@zebra-fed/zeta-web
    Preparing search index...

    Class ZetaSliderInputField

    A text input and slider field for entering numerical values.

    change - Fired whenever value of slider is changed. Contains a single entry in detail: value:number.

    https://www.figma.com/design/JesXQFLaPJLc1BdBM4sisI/🦓-ZDS---Components?node-id=875-11860&m=dev

    https://design.zebra.com/web/storybook/index.html?path=/docs/components-slider--docs

    Hierarchy

    • FormFieldInterface<this> & LitElement<this> & ContourableInterface<this>
      • ZetaSliderInputField
    Index

    Other

    constructor checked? disabled error indeterminate input internals label? max min name placeholder required rounded stepIncrement? type value shadowRootOptions styles handleBlur handleChange handleFocus handleInput

    rendering

    render

    updates

    update

    Other

    • Returns ZetaSliderInputField

    checked?: boolean
    disabled: boolean

    Disables the input field.

    error: boolean = false

    Error state.

    indeterminate: boolean
    input: HTMLInputElement
    internals: ElementInternals
    label?: string

    The label displayed above the input.

    max: number = 100

    The maximum value of the slider input field.

    min: number = 0

    The minimum value of the slider input field.

    name: string
    placeholder: string
    required: boolean
    rounded: boolean
    stepIncrement?: number

    If set, will put steps on the slider at the given increments and the slider will snap to the nearest step.

    type: InputType = "slider"
    value: string = "50"
    shadowRootOptions: ShadowRootInit = ...
    styles: CSSResultGroup[] = ...

    • Parameters

      • event: FocusEvent

      Returns void

    • Parameters

      • event: FocusEvent

      Returns void

    • Parameters

      • event: Event

      Returns void

    rendering

    • Invoked on each update to perform rendering tasks. This method may return any value renderable by lit-html's ChildPart - typically a TemplateResult. Setting properties inside this method will not trigger the element to update.

      Returns TemplateResult<1>

    updates

    • Updates the element. This method reflects property values to attributes and calls render to render DOM via lit-html. Setting properties inside this method will not trigger another update.

      Parameters

      • _changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>

      Returns void

    Settings

    Member Visibility

    On This Page

    Other
    rendering
    updates