@vuetify/nightly 4.0.0-dev-20230419.0 → 4.0.0-dev-20230422.0

package/lib/components/VSelect/index.d.ts

@@ -272,10 +272,10 @@ declare const VSelect: {
             errorMessages: string | string[];
             maxErrors: string | number;
             rules: ValidationRule[];
+            persistentHint: boolean;
             clearable: boolean;
             persistentClear: boolean;
             singleLine: boolean;
-            persistentHint: boolean;
             persistentPlaceholder: boolean;
             persistentCounter: boolean;
             valueComparator: typeof deepEqual;
@@ -573,6 +573,7 @@ declare const VSelect: {
             'onClick:appendInner': PropType<EventProp<[MouseEvent], (args_0: MouseEvent) => any>>;
             'onClick:prependInner': PropType<EventProp<[MouseEvent], (args_0: MouseEvent) => any>>;
             focused: BooleanConstructor;
+            'onUpdate:focused': PropType<EventProp<[FocusEvent], (args_0: FocusEvent) => any>>;
             validateOn: PropType<"input" | "blur" | "submit" | undefined>;
             errorMessages: {
                 type: PropType<string | string[]>;
@@ -586,12 +587,12 @@ declare const VSelect: {
                 type: PropType<ValidationRule[]>;
                 default: () => never[];
             };
+            hint: StringConstructor;
+            persistentHint: BooleanConstructor;
             hideDetails: PropType<boolean | "auto">;
             clearable: BooleanConstructor;
             persistentClear: BooleanConstructor;
             singleLine: BooleanConstructor;
-            hint: StringConstructor;
-            persistentHint: BooleanConstructor;
             persistentPlaceholder: BooleanConstructor;
             persistentCounter: BooleanConstructor;
             suffix: StringConstructor;
@@ -957,8 +958,9 @@ declare const VSelect: {
                 default: typeof deepEqual;
             };
         }, "multiple" | "$children" | "$slots" | "v-slots" | "items" | "v-slot:append" | "v-slot:prepend" | "modelValue" | "onUpdate:modelValue" | "v-slot:loader" | "v-slot:details" | "v-slot:clear" | "v-slot:label" | "v-slot:prepend-inner" | "v-slot:append-inner" | "v-slot:item" | "returnObject" | "v-slot:chip" | "v-slot:selection" | "v-slot:prepend-item" | "v-slot:append-item" | "v-slot:no-data">>> & {
+            "onUpdate:focused"?: ((focused: boolean) => any) | undefined;
             "onUpdate:menu"?: ((val: boolean) => any) | undefined;
-        } & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, "flat" | "reverse" | "type" | "error" | "active" | "direction" | "transition" | "menu" | "autofocus" | "eager" | "disabled" | "readonly" | "noDataText" | "messages" | "rounded" | "density" | "variant" | "clearIcon" | "focused" | "errorMessages" | "maxErrors" | "rules" | "clearable" | "persistentClear" | "singleLine" | "persistentHint" | "persistentPlaceholder" | "persistentCounter" | "valueComparator" | "itemTitle" | "itemValue" | "itemChildren" | "itemProps" | "chips" | "closableChips" | "hideNoData" | "hideSelected" | "menuIcon" | "openOnClear">;
+        } & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, "flat" | "reverse" | "type" | "error" | "active" | "direction" | "transition" | "menu" | "autofocus" | "eager" | "disabled" | "readonly" | "noDataText" | "messages" | "rounded" | "density" | "variant" | "clearIcon" | "focused" | "errorMessages" | "maxErrors" | "rules" | "persistentHint" | "clearable" | "persistentClear" | "singleLine" | "persistentPlaceholder" | "persistentCounter" | "valueComparator" | "itemTitle" | "itemValue" | "itemChildren" | "itemProps" | "chips" | "closableChips" | "hideNoData" | "hideSelected" | "menuIcon" | "openOnClear">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -970,7 +972,7 @@ declare const VSelect: {
         }>;
         $root: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}> | null;
         $parent: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}> | null;
-        $emit: (event: "update:menu", val: boolean) => void;
+        $emit: ((event: "update:focused", focused: boolean) => void) & ((event: "update:menu", val: boolean) => void);
         $el: any;
         $options: vue.ComponentOptionsBase<Readonly<vue.ExtractPropTypes<Omit<{
             transition: Omit<{
@@ -1256,6 +1258,7 @@ declare const VSelect: {
             'onClick:appendInner': PropType<EventProp<[MouseEvent], (args_0: MouseEvent) => any>>;
             'onClick:prependInner': PropType<EventProp<[MouseEvent], (args_0: MouseEvent) => any>>;
             focused: BooleanConstructor;
+            'onUpdate:focused': PropType<EventProp<[FocusEvent], (args_0: FocusEvent) => any>>;
             validateOn: PropType<"input" | "blur" | "submit" | undefined>;
             errorMessages: {
                 type: PropType<string | string[]>;
@@ -1269,12 +1272,12 @@ declare const VSelect: {
                 type: PropType<ValidationRule[]>;
                 default: () => never[];
             };
+            hint: StringConstructor;
+            persistentHint: BooleanConstructor;
             hideDetails: PropType<boolean | "auto">;
             clearable: BooleanConstructor;
             persistentClear: BooleanConstructor;
             singleLine: BooleanConstructor;
-            hint: StringConstructor;
-            persistentHint: BooleanConstructor;
             persistentPlaceholder: BooleanConstructor;
             persistentCounter: BooleanConstructor;
             suffix: StringConstructor;
@@ -1640,11 +1643,14 @@ declare const VSelect: {
                 default: typeof deepEqual;
             };
         }, "multiple" | "$children" | "$slots" | "v-slots" | "items" | "v-slot:append" | "v-slot:prepend" | "modelValue" | "onUpdate:modelValue" | "v-slot:loader" | "v-slot:details" | "v-slot:clear" | "v-slot:label" | "v-slot:prepend-inner" | "v-slot:append-inner" | "v-slot:item" | "returnObject" | "v-slot:chip" | "v-slot:selection" | "v-slot:prepend-item" | "v-slot:append-item" | "v-slot:no-data">>> & {
+            "onUpdate:focused"?: ((focused: boolean) => any) | undefined;
             "onUpdate:menu"?: ((val: boolean) => any) | undefined;
         }, {
+            isFocused: vue.Ref<boolean>;
             menu: vue.WritableComputedRef<boolean>;
             select: (item: InternalItem) => void;
         } & Omit<any, string | number | symbol>, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Omit<{
+            'update:focused': (focused: boolean) => boolean;
             'update:modelValue': (val: any) => boolean;
             'update:menu': (val: boolean) => true;
         }, "multiple" | "$children" | "$slots" | "v-slots" | "items" | "v-slot:append" | "v-slot:prepend" | "modelValue" | "update:modelValue" | "v-slot:loader" | "v-slot:details" | "v-slot:clear" | "v-slot:label" | "v-slot:prepend-inner" | "v-slot:append-inner" | "v-slot:item" | "returnObject" | "v-slot:chip" | "v-slot:selection" | "v-slot:prepend-item" | "v-slot:append-item" | "v-slot:no-data">, string, {
@@ -1776,10 +1782,10 @@ declare const VSelect: {
             errorMessages: string | string[];
             maxErrors: string | number;
             rules: ValidationRule[];
+            persistentHint: boolean;
             clearable: boolean;
             persistentClear: boolean;
             singleLine: boolean;
-            persistentHint: boolean;
             persistentPlaceholder: boolean;
             persistentCounter: boolean;
             valueComparator: typeof deepEqual;
@@ -2097,6 +2103,7 @@ declare const VSelect: {
         'onClick:appendInner': PropType<EventProp<[MouseEvent], (args_0: MouseEvent) => any>>;
         'onClick:prependInner': PropType<EventProp<[MouseEvent], (args_0: MouseEvent) => any>>;
         focused: BooleanConstructor;
+        'onUpdate:focused': PropType<EventProp<[FocusEvent], (args_0: FocusEvent) => any>>;
         validateOn: PropType<"input" | "blur" | "submit" | undefined>;
         errorMessages: {
             type: PropType<string | string[]>;
@@ -2110,12 +2117,12 @@ declare const VSelect: {
             type: PropType<ValidationRule[]>;
             default: () => never[];
         };
+        hint: StringConstructor;
+        persistentHint: BooleanConstructor;
         hideDetails: PropType<boolean | "auto">;
         clearable: BooleanConstructor;
         persistentClear: BooleanConstructor;
         singleLine: BooleanConstructor;
-        hint: StringConstructor;
-        persistentHint: BooleanConstructor;
         persistentPlaceholder: BooleanConstructor;
         persistentCounter: BooleanConstructor;
         suffix: StringConstructor;
@@ -2481,8 +2488,10 @@ declare const VSelect: {
             default: typeof deepEqual;
         };
     }, "multiple" | "$children" | "$slots" | "v-slots" | "items" | "v-slot:append" | "v-slot:prepend" | "modelValue" | "onUpdate:modelValue" | "v-slot:loader" | "v-slot:details" | "v-slot:clear" | "v-slot:label" | "v-slot:prepend-inner" | "v-slot:append-inner" | "v-slot:item" | "returnObject" | "v-slot:chip" | "v-slot:selection" | "v-slot:prepend-item" | "v-slot:append-item" | "v-slot:no-data">>> & {
+        "onUpdate:focused"?: ((focused: boolean) => any) | undefined;
         "onUpdate:menu"?: ((val: boolean) => any) | undefined;
     } & vue.ShallowUnwrapRef<{
+        isFocused: vue.Ref<boolean>;
         menu: vue.WritableComputedRef<boolean>;
         select: (item: InternalItem) => void;
     } & Omit<any, string | number | symbol>> & {} & vue.ComponentCustomProperties & {};
@@ -2773,6 +2782,7 @@ declare const VSelect: {
     'onClick:appendInner': PropType<EventProp<[MouseEvent], (args_0: MouseEvent) => any>>;
     'onClick:prependInner': PropType<EventProp<[MouseEvent], (args_0: MouseEvent) => any>>;
     focused: BooleanConstructor;
+    'onUpdate:focused': PropType<EventProp<[FocusEvent], (args_0: FocusEvent) => any>>;
     validateOn: PropType<"input" | "blur" | "submit" | undefined>;
     errorMessages: {
         type: PropType<string | string[]>;
@@ -2786,12 +2796,12 @@ declare const VSelect: {
         type: PropType<ValidationRule[]>;
         default: () => never[];
     };
+    hint: StringConstructor;
+    persistentHint: BooleanConstructor;
     hideDetails: PropType<boolean | "auto">;
     clearable: BooleanConstructor;
     persistentClear: BooleanConstructor;
     singleLine: BooleanConstructor;
-    hint: StringConstructor;
-    persistentHint: BooleanConstructor;
     persistentPlaceholder: BooleanConstructor;
     persistentCounter: BooleanConstructor;
     suffix: StringConstructor;
@@ -3157,11 +3167,14 @@ declare const VSelect: {
         default: typeof deepEqual;
     };
 }, "multiple" | "$children" | "$slots" | "v-slots" | "items" | "v-slot:append" | "v-slot:prepend" | "modelValue" | "onUpdate:modelValue" | "v-slot:loader" | "v-slot:details" | "v-slot:clear" | "v-slot:label" | "v-slot:prepend-inner" | "v-slot:append-inner" | "v-slot:item" | "returnObject" | "v-slot:chip" | "v-slot:selection" | "v-slot:prepend-item" | "v-slot:append-item" | "v-slot:no-data">>> & {
+    "onUpdate:focused"?: ((focused: boolean) => any) | undefined;
     "onUpdate:menu"?: ((val: boolean) => any) | undefined;
 }, {
+    isFocused: vue.Ref<boolean>;
     menu: vue.WritableComputedRef<boolean>;
     select: (item: InternalItem) => void;
 } & Omit<any, string | number | symbol>, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Omit<{
+    'update:focused': (focused: boolean) => boolean;
     'update:modelValue': (val: any) => boolean;
     'update:menu': (val: boolean) => true;
 }, "multiple" | "$children" | "$slots" | "v-slots" | "items" | "v-slot:append" | "v-slot:prepend" | "modelValue" | "update:modelValue" | "v-slot:loader" | "v-slot:details" | "v-slot:clear" | "v-slot:label" | "v-slot:prepend-inner" | "v-slot:append-inner" | "v-slot:item" | "returnObject" | "v-slot:chip" | "v-slot:selection" | "v-slot:prepend-item" | "v-slot:append-item" | "v-slot:no-data">, string, {
@@ -3293,10 +3306,10 @@ declare const VSelect: {
     errorMessages: string | string[];
     maxErrors: string | number;
     rules: ValidationRule[];
+    persistentHint: boolean;
     clearable: boolean;
     persistentClear: boolean;
     singleLine: boolean;
-    persistentHint: boolean;
     persistentPlaceholder: boolean;
     persistentCounter: boolean;
     valueComparator: typeof deepEqual;
@@ -3710,6 +3723,7 @@ declare const VSelect: {
     'onClick:appendInner': PropType<EventProp<[MouseEvent], (args_0: MouseEvent) => any>>;
     'onClick:prependInner': PropType<EventProp<[MouseEvent], (args_0: MouseEvent) => any>>;
     focused: BooleanConstructor;
+    'onUpdate:focused': PropType<EventProp<[FocusEvent], (args_0: FocusEvent) => any>>;
     validateOn: PropType<"input" | "blur" | "submit" | undefined>;
     errorMessages: {
         type: PropType<string | string[]>;
@@ -3723,12 +3737,12 @@ declare const VSelect: {
         type: PropType<ValidationRule[]>;
         default: () => never[];
     };
+    hint: StringConstructor;
+    persistentHint: BooleanConstructor;
     hideDetails: PropType<boolean | "auto">;
     clearable: BooleanConstructor;
     persistentClear: BooleanConstructor;
     singleLine: BooleanConstructor;
-    hint: StringConstructor;
-    persistentHint: BooleanConstructor;
     persistentPlaceholder: BooleanConstructor;
     persistentCounter: BooleanConstructor;
     suffix: StringConstructor;
@@ -4377,6 +4391,7 @@ declare const VSelect: {
     'onClick:appendInner': PropType<EventProp<[MouseEvent], (args_0: MouseEvent) => any>>;
     'onClick:prependInner': PropType<EventProp<[MouseEvent], (args_0: MouseEvent) => any>>;
     focused: BooleanConstructor;
+    'onUpdate:focused': PropType<EventProp<[FocusEvent], (args_0: FocusEvent) => any>>;
     validateOn: PropType<"input" | "blur" | "submit" | undefined>;
     errorMessages: {
         type: PropType<string | string[]>;
@@ -4390,12 +4405,12 @@ declare const VSelect: {
         type: PropType<ValidationRule[]>;
         default: () => never[];
     };
+    hint: StringConstructor;
+    persistentHint: BooleanConstructor;
     hideDetails: PropType<boolean | "auto">;
     clearable: BooleanConstructor;
     persistentClear: BooleanConstructor;
     singleLine: BooleanConstructor;
-    hint: StringConstructor;
-    persistentHint: BooleanConstructor;
     persistentPlaceholder: BooleanConstructor;
     persistentCounter: BooleanConstructor;
     suffix: StringConstructor;

package/lib/components/VSlider/VSlider.mjs

@@ -3,12 +3,12 @@ import { mergeProps as _mergeProps, createVNode as _createVNode, Fragment as _Fr
 import "./VSlider.css";
 
 // Components
-import { filterInputProps, makeVInputProps, VInput } from "../VInput/VInput.mjs";
+import { makeVInputProps, VInput } from "../VInput/VInput.mjs";
 import { VLabel } from "../VLabel/index.mjs";
 import { VSliderThumb } from "./VSliderThumb.mjs";
 import { VSliderTrack } from "./VSliderTrack.mjs"; // Composables
 import { makeFocusProps, useFocus } from "../../composables/focus.mjs";
-import { makeSliderProps, useSlider } from "./slider.mjs";
+import { makeSliderProps, useSlider, useSteps } from "./slider.mjs";
 import { useProxiedModel } from "../../composables/proxiedModel.mjs"; // Utilities
 import { computed, ref } from 'vue';
 import { genericComponent, useRender } from "../../util/index.mjs"; // Types
@@ -25,13 +25,21 @@ export const VSlider = genericComponent()({
   },
   emits: {
     'update:focused': value => true,
-    'update:modelValue': v => true
+    'update:modelValue': v => true,
+    start: value => true,
+    end: value => true
   },
   setup(props, _ref) {
     let {
-      slots
+      slots,
+      emit
     } = _ref;
     const thumbContainerRef = ref();
+    const steps = useSteps(props);
+    const model = useProxiedModel(props, 'modelValue', undefined, v => {
+      const value = typeof v === 'string' ? parseFloat(v) : v == null ? steps.min.value : v;
+      return steps.roundValue(value);
+    });
     const {
       min,
       max,
@@ -45,16 +53,26 @@ export const VSlider = genericComponent()({
       readonly
     } = useSlider({
       props,
-      // eslint-disable-next-line @typescript-eslint/no-use-before-define
-      handleSliderMouseUp: newValue => model.value = roundValue(newValue),
-      // eslint-disable-next-line @typescript-eslint/no-use-before-define
-      handleMouseMove: newValue => model.value = roundValue(newValue),
+      steps,
+      onSliderStart: () => {
+        emit('start', model.value);
+      },
+      onSliderEnd: _ref2 => {
+        let {
+          value
+        } = _ref2;
+        const roundedValue = roundValue(value);
+        model.value = roundedValue;
+        emit('end', roundedValue);
+      },
+      onSliderMove: _ref3 => {
+        let {
+          value
+        } = _ref3;
+        return model.value = roundValue(value);
+      },
       getActiveThumb: () => thumbContainerRef.value?.$el
     });
-    const model = useProxiedModel(props, 'modelValue', undefined, v => {
-      const value = typeof v === 'string' ? parseFloat(v) : v == null ? min.value : v;
-      return roundValue(value);
-    });
     const {
       isFocused,
       focus,
@@ -62,7 +80,7 @@ export const VSlider = genericComponent()({
     } = useFocus(props);
     const trackStop = computed(() => position(model.value));
     useRender(() => {
-      const [inputProps, _] = filterInputProps(props);
+      const [inputProps, _] = VInput.filterProps(props);
       const hasPrepend = !!(props.label || slots.label || slots.prepend);
       return _createVNode(VInput, _mergeProps({
         "class": ['v-slider', {
@@ -80,11 +98,11 @@ export const VSlider = genericComponent()({
           "class": "v-slider__label",
           "text": props.label
         }, null) : undefined, slots.prepend?.(slotProps)]) : undefined,
-        default: _ref2 => {
+        default: _ref4 => {
           let {
             id,
             messagesId
-          } = _ref2;
+          } = _ref4;
           return _createVNode("div", {
             "class": "v-slider__container",
             "onMousedown": !readonly.value ? onSliderMousedown : undefined,

package/lib/components/VSlider/VSlider.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VSlider.mjs","names":["filterInputProps","makeVInputProps","VInput","VLabel","VSliderThumb","VSliderTrack","makeFocusProps","useFocus","makeSliderProps","useSlider","useProxiedModel","computed","ref","genericComponent","useRender","VSlider","name","props","modelValue","type","Number","String","default","emits","value","v","setup","_ref","slots","thumbContainerRef","min","max","mousePressed","roundValue","onSliderMousedown","onSliderTouchstart","trackContainerRef","position","hasLabels","readonly","handleSliderMouseUp","newValue","model","handleMouseMove","getActiveThumb","$el","undefined","parseFloat","isFocused","focus","blur","trackStop","inputProps","_","hasPrepend","label","prepend","_createVNode","_mergeProps","disabled","slotProps","_Fragment","id","_ref2","messagesId","elevation"],"sources":["../../../src/components/VSlider/VSlider.tsx"],"sourcesContent":["// Styles\nimport './VSlider.sass'\n\n// Components\nimport { filterInputProps, makeVInputProps, VInput } from '@/components/VInput/VInput'\nimport { VLabel } from '@/components/VLabel'\nimport { VSliderThumb } from './VSliderThumb'\nimport { VSliderTrack } from './VSliderTrack'\n\n// Composables\nimport { makeFocusProps, useFocus } from '@/composables/focus'\nimport { makeSliderProps, useSlider } from './slider'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { computed, ref } from 'vue'\nimport { genericComponent, useRender } from '@/util'\n\n// Types\nimport type { MakeSlots } from '@/util'\nimport type { VInputSlots } from '@/components/VInput/VInput'\n\nexport type VSliderSlots = VInputSlots & MakeSlots<{\n  'tick-label': []\n  'thumb-label': []\n}>\n\nexport const VSlider = genericComponent<VSliderSlots>()({\n  name: 'VSlider',\n\n  props: {\n    ...makeFocusProps(),\n    ...makeSliderProps(),\n    ...makeVInputProps(),\n\n    modelValue: {\n      type: [Number, String],\n      default: 0,\n    },\n  },\n\n  emits: {\n    'update:focused': (value: boolean) => true,\n    'update:modelValue': (v: number) => true,\n  },\n\n  setup (props, { slots }) {\n    const thumbContainerRef = ref()\n\n    const {\n      min,\n      max,\n      mousePressed,\n      roundValue,\n      onSliderMousedown,\n      onSliderTouchstart,\n      trackContainerRef,\n      position,\n      hasLabels,\n      readonly,\n    } = useSlider({\n      props,\n      // eslint-disable-next-line @typescript-eslint/no-use-before-define\n      handleSliderMouseUp: newValue => model.value = roundValue(newValue),\n      // eslint-disable-next-line @typescript-eslint/no-use-before-define\n      handleMouseMove: newValue => model.value = roundValue(newValue),\n      getActiveThumb: () => thumbContainerRef.value?.$el,\n    })\n\n    const model = useProxiedModel(\n      props,\n      'modelValue',\n      undefined,\n      v => {\n        const value = typeof v === 'string' ? parseFloat(v) : v == null ? min.value : v\n\n        return roundValue(value)\n      },\n    )\n\n    const { isFocused, focus, blur } = useFocus(props)\n    const trackStop = computed(() => position(model.value))\n\n    useRender(() => {\n      const [inputProps, _] = filterInputProps(props)\n      const hasPrepend = !!(props.label || slots.label || slots.prepend)\n\n      return (\n        <VInput\n          class={[\n            'v-slider',\n            {\n              'v-slider--has-labels': !!slots['tick-label'] || hasLabels.value,\n              'v-slider--focused': isFocused.value,\n              'v-slider--pressed': mousePressed.value,\n              'v-slider--disabled': props.disabled,\n            },\n          ]}\n          { ...inputProps }\n          focused={ isFocused.value }\n        >\n          {{\n            ...slots,\n            prepend: hasPrepend ? slotProps => (\n              <>\n                { slots.label?.(slotProps) ?? props.label\n                  ? (\n                    <VLabel\n                      id={ slotProps.id.value }\n                      class=\"v-slider__label\"\n                      text={ props.label }\n                    />\n                  ) : undefined\n                }\n\n                { slots.prepend?.(slotProps) }\n              </>\n            ) : undefined,\n            default: ({ id, messagesId }) => (\n              <div\n                class=\"v-slider__container\"\n                onMousedown={ !readonly.value ? onSliderMousedown : undefined }\n                onTouchstartPassive={ !readonly.value ? onSliderTouchstart : undefined }\n              >\n                <input\n                  id={ id.value }\n                  name={ props.name || id.value }\n                  disabled={ props.disabled }\n                  readonly={ props.readonly }\n                  tabindex=\"-1\"\n                  value={ model.value }\n                />\n\n                <VSliderTrack\n                  ref={ trackContainerRef }\n                  start={ 0 }\n                  stop={ trackStop.value }\n                >\n                  {{ 'tick-label': slots['tick-label'] }}\n                </VSliderTrack>\n\n                <VSliderThumb\n                  ref={ thumbContainerRef }\n                  aria-describedby={ messagesId.value }\n                  focused={ isFocused.value }\n                  min={ min.value }\n                  max={ max.value }\n                  modelValue={ model.value }\n                  onUpdate:modelValue={ v => (model.value = v) }\n                  position={ trackStop.value }\n                  elevation={ props.elevation }\n                  onFocus={ focus }\n                  onBlur={ blur }\n                >\n                  {{ 'thumb-label': slots['thumb-label'] }}\n                </VSliderThumb>\n              </div>\n            ),\n          }}\n        </VInput>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VSlider = InstanceType<typeof VSlider>\n"],"mappings":"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"}
+{"version":3,"file":"VSlider.mjs","names":["makeVInputProps","VInput","VLabel","VSliderThumb","VSliderTrack","makeFocusProps","useFocus","makeSliderProps","useSlider","useSteps","useProxiedModel","computed","ref","genericComponent","useRender","VSlider","name","props","modelValue","type","Number","String","default","emits","value","v","start","end","setup","_ref","slots","emit","thumbContainerRef","steps","model","undefined","parseFloat","min","roundValue","max","mousePressed","onSliderMousedown","onSliderTouchstart","trackContainerRef","position","hasLabels","readonly","onSliderStart","onSliderEnd","_ref2","roundedValue","onSliderMove","_ref3","getActiveThumb","$el","isFocused","focus","blur","trackStop","inputProps","_","filterProps","hasPrepend","label","prepend","_createVNode","_mergeProps","disabled","slotProps","_Fragment","id","_ref4","messagesId","elevation"],"sources":["../../../src/components/VSlider/VSlider.tsx"],"sourcesContent":["// Styles\nimport './VSlider.sass'\n\n// Components\nimport { makeVInputProps, VInput } from '@/components/VInput/VInput'\nimport { VLabel } from '@/components/VLabel'\nimport { VSliderThumb } from './VSliderThumb'\nimport { VSliderTrack } from './VSliderTrack'\n\n// Composables\nimport { makeFocusProps, useFocus } from '@/composables/focus'\nimport { makeSliderProps, useSlider, useSteps } from './slider'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { computed, ref } from 'vue'\nimport { genericComponent, useRender } from '@/util'\n\n// Types\nimport type { MakeSlots } from '@/util'\nimport type { VInputSlots } from '@/components/VInput/VInput'\n\nexport type VSliderSlots = VInputSlots & MakeSlots<{\n  'tick-label': []\n  'thumb-label': []\n}>\n\nexport const VSlider = genericComponent<VSliderSlots>()({\n  name: 'VSlider',\n\n  props: {\n    ...makeFocusProps(),\n    ...makeSliderProps(),\n    ...makeVInputProps(),\n\n    modelValue: {\n      type: [Number, String],\n      default: 0,\n    },\n  },\n\n  emits: {\n    'update:focused': (value: boolean) => true,\n    'update:modelValue': (v: number) => true,\n    start: (value: number) => true,\n    end: (value: number) => true,\n  },\n\n  setup (props, { slots, emit }) {\n    const thumbContainerRef = ref()\n\n    const steps = useSteps(props)\n\n    const model = useProxiedModel(\n      props,\n      'modelValue',\n      undefined,\n      v => {\n        const value = typeof v === 'string' ? parseFloat(v) : v == null ? steps.min.value : v\n\n        return steps.roundValue(value)\n      },\n    )\n\n    const {\n      min,\n      max,\n      mousePressed,\n      roundValue,\n      onSliderMousedown,\n      onSliderTouchstart,\n      trackContainerRef,\n      position,\n      hasLabels,\n      readonly,\n    } = useSlider({\n      props,\n      steps,\n      onSliderStart: () => {\n        emit('start', model.value)\n      },\n      onSliderEnd: ({ value }) => {\n        const roundedValue = roundValue(value)\n        model.value = roundedValue\n        emit('end', roundedValue)\n      },\n      onSliderMove: ({ value }) => model.value = roundValue(value),\n      getActiveThumb: () => thumbContainerRef.value?.$el,\n    })\n\n    const { isFocused, focus, blur } = useFocus(props)\n    const trackStop = computed(() => position(model.value))\n\n    useRender(() => {\n      const [inputProps, _] = VInput.filterProps(props)\n      const hasPrepend = !!(props.label || slots.label || slots.prepend)\n\n      return (\n        <VInput\n          class={[\n            'v-slider',\n            {\n              'v-slider--has-labels': !!slots['tick-label'] || hasLabels.value,\n              'v-slider--focused': isFocused.value,\n              'v-slider--pressed': mousePressed.value,\n              'v-slider--disabled': props.disabled,\n            },\n          ]}\n          { ...inputProps }\n          focused={ isFocused.value }\n        >\n          {{\n            ...slots,\n            prepend: hasPrepend ? slotProps => (\n              <>\n                { slots.label?.(slotProps) ?? props.label\n                  ? (\n                    <VLabel\n                      id={ slotProps.id.value }\n                      class=\"v-slider__label\"\n                      text={ props.label }\n                    />\n                  ) : undefined\n                }\n\n                { slots.prepend?.(slotProps) }\n              </>\n            ) : undefined,\n            default: ({ id, messagesId }) => (\n              <div\n                class=\"v-slider__container\"\n                onMousedown={ !readonly.value ? onSliderMousedown : undefined }\n                onTouchstartPassive={ !readonly.value ? onSliderTouchstart : undefined }\n              >\n                <input\n                  id={ id.value }\n                  name={ props.name || id.value }\n                  disabled={ props.disabled }\n                  readonly={ props.readonly }\n                  tabindex=\"-1\"\n                  value={ model.value }\n                />\n\n                <VSliderTrack\n                  ref={ trackContainerRef }\n                  start={ 0 }\n                  stop={ trackStop.value }\n                >\n                  {{ 'tick-label': slots['tick-label'] }}\n                </VSliderTrack>\n\n                <VSliderThumb\n                  ref={ thumbContainerRef }\n                  aria-describedby={ messagesId.value }\n                  focused={ isFocused.value }\n                  min={ min.value }\n                  max={ max.value }\n                  modelValue={ model.value }\n                  onUpdate:modelValue={ v => (model.value = v) }\n                  position={ trackStop.value }\n                  elevation={ props.elevation }\n                  onFocus={ focus }\n                  onBlur={ blur }\n                >\n                  {{ 'thumb-label': slots['thumb-label'] }}\n                </VSliderThumb>\n              </div>\n            ),\n          }}\n        </VInput>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VSlider = InstanceType<typeof VSlider>\n"],"mappings":"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"}

package/lib/components/VSlider/index.d.ts

@@ -52,6 +52,7 @@ declare const VSlider: {
             errorMessages: string | string[];
             maxErrors: string | number;
             rules: ValidationRule[];
+            persistentHint: boolean;
             showTicks: boolean | "always";
             tickSize: string | number;
             trackSize: string | number;
@@ -74,6 +75,7 @@ declare const VSlider: {
             errorMessages: string | string[];
             maxErrors: string | number;
             rules: ValidationRule[];
+            persistentHint: boolean;
             showTicks: boolean | "always";
             tickSize: string | number;
             trackSize: string | number;
@@ -88,8 +90,10 @@ declare const VSlider: {
             appendIcon?: IconValue | undefined;
             'onClick:append'?: EventProp<[MouseEvent], (args_0: MouseEvent) => any> | undefined;
             'onClick:prepend'?: EventProp<[MouseEvent], (args_0: MouseEvent) => any> | undefined;
+            'onUpdate:focused'?: EventProp<[FocusEvent], (args_0: FocusEvent) => any> | undefined;
             validateOn?: "input" | "blur" | "submit" | undefined;
             validationValue?: any;
+            hint?: string | undefined;
             hideDetails?: boolean | "auto" | undefined;
             trackColor?: string | undefined;
             trackFillColor?: string | undefined;
@@ -131,7 +135,9 @@ declare const VSlider: {
         } & {
             "onUpdate:modelValue"?: ((v: number) => any) | undefined;
             "onUpdate:focused"?: ((value: boolean) => any) | undefined;
-        } & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, "reverse" | "max" | "error" | "direction" | "disabled" | "readonly" | "step" | "min" | "elevation" | "messages" | "rounded" | "density" | "modelValue" | "focused" | "errorMessages" | "maxErrors" | "rules" | "showTicks" | "tickSize" | "trackSize" | "thumbLabel" | "thumbSize">;
+            onEnd?: ((value: number) => any) | undefined;
+            onStart?: ((value: number) => any) | undefined;
+        } & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, "reverse" | "max" | "error" | "direction" | "disabled" | "readonly" | "step" | "min" | "elevation" | "messages" | "rounded" | "density" | "modelValue" | "focused" | "errorMessages" | "maxErrors" | "rules" | "persistentHint" | "showTicks" | "tickSize" | "trackSize" | "thumbLabel" | "thumbSize">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -143,7 +149,7 @@ declare const VSlider: {
         }>;
         $root: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}> | null;
         $parent: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}> | null;
-        $emit: ((event: "update:modelValue", v: number) => void) & ((event: "update:focused", value: boolean) => void);
+        $emit: ((event: "end", value: number) => void) & ((event: "start", value: number) => void) & ((event: "update:modelValue", v: number) => void) & ((event: "update:focused", value: boolean) => void);
         $el: any;
         $options: vue.ComponentOptionsBase<{
             reverse: boolean;
@@ -162,6 +168,7 @@ declare const VSlider: {
             errorMessages: string | string[];
             maxErrors: string | number;
             rules: ValidationRule[];
+            persistentHint: boolean;
             showTicks: boolean | "always";
             tickSize: string | number;
             trackSize: string | number;
@@ -176,8 +183,10 @@ declare const VSlider: {
             appendIcon?: IconValue | undefined;
             'onClick:append'?: EventProp<[MouseEvent], (args_0: MouseEvent) => any> | undefined;
             'onClick:prepend'?: EventProp<[MouseEvent], (args_0: MouseEvent) => any> | undefined;
+            'onUpdate:focused'?: EventProp<[FocusEvent], (args_0: FocusEvent) => any> | undefined;
             validateOn?: "input" | "blur" | "submit" | undefined;
             validationValue?: any;
+            hint?: string | undefined;
             hideDetails?: boolean | "auto" | undefined;
             trackColor?: string | undefined;
             trackFillColor?: string | undefined;
@@ -219,9 +228,13 @@ declare const VSlider: {
         } & {
             "onUpdate:modelValue"?: ((v: number) => any) | undefined;
             "onUpdate:focused"?: ((value: boolean) => any) | undefined;
+            onEnd?: ((value: number) => any) | undefined;
+            onStart?: ((value: number) => any) | undefined;
         }, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
-            'update:focused': (value: boolean) => boolean;
-            'update:modelValue': (v: number) => boolean;
+            'update:focused': (value: boolean) => true;
+            'update:modelValue': (v: number) => true;
+            start: (value: number) => true;
+            end: (value: number) => true;
         }, string, {
             reverse: boolean;
             max: string | number;
@@ -240,6 +253,7 @@ declare const VSlider: {
             errorMessages: string | string[];
             maxErrors: string | number;
             rules: ValidationRule[];
+            persistentHint: boolean;
             showTicks: boolean | "always";
             tickSize: string | number;
             trackSize: string | number;
@@ -282,6 +296,7 @@ declare const VSlider: {
         errorMessages: string | string[];
         maxErrors: string | number;
         rules: ValidationRule[];
+        persistentHint: boolean;
         showTicks: boolean | "always";
         tickSize: string | number;
         trackSize: string | number;
@@ -296,8 +311,10 @@ declare const VSlider: {
         appendIcon?: IconValue | undefined;
         'onClick:append'?: EventProp<[MouseEvent], (args_0: MouseEvent) => any> | undefined;
         'onClick:prepend'?: EventProp<[MouseEvent], (args_0: MouseEvent) => any> | undefined;
+        'onUpdate:focused'?: EventProp<[FocusEvent], (args_0: FocusEvent) => any> | undefined;
         validateOn?: "input" | "blur" | "submit" | undefined;
         validationValue?: any;
+        hint?: string | undefined;
         hideDetails?: boolean | "auto" | undefined;
         trackColor?: string | undefined;
         trackFillColor?: string | undefined;
@@ -339,6 +356,8 @@ declare const VSlider: {
     } & {
         "onUpdate:modelValue"?: ((v: number) => any) | undefined;
         "onUpdate:focused"?: ((value: boolean) => any) | undefined;
+        onEnd?: ((value: number) => any) | undefined;
+        onStart?: ((value: number) => any) | undefined;
     } & vue.ShallowUnwrapRef<{}> & {} & vue.ComponentCustomProperties & {};
     __isFragment?: undefined;
     __isTeleport?: undefined;
@@ -360,6 +379,7 @@ declare const VSlider: {
     errorMessages: string | string[];
     maxErrors: string | number;
     rules: ValidationRule[];
+    persistentHint: boolean;
     showTicks: boolean | "always";
     tickSize: string | number;
     trackSize: string | number;
@@ -374,8 +394,10 @@ declare const VSlider: {
     appendIcon?: IconValue | undefined;
     'onClick:append'?: EventProp<[MouseEvent], (args_0: MouseEvent) => any> | undefined;
     'onClick:prepend'?: EventProp<[MouseEvent], (args_0: MouseEvent) => any> | undefined;
+    'onUpdate:focused'?: EventProp<[FocusEvent], (args_0: FocusEvent) => any> | undefined;
     validateOn?: "input" | "blur" | "submit" | undefined;
     validationValue?: any;
+    hint?: string | undefined;
     hideDetails?: boolean | "auto" | undefined;
     trackColor?: string | undefined;
     trackFillColor?: string | undefined;
@@ -417,9 +439,13 @@ declare const VSlider: {
 } & {
     "onUpdate:modelValue"?: ((v: number) => any) | undefined;
     "onUpdate:focused"?: ((value: boolean) => any) | undefined;
+    onEnd?: ((value: number) => any) | undefined;
+    onStart?: ((value: number) => any) | undefined;
 }, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
-    'update:focused': (value: boolean) => boolean;
-    'update:modelValue': (v: number) => boolean;
+    'update:focused': (value: boolean) => true;
+    'update:modelValue': (v: number) => true;
+    start: (value: number) => true;
+    end: (value: number) => true;
 }, string, {
     reverse: boolean;
     max: string | number;
@@ -438,6 +464,7 @@ declare const VSlider: {
     errorMessages: string | string[];
     maxErrors: string | number;
     rules: ValidationRule[];
+    persistentHint: boolean;
     showTicks: boolean | "always";
     tickSize: string | number;
     trackSize: string | number;
@@ -449,6 +476,7 @@ declare const VSlider: {
         default: number;
     };
     focused: BooleanConstructor;
+    'onUpdate:focused': vue.PropType<EventProp<[FocusEvent], (args_0: FocusEvent) => any>>;
     disabled: BooleanConstructor;
     error: BooleanConstructor;
     errorMessages: {
@@ -477,6 +505,8 @@ declare const VSlider: {
     appendIcon: vue.PropType<IconValue>;
     prependIcon: vue.PropType<IconValue>;
     hideDetails: vue.PropType<boolean | "auto">;
+    hint: StringConstructor;
+    persistentHint: BooleanConstructor;
     messages: {
         type: vue.PropType<string | string[]>;
         default: () => never[];
@@ -547,6 +577,7 @@ declare const VSlider: {
         default: number;
     };
     focused: BooleanConstructor;
+    'onUpdate:focused': vue.PropType<EventProp<[FocusEvent], (args_0: FocusEvent) => any>>;
     disabled: BooleanConstructor;
     error: BooleanConstructor;
     errorMessages: {
@@ -575,6 +606,8 @@ declare const VSlider: {
     appendIcon: vue.PropType<IconValue>;
     prependIcon: vue.PropType<IconValue>;
     hideDetails: vue.PropType<boolean | "auto">;
+    hint: StringConstructor;
+    persistentHint: BooleanConstructor;
     messages: {
         type: vue.PropType<string | string[]>;
         default: () => never[];