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

exports[`slider renders continuous slider 1`] = `
<DocumentFragment>
  <div
    class="pf-v6-c-slider"
    style="--pf-v6-c-slider--value: 50%; --pf-v6-c-slider__value--c-form-control--width-chars: 2;"
  >
    <div
      class="pf-v6-c-slider__main"
    >
      <div
        class="pf-v6-c-slider__rail"
      >
        <div
          class="pf-v6-c-slider__rail-track"
        />
      </div>
      <div
        aria-hidden="true"
        class="pf-v6-c-slider__steps"
      >
        <div
          class="pf-v6-c-slider__step pf-m-active"
          style="--pf-v6-c-slider__step--InsetInlineStart: 0%;"
        >
          <div
            class="pf-v6-c-slider__step-label"
          >
            0
          </div>
        </div>
        <div
          class="pf-v6-c-slider__step"
          style="--pf-v6-c-slider__step--InsetInlineStart: 100%;"
        >
          <div
            class="pf-v6-c-slider__step-label"
          >
            100
          </div>
        </div>
      </div>
      <div
        aria-disabled="false"
        aria-label="Value"
        aria-valuemax="100"
        aria-valuemin="0"
        aria-valuenow="50"
        aria-valuetext="50"
        class="pf-v6-c-slider__thumb"
        role="slider"
        tabindex="0"
      />
    </div>
    <div
      class="pf-v6-c-slider__value"
    >
      <span
        class="pf-v6-c-form-control"
      >
        <input
          aria-invalid="false"
          aria-label="Slider value input"
          data-ouia-component-id="OUIA-Generated-TextInputBase-1"
          data-ouia-component-type="PF6/TextInput"
          data-ouia-safe="true"
          type="number"
          value="50"
        />
      </span>
    </div>
  </div>
</DocumentFragment>
`;

exports[`slider renders continuous slider with custom steps 1`] = `
<DocumentFragment>
  <div
    class="pf-v6-c-slider"
    style="--pf-v6-c-slider--value: 50%; --pf-v6-c-slider__value--c-form-control--width-chars: 1;"
  >
    <div
      class="pf-v6-c-slider__main"
    >
      <div
        class="pf-v6-c-slider__rail"
      >
        <div
          class="pf-v6-c-slider__rail-track"
        />
      </div>
      <div
        aria-hidden="true"
        class="pf-v6-c-slider__steps"
      >
        <div
          class="pf-v6-c-slider__step pf-m-active"
          style="--pf-v6-c-slider__step--InsetInlineStart: 0%;"
        >
          <div
            class="pf-v6-c-slider__step-tick"
          />
          <div
            class="pf-v6-c-slider__step-label"
          >
            0%
          </div>
        </div>
        <div
          class="pf-v6-c-slider__step"
          style="--pf-v6-c-slider__step--InsetInlineStart: 100%;"
        >
          <div
            class="pf-v6-c-slider__step-tick"
          />
          <div
            class="pf-v6-c-slider__step-label"
          >
            100%
          </div>
        </div>
      </div>
      <div
        aria-disabled="false"
        aria-label="Value"
        aria-valuemax="100"
        aria-valuemin="0"
        aria-valuenow="50"
        aria-valuetext="50"
        class="pf-v6-c-slider__thumb"
        role="slider"
        tabindex="0"
      />
    </div>
  </div>
</DocumentFragment>
`;

exports[`slider renders disabled slider 1`] = `
<DocumentFragment>
  <div
    class="pf-v6-c-slider pf-m-disabled"
    style="--pf-v6-c-slider--value: 50%; --pf-v6-c-slider__value--c-form-control--width-chars: 1;"
  >
    <div
      class="pf-v6-c-slider__main"
    >
      <div
        class="pf-v6-c-slider__rail"
      >
        <div
          class="pf-v6-c-slider__rail-track"
        />
      </div>
      <div
        aria-hidden="true"
        class="pf-v6-c-slider__steps"
      >
        <div
          class="pf-v6-c-slider__step pf-m-active"
          style="--pf-v6-c-slider__step--InsetInlineStart: 0%;"
        >
          <div
            class="pf-v6-c-slider__step-label"
          >
            0
          </div>
        </div>
        <div
          class="pf-v6-c-slider__step"
          style="--pf-v6-c-slider__step--InsetInlineStart: 100%;"
        >
          <div
            class="pf-v6-c-slider__step-label"
          >
            100
          </div>
        </div>
      </div>
      <div
        aria-disabled="true"
        aria-label="Value"
        aria-valuemax="100"
        aria-valuemin="0"
        aria-valuenow="50"
        aria-valuetext="50"
        class="pf-v6-c-slider__thumb"
        role="slider"
        tabindex="-1"
      />
    </div>
  </div>
</DocumentFragment>
`;

exports[`slider renders discrete slider 1`] = `
<DocumentFragment>
  <div
    class="pf-v6-c-slider"
    style="--pf-v6-c-slider--value: 40%; --pf-v6-c-slider__value--c-form-control--width-chars: 2;"
  >
    <div
      class="pf-v6-c-slider__main"
    >
      <div
        class="pf-v6-c-slider__rail"
      >
        <div
          class="pf-v6-c-slider__rail-track"
        />
      </div>
      <div
        aria-hidden="true"
        class="pf-v6-c-slider__steps"
      >
        <div
          class="pf-v6-c-slider__step pf-m-active"
          style="--pf-v6-c-slider__step--InsetInlineStart: 0%;"
        >
          <div
            class="pf-v6-c-slider__step-label"
          >
            10
          </div>
        </div>
        <div
          class="pf-v6-c-slider__step"
          style="--pf-v6-c-slider__step--InsetInlineStart: 100%;"
        >
          <div
            class="pf-v6-c-slider__step-label"
          >
            110
          </div>
        </div>
      </div>
      <div
        aria-disabled="false"
        aria-label="Value"
        aria-valuemax="110"
        aria-valuemin="10"
        aria-valuenow="50"
        aria-valuetext="50"
        class="pf-v6-c-slider__thumb"
        role="slider"
        tabindex="0"
      />
    </div>
    <div
      class="pf-v6-c-slider__value"
    >
      <span
        class="pf-v6-c-form-control"
      >
        <input
          aria-invalid="false"
          aria-label="Slider value input"
          data-ouia-component-id="OUIA-Generated-TextInputBase-2"
          data-ouia-component-type="PF6/TextInput"
          data-ouia-safe="true"
          type="number"
          value="50"
        />
      </span>
    </div>
  </div>
</DocumentFragment>
`;

exports[`slider renders discrete slider with custom steps 1`] = `
<DocumentFragment>
  <div
    class="pf-v6-c-slider"
    style="--pf-v6-c-slider--value: 50%; --pf-v6-c-slider__value--c-form-control--width-chars: 1;"
  >
    <div
      class="pf-v6-c-slider__main"
    >
      <div
        class="pf-v6-c-slider__rail"
      >
        <div
          class="pf-v6-c-slider__rail-track"
        />
      </div>
      <div
        aria-hidden="true"
        class="pf-v6-c-slider__steps"
      >
        <div
          class="pf-v6-c-slider__step pf-m-active"
          style="--pf-v6-c-slider__step--InsetInlineStart: 0%;"
        >
          <div
            class="pf-v6-c-slider__step-tick"
          />
          <div
            class="pf-v6-c-slider__step-label"
          >
            0%
          </div>
        </div>
        <div
          class="pf-v6-c-slider__step pf-m-active"
          style="--pf-v6-c-slider__step--InsetInlineStart: 25%;"
        >
          <div
            class="pf-v6-c-slider__step-tick"
          />
        </div>
        <div
          class="pf-v6-c-slider__step pf-m-active"
          style="--pf-v6-c-slider__step--InsetInlineStart: 50%;"
        >
          <div
            class="pf-v6-c-slider__step-tick"
          />
          <div
            class="pf-v6-c-slider__step-label"
          >
            50%
          </div>
        </div>
        <div
          class="pf-v6-c-slider__step"
          style="--pf-v6-c-slider__step--InsetInlineStart: 75%;"
        >
          <div
            class="pf-v6-c-slider__step-tick"
          />
        </div>
        <div
          class="pf-v6-c-slider__step"
          style="--pf-v6-c-slider__step--InsetInlineStart: 100%;"
        >
          <div
            class="pf-v6-c-slider__step-tick"
          />
          <div
            class="pf-v6-c-slider__step-label"
          >
            100%
          </div>
        </div>
      </div>
      <div
        aria-disabled="false"
        aria-label="Value"
        aria-valuemax="100"
        aria-valuemin="0"
        aria-valuenow="50"
        aria-valuetext="50%"
        class="pf-v6-c-slider__thumb"
        role="slider"
        tabindex="0"
      />
    </div>
  </div>
</DocumentFragment>
`;

exports[`slider renders slider with input 1`] = `
<DocumentFragment>
  <div
    class="pf-v6-c-slider"
    style="--pf-v6-c-slider--value: 50%; --pf-v6-c-slider__value--c-form-control--width-chars: 2;"
  >
    <div
      class="pf-v6-c-slider__main"
    >
      <div
        class="pf-v6-c-slider__rail"
      >
        <div
          class="pf-v6-c-slider__rail-track"
        />
      </div>
      <div
        aria-hidden="true"
        class="pf-v6-c-slider__steps"
      >
        <div
          class="pf-v6-c-slider__step pf-m-active"
          style="--pf-v6-c-slider__step--InsetInlineStart: 0%;"
        >
          <div
            class="pf-v6-c-slider__step-label"
          >
            0
          </div>
        </div>
        <div
          class="pf-v6-c-slider__step"
          style="--pf-v6-c-slider__step--InsetInlineStart: 100%;"
        >
          <div
            class="pf-v6-c-slider__step-label"
          >
            100
          </div>
        </div>
      </div>
      <div
        aria-disabled="false"
        aria-label="Value"
        aria-valuemax="100"
        aria-valuemin="0"
        aria-valuenow="50"
        aria-valuetext="50"
        class="pf-v6-c-slider__thumb"
        role="slider"
        tabindex="0"
      />
    </div>
    <div
      class="pf-v6-c-slider__value"
    >
      <div
        class="pf-v6-c-input-group"
      >
        <div
          class="pf-v6-c-input-group__item pf-m-fill"
        >
          <span
            class="pf-v6-c-form-control"
          >
            <input
              aria-invalid="false"
              aria-label="Slider value input"
              data-ouia-component-id="OUIA-Generated-TextInputBase-3"
              data-ouia-component-type="PF6/TextInput"
              data-ouia-safe="true"
              type="number"
              value="50"
            />
          </span>
        </div>
        <div
          class="pf-v6-c-input-group__item pf-m-box"
        >
          <span
            class="pf-v6-c-input-group__text"
          >
            %
          </span>
        </div>
      </div>
    </div>
  </div>
</DocumentFragment>
`;

exports[`slider renders slider with input above thumb 1`] = `
<DocumentFragment>
  <div
    class="pf-v6-c-slider"
    style="--pf-v6-c-slider--value: 50%; --pf-v6-c-slider__value--c-form-control--width-chars: 2;"
  >
    <div
      class="pf-v6-c-slider__main"
    >
      <div
        class="pf-v6-c-slider__rail"
      >
        <div
          class="pf-v6-c-slider__rail-track"
        />
      </div>
      <div
        aria-hidden="true"
        class="pf-v6-c-slider__steps"
      >
        <div
          class="pf-v6-c-slider__step pf-m-active"
          style="--pf-v6-c-slider__step--InsetInlineStart: 0%;"
        >
          <div
            class="pf-v6-c-slider__step-label"
          >
            0
          </div>
        </div>
        <div
          class="pf-v6-c-slider__step"
          style="--pf-v6-c-slider__step--InsetInlineStart: 100%;"
        >
          <div
            class="pf-v6-c-slider__step-label"
          >
            100
          </div>
        </div>
      </div>
      <div
        aria-disabled="false"
        aria-label="Value"
        aria-valuemax="100"
        aria-valuemin="0"
        aria-valuenow="50"
        aria-valuetext="50"
        class="pf-v6-c-slider__thumb"
        role="slider"
        tabindex="0"
      />
      <div
        class="pf-v6-c-slider__value pf-m-floating"
      >
        <div
          class="pf-v6-c-input-group"
        >
          <div
            class="pf-v6-c-input-group__item pf-m-fill"
          >
            <span
              class="pf-v6-c-form-control"
            >
              <input
                aria-invalid="false"
                aria-label="Slider value input"
                data-ouia-component-id="OUIA-Generated-TextInputBase-4"
                data-ouia-component-type="PF6/TextInput"
                data-ouia-safe="true"
                type="number"
                value="50"
              />
            </span>
          </div>
          <div
            class="pf-v6-c-input-group__item pf-m-box"
          >
            <span
              class="pf-v6-c-input-group__text"
            >
              %
            </span>
          </div>
        </div>
      </div>
    </div>
  </div>
</DocumentFragment>
`;

exports[`slider renders slider with input actions 1`] = `
<DocumentFragment>
  <div
    class="pf-v6-c-slider"
    style="--pf-v6-c-slider--value: 50%; --pf-v6-c-slider__value--c-form-control--width-chars: 1;"
  >
    <div
      class="pf-v6-c-slider__actions"
    >
      <button
        aria-disabled="false"
        aria-label="Minus"
        class="pf-v6-c-button pf-m-plain"
        data-ouia-component-id="OUIA-Generated-Button-plain-1"
        data-ouia-component-type="PF6/Button"
        data-ouia-safe="true"
        type="button"
      />
    </div>
    <div
      class="pf-v6-c-slider__main"
    >
      <div
        class="pf-v6-c-slider__rail"
      >
        <div
          class="pf-v6-c-slider__rail-track"
        />
      </div>
      <div
        aria-hidden="true"
        class="pf-v6-c-slider__steps"
      >
        <div
          class="pf-v6-c-slider__step pf-m-active"
          style="--pf-v6-c-slider__step--InsetInlineStart: 0%;"
        >
          <div
            class="pf-v6-c-slider__step-label"
          >
            0
          </div>
        </div>
        <div
          class="pf-v6-c-slider__step"
          style="--pf-v6-c-slider__step--InsetInlineStart: 100%;"
        >
          <div
            class="pf-v6-c-slider__step-label"
          >
            100
          </div>
        </div>
      </div>
      <div
        aria-disabled="false"
        aria-label="Value"
        aria-valuemax="100"
        aria-valuemin="0"
        aria-valuenow="50"
        aria-valuetext="50"
        class="pf-v6-c-slider__thumb"
        role="slider"
        tabindex="0"
      />
    </div>
    <div
      class="pf-v6-c-slider__actions"
    >
      <button
        aria-disabled="false"
        aria-label="Plus"
        class="pf-v6-c-button pf-m-plain"
        data-ouia-component-id="OUIA-Generated-Button-plain-2"
        data-ouia-component-type="PF6/Button"
        data-ouia-safe="true"
        type="button"
      />
    </div>
  </div>
</DocumentFragment>
`;

exports[`slider renders slider with tooltip on thumb 1`] = `
<DocumentFragment>
  <div
    class="pf-v6-c-slider"
    style="--pf-v6-c-slider--value: 50%; --pf-v6-c-slider__value--c-form-control--width-chars: 1;"
  >
    <div
      class="pf-v6-c-slider__main"
    >
      <div
        class="pf-v6-c-slider__rail"
      >
        <div
          class="pf-v6-c-slider__rail-track"
        />
      </div>
      <div
        aria-hidden="true"
        class="pf-v6-c-slider__steps"
      >
        <div
          class="pf-v6-c-slider__step pf-m-active"
          style="--pf-v6-c-slider__step--InsetInlineStart: 0%;"
        >
          <div
            class="pf-v6-c-slider__step-label"
          >
            0
          </div>
        </div>
        <div
          class="pf-v6-c-slider__step"
          style="--pf-v6-c-slider__step--InsetInlineStart: 100%;"
        >
          <div
            class="pf-v6-c-slider__step-label"
          >
            100
          </div>
        </div>
      </div>
      <div
        aria-disabled="false"
        aria-label="Value"
        aria-valuemax="100"
        aria-valuemin="0"
        aria-valuenow="50"
        aria-valuetext="50"
        class="pf-v6-c-slider__thumb"
        role="slider"
        tabindex="0"
      />
    </div>
  </div>
</DocumentFragment>
`;