// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`numberInput disables lower threshold 1`] = `
<DocumentFragment>
  <div
    class="pf-v6-c-number-input"
  >
    <div
      class="pf-v6-c-input-group"
    >
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Minus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-13"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          disabled=""
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <span
          class="pf-v6-c-form-control pf-m-readonly"
        >
          <input
            aria-invalid="false"
            aria-label="Input"
            data-ouia-component-id="OUIA-Generated-TextInputBase-7"
            data-ouia-component-type="PF6/TextInput"
            data-ouia-safe="true"
            readonly=""
            type="number"
            value="0"
          />
        </span>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Plus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-14"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
    </div>
  </div>
</DocumentFragment>
`;

exports[`numberInput disables upper threshold 1`] = `
<DocumentFragment>
  <div
    class="pf-v6-c-number-input"
  >
    <div
      class="pf-v6-c-input-group"
    >
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Minus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-15"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <span
          class="pf-v6-c-form-control pf-m-readonly"
        >
          <input
            aria-invalid="false"
            aria-label="Input"
            data-ouia-component-id="OUIA-Generated-TextInputBase-8"
            data-ouia-component-type="PF6/TextInput"
            data-ouia-safe="true"
            readonly=""
            type="number"
            value="100"
          />
        </span>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Plus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-16"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          disabled=""
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
    </div>
  </div>
</DocumentFragment>
`;

exports[`numberInput passes button props successfully 1`] = `
<DocumentFragment>
  <div
    class="pf-v6-c-number-input"
  >
    <div
      class="pf-v6-c-input-group"
    >
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Minus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-25"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          id="minus-id"
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <span
          class="pf-v6-c-form-control pf-m-readonly"
        >
          <input
            aria-invalid="false"
            aria-label="Input"
            data-ouia-component-id="OUIA-Generated-TextInputBase-13"
            data-ouia-component-type="PF6/TextInput"
            data-ouia-safe="true"
            readonly=""
            type="number"
            value="5"
          />
        </span>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Plus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-26"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          id="plus-id"
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
    </div>
  </div>
</DocumentFragment>
`;

exports[`numberInput passes input props successfully 1`] = `
<DocumentFragment>
  <div
    class="pf-v6-c-number-input"
  >
    <div
      class="pf-v6-c-input-group"
    >
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Minus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-23"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <span
          class="pf-v6-c-form-control"
        >
          <input
            aria-invalid="false"
            aria-label="Input"
            data-ouia-component-id="OUIA-Generated-TextInputBase-12"
            data-ouia-component-type="PF6/TextInput"
            data-ouia-safe="true"
            name="test-name"
            type="number"
            value="5"
          />
        </span>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Plus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-24"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
    </div>
  </div>
</DocumentFragment>
`;

exports[`numberInput renders custom width 1`] = `
<DocumentFragment>
  <div
    class="pf-v6-c-number-input"
    style="--pf-v6-c-number-input--c-form-control--width-chars: 10;"
  >
    <div
      class="pf-v6-c-input-group"
    >
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Minus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-21"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <span
          class="pf-v6-c-form-control pf-m-readonly"
        >
          <input
            aria-invalid="false"
            aria-label="Input"
            data-ouia-component-id="OUIA-Generated-TextInputBase-11"
            data-ouia-component-type="PF6/TextInput"
            data-ouia-safe="true"
            readonly=""
            type="number"
            value="5"
          />
        </span>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Plus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-22"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
    </div>
  </div>
</DocumentFragment>
`;

exports[`numberInput renders defaults & extra props 1`] = `
<DocumentFragment>
  <div
    class="pf-v6-c-number-input custom"
    id="numberInput1"
  >
    <div
      class="pf-v6-c-input-group"
    >
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Minus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-1"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <span
          class="pf-v6-c-form-control pf-m-readonly"
        >
          <input
            aria-invalid="false"
            aria-label="Input"
            data-ouia-component-id="OUIA-Generated-TextInputBase-1"
            data-ouia-component-type="PF6/TextInput"
            data-ouia-safe="true"
            readonly=""
            type="number"
            value="0"
          />
        </span>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Plus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-2"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
    </div>
  </div>
</DocumentFragment>
`;

exports[`numberInput renders disabled 1`] = `
<DocumentFragment>
  <div
    class="pf-v6-c-number-input"
  >
    <div
      class="pf-v6-c-input-group"
    >
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Minus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-11"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          disabled=""
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <span
          class="pf-v6-c-form-control pf-m-readonly pf-m-disabled"
        >
          <input
            aria-invalid="false"
            aria-label="Input"
            data-ouia-component-id="OUIA-Generated-TextInputBase-6"
            data-ouia-component-type="PF6/TextInput"
            data-ouia-safe="true"
            disabled=""
            readonly=""
            type="number"
            value="90"
          />
        </span>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Plus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-12"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          disabled=""
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
    </div>
  </div>
</DocumentFragment>
`;

exports[`numberInput renders error validated 1`] = `
<DocumentFragment>
  <div
    class="pf-v6-c-number-input"
  >
    <div
      class="pf-v6-c-input-group"
    >
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Minus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-5"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <span
          class="pf-v6-c-form-control pf-m-readonly pf-m-error"
        >
          <input
            aria-invalid="true"
            aria-label="Input"
            data-ouia-component-id="OUIA-Generated-TextInputBase-3"
            data-ouia-component-type="PF6/TextInput"
            data-ouia-safe="true"
            readonly=""
            type="number"
            value="0"
          />
          <span
            class="pf-v6-c-form-control__utilities"
          >
            <span
              class="pf-v6-c-form-control__icon pf-m-status"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 512 512"
                width="1em"
              >
                <path
                  d="M504 256c0 136.997-111.043 248-248 248S8 392.997 8 256C8 119.083 119.043 8 256 8s248 111.083 248 248zm-248 50c-25.405 0-46 20.595-46 46s20.595 46 46 46 46-20.595 46-46-20.595-46-46-46zm-43.673-165.346l7.418 136c.347 6.364 5.609 11.346 11.982 11.346h48.546c6.373 0 11.635-4.982 11.982-11.346l7.418-136c.375-6.874-5.098-12.654-11.982-12.654h-63.383c-6.884 0-12.356 5.78-11.981 12.654z"
                />
              </svg>
            </span>
          </span>
        </span>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Plus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-6"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
    </div>
  </div>
</DocumentFragment>
`;

exports[`numberInput renders success validated 1`] = `
<DocumentFragment>
  <div
    class="pf-v6-c-number-input"
  >
    <div
      class="pf-v6-c-input-group"
    >
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Minus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-3"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <span
          class="pf-v6-c-form-control pf-m-readonly pf-m-success"
        >
          <input
            aria-invalid="false"
            aria-label="Input"
            data-ouia-component-id="OUIA-Generated-TextInputBase-2"
            data-ouia-component-type="PF6/TextInput"
            data-ouia-safe="true"
            readonly=""
            type="number"
            value="0"
          />
          <span
            class="pf-v6-c-form-control__utilities"
          >
            <span
              class="pf-v6-c-form-control__icon pf-m-status"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 512 512"
                width="1em"
              >
                <path
                  d="M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z"
                />
              </svg>
            </span>
          </span>
        </span>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Plus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-4"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
    </div>
  </div>
</DocumentFragment>
`;

exports[`numberInput renders unit & position 1`] = `
<DocumentFragment>
  <div
    class="pf-v6-c-number-input"
  >
    <div
      class="pf-v6-c-number-input__unit"
    >
      $
    </div>
    <div
      class="pf-v6-c-input-group"
    >
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Minus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-19"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <span
          class="pf-v6-c-form-control pf-m-readonly"
        >
          <input
            aria-invalid="false"
            aria-label="Input"
            data-ouia-component-id="OUIA-Generated-TextInputBase-10"
            data-ouia-component-type="PF6/TextInput"
            data-ouia-safe="true"
            readonly=""
            type="number"
            value="5"
          />
        </span>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Plus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-20"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
    </div>
  </div>
</DocumentFragment>
`;

exports[`numberInput renders unit 1`] = `
<DocumentFragment>
  <div
    class="pf-v6-c-number-input"
  >
    <div
      class="pf-v6-c-input-group"
    >
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Minus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-17"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <span
          class="pf-v6-c-form-control pf-m-readonly"
        >
          <input
            aria-invalid="false"
            aria-label="Input"
            data-ouia-component-id="OUIA-Generated-TextInputBase-9"
            data-ouia-component-type="PF6/TextInput"
            data-ouia-safe="true"
            readonly=""
            type="number"
            value="5"
          />
        </span>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Plus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-18"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
    </div>
    <div
      class="pf-v6-c-number-input__unit"
    >
      %
    </div>
  </div>
</DocumentFragment>
`;

exports[`numberInput renders value 1`] = `
<DocumentFragment>
  <div
    class="pf-v6-c-number-input"
  >
    <div
      class="pf-v6-c-input-group"
    >
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Minus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-9"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <span
          class="pf-v6-c-form-control pf-m-readonly"
        >
          <input
            aria-invalid="false"
            aria-label="Input"
            data-ouia-component-id="OUIA-Generated-TextInputBase-5"
            data-ouia-component-type="PF6/TextInput"
            data-ouia-safe="true"
            readonly=""
            type="number"
            value="90"
          />
        </span>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Plus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-10"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
    </div>
  </div>
</DocumentFragment>
`;

exports[`numberInput renders warning validated 1`] = `
<DocumentFragment>
  <div
    class="pf-v6-c-number-input"
  >
    <div
      class="pf-v6-c-input-group"
    >
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Minus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-7"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <span
          class="pf-v6-c-form-control pf-m-readonly pf-m-warning"
        >
          <input
            aria-invalid="false"
            aria-label="Input"
            data-ouia-component-id="OUIA-Generated-TextInputBase-4"
            data-ouia-component-type="PF6/TextInput"
            data-ouia-safe="true"
            readonly=""
            type="number"
            value="0"
          />
          <span
            class="pf-v6-c-form-control__utilities"
          >
            <span
              class="pf-v6-c-form-control__icon pf-m-status"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 576 512"
                width="1em"
              >
                <path
                  d="M569.517 440.013C587.975 472.007 564.806 512 527.94 512H48.054c-36.937 0-59.999-40.055-41.577-71.987L246.423 23.985c18.467-32.009 64.72-31.951 83.154 0l239.94 416.028zM288 354c-25.405 0-46 20.595-46 46s20.595 46 46 46 46-20.595 46-46-20.595-46-46-46zm-43.673-165.346l7.418 136c.347 6.364 5.609 11.346 11.982 11.346h48.546c6.373 0 11.635-4.982 11.982-11.346l7.418-136c.375-6.874-5.098-12.654-11.982-12.654h-63.383c-6.884 0-12.356 5.78-11.981 12.654z"
                />
              </svg>
            </span>
          </span>
        </span>
      </div>
      <div
        class="pf-v6-c-input-group__item"
      >
        <button
          aria-disabled="false"
          aria-label="Plus"
          class="pf-v6-c-button pf-m-control"
          data-ouia-component-id="OUIA-Generated-Button-control-8"
          data-ouia-component-type="PF6/Button"
          data-ouia-safe="true"
          type="button"
        >
          <span
            class="pf-v6-c-button__icon"
          >
            <span
              class="pf-v6-c-number-input__icon"
            >
              <svg
                aria-hidden="true"
                class="pf-v6-svg"
                fill="currentColor"
                height="1em"
                role="img"
                viewBox="0 0 448 512"
                width="1em"
              >
                <path
                  d="M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
                />
              </svg>
            </span>
          </span>
        </button>
      </div>
    </div>
  </div>
</DocumentFragment>
`;