@vuetify/nightly 3.3.0 → 3.3.1-master.2023-05-24

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

@@ -1 +1 @@
-{"version":3,"file":"VSliderThumb.mjs","names":["VScaleTransition","VSliderSymbol","Ripple","makeComponentProps","useElevation","useTextColor","computed","inject","convertToUnit","genericComponent","keyValues","propsFactory","useRender","makeVSliderThumbProps","focused","Boolean","max","type","Number","required","min","modelValue","position","ripple","default","VSliderThumb","name","directives","props","emits","v","setup","_ref","slots","emit","slider","Error","thumbColor","step","vertical","disabled","thumbSize","thumbLabel","direction","readonly","elevation","isReversed","horizontalDirection","mousePressed","decimals","textColorClasses","textColorStyles","pageup","pagedown","end","home","left","right","down","up","relevantKeys","multipliers","value","parseKeydown","e","includes","key","preventDefault","_step","steps","increase","multiplier","shiftKey","ctrlKey","Math","onKeydown","newValue","positionPercentage","elevationClasses","undefined","_createVNode","class","style","_withDirectives","_resolveDirective","circle","center","toFixed","_vShow"],"sources":["../../../src/components/VSlider/VSliderThumb.tsx"],"sourcesContent":["// Styles\nimport './VSliderThumb.sass'\n\n// Components\nimport { VScaleTransition } from '../transitions'\nimport { VSliderSymbol } from './slider'\n\n// Directives\nimport Ripple from '@/directives/ripple'\n\n// Composables\nimport { makeComponentProps } from '@/composables/component'\nimport { useElevation } from '@/composables/elevation'\nimport { useTextColor } from '@/composables/color'\n\n// Utilities\nimport { computed, inject } from 'vue'\nimport { convertToUnit, genericComponent, keyValues, propsFactory, useRender } from '@/util'\n\nexport type VSliderThumbSlots = {\n  'thumb-label': [{ modelValue: number }]\n}\n\nexport const makeVSliderThumbProps = propsFactory({\n  focused: Boolean,\n  max: {\n    type: Number,\n    required: true,\n  },\n  min: {\n    type: Number,\n    required: true,\n  },\n  modelValue: {\n    type: Number,\n    required: true,\n  },\n  position: {\n    type: Number,\n    required: true,\n  },\n  ripple: {\n    type: Boolean,\n    default: true,\n  },\n\n  ...makeComponentProps(),\n}, 'v-slider-thumb')\n\nexport const VSliderThumb = genericComponent<VSliderThumbSlots>()({\n  name: 'VSliderThumb',\n\n  directives: { Ripple },\n\n  props: makeVSliderThumbProps(),\n\n  emits: {\n    'update:modelValue': (v: number) => true,\n  },\n\n  setup (props, { slots, emit }) {\n    const slider = inject(VSliderSymbol)\n\n    if (!slider) throw new Error('[Vuetify] v-slider-thumb must be used inside v-slider or v-range-slider')\n\n    const {\n      thumbColor,\n      step,\n      vertical,\n      disabled,\n      thumbSize,\n      thumbLabel,\n      direction,\n      readonly,\n      elevation,\n      isReversed,\n      horizontalDirection,\n      mousePressed,\n      decimals,\n    } = slider\n\n    const { textColorClasses, textColorStyles } = useTextColor(thumbColor)\n\n    const { pageup, pagedown, end, home, left, right, down, up } = keyValues\n    const relevantKeys = [pageup, pagedown, end, home, left, right, down, up]\n\n    const multipliers = computed(() => {\n      if (step.value) return [1, 2, 3]\n      else return [1, 5, 10]\n    })\n\n    function parseKeydown (e: KeyboardEvent, value: number) {\n      if (!relevantKeys.includes(e.key)) return\n\n      e.preventDefault()\n\n      const _step = step.value || 0.1\n      const steps = (props.max - props.min) / _step\n      if ([left, right, down, up].includes(e.key)) {\n        const increase = horizontalDirection.value === 'rtl' ? [left, up] : [right, up]\n        const direction = increase.includes(e.key) ? 1 : -1\n        const multiplier = e.shiftKey ? 2 : (e.ctrlKey ? 1 : 0)\n\n        value = value + (direction * _step * multipliers.value[multiplier])\n      } else if (e.key === home) {\n        value = props.min\n      } else if (e.key === end) {\n        value = props.max\n      } else {\n        const direction = e.key === pagedown ? 1 : -1\n        value = value - (direction * _step * (steps > 100 ? steps / 10 : 10))\n      }\n\n      return Math.max(props.min, Math.min(props.max, value))\n    }\n\n    function onKeydown (e: KeyboardEvent) {\n      const newValue = parseKeydown(e, props.modelValue)\n\n      newValue != null && emit('update:modelValue', newValue)\n    }\n\n    useRender(() => {\n      const positionPercentage = convertToUnit((vertical.value || isReversed.value) ? 100 - props.position : props.position, '%')\n      const { elevationClasses } = useElevation(computed(() => !disabled.value ? elevation.value : undefined))\n\n      return (\n        <div\n          class={[\n            'v-slider-thumb',\n            {\n              'v-slider-thumb--focused': props.focused,\n              'v-slider-thumb--pressed': props.focused && mousePressed.value,\n            },\n            props.class,\n          ]}\n          style={[\n            {\n              '--v-slider-thumb-position': positionPercentage,\n              '--v-slider-thumb-size': convertToUnit(thumbSize.value),\n            },\n            props.style,\n          ]}\n          role=\"slider\"\n          tabindex={ disabled.value ? -1 : 0 }\n          aria-valuemin={ props.min }\n          aria-valuemax={ props.max }\n          aria-valuenow={ props.modelValue }\n          aria-readonly={ !!readonly.value }\n          aria-orientation={ direction.value }\n          onKeydown={ !readonly.value ? onKeydown : undefined }\n        >\n          <div\n            class={[\n              'v-slider-thumb__surface',\n              textColorClasses.value,\n              elevationClasses.value,\n            ]}\n            style={{\n              ...textColorStyles.value,\n            }}\n          />\n          <div\n            class={[\n              'v-slider-thumb__ripple',\n              textColorClasses.value,\n            ]}\n            style={ textColorStyles.value }\n            v-ripple={[props.ripple, null, ['circle', 'center']]}\n          />\n          <VScaleTransition origin=\"bottom center\">\n            <div\n              class=\"v-slider-thumb__label-container\"\n              v-show={ (thumbLabel.value && props.focused) || thumbLabel.value === 'always' }\n            >\n              <div\n                class={[\n                  'v-slider-thumb__label',\n                ]}\n              >\n                <div>\n                  { slots['thumb-label']?.({ modelValue: props.modelValue }) ?? props.modelValue.toFixed(step.value ? decimals.value : 1) }\n                </div>\n              </div>\n            </div>\n          </VScaleTransition>\n        </div>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VSliderThumb = InstanceType<typeof VSliderThumb>\n"],"mappings":"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"}
+{"version":3,"file":"VSliderThumb.mjs","names":["VSliderSymbol","VScaleTransition","useTextColor","makeComponentProps","useElevation","Ripple","computed","inject","convertToUnit","genericComponent","keyValues","propsFactory","useRender","makeVSliderThumbProps","focused","Boolean","max","type","Number","required","min","modelValue","position","ripple","default","VSliderThumb","name","directives","props","emits","v","setup","_ref","slots","emit","slider","Error","thumbColor","step","vertical","disabled","thumbSize","thumbLabel","direction","readonly","elevation","isReversed","horizontalDirection","mousePressed","decimals","textColorClasses","textColorStyles","pageup","pagedown","end","home","left","right","down","up","relevantKeys","multipliers","value","parseKeydown","e","includes","key","preventDefault","_step","steps","increase","multiplier","shiftKey","ctrlKey","Math","onKeydown","newValue","positionPercentage","elevationClasses","undefined","_createVNode","class","style","_withDirectives","_resolveDirective","circle","center","toFixed","_vShow"],"sources":["../../../src/components/VSlider/VSliderThumb.tsx"],"sourcesContent":["// Styles\nimport './VSliderThumb.sass'\n\n// Components\nimport { VSliderSymbol } from './slider'\nimport { VScaleTransition } from '../transitions'\n\n// Composables\nimport { useTextColor } from '@/composables/color'\nimport { makeComponentProps } from '@/composables/component'\nimport { useElevation } from '@/composables/elevation'\n\n// Directives\nimport Ripple from '@/directives/ripple'\n\n// Utilities\nimport { computed, inject } from 'vue'\nimport { convertToUnit, genericComponent, keyValues, propsFactory, useRender } from '@/util'\n\nexport type VSliderThumbSlots = {\n  'thumb-label': { modelValue: number }\n}\n\nexport const makeVSliderThumbProps = propsFactory({\n  focused: Boolean,\n  max: {\n    type: Number,\n    required: true,\n  },\n  min: {\n    type: Number,\n    required: true,\n  },\n  modelValue: {\n    type: Number,\n    required: true,\n  },\n  position: {\n    type: Number,\n    required: true,\n  },\n  ripple: {\n    type: Boolean,\n    default: true,\n  },\n\n  ...makeComponentProps(),\n}, 'v-slider-thumb')\n\nexport const VSliderThumb = genericComponent<VSliderThumbSlots>()({\n  name: 'VSliderThumb',\n\n  directives: { Ripple },\n\n  props: makeVSliderThumbProps(),\n\n  emits: {\n    'update:modelValue': (v: number) => true,\n  },\n\n  setup (props, { slots, emit }) {\n    const slider = inject(VSliderSymbol)\n\n    if (!slider) throw new Error('[Vuetify] v-slider-thumb must be used inside v-slider or v-range-slider')\n\n    const {\n      thumbColor,\n      step,\n      vertical,\n      disabled,\n      thumbSize,\n      thumbLabel,\n      direction,\n      readonly,\n      elevation,\n      isReversed,\n      horizontalDirection,\n      mousePressed,\n      decimals,\n    } = slider\n\n    const { textColorClasses, textColorStyles } = useTextColor(thumbColor)\n\n    const { pageup, pagedown, end, home, left, right, down, up } = keyValues\n    const relevantKeys = [pageup, pagedown, end, home, left, right, down, up]\n\n    const multipliers = computed(() => {\n      if (step.value) return [1, 2, 3]\n      else return [1, 5, 10]\n    })\n\n    function parseKeydown (e: KeyboardEvent, value: number) {\n      if (!relevantKeys.includes(e.key)) return\n\n      e.preventDefault()\n\n      const _step = step.value || 0.1\n      const steps = (props.max - props.min) / _step\n      if ([left, right, down, up].includes(e.key)) {\n        const increase = horizontalDirection.value === 'rtl' ? [left, up] : [right, up]\n        const direction = increase.includes(e.key) ? 1 : -1\n        const multiplier = e.shiftKey ? 2 : (e.ctrlKey ? 1 : 0)\n\n        value = value + (direction * _step * multipliers.value[multiplier])\n      } else if (e.key === home) {\n        value = props.min\n      } else if (e.key === end) {\n        value = props.max\n      } else {\n        const direction = e.key === pagedown ? 1 : -1\n        value = value - (direction * _step * (steps > 100 ? steps / 10 : 10))\n      }\n\n      return Math.max(props.min, Math.min(props.max, value))\n    }\n\n    function onKeydown (e: KeyboardEvent) {\n      const newValue = parseKeydown(e, props.modelValue)\n\n      newValue != null && emit('update:modelValue', newValue)\n    }\n\n    useRender(() => {\n      const positionPercentage = convertToUnit((vertical.value || isReversed.value) ? 100 - props.position : props.position, '%')\n      const { elevationClasses } = useElevation(computed(() => !disabled.value ? elevation.value : undefined))\n\n      return (\n        <div\n          class={[\n            'v-slider-thumb',\n            {\n              'v-slider-thumb--focused': props.focused,\n              'v-slider-thumb--pressed': props.focused && mousePressed.value,\n            },\n            props.class,\n          ]}\n          style={[\n            {\n              '--v-slider-thumb-position': positionPercentage,\n              '--v-slider-thumb-size': convertToUnit(thumbSize.value),\n            },\n            props.style,\n          ]}\n          role=\"slider\"\n          tabindex={ disabled.value ? -1 : 0 }\n          aria-valuemin={ props.min }\n          aria-valuemax={ props.max }\n          aria-valuenow={ props.modelValue }\n          aria-readonly={ !!readonly.value }\n          aria-orientation={ direction.value }\n          onKeydown={ !readonly.value ? onKeydown : undefined }\n        >\n          <div\n            class={[\n              'v-slider-thumb__surface',\n              textColorClasses.value,\n              elevationClasses.value,\n            ]}\n            style={{\n              ...textColorStyles.value,\n            }}\n          />\n          <div\n            class={[\n              'v-slider-thumb__ripple',\n              textColorClasses.value,\n            ]}\n            style={ textColorStyles.value }\n            v-ripple={[props.ripple, null, ['circle', 'center']]}\n          />\n          <VScaleTransition origin=\"bottom center\">\n            <div\n              class=\"v-slider-thumb__label-container\"\n              v-show={ (thumbLabel.value && props.focused) || thumbLabel.value === 'always' }\n            >\n              <div\n                class={[\n                  'v-slider-thumb__label',\n                ]}\n              >\n                <div>\n                  { slots['thumb-label']?.({ modelValue: props.modelValue }) ?? props.modelValue.toFixed(step.value ? decimals.value : 1) }\n                </div>\n              </div>\n            </div>\n          </VScaleTransition>\n        </div>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VSliderThumb = InstanceType<typeof VSliderThumb>\n"],"mappings":"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"}

package/lib/components/VSlider/VSliderTrack.mjs

@@ -4,11 +4,11 @@ import "./VSliderTrack.css";
 
 // Components
 import { VSliderSymbol } from "./slider.mjs"; // Composables
-import { makeComponentProps } from "../../composables/component.mjs";
 import { useBackgroundColor } from "../../composables/color.mjs";
+import { makeComponentProps } from "../../composables/component.mjs";
 import { useRounded } from "../../composables/rounded.mjs"; // Utilities
 import { computed, inject } from 'vue';
-import { convertToUnit, genericComponent, propsFactory, useRender } from "../../util/index.mjs";
+import { convertToUnit, genericComponent, propsFactory, useRender } from "../../util/index.mjs"; // Types
 export const makeVSliderTrackProps = propsFactory({
   start: {
     type: Number,

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

@@ -1 +1 @@
-{"version":3,"file":"VSliderTrack.mjs","names":["VSliderSymbol","makeComponentProps","useBackgroundColor","useRounded","computed","inject","convertToUnit","genericComponent","propsFactory","useRender","makeVSliderTrackProps","start","type","Number","required","stop","VSliderTrack","name","props","emits","setup","_ref","slots","slider","Error","color","horizontalDirection","parsedTicks","rounded","showTicks","tickSize","trackColor","trackFillColor","trackSize","vertical","min","max","roundedClasses","backgroundColorClasses","trackFillColorClasses","backgroundColorStyles","trackFillColorStyles","trackColorClasses","trackColorStyles","startDir","value","endDir","backgroundStyles","trackFillWidth","trackFillStyles","computedTicks","ticks","slice","reverse","map","tick","index","directionProperty","directionValue","position","undefined","_createVNode","label","class","direction","style"],"sources":["../../../src/components/VSlider/VSliderTrack.tsx"],"sourcesContent":["// Styles\nimport './VSliderTrack.sass'\n\n// Components\nimport { type Tick, VSliderSymbol } from './slider'\n\n// Composables\nimport { makeComponentProps } from '@/composables/component'\nimport { useBackgroundColor } from '@/composables/color'\nimport { useRounded } from '@/composables/rounded'\n\n// Utilities\nimport { computed, inject } from 'vue'\nimport { convertToUnit, genericComponent, propsFactory, useRender } from '@/util'\n\nexport type VSliderTrackSlots = {\n  'tick-label': [{ tick: Tick, index: number }]\n}\n\nexport const makeVSliderTrackProps = propsFactory({\n  start: {\n    type: Number,\n    required: true,\n  },\n  stop: {\n    type: Number,\n    required: true,\n  },\n\n  ...makeComponentProps(),\n}, 'v-slider-track')\n\nexport const VSliderTrack = genericComponent<VSliderTrackSlots>()({\n  name: 'VSliderTrack',\n\n  props: makeVSliderTrackProps(),\n\n  emits: {},\n\n  setup (props, { slots }) {\n    const slider = inject(VSliderSymbol)\n\n    if (!slider) throw new Error('[Vuetify] v-slider-track must be inside v-slider or v-range-slider')\n\n    const {\n      color,\n      horizontalDirection,\n      parsedTicks,\n      rounded,\n      showTicks,\n      tickSize,\n      trackColor,\n      trackFillColor,\n      trackSize,\n      vertical,\n      min,\n      max,\n    } = slider\n\n    const { roundedClasses } = useRounded(rounded)\n\n    const {\n      backgroundColorClasses: trackFillColorClasses,\n      backgroundColorStyles: trackFillColorStyles,\n    } = useBackgroundColor(trackFillColor)\n\n    const {\n      backgroundColorClasses: trackColorClasses,\n      backgroundColorStyles: trackColorStyles,\n    } = useBackgroundColor(trackColor)\n\n    const startDir = computed(() => `inset-${vertical.value ? 'block-end' : 'inline-start'}`)\n    const endDir = computed(() => vertical.value ? 'height' : 'width')\n\n    const backgroundStyles = computed(() => {\n      return {\n        [startDir.value]: '0%',\n        [endDir.value]: '100%',\n      }\n    })\n\n    const trackFillWidth = computed(() => props.stop - props.start)\n\n    const trackFillStyles = computed(() => {\n      return {\n        [startDir.value]: convertToUnit(props.start, '%'),\n        [endDir.value]: convertToUnit(trackFillWidth.value, '%'),\n      }\n    })\n\n    const computedTicks = computed(() => {\n      if (!showTicks.value) return []\n\n      const ticks = vertical.value ? parsedTicks.value.slice().reverse() : parsedTicks.value\n\n      return ticks.map((tick, index) => {\n        const directionProperty = vertical.value ? 'bottom' : 'margin-inline-start'\n        const directionValue = tick.value !== min.value && tick.value !== max.value ? convertToUnit(tick.position, '%') : undefined\n\n        return (\n          <div\n            key={ tick.value }\n            class={[\n              'v-slider-track__tick',\n              {\n                'v-slider-track__tick--filled': tick.position >= props.start && tick.position <= props.stop,\n                'v-slider-track__tick--first': tick.value === min.value,\n                'v-slider-track__tick--last': tick.value === max.value,\n              },\n            ]}\n            style={{ [directionProperty]: directionValue }}\n          >\n            {\n              (tick.label || slots['tick-label']) && (\n                <div class=\"v-slider-track__tick-label\">\n                  { slots['tick-label']?.({ tick, index }) ?? tick.label }\n                </div>\n              )\n            }\n          </div>\n        )\n      })\n    })\n\n    useRender(() => {\n      return (\n        <div\n          class={[\n            'v-slider-track',\n            roundedClasses.value,\n            props.class,\n          ]}\n          style={[\n            {\n              '--v-slider-track-size': convertToUnit(trackSize.value),\n              '--v-slider-tick-size': convertToUnit(tickSize.value),\n              direction: !vertical.value ? horizontalDirection.value : undefined,\n            },\n            props.style,\n          ]}\n        >\n          <div\n            class={[\n              'v-slider-track__background',\n              trackColorClasses.value,\n              {\n                'v-slider-track__background--opacity': !!color.value || !trackFillColor.value,\n              },\n            ]}\n            style={{\n              ...backgroundStyles.value,\n              ...trackColorStyles.value,\n            }}\n          />\n          <div\n            class={[\n              'v-slider-track__fill',\n              trackFillColorClasses.value,\n            ]}\n            style={{\n              ...trackFillStyles.value,\n              ...trackFillColorStyles.value,\n            }}\n          />\n\n          { showTicks.value && (\n            <div\n              class={[\n                'v-slider-track__ticks',\n                {\n                  'v-slider-track__ticks--always-show': showTicks.value === 'always',\n                },\n              ]}\n            >\n              { computedTicks.value }\n            </div>\n          )}\n        </div>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VSliderTrack = InstanceType<typeof VSliderTrack>\n"],"mappings":"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"}
+{"version":3,"file":"VSliderTrack.mjs","names":["VSliderSymbol","useBackgroundColor","makeComponentProps","useRounded","computed","inject","convertToUnit","genericComponent","propsFactory","useRender","makeVSliderTrackProps","start","type","Number","required","stop","VSliderTrack","name","props","emits","setup","_ref","slots","slider","Error","color","horizontalDirection","parsedTicks","rounded","showTicks","tickSize","trackColor","trackFillColor","trackSize","vertical","min","max","roundedClasses","backgroundColorClasses","trackFillColorClasses","backgroundColorStyles","trackFillColorStyles","trackColorClasses","trackColorStyles","startDir","value","endDir","backgroundStyles","trackFillWidth","trackFillStyles","computedTicks","ticks","slice","reverse","map","tick","index","directionProperty","directionValue","position","undefined","_createVNode","label","class","direction","style"],"sources":["../../../src/components/VSlider/VSliderTrack.tsx"],"sourcesContent":["// Styles\nimport './VSliderTrack.sass'\n\n// Components\nimport { VSliderSymbol } from './slider'\n\n// Composables\nimport { useBackgroundColor } from '@/composables/color'\nimport { makeComponentProps } from '@/composables/component'\nimport { useRounded } from '@/composables/rounded'\n\n// Utilities\nimport { computed, inject } from 'vue'\nimport { convertToUnit, genericComponent, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { Tick } from './slider'\n\nexport type VSliderTrackSlots = {\n  'tick-label': { tick: Tick, index: number }\n}\n\nexport const makeVSliderTrackProps = propsFactory({\n  start: {\n    type: Number,\n    required: true,\n  },\n  stop: {\n    type: Number,\n    required: true,\n  },\n\n  ...makeComponentProps(),\n}, 'v-slider-track')\n\nexport const VSliderTrack = genericComponent<VSliderTrackSlots>()({\n  name: 'VSliderTrack',\n\n  props: makeVSliderTrackProps(),\n\n  emits: {},\n\n  setup (props, { slots }) {\n    const slider = inject(VSliderSymbol)\n\n    if (!slider) throw new Error('[Vuetify] v-slider-track must be inside v-slider or v-range-slider')\n\n    const {\n      color,\n      horizontalDirection,\n      parsedTicks,\n      rounded,\n      showTicks,\n      tickSize,\n      trackColor,\n      trackFillColor,\n      trackSize,\n      vertical,\n      min,\n      max,\n    } = slider\n\n    const { roundedClasses } = useRounded(rounded)\n\n    const {\n      backgroundColorClasses: trackFillColorClasses,\n      backgroundColorStyles: trackFillColorStyles,\n    } = useBackgroundColor(trackFillColor)\n\n    const {\n      backgroundColorClasses: trackColorClasses,\n      backgroundColorStyles: trackColorStyles,\n    } = useBackgroundColor(trackColor)\n\n    const startDir = computed(() => `inset-${vertical.value ? 'block-end' : 'inline-start'}`)\n    const endDir = computed(() => vertical.value ? 'height' : 'width')\n\n    const backgroundStyles = computed(() => {\n      return {\n        [startDir.value]: '0%',\n        [endDir.value]: '100%',\n      }\n    })\n\n    const trackFillWidth = computed(() => props.stop - props.start)\n\n    const trackFillStyles = computed(() => {\n      return {\n        [startDir.value]: convertToUnit(props.start, '%'),\n        [endDir.value]: convertToUnit(trackFillWidth.value, '%'),\n      }\n    })\n\n    const computedTicks = computed(() => {\n      if (!showTicks.value) return []\n\n      const ticks = vertical.value ? parsedTicks.value.slice().reverse() : parsedTicks.value\n\n      return ticks.map((tick, index) => {\n        const directionProperty = vertical.value ? 'bottom' : 'margin-inline-start'\n        const directionValue = tick.value !== min.value && tick.value !== max.value ? convertToUnit(tick.position, '%') : undefined\n\n        return (\n          <div\n            key={ tick.value }\n            class={[\n              'v-slider-track__tick',\n              {\n                'v-slider-track__tick--filled': tick.position >= props.start && tick.position <= props.stop,\n                'v-slider-track__tick--first': tick.value === min.value,\n                'v-slider-track__tick--last': tick.value === max.value,\n              },\n            ]}\n            style={{ [directionProperty]: directionValue }}\n          >\n            {\n              (tick.label || slots['tick-label']) && (\n                <div class=\"v-slider-track__tick-label\">\n                  { slots['tick-label']?.({ tick, index }) ?? tick.label }\n                </div>\n              )\n            }\n          </div>\n        )\n      })\n    })\n\n    useRender(() => {\n      return (\n        <div\n          class={[\n            'v-slider-track',\n            roundedClasses.value,\n            props.class,\n          ]}\n          style={[\n            {\n              '--v-slider-track-size': convertToUnit(trackSize.value),\n              '--v-slider-tick-size': convertToUnit(tickSize.value),\n              direction: !vertical.value ? horizontalDirection.value : undefined,\n            },\n            props.style,\n          ]}\n        >\n          <div\n            class={[\n              'v-slider-track__background',\n              trackColorClasses.value,\n              {\n                'v-slider-track__background--opacity': !!color.value || !trackFillColor.value,\n              },\n            ]}\n            style={{\n              ...backgroundStyles.value,\n              ...trackColorStyles.value,\n            }}\n          />\n          <div\n            class={[\n              'v-slider-track__fill',\n              trackFillColorClasses.value,\n            ]}\n            style={{\n              ...trackFillStyles.value,\n              ...trackFillColorStyles.value,\n            }}\n          />\n\n          { showTicks.value && (\n            <div\n              class={[\n                'v-slider-track__ticks',\n                {\n                  'v-slider-track__ticks--always-show': showTicks.value === 'always',\n                },\n              ]}\n            >\n              { computedTicks.value }\n            </div>\n          )}\n        </div>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VSliderTrack = InstanceType<typeof VSliderTrack>\n"],"mappings":"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"}

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

@@ -54,10 +54,10 @@ declare const VSlider: {
             density?: Density | undefined;
             modelValue?: string | number | undefined;
             focused?: boolean | undefined;
-            centerAffix?: boolean | undefined;
             errorMessages?: string | readonly string[] | undefined;
             maxErrors?: string | number | undefined;
             rules?: readonly ValidationRule[] | undefined;
+            centerAffix?: boolean | undefined;
             persistentHint?: boolean | undefined;
             showTicks?: boolean | "always" | undefined;
             tickSize?: string | number | undefined;
@@ -70,40 +70,30 @@ declare const VSlider: {
             color?: string | undefined;
             label?: string | undefined;
             class?: any;
-            $children?: vue.VNodeChild | ((args_0: VInputSlot) => vue.VNodeChild) | {
-                default?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                prepend?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                append?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                details?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                message?: ((args_0: VMessageSlot) => vue.VNodeChild) | undefined;
-                label?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
+            $children?: vue.VNodeChild | ((arg: VInputSlot) => vue.VNodeChild) | {
+                default?: ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+                prepend?: ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+                append?: ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+                details?: ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+                message?: ((arg: VMessageSlot) => vue.VNodeChild) | undefined;
+                label?: ((arg: VInputSlot) => vue.VNodeChild) | undefined;
                 'tick-label'?: (() => vue.VNodeChild) | undefined;
                 'thumb-label'?: (() => vue.VNodeChild) | undefined;
             };
             ref?: vue.VNodeRef | undefined;
             ref_for?: boolean | undefined;
             ref_key?: string | undefined;
-            "v-slot:default"?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
+            "v-slot:default"?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
             'v-slots'?: {
-                default?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                prepend?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                append?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                details?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                message?: false | ((args_0: VMessageSlot) => vue.VNodeChild) | undefined;
-                label?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
+                default?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+                prepend?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+                append?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+                details?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+                message?: false | ((arg: VMessageSlot) => vue.VNodeChild) | undefined;
+                label?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
                 'tick-label'?: false | (() => vue.VNodeChild) | undefined;
                 'thumb-label'?: false | (() => vue.VNodeChild) | undefined;
             } | undefined;
-            $slots?: {
-                default?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                prepend?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                append?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                details?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                message?: ((args_0: VMessageSlot) => vue.VNodeChild) | undefined;
-                label?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                'tick-label'?: (() => vue.VNodeChild) | undefined;
-                'thumb-label'?: (() => vue.VNodeChild) | undefined;
-            } | undefined;
             onVnodeBeforeMount?: ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
                 [key: string]: any;
             }>) => void) | ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
@@ -142,21 +132,21 @@ declare const VSlider: {
             }>) => void) | ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
                 [key: string]: any;
             }>) => void)[] | undefined;
-            "v-slot:append"?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-            "v-slot:prepend"?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
+            "v-slot:append"?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+            "v-slot:prepend"?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
             "onUpdate:modelValue"?: ((v: number) => any) | undefined;
             prependIcon?: IconValue | undefined;
             appendIcon?: IconValue | undefined;
+            "v-slot:label"?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
             'onClick:append'?: EventProp<[MouseEvent], (args_0: MouseEvent) => any> | undefined;
             'onClick:prepend'?: EventProp<[MouseEvent], (args_0: MouseEvent) => any> | undefined;
+            "v-slot:message"?: false | ((arg: VMessageSlot) => vue.VNodeChild) | undefined;
             'onUpdate:focused'?: (EventProp<[boolean], (args_0: boolean) => any> & ((value: boolean) => any)) | undefined;
-            "v-slot:label"?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-            "v-slot:message"?: false | ((args_0: VMessageSlot) => vue.VNodeChild) | undefined;
             validateOn?: "lazy" | ("input" | "blur" | "submit") | "input lazy" | "blur lazy" | "submit lazy" | "lazy input" | "lazy blur" | "lazy submit" | undefined;
             validationValue?: any;
             hint?: string | undefined;
             hideDetails?: boolean | "auto" | undefined;
-            "v-slot:details"?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
+            "v-slot:details"?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
             "v-slot:tick-label"?: false | (() => vue.VNodeChild) | undefined;
             trackColor?: string | undefined;
             trackFillColor?: string | undefined;
@@ -173,22 +163,22 @@ declare const VSlider: {
             [x: string]: unknown;
         };
         $slots: Readonly<{
-            default?: ((args_0: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            default?: ((arg: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
                 [key: string]: any;
             }>[]) | undefined;
-            prepend?: ((args_0: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            prepend?: ((arg: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
                 [key: string]: any;
             }>[]) | undefined;
-            append?: ((args_0: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            append?: ((arg: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
                 [key: string]: any;
             }>[]) | undefined;
-            details?: ((args_0: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            details?: ((arg: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
                 [key: string]: any;
             }>[]) | undefined;
-            message?: ((args_0: VMessageSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            message?: ((arg: VMessageSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
                 [key: string]: any;
             }>[]) | undefined;
-            label?: ((args_0: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            label?: ((arg: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
                 [key: string]: any;
             }>[]) | undefined;
             'tick-label'?: (() => vue.VNode<vue.RendererNode, vue.RendererElement, {
@@ -217,10 +207,10 @@ declare const VSlider: {
             density: Density;
             modelValue: string | number;
             focused: boolean;
-            centerAffix: boolean;
             errorMessages: string | readonly string[];
             maxErrors: string | number;
             rules: readonly ValidationRule[];
+            centerAffix: boolean;
             persistentHint: boolean;
             showTicks: boolean | "always";
             tickSize: string | number;
@@ -248,46 +238,35 @@ declare const VSlider: {
             thumbLabel?: boolean | "always" | undefined;
             ticks?: readonly number[] | Record<number, string> | undefined;
         } & {
-            $children?: vue.VNodeChild | ((args_0: VInputSlot) => vue.VNodeChild) | {
-                default?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                prepend?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                append?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                details?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                message?: ((args_0: VMessageSlot) => vue.VNodeChild) | undefined;
-                label?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
+            $children?: vue.VNodeChild | ((arg: VInputSlot) => vue.VNodeChild) | {
+                default?: ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+                prepend?: ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+                append?: ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+                details?: ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+                message?: ((arg: VMessageSlot) => vue.VNodeChild) | undefined;
+                label?: ((arg: VInputSlot) => vue.VNodeChild) | undefined;
                 'tick-label'?: (() => vue.VNodeChild) | undefined;
                 'thumb-label'?: (() => vue.VNodeChild) | undefined;
             };
             'v-slots'?: {
-                default?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                prepend?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                append?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                details?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                message?: false | ((args_0: VMessageSlot) => vue.VNodeChild) | undefined;
-                label?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
+                default?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+                prepend?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+                append?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+                details?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+                message?: false | ((arg: VMessageSlot) => vue.VNodeChild) | undefined;
+                label?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
                 'tick-label'?: false | (() => vue.VNodeChild) | undefined;
                 'thumb-label'?: false | (() => vue.VNodeChild) | undefined;
             } | undefined;
         } & {
-            "v-slot:default"?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-            "v-slot:prepend"?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-            "v-slot:append"?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-            "v-slot:details"?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-            "v-slot:message"?: false | ((args_0: VMessageSlot) => vue.VNodeChild) | undefined;
-            "v-slot:label"?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
+            "v-slot:default"?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+            "v-slot:prepend"?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+            "v-slot:append"?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+            "v-slot:details"?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+            "v-slot:message"?: false | ((arg: VMessageSlot) => vue.VNodeChild) | undefined;
+            "v-slot:label"?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
             "v-slot:tick-label"?: false | (() => vue.VNodeChild) | undefined;
             "v-slot:thumb-label"?: false | (() => vue.VNodeChild) | undefined;
-        } & {
-            $slots?: {
-                default?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                prepend?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                append?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                details?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                message?: ((args_0: VMessageSlot) => vue.VNodeChild) | undefined;
-                label?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-                'tick-label'?: (() => vue.VNodeChild) | undefined;
-                'thumb-label'?: (() => vue.VNodeChild) | undefined;
-            } | undefined;
         } & {
             "onUpdate:modelValue"?: ((v: number) => any) | undefined;
             "onUpdate:focused"?: ((value: boolean) => any) | undefined;
@@ -314,10 +293,10 @@ declare const VSlider: {
             density: Density;
             modelValue: string | number;
             focused: boolean;
-            centerAffix: boolean;
             errorMessages: string | readonly string[];
             maxErrors: string | number;
             rules: readonly ValidationRule[];
+            centerAffix: boolean;
             persistentHint: boolean;
             showTicks: boolean | "always";
             tickSize: string | number;
@@ -325,22 +304,22 @@ declare const VSlider: {
             thumbLabel: boolean | "always" | undefined;
             thumbSize: string | number;
         }, {}, string, vue.SlotsType<Partial<{
-            default: (args_0: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            default: (arg: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
                 [key: string]: any;
             }>[];
-            prepend: (args_0: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            prepend: (arg: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
                 [key: string]: any;
             }>[];
-            append: (args_0: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            append: (arg: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
                 [key: string]: any;
             }>[];
-            details: (args_0: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            details: (arg: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
                 [key: string]: any;
             }>[];
-            message: (args_0: VMessageSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            message: (arg: VMessageSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
                 [key: string]: any;
             }>[];
-            label: (args_0: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            label: (arg: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
                 [key: string]: any;
             }>[];
             'tick-label': () => vue.VNode<vue.RendererNode, vue.RendererElement, {
@@ -384,10 +363,10 @@ declare const VSlider: {
         density: Density;
         modelValue: string | number;
         focused: boolean;
-        centerAffix: boolean;
         errorMessages: string | readonly string[];
         maxErrors: string | number;
         rules: readonly ValidationRule[];
+        centerAffix: boolean;
         persistentHint: boolean;
         showTicks: boolean | "always";
         tickSize: string | number;
@@ -415,46 +394,35 @@ declare const VSlider: {
         thumbLabel?: boolean | "always" | undefined;
         ticks?: readonly number[] | Record<number, string> | undefined;
     } & {
-        $children?: vue.VNodeChild | ((args_0: VInputSlot) => vue.VNodeChild) | {
-            default?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-            prepend?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-            append?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-            details?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-            message?: ((args_0: VMessageSlot) => vue.VNodeChild) | undefined;
-            label?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
+        $children?: vue.VNodeChild | ((arg: VInputSlot) => vue.VNodeChild) | {
+            default?: ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+            prepend?: ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+            append?: ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+            details?: ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+            message?: ((arg: VMessageSlot) => vue.VNodeChild) | undefined;
+            label?: ((arg: VInputSlot) => vue.VNodeChild) | undefined;
             'tick-label'?: (() => vue.VNodeChild) | undefined;
             'thumb-label'?: (() => vue.VNodeChild) | undefined;
         };
         'v-slots'?: {
-            default?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-            prepend?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-            append?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-            details?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-            message?: false | ((args_0: VMessageSlot) => vue.VNodeChild) | undefined;
-            label?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
+            default?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+            prepend?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+            append?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+            details?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+            message?: false | ((arg: VMessageSlot) => vue.VNodeChild) | undefined;
+            label?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
             'tick-label'?: false | (() => vue.VNodeChild) | undefined;
             'thumb-label'?: false | (() => vue.VNodeChild) | undefined;
         } | undefined;
     } & {
-        "v-slot:default"?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-        "v-slot:prepend"?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-        "v-slot:append"?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-        "v-slot:details"?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-        "v-slot:message"?: false | ((args_0: VMessageSlot) => vue.VNodeChild) | undefined;
-        "v-slot:label"?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
+        "v-slot:default"?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+        "v-slot:prepend"?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+        "v-slot:append"?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+        "v-slot:details"?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+        "v-slot:message"?: false | ((arg: VMessageSlot) => vue.VNodeChild) | undefined;
+        "v-slot:label"?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
         "v-slot:tick-label"?: false | (() => vue.VNodeChild) | undefined;
         "v-slot:thumb-label"?: false | (() => vue.VNodeChild) | undefined;
-    } & {
-        $slots?: {
-            default?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-            prepend?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-            append?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-            details?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-            message?: ((args_0: VMessageSlot) => vue.VNodeChild) | undefined;
-            label?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-            'tick-label'?: (() => vue.VNodeChild) | undefined;
-            'thumb-label'?: (() => vue.VNodeChild) | undefined;
-        } | undefined;
     } & {
         "onUpdate:modelValue"?: ((v: number) => any) | undefined;
         "onUpdate:focused"?: ((value: boolean) => any) | undefined;
@@ -479,10 +447,10 @@ declare const VSlider: {
     density: Density;
     modelValue: string | number;
     focused: boolean;
-    centerAffix: boolean;
     errorMessages: string | readonly string[];
     maxErrors: string | number;
     rules: readonly ValidationRule[];
+    centerAffix: boolean;
     persistentHint: boolean;
     showTicks: boolean | "always";
     tickSize: string | number;
@@ -510,46 +478,35 @@ declare const VSlider: {
     thumbLabel?: boolean | "always" | undefined;
     ticks?: readonly number[] | Record<number, string> | undefined;
 } & {
-    $children?: vue.VNodeChild | ((args_0: VInputSlot) => vue.VNodeChild) | {
-        default?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-        prepend?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-        append?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-        details?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-        message?: ((args_0: VMessageSlot) => vue.VNodeChild) | undefined;
-        label?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
+    $children?: vue.VNodeChild | ((arg: VInputSlot) => vue.VNodeChild) | {
+        default?: ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+        prepend?: ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+        append?: ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+        details?: ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+        message?: ((arg: VMessageSlot) => vue.VNodeChild) | undefined;
+        label?: ((arg: VInputSlot) => vue.VNodeChild) | undefined;
         'tick-label'?: (() => vue.VNodeChild) | undefined;
         'thumb-label'?: (() => vue.VNodeChild) | undefined;
     };
     'v-slots'?: {
-        default?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-        prepend?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-        append?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-        details?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-        message?: false | ((args_0: VMessageSlot) => vue.VNodeChild) | undefined;
-        label?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
+        default?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+        prepend?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+        append?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+        details?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+        message?: false | ((arg: VMessageSlot) => vue.VNodeChild) | undefined;
+        label?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
         'tick-label'?: false | (() => vue.VNodeChild) | undefined;
         'thumb-label'?: false | (() => vue.VNodeChild) | undefined;
     } | undefined;
 } & {
-    "v-slot:default"?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-    "v-slot:prepend"?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-    "v-slot:append"?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-    "v-slot:details"?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-    "v-slot:message"?: false | ((args_0: VMessageSlot) => vue.VNodeChild) | undefined;
-    "v-slot:label"?: false | ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
+    "v-slot:default"?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+    "v-slot:prepend"?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+    "v-slot:append"?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+    "v-slot:details"?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
+    "v-slot:message"?: false | ((arg: VMessageSlot) => vue.VNodeChild) | undefined;
+    "v-slot:label"?: false | ((arg: VInputSlot) => vue.VNodeChild) | undefined;
     "v-slot:tick-label"?: false | (() => vue.VNodeChild) | undefined;
     "v-slot:thumb-label"?: false | (() => vue.VNodeChild) | undefined;
-} & {
-    $slots?: {
-        default?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-        prepend?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-        append?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-        details?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-        message?: ((args_0: VMessageSlot) => vue.VNodeChild) | undefined;
-        label?: ((args_0: VInputSlot) => vue.VNodeChild) | undefined;
-        'tick-label'?: (() => vue.VNodeChild) | undefined;
-        'thumb-label'?: (() => vue.VNodeChild) | undefined;
-    } | undefined;
 } & {
     "onUpdate:modelValue"?: ((v: number) => any) | undefined;
     "onUpdate:focused"?: ((value: boolean) => any) | undefined;
@@ -576,10 +533,10 @@ declare const VSlider: {
     density: Density;
     modelValue: string | number;
     focused: boolean;
-    centerAffix: boolean;
     errorMessages: string | readonly string[];
     maxErrors: string | number;
     rules: readonly ValidationRule[];
+    centerAffix: boolean;
     persistentHint: boolean;
     showTicks: boolean | "always";
     tickSize: string | number;
@@ -587,22 +544,22 @@ declare const VSlider: {
     thumbLabel: boolean | "always" | undefined;
     thumbSize: string | number;
 }, {}, string, vue.SlotsType<Partial<{
-    default: (args_0: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    default: (arg: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
         [key: string]: any;
     }>[];
-    prepend: (args_0: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    prepend: (arg: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
         [key: string]: any;
     }>[];
-    append: (args_0: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    append: (arg: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
         [key: string]: any;
     }>[];
-    details: (args_0: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    details: (arg: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
         [key: string]: any;
     }>[];
-    message: (args_0: VMessageSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    message: (arg: VMessageSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
         [key: string]: any;
     }>[];
-    label: (args_0: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    label: (arg: VInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
         [key: string]: any;
     }>[];
     'tick-label': () => vue.VNode<vue.RendererNode, vue.RendererElement, {

package/lib/components/VSlider/slider.mjs

@@ -1,13 +1,10 @@
 /* eslint-disable max-statements */
 // Composables
 import { makeElevationProps } from "../../composables/elevation.mjs";
-import { makeRoundedProps } from "../../composables/rounded.mjs";
-import { useRtl } from "../../composables/locale.mjs"; // Utilities
-import { clamp, createRange, getDecimals, propsFactory } from "../../util/index.mjs";
+import { useRtl } from "../../composables/locale.mjs";
+import { makeRoundedProps } from "../../composables/rounded.mjs"; // Utilities
 import { computed, provide, ref, shallowRef, toRef } from 'vue';
-
-// Types
-
+import { clamp, createRange, getDecimals, propsFactory } from "../../util/index.mjs"; // Types
 export const VSliderSymbol = Symbol.for('vuetify:v-slider');
 export function getOffset(e, el, direction) {
   const vertical = direction === 'vertical';