{ "schemaVersion": "1.0.0", "readme": "", "modules": [ { "kind": "javascript-module", "path": "vaadin-slider.js", "declarations": [], "exports": [ { "kind": "js", "name": "*", "declaration": { "name": "*", "module": "src/vaadin-slider.js" } } ] }, { "kind": "javascript-module", "path": "vaadin-range-slider.js", "declarations": [], "exports": [ { "kind": "js", "name": "*", "declaration": { "name": "*", "module": "src/vaadin-range-slider.js" } } ] }, { "kind": "javascript-module", "path": "src/vaadin-range-slider.js", "declarations": [ { "kind": "class", "description": "`` is a web component that represents a range slider\nfor selecting a subset of the given range.\n\n```html\n\n```\n\n### Styling\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n---------------------|-----------------\n`label` | The label element\n`required-indicator` | The required indicator element\n`helper-text` | The helper text element\n`error-message` | The error message element\n`track` | The slider track\n`track-fill` | The filled portion of the track\n`thumb` | The slider thumb (applies to both thumbs)\n`thumb-start` | The start (lower value) thumb\n`thumb-end` | The end (upper value) thumb\n`marks` | Container for min/max labels\n`min` | Minimum value label\n`max` | Maximum value label\n\nThe following state attributes are available for styling:\n\nAttribute | Description\n-------------------|-------------\n`disabled` | Set when the slider is disabled\n`readonly` | Set when the slider is read-only\n`focused` | Set when the slider has focus\n`focus-ring` | Set when the slider is focused using the keyboard\n`start-active` | Set when the start thumb is activated with mouse or touch\n`end-active` | Set when the end thumb is activated with mouse or touch\n`start-focused` | Set when the start thumb has focus\n`end-focused` | Set when the end thumb has focus\n`min-max-visible` | Set when the min/max labels are displayed\n\nThe following custom CSS properties are available for styling:\n\nCustom CSS property |\n:--------------------------------------------|\n`--vaadin-field-default-width` |\n`--vaadin-input-field-error-color` |\n`--vaadin-input-field-error-font-size` |\n`--vaadin-input-field-error-font-weight` |\n`--vaadin-input-field-helper-color` |\n`--vaadin-input-field-helper-font-size` |\n`--vaadin-input-field-helper-font-weight` |\n`--vaadin-input-field-label-color` |\n`--vaadin-input-field-label-font-size` |\n`--vaadin-input-field-label-font-weight` |\n`--vaadin-input-field-required-indicator` |\n`--vaadin-slider-bubble-arrow-size` |\n`--vaadin-slider-bubble-background` |\n`--vaadin-slider-bubble-border-color` |\n`--vaadin-slider-bubble-border-radius` |\n`--vaadin-slider-bubble-border-width` |\n`--vaadin-slider-bubble-offset` |\n`--vaadin-slider-bubble-padding` |\n`--vaadin-slider-bubble-shadow` |\n`--vaadin-slider-bubble-text-color` |\n`--vaadin-slider-bubble-font-size` |\n`--vaadin-slider-bubble-font-weight` |\n`--vaadin-slider-bubble-line-height` |\n`--vaadin-slider-fill-background` |\n`--vaadin-slider-fill-border-color` |\n`--vaadin-slider-fill-border-width` |\n`--vaadin-slider-marks-color` |\n`--vaadin-slider-marks-font-size` |\n`--vaadin-slider-marks-font-weight` |\n`--vaadin-slider-thumb-border-color` |\n`--vaadin-slider-thumb-border-radius` |\n`--vaadin-slider-thumb-border-width` |\n`--vaadin-slider-thumb-cursor` |\n`--vaadin-slider-thumb-cursor-active` |\n`--vaadin-slider-thumb-height` |\n`--vaadin-slider-thumb-width` |\n`--vaadin-slider-track-background` |\n`--vaadin-slider-track-border-color` |\n`--vaadin-slider-track-border-radius` |\n`--vaadin-slider-track-border-width` |\n`--vaadin-slider-track-height` |\n\nIn order to style the slider bubble, use `` shadow DOM parts:\n\nPart name | Description\n-----------------|----------------------\n`overlay` | The overlay container\n`content` | The overlay content\n`arrow` | Arrow pointing to the thumb\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.", "name": "RangeSlider", "members": [ { "kind": "field", "name": "accessibleName", "privacy": "public", "type": { "text": "string" }, "description": "String used to label the component to screen reader users.", "attribute": "accessible-name", "inheritedFrom": { "name": "FieldMixin", "package": "@vaadin/field-base/src/field-mixin.js" } }, { "kind": "field", "name": "accessibleNameEnd", "privacy": "public", "type": { "text": "string" }, "description": "Custom accessible name for the end (maximum) input.\nWhen not set, defaults to \"${label} max\" or \"max\" if no label.", "attribute": "accessible-name-end" }, { "kind": "field", "name": "accessibleNameRef", "privacy": "public", "type": { "text": "string" }, "description": "Id of the element used as label of the component to screen reader users.", "attribute": "accessible-name-ref", "inheritedFrom": { "name": "FieldMixin", "package": "@vaadin/field-base/src/field-mixin.js" } }, { "kind": "field", "name": "accessibleNameStart", "privacy": "public", "type": { "text": "string" }, "description": "Custom accessible name for the start (minimum) input.\nWhen not set, defaults to \"${label} min\" or \"min\" if no label.", "attribute": "accessible-name-start" }, { "kind": "method", "name": "checkValidity", "description": "Returns true if the field value satisfies all constraints (if any).", "return": { "type": { "text": "boolean" } }, "inheritedFrom": { "name": "ValidateMixin", "package": "@vaadin/field-base/src/validate-mixin.js" } }, { "kind": "field", "name": "disabled", "privacy": "public", "type": { "text": "boolean" }, "description": "If true, the user cannot interact with this element.", "attribute": "disabled", "inheritedFrom": { "name": "DisabledMixin", "package": "@vaadin/a11y-base/src/disabled-mixin.js" } }, { "kind": "field", "name": "errorMessage", "privacy": "public", "type": { "text": "string" }, "description": "Error to show when the field is invalid.", "attribute": "error-message", "inheritedFrom": { "name": "FieldMixin", "package": "@vaadin/field-base/src/field-mixin.js" } }, { "kind": "field", "name": "helperText", "privacy": "public", "type": { "text": "string" }, "description": "String used for the helper text.", "attribute": "helper-text", "inheritedFrom": { "name": "FieldMixin", "package": "@vaadin/field-base/src/field-mixin.js" } }, { "kind": "field", "name": "invalid", "privacy": "public", "type": { "text": "boolean" }, "description": "Set to true when the field is invalid.", "attribute": "invalid", "inheritedFrom": { "name": "ValidateMixin", "package": "@vaadin/field-base/src/validate-mixin.js" } }, { "kind": "field", "name": "label", "privacy": "public", "type": { "text": "string" }, "description": "The label text for the input node.\nWhen no light dom defined via [slot=label], this value will be used.", "attribute": "label", "inheritedFrom": { "name": "LabelMixin", "package": "@vaadin/field-base/src/label-mixin.js" } }, { "kind": "field", "name": "manualValidation", "privacy": "public", "type": { "text": "boolean" }, "description": "Set to true to enable manual validation mode. This mode disables automatic\nconstraint validation, allowing you to control the validation process yourself.\nYou can still trigger constraint validation manually with the `validate()` method\nor use `checkValidity()` to assess the component's validity without affecting\nthe invalid state. In manual validation mode, you can also manipulate\nthe `invalid` property directly through your application logic without conflicts\nwith the component's internal validation.", "attribute": "manual-validation", "inheritedFrom": { "name": "ValidateMixin", "package": "@vaadin/field-base/src/validate-mixin.js" } }, { "kind": "field", "name": "max", "privacy": "public", "type": { "text": "number" }, "description": "The maximum allowed value.", "attribute": "max", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } }, { "kind": "field", "name": "min", "privacy": "public", "type": { "text": "number" }, "description": "The minimum allowed value.", "attribute": "min", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } }, { "kind": "field", "name": "minMaxVisible", "privacy": "public", "type": { "text": "boolean" }, "description": "When true, displays the min and max values below the slider track.", "attribute": "min-max-visible", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } }, { "kind": "field", "name": "readonly", "privacy": "public", "type": { "text": "boolean" }, "description": "When true, the user cannot modify the value of the slider.\nThe difference between `disabled` and `readonly` is that the\nread-only slider remains focusable and is announced by screen\nreaders.", "attribute": "readonly", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } }, { "kind": "field", "name": "required", "privacy": "public", "type": { "text": "boolean" }, "description": "Specifies that the user must fill in a value.", "attribute": "required", "inheritedFrom": { "name": "ValidateMixin", "package": "@vaadin/field-base/src/validate-mixin.js" } }, { "kind": "field", "name": "step", "privacy": "public", "type": { "text": "number" }, "description": "The stepping interval of the slider.", "attribute": "step", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } }, { "kind": "method", "name": "validate", "description": "Validates the field and sets the `invalid` property based on the result.\n\nThe method fires a `validated` event with the result of the validation.", "return": { "type": { "text": "boolean" } }, "inheritedFrom": { "name": "ValidateMixin", "package": "@vaadin/field-base/src/validate-mixin.js" } }, { "kind": "field", "name": "value", "privacy": "public", "type": { "text": "array" }, "description": "The value of the slider.", "attribute": "value" }, { "kind": "field", "name": "valueAlwaysVisible", "privacy": "public", "type": { "text": "boolean" }, "description": "When true, the value bubble is always visible,\nregardless of focus or hover state.", "attribute": "value-always-visible", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } } ], "events": [ { "name": "change", "type": { "text": "Event" }, "description": "Fired when the user commits a value change.", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } }, { "name": "input", "type": { "text": "Event" }, "description": "Fired when the slider value changes during user interaction.", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } }, { "type": { "text": "CustomEvent" }, "description": "Fired when the `invalid` property changes.", "name": "invalid-changed" }, { "name": "validated", "type": { "text": "CustomEvent" }, "description": "Fired whenever the field is validated.", "inheritedFrom": { "name": "ValidateMixin", "package": "@vaadin/field-base/src/validate-mixin.js" } }, { "type": { "text": "CustomEvent" }, "description": "Fired when the `value` property changes.", "name": "value-changed" } ], "attributes": [ { "name": "accessible-name", "type": { "text": "string" }, "description": "String used to label the component to screen reader users.", "fieldName": "accessibleName", "inheritedFrom": { "name": "FieldMixin", "package": "@vaadin/field-base/src/field-mixin.js" } }, { "name": "accessible-name-end", "type": { "text": "string" }, "description": "Custom accessible name for the end (maximum) input.\nWhen not set, defaults to \"${label} max\" or \"max\" if no label.", "fieldName": "accessibleNameEnd" }, { "name": "accessible-name-ref", "type": { "text": "string" }, "description": "Id of the element used as label of the component to screen reader users.", "fieldName": "accessibleNameRef", "inheritedFrom": { "name": "FieldMixin", "package": "@vaadin/field-base/src/field-mixin.js" } }, { "name": "accessible-name-start", "type": { "text": "string" }, "description": "Custom accessible name for the start (minimum) input.\nWhen not set, defaults to \"${label} min\" or \"min\" if no label.", "fieldName": "accessibleNameStart" }, { "name": "disabled", "type": { "text": "boolean" }, "description": "If true, the user cannot interact with this element.", "fieldName": "disabled", "inheritedFrom": { "name": "DisabledMixin", "package": "@vaadin/a11y-base/src/disabled-mixin.js" } }, { "name": "error-message", "type": { "text": "string" }, "description": "Error to show when the field is invalid.", "fieldName": "errorMessage", "inheritedFrom": { "name": "FieldMixin", "package": "@vaadin/field-base/src/field-mixin.js" } }, { "name": "helper-text", "type": { "text": "string" }, "description": "String used for the helper text.", "fieldName": "helperText", "inheritedFrom": { "name": "FieldMixin", "package": "@vaadin/field-base/src/field-mixin.js" } }, { "name": "invalid", "type": { "text": "boolean" }, "description": "Set to true when the field is invalid.", "fieldName": "invalid", "inheritedFrom": { "name": "ValidateMixin", "package": "@vaadin/field-base/src/validate-mixin.js" } }, { "name": "label", "type": { "text": "string" }, "description": "The label text for the input node.\nWhen no light dom defined via [slot=label], this value will be used.", "fieldName": "label", "inheritedFrom": { "name": "LabelMixin", "package": "@vaadin/field-base/src/label-mixin.js" } }, { "name": "manual-validation", "type": { "text": "boolean" }, "description": "Set to true to enable manual validation mode. This mode disables automatic\nconstraint validation, allowing you to control the validation process yourself.\nYou can still trigger constraint validation manually with the `validate()` method\nor use `checkValidity()` to assess the component's validity without affecting\nthe invalid state. In manual validation mode, you can also manipulate\nthe `invalid` property directly through your application logic without conflicts\nwith the component's internal validation.", "fieldName": "manualValidation", "inheritedFrom": { "name": "ValidateMixin", "package": "@vaadin/field-base/src/validate-mixin.js" } }, { "name": "max", "type": { "text": "number" }, "description": "The maximum allowed value.", "fieldName": "max", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } }, { "name": "min", "type": { "text": "number" }, "description": "The minimum allowed value.", "fieldName": "min", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } }, { "name": "min-max-visible", "type": { "text": "boolean" }, "description": "When true, displays the min and max values below the slider track.", "fieldName": "minMaxVisible", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } }, { "name": "readonly", "type": { "text": "boolean" }, "description": "When true, the user cannot modify the value of the slider.\nThe difference between `disabled` and `readonly` is that the\nread-only slider remains focusable and is announced by screen\nreaders.", "fieldName": "readonly", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } }, { "name": "required", "type": { "text": "boolean" }, "description": "Specifies that the user must fill in a value.", "fieldName": "required", "inheritedFrom": { "name": "ValidateMixin", "package": "@vaadin/field-base/src/validate-mixin.js" } }, { "name": "step", "type": { "text": "number" }, "description": "The stepping interval of the slider.", "fieldName": "step", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } }, { "name": "value", "type": { "text": "array" }, "description": "The value of the slider.", "fieldName": "value" }, { "name": "value-always-visible", "type": { "text": "boolean" }, "description": "When true, the value bubble is always visible,\nregardless of focus or hover state.", "fieldName": "valueAlwaysVisible", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } } ], "mixins": [ { "name": "FieldMixin", "package": "@vaadin/field-base/src/field-mixin.js" }, { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" }, { "name": "FocusMixin", "package": "@vaadin/a11y-base/src/focus-mixin.js" }, { "name": "ElementMixin", "package": "@vaadin/component-base/src/element-mixin.js" }, { "name": "ThemableMixin", "package": "@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js" }, { "name": "PolylitMixin", "package": "@vaadin/component-base/src/polylit-mixin.js" }, { "name": "LumoInjectionMixin", "package": "@vaadin/vaadin-themable-mixin/lumo-injection-mixin.js" } ], "superclass": { "name": "LitElement", "package": "lit" }, "tagName": "vaadin-range-slider", "customElement": true } ], "exports": [ { "kind": "js", "name": "RangeSlider", "declaration": { "name": "RangeSlider", "module": "src/vaadin-range-slider.js" } } ] }, { "kind": "javascript-module", "path": "src/vaadin-slider-mixin.js", "declarations": [ { "kind": "mixin", "description": "", "name": "SliderMixin", "members": [ { "kind": "field", "name": "disabled", "privacy": "public", "type": { "text": "boolean" }, "description": "If true, the user cannot interact with this element.", "attribute": "disabled", "inheritedFrom": { "name": "DisabledMixin", "package": "@vaadin/a11y-base/src/disabled-mixin.js" } }, { "kind": "field", "name": "max", "privacy": "public", "type": { "text": "number" }, "description": "The maximum allowed value.", "attribute": "max" }, { "kind": "field", "name": "min", "privacy": "public", "type": { "text": "number" }, "description": "The minimum allowed value.", "attribute": "min" }, { "kind": "field", "name": "minMaxVisible", "privacy": "public", "type": { "text": "boolean" }, "description": "When true, displays the min and max values below the slider track.", "attribute": "min-max-visible" }, { "kind": "field", "name": "readonly", "privacy": "public", "type": { "text": "boolean" }, "description": "When true, the user cannot modify the value of the slider.\nThe difference between `disabled` and `readonly` is that the\nread-only slider remains focusable and is announced by screen\nreaders.", "attribute": "readonly" }, { "kind": "field", "name": "step", "privacy": "public", "type": { "text": "number" }, "description": "The stepping interval of the slider.", "attribute": "step" }, { "kind": "field", "name": "valueAlwaysVisible", "privacy": "public", "type": { "text": "boolean" }, "description": "When true, the value bubble is always visible,\nregardless of focus or hover state.", "attribute": "value-always-visible" } ], "events": [ { "name": "change", "type": { "text": "Event" } }, { "name": "input", "type": { "text": "Event" } } ], "attributes": [ { "name": "disabled", "type": { "text": "boolean" }, "description": "If true, the user cannot interact with this element.", "fieldName": "disabled", "inheritedFrom": { "name": "DisabledMixin", "package": "@vaadin/a11y-base/src/disabled-mixin.js" } }, { "name": "max", "type": { "text": "number" }, "description": "The maximum allowed value.", "fieldName": "max" }, { "name": "min", "type": { "text": "number" }, "description": "The minimum allowed value.", "fieldName": "min" }, { "name": "min-max-visible", "type": { "text": "boolean" }, "description": "When true, displays the min and max values below the slider track.", "fieldName": "minMaxVisible" }, { "name": "readonly", "type": { "text": "boolean" }, "description": "When true, the user cannot modify the value of the slider.\nThe difference between `disabled` and `readonly` is that the\nread-only slider remains focusable and is announced by screen\nreaders.", "fieldName": "readonly" }, { "name": "step", "type": { "text": "number" }, "description": "The stepping interval of the slider.", "fieldName": "step" }, { "name": "value-always-visible", "type": { "text": "boolean" }, "description": "When true, the value bubble is always visible,\nregardless of focus or hover state.", "fieldName": "valueAlwaysVisible" } ], "mixins": [ { "name": "SlotStylesMixin", "package": "@vaadin/component-base/src/slot-styles-mixin.js" }, { "name": "DisabledMixin", "package": "@vaadin/a11y-base/src/disabled-mixin.js" } ], "parameters": [ { "name": "superClass" } ] } ], "exports": [ { "kind": "js", "name": "SliderMixin", "declaration": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } } ] }, { "kind": "javascript-module", "path": "src/vaadin-slider.js", "declarations": [ { "kind": "class", "description": "`` is a web component that represents a range slider\nfor selecting numerical values within a defined range.\n\n```html\n\n```\n\n### Styling\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n---------------------|-----------------\n`label` | The label element\n`required-indicator` | The required indicator element\n`helper-text` | The helper text element\n`error-message` | The error message element\n`track` | The slider track\n`track-fill` | The filled portion of the track\n`thumb` | The slider thumb\n`marks` | Container for min/max labels\n`min` | Minimum value label\n`max` | Maximum value label\n\nThe following state attributes are available for styling:\n\nAttribute | Description\n-------------------|-------------\n`active` | Set when the slider is activated with mouse or touch\n`disabled` | Set when the slider is disabled\n`readonly` | Set when the slider is read-only\n`focused` | Set when the slider has focus\n`focus-ring` | Set when the slider is focused using the keyboard\n`min-max-visible` | Set when the min/max labels are displayed\n\nThe following custom CSS properties are available for styling:\n\nCustom CSS property |\n:--------------------------------------------|\n`--vaadin-field-default-width` |\n`--vaadin-input-field-error-color` |\n`--vaadin-input-field-error-font-size` |\n`--vaadin-input-field-error-font-weight` |\n`--vaadin-input-field-helper-color` |\n`--vaadin-input-field-helper-font-size` |\n`--vaadin-input-field-helper-font-weight` |\n`--vaadin-input-field-label-color` |\n`--vaadin-input-field-label-font-size` |\n`--vaadin-input-field-label-font-weight` |\n`--vaadin-input-field-required-indicator` |\n`--vaadin-slider-bubble-arrow-size` |\n`--vaadin-slider-bubble-background` |\n`--vaadin-slider-bubble-border-color` |\n`--vaadin-slider-bubble-border-radius` |\n`--vaadin-slider-bubble-border-width` |\n`--vaadin-slider-bubble-offset` |\n`--vaadin-slider-bubble-padding` |\n`--vaadin-slider-bubble-shadow` |\n`--vaadin-slider-bubble-text-color` |\n`--vaadin-slider-bubble-font-size` |\n`--vaadin-slider-bubble-font-weight` |\n`--vaadin-slider-bubble-line-height` |\n`--vaadin-slider-fill-background` |\n`--vaadin-slider-fill-border-color` |\n`--vaadin-slider-fill-border-width` |\n`--vaadin-slider-marks-color` |\n`--vaadin-slider-marks-font-size` |\n`--vaadin-slider-marks-font-weight` |\n`--vaadin-slider-thumb-border-color` |\n`--vaadin-slider-thumb-border-radius` |\n`--vaadin-slider-thumb-border-width` |\n`--vaadin-slider-thumb-cursor` |\n`--vaadin-slider-thumb-cursor-active` |\n`--vaadin-slider-thumb-height` |\n`--vaadin-slider-thumb-width` |\n`--vaadin-slider-track-background` |\n`--vaadin-slider-track-border-color` |\n`--vaadin-slider-track-border-radius` |\n`--vaadin-slider-track-border-width` |\n`--vaadin-slider-track-height` |\n\nIn order to style the slider bubble, use `` shadow DOM parts:\n\nPart name | Description\n-----------------|----------------------\n`overlay` | The overlay container\n`content` | The overlay content\n`arrow` | Arrow pointing to the thumb\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.", "name": "Slider", "members": [ { "kind": "field", "name": "accessibleName", "privacy": "public", "type": { "text": "string" }, "description": "String used to label the component to screen reader users.", "attribute": "accessible-name", "inheritedFrom": { "name": "FieldMixin", "package": "@vaadin/field-base/src/field-mixin.js" } }, { "kind": "field", "name": "accessibleNameRef", "privacy": "public", "type": { "text": "string" }, "description": "Id of the element used as label of the component to screen reader users.", "attribute": "accessible-name-ref", "inheritedFrom": { "name": "FieldMixin", "package": "@vaadin/field-base/src/field-mixin.js" } }, { "kind": "method", "name": "checkValidity", "description": "Returns true if the field value satisfies all constraints (if any).", "return": { "type": { "text": "boolean" } }, "inheritedFrom": { "name": "ValidateMixin", "package": "@vaadin/field-base/src/validate-mixin.js" } }, { "kind": "field", "name": "disabled", "privacy": "public", "type": { "text": "boolean" }, "description": "If true, the user cannot interact with this element.", "attribute": "disabled", "inheritedFrom": { "name": "DisabledMixin", "package": "@vaadin/a11y-base/src/disabled-mixin.js" } }, { "kind": "field", "name": "errorMessage", "privacy": "public", "type": { "text": "string" }, "description": "Error to show when the field is invalid.", "attribute": "error-message", "inheritedFrom": { "name": "FieldMixin", "package": "@vaadin/field-base/src/field-mixin.js" } }, { "kind": "field", "name": "helperText", "privacy": "public", "type": { "text": "string" }, "description": "String used for the helper text.", "attribute": "helper-text", "inheritedFrom": { "name": "FieldMixin", "package": "@vaadin/field-base/src/field-mixin.js" } }, { "kind": "field", "name": "invalid", "privacy": "public", "type": { "text": "boolean" }, "description": "Set to true when the field is invalid.", "attribute": "invalid", "inheritedFrom": { "name": "ValidateMixin", "package": "@vaadin/field-base/src/validate-mixin.js" } }, { "kind": "field", "name": "label", "privacy": "public", "type": { "text": "string" }, "description": "The label text for the input node.\nWhen no light dom defined via [slot=label], this value will be used.", "attribute": "label", "inheritedFrom": { "name": "LabelMixin", "package": "@vaadin/field-base/src/label-mixin.js" } }, { "kind": "field", "name": "manualValidation", "privacy": "public", "type": { "text": "boolean" }, "description": "Set to true to enable manual validation mode. This mode disables automatic\nconstraint validation, allowing you to control the validation process yourself.\nYou can still trigger constraint validation manually with the `validate()` method\nor use `checkValidity()` to assess the component's validity without affecting\nthe invalid state. In manual validation mode, you can also manipulate\nthe `invalid` property directly through your application logic without conflicts\nwith the component's internal validation.", "attribute": "manual-validation", "inheritedFrom": { "name": "ValidateMixin", "package": "@vaadin/field-base/src/validate-mixin.js" } }, { "kind": "field", "name": "max", "privacy": "public", "type": { "text": "number" }, "description": "The maximum allowed value.", "attribute": "max", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } }, { "kind": "field", "name": "min", "privacy": "public", "type": { "text": "number" }, "description": "The minimum allowed value.", "attribute": "min", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } }, { "kind": "field", "name": "minMaxVisible", "privacy": "public", "type": { "text": "boolean" }, "description": "When true, displays the min and max values below the slider track.", "attribute": "min-max-visible", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } }, { "kind": "field", "name": "readonly", "privacy": "public", "type": { "text": "boolean" }, "description": "When true, the user cannot modify the value of the slider.\nThe difference between `disabled` and `readonly` is that the\nread-only slider remains focusable and is announced by screen\nreaders.", "attribute": "readonly", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } }, { "kind": "field", "name": "required", "privacy": "public", "type": { "text": "boolean" }, "description": "Specifies that the user must fill in a value.", "attribute": "required", "inheritedFrom": { "name": "ValidateMixin", "package": "@vaadin/field-base/src/validate-mixin.js" } }, { "kind": "field", "name": "step", "privacy": "public", "type": { "text": "number" }, "description": "The stepping interval of the slider.", "attribute": "step", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } }, { "kind": "method", "name": "validate", "description": "Validates the field and sets the `invalid` property based on the result.\n\nThe method fires a `validated` event with the result of the validation.", "return": { "type": { "text": "boolean" } }, "inheritedFrom": { "name": "ValidateMixin", "package": "@vaadin/field-base/src/validate-mixin.js" } }, { "kind": "field", "name": "value", "privacy": "public", "type": { "text": "number" }, "description": "The value of the slider.", "attribute": "value" }, { "kind": "field", "name": "valueAlwaysVisible", "privacy": "public", "type": { "text": "boolean" }, "description": "When true, the value bubble is always visible,\nregardless of focus or hover state.", "attribute": "value-always-visible", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } } ], "events": [ { "name": "change", "type": { "text": "Event" }, "description": "Fired when the user commits a value change.", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } }, { "name": "input", "type": { "text": "Event" }, "description": "Fired when the slider value changes during user interaction.", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } }, { "type": { "text": "CustomEvent" }, "description": "Fired when the `invalid` property changes.", "name": "invalid-changed" }, { "name": "validated", "type": { "text": "CustomEvent" }, "description": "Fired whenever the field is validated.", "inheritedFrom": { "name": "ValidateMixin", "package": "@vaadin/field-base/src/validate-mixin.js" } }, { "type": { "text": "CustomEvent" }, "description": "Fired when the `value` property changes.", "name": "value-changed" } ], "attributes": [ { "name": "accessible-name", "type": { "text": "string" }, "description": "String used to label the component to screen reader users.", "fieldName": "accessibleName", "inheritedFrom": { "name": "FieldMixin", "package": "@vaadin/field-base/src/field-mixin.js" } }, { "name": "accessible-name-ref", "type": { "text": "string" }, "description": "Id of the element used as label of the component to screen reader users.", "fieldName": "accessibleNameRef", "inheritedFrom": { "name": "FieldMixin", "package": "@vaadin/field-base/src/field-mixin.js" } }, { "name": "disabled", "type": { "text": "boolean" }, "description": "If true, the user cannot interact with this element.", "fieldName": "disabled", "inheritedFrom": { "name": "DisabledMixin", "package": "@vaadin/a11y-base/src/disabled-mixin.js" } }, { "name": "error-message", "type": { "text": "string" }, "description": "Error to show when the field is invalid.", "fieldName": "errorMessage", "inheritedFrom": { "name": "FieldMixin", "package": "@vaadin/field-base/src/field-mixin.js" } }, { "name": "helper-text", "type": { "text": "string" }, "description": "String used for the helper text.", "fieldName": "helperText", "inheritedFrom": { "name": "FieldMixin", "package": "@vaadin/field-base/src/field-mixin.js" } }, { "name": "invalid", "type": { "text": "boolean" }, "description": "Set to true when the field is invalid.", "fieldName": "invalid", "inheritedFrom": { "name": "ValidateMixin", "package": "@vaadin/field-base/src/validate-mixin.js" } }, { "name": "label", "type": { "text": "string" }, "description": "The label text for the input node.\nWhen no light dom defined via [slot=label], this value will be used.", "fieldName": "label", "inheritedFrom": { "name": "LabelMixin", "package": "@vaadin/field-base/src/label-mixin.js" } }, { "name": "manual-validation", "type": { "text": "boolean" }, "description": "Set to true to enable manual validation mode. This mode disables automatic\nconstraint validation, allowing you to control the validation process yourself.\nYou can still trigger constraint validation manually with the `validate()` method\nor use `checkValidity()` to assess the component's validity without affecting\nthe invalid state. In manual validation mode, you can also manipulate\nthe `invalid` property directly through your application logic without conflicts\nwith the component's internal validation.", "fieldName": "manualValidation", "inheritedFrom": { "name": "ValidateMixin", "package": "@vaadin/field-base/src/validate-mixin.js" } }, { "name": "max", "type": { "text": "number" }, "description": "The maximum allowed value.", "fieldName": "max", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } }, { "name": "min", "type": { "text": "number" }, "description": "The minimum allowed value.", "fieldName": "min", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } }, { "name": "min-max-visible", "type": { "text": "boolean" }, "description": "When true, displays the min and max values below the slider track.", "fieldName": "minMaxVisible", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } }, { "name": "readonly", "type": { "text": "boolean" }, "description": "When true, the user cannot modify the value of the slider.\nThe difference between `disabled` and `readonly` is that the\nread-only slider remains focusable and is announced by screen\nreaders.", "fieldName": "readonly", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } }, { "name": "required", "type": { "text": "boolean" }, "description": "Specifies that the user must fill in a value.", "fieldName": "required", "inheritedFrom": { "name": "ValidateMixin", "package": "@vaadin/field-base/src/validate-mixin.js" } }, { "name": "step", "type": { "text": "number" }, "description": "The stepping interval of the slider.", "fieldName": "step", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } }, { "name": "value", "type": { "text": "number" }, "description": "The value of the slider.", "fieldName": "value" }, { "name": "value-always-visible", "type": { "text": "boolean" }, "description": "When true, the value bubble is always visible,\nregardless of focus or hover state.", "fieldName": "valueAlwaysVisible", "inheritedFrom": { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" } } ], "mixins": [ { "name": "FieldMixin", "package": "@vaadin/field-base/src/field-mixin.js" }, { "name": "SliderMixin", "module": "src/vaadin-slider-mixin.js" }, { "name": "FocusMixin", "package": "@vaadin/a11y-base/src/focus-mixin.js" }, { "name": "ElementMixin", "package": "@vaadin/component-base/src/element-mixin.js" }, { "name": "ThemableMixin", "package": "@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js" }, { "name": "PolylitMixin", "package": "@vaadin/component-base/src/polylit-mixin.js" }, { "name": "LumoInjectionMixin", "package": "@vaadin/vaadin-themable-mixin/lumo-injection-mixin.js" } ], "superclass": { "name": "LitElement", "package": "lit" }, "tagName": "vaadin-slider", "customElement": true } ], "exports": [ { "kind": "js", "name": "Slider", "declaration": { "name": "Slider", "module": "src/vaadin-slider.js" } } ] } ] }