vuetify 3.2.2 → 3.2.4

package/lib/components/VRangeSlider/VRangeSlider.mjs

@@ -9,21 +9,23 @@ import { VLabel } from "../VLabel/index.mjs";
 import { VSliderThumb } from "../VSlider/VSliderThumb.mjs";
 import { VSliderTrack } from "../VSlider/VSliderTrack.mjs"; // Composables
 import { makeFocusProps, useFocus } from "../../composables/focus.mjs";
-import { useProxiedModel } from "../../composables/proxiedModel.mjs"; // Utilities
+import { useProxiedModel } from "../../composables/proxiedModel.mjs";
+import { useRtl } from "../../composables/locale.mjs"; // Utilities
 import { computed, ref } from 'vue';
-import { genericComponent, useRender } from "../../util/index.mjs"; // Types
+import { genericComponent, propsFactory, useRender } from "../../util/index.mjs"; // Types
+export const makeVRangeSliderProps = propsFactory({
+  ...makeFocusProps(),
+  ...makeVInputProps(),
+  ...makeSliderProps(),
+  strict: Boolean,
+  modelValue: {
+    type: Array,
+    default: () => [0, 0]
+  }
+}, 'v-range-slider');
 export const VRangeSlider = genericComponent()({
   name: 'VRangeSlider',
-  props: {
-    ...makeFocusProps(),
-    ...makeVInputProps(),
-    ...makeSliderProps(),
-    strict: Boolean,
-    modelValue: {
-      type: Array,
-      default: () => [0, 0]
-    }
-  },
+  props: makeVRangeSliderProps(),
   emits: {
     'update:focused': value => true,
     'update:modelValue': value => true,
@@ -38,6 +40,9 @@ export const VRangeSlider = genericComponent()({
     const startThumbRef = ref();
     const stopThumbRef = ref();
     const inputRef = ref();
+    const {
+      rtlClasses
+    } = useRtl();
     function getActiveThumb(e) {
       if (!startThumbRef.value || !stopThumbRef.value) return;
       const startOffset = getOffset(e, startThumbRef.value.$el, props.direction);
@@ -108,7 +113,7 @@ export const VRangeSlider = genericComponent()({
           'v-slider--focused': isFocused.value,
           'v-slider--pressed': mousePressed.value,
           'v-slider--disabled': props.disabled
-        }, props.class],
+        }, rtlClasses.value, props.class],
         "style": props.style,
         "ref": inputRef
       }, inputProps, {

package/lib/components/VRangeSlider/VRangeSlider.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VRangeSlider.mjs","names":["makeVInputProps","VInput","getOffset","makeSliderProps","useSlider","useSteps","VLabel","VSliderThumb","VSliderTrack","makeFocusProps","useFocus","useProxiedModel","computed","ref","genericComponent","useRender","VRangeSlider","name","props","strict","Boolean","modelValue","type","Array","default","emits","value","end","start","setup","_ref","slots","emit","startThumbRef","stopThumbRef","inputRef","getActiveThumb","e","startOffset","$el","direction","stopOffset","a","Math","abs","b","steps","model","undefined","arr","length","map","roundValue","activeThumbRef","hasLabels","max","min","mousePressed","onSliderMousedown","onSliderTouchstart","position","trackContainerRef","onSliderStart","onSliderEnd","_ref2","newValue","onSliderMove","_ref3","stop","focus","isFocused","blur","trackStart","trackStop","inputProps","_","filterProps","hasPrepend","label","prepend","_createVNode","_mergeProps","disabled","class","style","slotProps","_Fragment","_ref4","id","messagesId","readonly","v","relatedTarget","onBlur"],"sources":["../../../src/components/VRangeSlider/VRangeSlider.tsx"],"sourcesContent":["// Styles\nimport '../VSlider/VSlider.sass'\n\n// Components\nimport { makeVInputProps, VInput } from '@/components/VInput/VInput'\nimport { getOffset, makeSliderProps, useSlider, useSteps } from '@/components/VSlider/slider'\nimport { VLabel } from '@/components/VLabel'\nimport { VSliderThumb } from '@/components/VSlider/VSliderThumb'\nimport { VSliderTrack } from '@/components/VSlider/VSliderTrack'\n\n// Composables\nimport { makeFocusProps, useFocus } from '@/composables/focus'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { computed, ref } from 'vue'\nimport { genericComponent, useRender } from '@/util'\n\n// Types\nimport type { PropType, WritableComputedRef } from 'vue'\nimport type { VSliderSlots } from '../VSlider/VSlider'\n\nexport const VRangeSlider = genericComponent<VSliderSlots>()({\n  name: 'VRangeSlider',\n\n  props: {\n    ...makeFocusProps(),\n    ...makeVInputProps(),\n    ...makeSliderProps(),\n\n    strict: Boolean,\n    modelValue: {\n      type: Array as PropType<number[]>,\n      default: () => ([0, 0]),\n    },\n  },\n\n  emits: {\n    'update:focused': (value: boolean) => true,\n    'update:modelValue': (value: [number, number]) => true,\n    end: (value: [number, number]) => true,\n    start: (value: [number, number]) => true,\n  },\n\n  setup (props, { slots, emit }) {\n    const startThumbRef = ref<VSliderThumb>()\n    const stopThumbRef = ref<VSliderThumb>()\n    const inputRef = ref<VInput>()\n\n    function getActiveThumb (e: MouseEvent | TouchEvent) {\n      if (!startThumbRef.value || !stopThumbRef.value) return\n\n      const startOffset = getOffset(e, startThumbRef.value.$el, props.direction)\n      const stopOffset = getOffset(e, stopThumbRef.value.$el, props.direction)\n\n      const a = Math.abs(startOffset)\n      const b = Math.abs(stopOffset)\n\n      return (a < b || (a === b && startOffset < 0)) ? startThumbRef.value.$el : stopThumbRef.value.$el\n    }\n\n    const steps = useSteps(props)\n\n    const model = useProxiedModel(\n      props,\n      'modelValue',\n      undefined,\n      arr => {\n        if (!arr?.length) return [0, 0]\n\n        return arr.map(value => steps.roundValue(value))\n      },\n    ) as WritableComputedRef<[number, number]> & { readonly externalValue: number[] }\n\n    const {\n      activeThumbRef,\n      hasLabels,\n      max,\n      min,\n      mousePressed,\n      onSliderMousedown,\n      onSliderTouchstart,\n      position,\n      trackContainerRef,\n    } = useSlider({\n      props,\n      steps,\n      onSliderStart: () => {\n        emit('start', model.value)\n      },\n      onSliderEnd: ({ value }) => {\n        const newValue: [number, number] = activeThumbRef.value === startThumbRef.value?.$el\n          ? [value, model.value[1]]\n          : [model.value[0], value]\n\n        model.value = newValue\n        emit('end', newValue)\n      },\n      onSliderMove: ({ value }) => {\n        const [start, stop] = model.value\n\n        if (!props.strict && start === stop && start !== min.value) {\n          activeThumbRef.value = value > start ? stopThumbRef.value?.$el : startThumbRef.value?.$el\n          activeThumbRef.value?.focus()\n        }\n\n        if (activeThumbRef.value === startThumbRef.value?.$el) {\n          model.value = [Math.min(value, stop), stop]\n        } else {\n          model.value = [start, Math.max(start, value)]\n        }\n      },\n      getActiveThumb,\n    })\n\n    const { isFocused, focus, blur } = useFocus(props)\n    const trackStart = computed(() => position(model.value[0]))\n    const trackStop = computed(() => position(model.value[1]))\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            'v-range-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            props.class,\n          ]}\n          style={ props.style }\n          ref={ inputRef }\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                      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={ onSliderMousedown }\n                onTouchstartPassive={ onSliderTouchstart }\n              >\n                <input\n                  id={ `${id.value}_start` }\n                  name={ props.name || id.value }\n                  disabled={ props.disabled }\n                  readonly={ props.readonly }\n                  tabindex=\"-1\"\n                  value={ model.value[0] }\n                />\n\n                <input\n                  id={ `${id.value}_stop` }\n                  name={ props.name || id.value }\n                  disabled={ props.disabled }\n                  readonly={ props.readonly }\n                  tabindex=\"-1\"\n                  value={ model.value[1] }\n                />\n\n                <VSliderTrack\n                  ref={ trackContainerRef }\n                  start={ trackStart.value }\n                  stop={ trackStop.value }\n                >\n                  {{ 'tick-label': slots['tick-label'] }}\n                </VSliderTrack>\n\n                <VSliderThumb\n                  ref={ startThumbRef }\n                  aria-describedby={ messagesId.value }\n                  focused={ isFocused && activeThumbRef.value === startThumbRef.value?.$el }\n                  modelValue={ model.value[0] }\n                  onUpdate:modelValue={ v => (model.value = [v, model.value[1]]) }\n                  onFocus={ (e: FocusEvent) => {\n                    focus()\n                    activeThumbRef.value = startThumbRef.value?.$el\n\n                    // Make sure second thumb is focused if\n                    // the thumbs are on top of each other\n                    // and they are both at minimum value\n                    // but only if focused from outside.\n                    if (\n                      model.value[0] === model.value[1] &&\n                      model.value[1] === min.value &&\n                      e.relatedTarget !== stopThumbRef.value?.$el\n                    ) {\n                      startThumbRef.value?.$el.blur()\n                      stopThumbRef.value?.$el.focus()\n                    }\n                  }}\n                  onBlur={ () => {\n                    blur()\n                    activeThumbRef.value = undefined\n                  }}\n                  min={ min.value }\n                  max={ model.value[1] }\n                  position={ trackStart.value }\n                >\n                  {{ 'thumb-label': slots['thumb-label'] }}\n                </VSliderThumb>\n\n                <VSliderThumb\n                  ref={ stopThumbRef }\n                  aria-describedby={ messagesId.value }\n                  focused={ isFocused && activeThumbRef.value === stopThumbRef.value?.$el }\n                  modelValue={ model.value[1] }\n                  onUpdate:modelValue={ v => (model.value = [model.value[0], v]) }\n                  onFocus={ (e: FocusEvent) => {\n                    focus()\n                    activeThumbRef.value = stopThumbRef.value?.$el\n\n                    // Make sure first thumb is focused if\n                    // the thumbs are on top of each other\n                    // and they are both at maximum value\n                    // but only if focused from outside.\n                    if (\n                      model.value[0] === model.value[1] &&\n                      model.value[0] === max.value &&\n                      e.relatedTarget !== startThumbRef.value?.$el\n                    ) {\n                      stopThumbRef.value?.$el.blur()\n                      startThumbRef.value?.$el.focus()\n                    }\n                  }}\n                  onBlur={ () => {\n                    blur()\n                    activeThumbRef.value = undefined\n                  }}\n                  min={ model.value[0] }\n                  max={ max.value }\n                  position={ trackStop.value }\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 VRangeSlider = InstanceType<typeof VRangeSlider>\n"],"mappings":"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"}
+{"version":3,"file":"VRangeSlider.mjs","names":["makeVInputProps","VInput","getOffset","makeSliderProps","useSlider","useSteps","VLabel","VSliderThumb","VSliderTrack","makeFocusProps","useFocus","useProxiedModel","useRtl","computed","ref","genericComponent","propsFactory","useRender","makeVRangeSliderProps","strict","Boolean","modelValue","type","Array","default","VRangeSlider","name","props","emits","value","end","start","setup","_ref","slots","emit","startThumbRef","stopThumbRef","inputRef","rtlClasses","getActiveThumb","e","startOffset","$el","direction","stopOffset","a","Math","abs","b","steps","model","undefined","arr","length","map","roundValue","activeThumbRef","hasLabels","max","min","mousePressed","onSliderMousedown","onSliderTouchstart","position","trackContainerRef","onSliderStart","onSliderEnd","_ref2","newValue","onSliderMove","_ref3","stop","focus","isFocused","blur","trackStart","trackStop","inputProps","_","filterProps","hasPrepend","label","prepend","_createVNode","_mergeProps","disabled","class","style","slotProps","_Fragment","_ref4","id","messagesId","readonly","v","relatedTarget","onBlur"],"sources":["../../../src/components/VRangeSlider/VRangeSlider.tsx"],"sourcesContent":["// Styles\nimport '../VSlider/VSlider.sass'\n\n// Components\nimport { makeVInputProps, VInput } from '@/components/VInput/VInput'\nimport { getOffset, makeSliderProps, useSlider, useSteps } from '@/components/VSlider/slider'\nimport { VLabel } from '@/components/VLabel'\nimport { VSliderThumb } from '@/components/VSlider/VSliderThumb'\nimport { VSliderTrack } from '@/components/VSlider/VSliderTrack'\n\n// Composables\nimport { makeFocusProps, useFocus } from '@/composables/focus'\nimport { useProxiedModel } from '@/composables/proxiedModel'\nimport { useRtl } from '@/composables/locale'\n\n// Utilities\nimport { computed, ref } from 'vue'\nimport { genericComponent, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { PropType, WritableComputedRef } from 'vue'\nimport type { VSliderSlots } from '../VSlider/VSlider'\n\nexport const makeVRangeSliderProps = propsFactory({\n  ...makeFocusProps(),\n  ...makeVInputProps(),\n  ...makeSliderProps(),\n\n  strict: Boolean,\n  modelValue: {\n    type: Array as PropType<number[]>,\n    default: () => ([0, 0]),\n  },\n}, 'v-range-slider')\n\nexport const VRangeSlider = genericComponent<VSliderSlots>()({\n  name: 'VRangeSlider',\n\n  props: makeVRangeSliderProps(),\n\n  emits: {\n    'update:focused': (value: boolean) => true,\n    'update:modelValue': (value: [number, number]) => true,\n    end: (value: [number, number]) => true,\n    start: (value: [number, number]) => true,\n  },\n\n  setup (props, { slots, emit }) {\n    const startThumbRef = ref<VSliderThumb>()\n    const stopThumbRef = ref<VSliderThumb>()\n    const inputRef = ref<VInput>()\n    const { rtlClasses } = useRtl()\n\n    function getActiveThumb (e: MouseEvent | TouchEvent) {\n      if (!startThumbRef.value || !stopThumbRef.value) return\n\n      const startOffset = getOffset(e, startThumbRef.value.$el, props.direction)\n      const stopOffset = getOffset(e, stopThumbRef.value.$el, props.direction)\n\n      const a = Math.abs(startOffset)\n      const b = Math.abs(stopOffset)\n\n      return (a < b || (a === b && startOffset < 0)) ? startThumbRef.value.$el : stopThumbRef.value.$el\n    }\n\n    const steps = useSteps(props)\n\n    const model = useProxiedModel(\n      props,\n      'modelValue',\n      undefined,\n      arr => {\n        if (!arr?.length) return [0, 0]\n\n        return arr.map(value => steps.roundValue(value))\n      },\n    ) as WritableComputedRef<[number, number]> & { readonly externalValue: number[] }\n\n    const {\n      activeThumbRef,\n      hasLabels,\n      max,\n      min,\n      mousePressed,\n      onSliderMousedown,\n      onSliderTouchstart,\n      position,\n      trackContainerRef,\n    } = useSlider({\n      props,\n      steps,\n      onSliderStart: () => {\n        emit('start', model.value)\n      },\n      onSliderEnd: ({ value }) => {\n        const newValue: [number, number] = activeThumbRef.value === startThumbRef.value?.$el\n          ? [value, model.value[1]]\n          : [model.value[0], value]\n\n        model.value = newValue\n        emit('end', newValue)\n      },\n      onSliderMove: ({ value }) => {\n        const [start, stop] = model.value\n\n        if (!props.strict && start === stop && start !== min.value) {\n          activeThumbRef.value = value > start ? stopThumbRef.value?.$el : startThumbRef.value?.$el\n          activeThumbRef.value?.focus()\n        }\n\n        if (activeThumbRef.value === startThumbRef.value?.$el) {\n          model.value = [Math.min(value, stop), stop]\n        } else {\n          model.value = [start, Math.max(start, value)]\n        }\n      },\n      getActiveThumb,\n    })\n\n    const { isFocused, focus, blur } = useFocus(props)\n    const trackStart = computed(() => position(model.value[0]))\n    const trackStop = computed(() => position(model.value[1]))\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            'v-range-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            rtlClasses.value,\n            props.class,\n          ]}\n          style={ props.style }\n          ref={ inputRef }\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                      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={ onSliderMousedown }\n                onTouchstartPassive={ onSliderTouchstart }\n              >\n                <input\n                  id={ `${id.value}_start` }\n                  name={ props.name || id.value }\n                  disabled={ props.disabled }\n                  readonly={ props.readonly }\n                  tabindex=\"-1\"\n                  value={ model.value[0] }\n                />\n\n                <input\n                  id={ `${id.value}_stop` }\n                  name={ props.name || id.value }\n                  disabled={ props.disabled }\n                  readonly={ props.readonly }\n                  tabindex=\"-1\"\n                  value={ model.value[1] }\n                />\n\n                <VSliderTrack\n                  ref={ trackContainerRef }\n                  start={ trackStart.value }\n                  stop={ trackStop.value }\n                >\n                  {{ 'tick-label': slots['tick-label'] }}\n                </VSliderTrack>\n\n                <VSliderThumb\n                  ref={ startThumbRef }\n                  aria-describedby={ messagesId.value }\n                  focused={ isFocused && activeThumbRef.value === startThumbRef.value?.$el }\n                  modelValue={ model.value[0] }\n                  onUpdate:modelValue={ v => (model.value = [v, model.value[1]]) }\n                  onFocus={ (e: FocusEvent) => {\n                    focus()\n                    activeThumbRef.value = startThumbRef.value?.$el\n\n                    // Make sure second thumb is focused if\n                    // the thumbs are on top of each other\n                    // and they are both at minimum value\n                    // but only if focused from outside.\n                    if (\n                      model.value[0] === model.value[1] &&\n                      model.value[1] === min.value &&\n                      e.relatedTarget !== stopThumbRef.value?.$el\n                    ) {\n                      startThumbRef.value?.$el.blur()\n                      stopThumbRef.value?.$el.focus()\n                    }\n                  }}\n                  onBlur={ () => {\n                    blur()\n                    activeThumbRef.value = undefined\n                  }}\n                  min={ min.value }\n                  max={ model.value[1] }\n                  position={ trackStart.value }\n                >\n                  {{ 'thumb-label': slots['thumb-label'] }}\n                </VSliderThumb>\n\n                <VSliderThumb\n                  ref={ stopThumbRef }\n                  aria-describedby={ messagesId.value }\n                  focused={ isFocused && activeThumbRef.value === stopThumbRef.value?.$el }\n                  modelValue={ model.value[1] }\n                  onUpdate:modelValue={ v => (model.value = [model.value[0], v]) }\n                  onFocus={ (e: FocusEvent) => {\n                    focus()\n                    activeThumbRef.value = stopThumbRef.value?.$el\n\n                    // Make sure first thumb is focused if\n                    // the thumbs are on top of each other\n                    // and they are both at maximum value\n                    // but only if focused from outside.\n                    if (\n                      model.value[0] === model.value[1] &&\n                      model.value[0] === max.value &&\n                      e.relatedTarget !== startThumbRef.value?.$el\n                    ) {\n                      stopThumbRef.value?.$el.blur()\n                      startThumbRef.value?.$el.focus()\n                    }\n                  }}\n                  onBlur={ () => {\n                    blur()\n                    activeThumbRef.value = undefined\n                  }}\n                  min={ model.value[0] }\n                  max={ max.value }\n                  position={ trackStop.value }\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 VRangeSlider = InstanceType<typeof VRangeSlider>\n"],"mappings":"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"}

package/lib/components/VRating/VRating.mjs

@@ -12,52 +12,56 @@ import { makeTagProps } from "../../composables/tag.mjs";
 import { makeThemeProps, provideTheme } from "../../composables/theme.mjs";
 import { useLocale } from "../../composables/locale.mjs";
 import { useProxiedModel } from "../../composables/proxiedModel.mjs"; // Utilities
-import { computed, ref } from 'vue';
-import { clamp, createRange, genericComponent, getUid, useRender } from "../../util/index.mjs"; // Types
+import { clamp, createRange, genericComponent, getUid, propsFactory, useRender } from "../../util/index.mjs";
+import { computed, shallowRef } from 'vue';
+
+// Types
+
+export const makeVRatingProps = propsFactory({
+  name: String,
+  itemAriaLabel: {
+    type: String,
+    default: '$vuetify.rating.ariaLabel.item'
+  },
+  activeColor: String,
+  color: String,
+  clearable: Boolean,
+  disabled: Boolean,
+  emptyIcon: {
+    type: IconValue,
+    default: '$ratingEmpty'
+  },
+  fullIcon: {
+    type: IconValue,
+    default: '$ratingFull'
+  },
+  halfIncrements: Boolean,
+  hover: Boolean,
+  length: {
+    type: [Number, String],
+    default: 5
+  },
+  readonly: Boolean,
+  modelValue: {
+    type: [Number, String],
+    default: 0
+  },
+  itemLabels: Array,
+  itemLabelPosition: {
+    type: String,
+    default: 'top',
+    validator: v => ['top', 'bottom'].includes(v)
+  },
+  ripple: Boolean,
+  ...makeComponentProps(),
+  ...makeDensityProps(),
+  ...makeSizeProps(),
+  ...makeTagProps(),
+  ...makeThemeProps()
+}, 'v-rating');
 export const VRating = genericComponent()({
   name: 'VRating',
-  props: {
-    name: String,
-    itemAriaLabel: {
-      type: String,
-      default: '$vuetify.rating.ariaLabel.item'
-    },
-    activeColor: String,
-    color: String,
-    clearable: Boolean,
-    disabled: Boolean,
-    emptyIcon: {
-      type: IconValue,
-      default: '$ratingEmpty'
-    },
-    fullIcon: {
-      type: IconValue,
-      default: '$ratingFull'
-    },
-    halfIncrements: Boolean,
-    hover: Boolean,
-    length: {
-      type: [Number, String],
-      default: 5
-    },
-    readonly: Boolean,
-    modelValue: {
-      type: [Number, String],
-      default: 0
-    },
-    itemLabels: Array,
-    itemLabelPosition: {
-      type: String,
-      default: 'top',
-      validator: v => ['top', 'bottom'].includes(v)
-    },
-    ripple: Boolean,
-    ...makeComponentProps(),
-    ...makeDensityProps(),
-    ...makeSizeProps(),
-    ...makeTagProps(),
-    ...makeThemeProps()
-  },
+  props: makeVRatingProps(),
   emits: {
     'update:modelValue': value => true
   },
@@ -75,7 +79,7 @@ export const VRating = genericComponent()({
     const normalizedValue = computed(() => clamp(parseFloat(rating.value), 0, +props.length));
     const range = computed(() => createRange(Number(props.length), 1));
     const increments = computed(() => range.value.flatMap(v => props.halfIncrements ? [v - 0.5, v] : [v]));
-    const hoverIndex = ref(-1);
+    const hoverIndex = shallowRef(-1);
     const itemState = computed(() => increments.value.map(value => {
       const isHovering = props.hover && hoverIndex.value > -1;
       const isFilled = normalizedValue.value >= value;

package/lib/components/VRating/VRating.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VRating.mjs","names":["VBtn","IconValue","makeComponentProps","makeDensityProps","makeSizeProps","makeTagProps","makeThemeProps","provideTheme","useLocale","useProxiedModel","computed","ref","clamp","createRange","genericComponent","getUid","useRender","VRating","name","props","String","itemAriaLabel","type","default","activeColor","color","clearable","Boolean","disabled","emptyIcon","fullIcon","halfIncrements","hover","length","Number","readonly","modelValue","itemLabels","Array","itemLabelPosition","validator","v","includes","ripple","emits","value","setup","_ref","slots","t","themeClasses","rating","normalizedValue","parseFloat","range","increments","flatMap","hoverIndex","itemState","map","isHovering","isFilled","isHovered","isFullIcon","icon","eventState","onMouseenter","onMouseleave","onClick","undefined","VRatingItem","_ref2","index","showStar","id","replace","btnProps","density","size","variant","_createVNode","_Fragment","item","createLabel","labelProps","label","_createTextVNode","hasLabels","tag","class","style","i"],"sources":["../../../src/components/VRating/VRating.tsx"],"sourcesContent":["// Styles\nimport './VRating.sass'\n\n// Components\nimport { VBtn } from '@/components/VBtn'\n\n// Composables\nimport { IconValue } from '@/composables/icons'\nimport { makeComponentProps } from '@/composables/component'\nimport { makeDensityProps } from '@/composables/density'\nimport { makeSizeProps } from '@/composables/size'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { useLocale } from '@/composables/locale'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { computed, ref } from 'vue'\nimport { clamp, createRange, genericComponent, getUid, useRender } from '@/util'\n\n// Types\nimport type { Prop } from 'vue'\nimport type { Variant } from '@/composables/variant'\n\ntype VRatingItemSlot = {\n  value: number\n  index: number\n  isFilled: boolean\n  isHovered: boolean\n  icon: IconValue\n  color?: string\n  props: Record<string, unknown>\n  rating: number\n}\n\ntype VRatingItemLabelSlot = {\n  value: number\n  index: number\n  label?: string\n}\n\ntype VRatingSlots = {\n  item: [VRatingItemSlot]\n  'item-label': [VRatingItemLabelSlot]\n}\n\nexport const VRating = genericComponent<VRatingSlots>()({\n  name: 'VRating',\n\n  props: {\n    name: String,\n    itemAriaLabel: {\n      type: String,\n      default: '$vuetify.rating.ariaLabel.item',\n    },\n    activeColor: String,\n    color: String,\n    clearable: Boolean,\n    disabled: Boolean,\n    emptyIcon: {\n      type: IconValue,\n      default: '$ratingEmpty',\n    },\n    fullIcon: {\n      type: IconValue,\n      default: '$ratingFull',\n    },\n    halfIncrements: Boolean,\n    hover: Boolean,\n    length: {\n      type: [Number, String],\n      default: 5,\n    },\n    readonly: Boolean,\n    modelValue: {\n      type: [Number, String],\n      default: 0,\n    },\n    itemLabels: Array as Prop<string[]>,\n    itemLabelPosition: {\n      type: String,\n      default: 'top',\n      validator: (v: any) => ['top', 'bottom'].includes(v),\n    },\n    ripple: Boolean,\n\n    ...makeComponentProps(),\n    ...makeDensityProps(),\n    ...makeSizeProps(),\n    ...makeTagProps(),\n    ...makeThemeProps(),\n  },\n\n  emits: {\n    'update:modelValue': (value: number | string) => true,\n  },\n\n  setup (props, { slots }) {\n    const { t } = useLocale()\n    const { themeClasses } = provideTheme(props)\n    const rating = useProxiedModel(props, 'modelValue')\n    const normalizedValue = computed(() => clamp(parseFloat(rating.value), 0, +props.length))\n\n    const range = computed(() => createRange(Number(props.length), 1))\n    const increments = computed(() => range.value.flatMap(v => props.halfIncrements ? [v - 0.5, v] : [v]))\n    const hoverIndex = ref(-1)\n\n    const itemState = computed(() => increments.value.map(value => {\n      const isHovering = props.hover && hoverIndex.value > -1\n      const isFilled = normalizedValue.value >= value\n      const isHovered = hoverIndex.value >= value\n      const isFullIcon = isHovering ? isHovered : isFilled\n      const icon = isFullIcon ? props.fullIcon : props.emptyIcon\n      const activeColor = props.activeColor ?? props.color\n      const color = (isFilled || isHovered) ? activeColor : props.color\n\n      return { isFilled, isHovered, icon, color }\n    }))\n\n    const eventState = computed(() => [0, ...increments.value].map(value => {\n      function onMouseenter () {\n        hoverIndex.value = value\n      }\n\n      function onMouseleave () {\n        hoverIndex.value = -1\n      }\n\n      function onClick () {\n        if (props.disabled || props.readonly) return\n        rating.value = normalizedValue.value === value && props.clearable ? 0 : value\n      }\n\n      return {\n        onMouseenter: props.hover ? onMouseenter : undefined,\n        onMouseleave: props.hover ? onMouseleave : undefined,\n        onClick,\n      }\n    }))\n\n    const name = computed(() => props.name ?? `v-rating-${getUid()}`)\n\n    function VRatingItem ({ value, index, showStar = true }: { value: number, index: number, showStar?: boolean }) {\n      const { onMouseenter, onMouseleave, onClick } = eventState.value[index + 1]\n      const id = `${name.value}-${String(value).replace('.', '-')}`\n      const btnProps = {\n        color: itemState.value[index]?.color,\n        density: props.density,\n        disabled: props.disabled,\n        icon: itemState.value[index]?.icon,\n        ripple: props.ripple,\n        size: props.size,\n        variant: 'plain' as Variant,\n      }\n\n      return (\n        <>\n          <label\n            for={ id }\n            class={{\n              'v-rating__item--half': props.halfIncrements && value % 1 > 0,\n              'v-rating__item--full': props.halfIncrements && value % 1 === 0,\n            }}\n            onMouseenter={ onMouseenter }\n            onMouseleave={ onMouseleave }\n            onClick={ onClick }\n          >\n            <span class=\"v-rating__hidden\">{ t(props.itemAriaLabel, value, props.length) }</span>\n            {\n              !showStar ? undefined\n              : slots.item ? slots.item({\n                ...itemState.value[index],\n                props: btnProps,\n                value,\n                index,\n                rating: normalizedValue.value,\n              })\n              : (\n                <VBtn { ...btnProps } />\n              )\n            }\n          </label>\n\n          <input\n            class=\"v-rating__hidden\"\n            name={ name.value }\n            id={ id }\n            type=\"radio\"\n            value={ value }\n            checked={ normalizedValue.value === value }\n            tabindex={ -1 }\n            readonly={ props.readonly }\n            disabled={ props.disabled }\n          />\n        </>\n      )\n    }\n\n    function createLabel (labelProps: { value: number, index: number, label?: string }) {\n      if (slots['item-label']) return slots['item-label'](labelProps)\n\n      if (labelProps.label) return <span>{ labelProps.label }</span>\n\n      return <span>&nbsp;</span>\n    }\n\n    useRender(() => {\n      const hasLabels = !!props.itemLabels?.length || slots['item-label']\n\n      return (\n        <props.tag\n          class={[\n            'v-rating',\n            {\n              'v-rating--hover': props.hover,\n              'v-rating--readonly': props.readonly,\n            },\n            themeClasses.value,\n            props.class,\n          ]}\n          style={ props.style }\n        >\n          <VRatingItem value={ 0 } index={ -1 } showStar={ false } />\n\n          { range.value.map((value, i) => (\n            <div class=\"v-rating__wrapper\">\n              {\n                hasLabels && props.itemLabelPosition === 'top'\n                  ? createLabel({ value, index: i, label: props.itemLabels?.[i] })\n                  : undefined\n              }\n              <div class=\"v-rating__item\">\n                { props.halfIncrements ? (\n                  <>\n                    <VRatingItem value={ value - 0.5 } index={ i * 2 } />\n                    <VRatingItem value={ value } index={ (i * 2) + 1 } />\n                  </>\n                ) : (\n                  <VRatingItem value={ value } index={ i } />\n                )}\n              </div>\n              {\n                hasLabels && props.itemLabelPosition === 'bottom'\n                  ? createLabel({ value, index: i, label: props.itemLabels?.[i] })\n                  : undefined\n              }\n            </div>\n          ))}\n        </props.tag>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VRating = InstanceType<typeof VRating>\n"],"mappings":"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"}
+{"version":3,"file":"VRating.mjs","names":["VBtn","IconValue","makeComponentProps","makeDensityProps","makeSizeProps","makeTagProps","makeThemeProps","provideTheme","useLocale","useProxiedModel","clamp","createRange","genericComponent","getUid","propsFactory","useRender","computed","shallowRef","makeVRatingProps","name","String","itemAriaLabel","type","default","activeColor","color","clearable","Boolean","disabled","emptyIcon","fullIcon","halfIncrements","hover","length","Number","readonly","modelValue","itemLabels","Array","itemLabelPosition","validator","v","includes","ripple","VRating","props","emits","value","setup","_ref","slots","t","themeClasses","rating","normalizedValue","parseFloat","range","increments","flatMap","hoverIndex","itemState","map","isHovering","isFilled","isHovered","isFullIcon","icon","eventState","onMouseenter","onMouseleave","onClick","undefined","VRatingItem","_ref2","index","showStar","id","replace","btnProps","density","size","variant","_createVNode","_Fragment","item","createLabel","labelProps","label","_createTextVNode","hasLabels","tag","class","style","i"],"sources":["../../../src/components/VRating/VRating.tsx"],"sourcesContent":["// Styles\nimport './VRating.sass'\n\n// Components\nimport { VBtn } from '@/components/VBtn'\n\n// Composables\nimport { IconValue } from '@/composables/icons'\nimport { makeComponentProps } from '@/composables/component'\nimport { makeDensityProps } from '@/composables/density'\nimport { makeSizeProps } from '@/composables/size'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { useLocale } from '@/composables/locale'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { clamp, createRange, genericComponent, getUid, propsFactory, useRender } from '@/util'\nimport { computed, shallowRef } from 'vue'\n\n// Types\nimport type { Prop } from 'vue'\nimport type { Variant } from '@/composables/variant'\n\ntype VRatingItemSlot = {\n  value: number\n  index: number\n  isFilled: boolean\n  isHovered: boolean\n  icon: IconValue\n  color?: string\n  props: Record<string, unknown>\n  rating: number\n}\n\ntype VRatingItemLabelSlot = {\n  value: number\n  index: number\n  label?: string\n}\n\ntype VRatingSlots = {\n  item: [VRatingItemSlot]\n  'item-label': [VRatingItemLabelSlot]\n}\n\nexport const makeVRatingProps = propsFactory({\n  name: String,\n  itemAriaLabel: {\n    type: String,\n    default: '$vuetify.rating.ariaLabel.item',\n  },\n  activeColor: String,\n  color: String,\n  clearable: Boolean,\n  disabled: Boolean,\n  emptyIcon: {\n    type: IconValue,\n    default: '$ratingEmpty',\n  },\n  fullIcon: {\n    type: IconValue,\n    default: '$ratingFull',\n  },\n  halfIncrements: Boolean,\n  hover: Boolean,\n  length: {\n    type: [Number, String],\n    default: 5,\n  },\n  readonly: Boolean,\n  modelValue: {\n    type: [Number, String],\n    default: 0,\n  },\n  itemLabels: Array as Prop<string[]>,\n  itemLabelPosition: {\n    type: String,\n    default: 'top',\n    validator: (v: any) => ['top', 'bottom'].includes(v),\n  },\n  ripple: Boolean,\n\n  ...makeComponentProps(),\n  ...makeDensityProps(),\n  ...makeSizeProps(),\n  ...makeTagProps(),\n  ...makeThemeProps(),\n}, 'v-rating')\n\nexport const VRating = genericComponent<VRatingSlots>()({\n  name: 'VRating',\n\n  props: makeVRatingProps(),\n\n  emits: {\n    'update:modelValue': (value: number | string) => true,\n  },\n\n  setup (props, { slots }) {\n    const { t } = useLocale()\n    const { themeClasses } = provideTheme(props)\n    const rating = useProxiedModel(props, 'modelValue')\n    const normalizedValue = computed(() => clamp(parseFloat(rating.value), 0, +props.length))\n\n    const range = computed(() => createRange(Number(props.length), 1))\n    const increments = computed(() => range.value.flatMap(v => props.halfIncrements ? [v - 0.5, v] : [v]))\n    const hoverIndex = shallowRef(-1)\n\n    const itemState = computed(() => increments.value.map(value => {\n      const isHovering = props.hover && hoverIndex.value > -1\n      const isFilled = normalizedValue.value >= value\n      const isHovered = hoverIndex.value >= value\n      const isFullIcon = isHovering ? isHovered : isFilled\n      const icon = isFullIcon ? props.fullIcon : props.emptyIcon\n      const activeColor = props.activeColor ?? props.color\n      const color = (isFilled || isHovered) ? activeColor : props.color\n\n      return { isFilled, isHovered, icon, color }\n    }))\n\n    const eventState = computed(() => [0, ...increments.value].map(value => {\n      function onMouseenter () {\n        hoverIndex.value = value\n      }\n\n      function onMouseleave () {\n        hoverIndex.value = -1\n      }\n\n      function onClick () {\n        if (props.disabled || props.readonly) return\n        rating.value = normalizedValue.value === value && props.clearable ? 0 : value\n      }\n\n      return {\n        onMouseenter: props.hover ? onMouseenter : undefined,\n        onMouseleave: props.hover ? onMouseleave : undefined,\n        onClick,\n      }\n    }))\n\n    const name = computed(() => props.name ?? `v-rating-${getUid()}`)\n\n    function VRatingItem ({ value, index, showStar = true }: { value: number, index: number, showStar?: boolean }) {\n      const { onMouseenter, onMouseleave, onClick } = eventState.value[index + 1]\n      const id = `${name.value}-${String(value).replace('.', '-')}`\n      const btnProps = {\n        color: itemState.value[index]?.color,\n        density: props.density,\n        disabled: props.disabled,\n        icon: itemState.value[index]?.icon,\n        ripple: props.ripple,\n        size: props.size,\n        variant: 'plain' as Variant,\n      }\n\n      return (\n        <>\n          <label\n            for={ id }\n            class={{\n              'v-rating__item--half': props.halfIncrements && value % 1 > 0,\n              'v-rating__item--full': props.halfIncrements && value % 1 === 0,\n            }}\n            onMouseenter={ onMouseenter }\n            onMouseleave={ onMouseleave }\n            onClick={ onClick }\n          >\n            <span class=\"v-rating__hidden\">{ t(props.itemAriaLabel, value, props.length) }</span>\n            {\n              !showStar ? undefined\n              : slots.item ? slots.item({\n                ...itemState.value[index],\n                props: btnProps,\n                value,\n                index,\n                rating: normalizedValue.value,\n              })\n              : (\n                <VBtn { ...btnProps } />\n              )\n            }\n          </label>\n\n          <input\n            class=\"v-rating__hidden\"\n            name={ name.value }\n            id={ id }\n            type=\"radio\"\n            value={ value }\n            checked={ normalizedValue.value === value }\n            tabindex={ -1 }\n            readonly={ props.readonly }\n            disabled={ props.disabled }\n          />\n        </>\n      )\n    }\n\n    function createLabel (labelProps: { value: number, index: number, label?: string }) {\n      if (slots['item-label']) return slots['item-label'](labelProps)\n\n      if (labelProps.label) return <span>{ labelProps.label }</span>\n\n      return <span>&nbsp;</span>\n    }\n\n    useRender(() => {\n      const hasLabels = !!props.itemLabels?.length || slots['item-label']\n\n      return (\n        <props.tag\n          class={[\n            'v-rating',\n            {\n              'v-rating--hover': props.hover,\n              'v-rating--readonly': props.readonly,\n            },\n            themeClasses.value,\n            props.class,\n          ]}\n          style={ props.style }\n        >\n          <VRatingItem value={ 0 } index={ -1 } showStar={ false } />\n\n          { range.value.map((value, i) => (\n            <div class=\"v-rating__wrapper\">\n              {\n                hasLabels && props.itemLabelPosition === 'top'\n                  ? createLabel({ value, index: i, label: props.itemLabels?.[i] })\n                  : undefined\n              }\n              <div class=\"v-rating__item\">\n                { props.halfIncrements ? (\n                  <>\n                    <VRatingItem value={ value - 0.5 } index={ i * 2 } />\n                    <VRatingItem value={ value } index={ (i * 2) + 1 } />\n                  </>\n                ) : (\n                  <VRatingItem value={ value } index={ i } />\n                )}\n              </div>\n              {\n                hasLabels && props.itemLabelPosition === 'bottom'\n                  ? createLabel({ value, index: i, label: props.itemLabels?.[i] })\n                  : undefined\n              }\n            </div>\n          ))}\n        </props.tag>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VRating = InstanceType<typeof VRating>\n"],"mappings":"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"}

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

@@ -41,10 +41,10 @@ declare const VRating: {
             ripple: boolean;
             clearable: boolean;
             hover: boolean;
-            halfIncrements: boolean;
             itemAriaLabel: string;
             emptyIcon: IconValue;
             fullIcon: IconValue;
+            halfIncrements: boolean;
             itemLabelPosition: string;
         }> & Omit<{
             length: string | number;
@@ -58,10 +58,10 @@ declare const VRating: {
             ripple: boolean;
             clearable: boolean;
             hover: boolean;
-            halfIncrements: boolean;
             itemAriaLabel: string;
             emptyIcon: IconValue;
             fullIcon: IconValue;
+            halfIncrements: boolean;
             itemLabelPosition: string;
         } & {
             name?: string | undefined;
@@ -84,7 +84,7 @@ declare const VRating: {
             "v-slot:item-label"?: false | ((args_0: VRatingItemLabelSlot) => vue.VNodeChild) | undefined;
         } & {
             "onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
-        } & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, "length" | "style" | "disabled" | "size" | "readonly" | "tag" | "density" | "modelValue" | "ripple" | "clearable" | "hover" | "halfIncrements" | "itemAriaLabel" | "emptyIcon" | "fullIcon" | "itemLabelPosition">;
+        } & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, "length" | "style" | "disabled" | "size" | "readonly" | "tag" | "density" | "modelValue" | "ripple" | "clearable" | "hover" | "itemAriaLabel" | "emptyIcon" | "fullIcon" | "halfIncrements" | "itemLabelPosition">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -110,10 +110,10 @@ declare const VRating: {
             ripple: boolean;
             clearable: boolean;
             hover: boolean;
-            halfIncrements: boolean;
             itemAriaLabel: string;
             emptyIcon: IconValue;
             fullIcon: IconValue;
+            halfIncrements: boolean;
             itemLabelPosition: string;
         } & {
             name?: string | undefined;
@@ -150,10 +150,10 @@ declare const VRating: {
             ripple: boolean;
             clearable: boolean;
             hover: boolean;
-            halfIncrements: boolean;
             itemAriaLabel: string;
             emptyIcon: IconValue;
             fullIcon: IconValue;
+            halfIncrements: boolean;
             itemLabelPosition: string;
         }, {}, string> & {
             beforeCreate?: ((() => void) | (() => void)[]) | undefined;
@@ -187,10 +187,10 @@ declare const VRating: {
         ripple: boolean;
         clearable: boolean;
         hover: boolean;
-        halfIncrements: boolean;
         itemAriaLabel: string;
         emptyIcon: IconValue;
         fullIcon: IconValue;
+        halfIncrements: boolean;
         itemLabelPosition: string;
     } & {
         name?: string | undefined;
@@ -229,10 +229,10 @@ declare const VRating: {
     ripple: boolean;
     clearable: boolean;
     hover: boolean;
-    halfIncrements: boolean;
     itemAriaLabel: string;
     emptyIcon: IconValue;
     fullIcon: IconValue;
+    halfIncrements: boolean;
     itemLabelPosition: string;
 } & {
     name?: string | undefined;
@@ -269,10 +269,10 @@ declare const VRating: {
     ripple: boolean;
     clearable: boolean;
     hover: boolean;
-    halfIncrements: boolean;
     itemAriaLabel: string;
     emptyIcon: IconValue;
     fullIcon: IconValue;
+    halfIncrements: boolean;
     itemLabelPosition: string;
 }, {}, string> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
     theme: StringConstructor;

package/lib/components/VResponsive/VResponsive.mjs

@@ -6,7 +6,7 @@ import "./VResponsive.css";
 import { makeComponentProps } from "../../composables/component.mjs";
 import { makeDimensionProps, useDimension } from "../../composables/dimensions.mjs"; // Utilities
 import { computed } from 'vue';
-import { genericComponent, useRender } from "../../util/index.mjs";
+import { genericComponent, propsFactory, useRender } from "../../util/index.mjs";
 export function useAspectStyles(props) {
   return {
     aspectStyles: computed(() => {
@@ -17,14 +17,15 @@ export function useAspectStyles(props) {
     })
   };
 }
+export const makeVResponsiveProps = propsFactory({
+  aspectRatio: [String, Number],
+  contentClass: String,
+  ...makeComponentProps(),
+  ...makeDimensionProps()
+}, 'v-responsive');
 export const VResponsive = genericComponent()({
   name: 'VResponsive',
-  props: {
-    aspectRatio: [String, Number],
-    contentClass: String,
-    ...makeComponentProps(),
-    ...makeDimensionProps()
-  },
+  props: makeVResponsiveProps(),
   setup(props, _ref) {
     let {
       slots

package/lib/components/VResponsive/VResponsive.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VResponsive.mjs","names":["makeComponentProps","makeDimensionProps","useDimension","computed","genericComponent","useRender","useAspectStyles","props","aspectStyles","ratio","Number","aspectRatio","paddingBottom","String","undefined","VResponsive","name","contentClass","setup","_ref","slots","dimensionStyles","_createVNode","class","value","style","additional","default"],"sources":["../../../src/components/VResponsive/VResponsive.tsx"],"sourcesContent":["// Styles\nimport './VResponsive.sass'\n\n// Composables\nimport { makeComponentProps } from '@/composables/component'\nimport { makeDimensionProps, useDimension } from '@/composables/dimensions'\n\n// Utilities\nimport { computed } from 'vue'\nimport { genericComponent, useRender } from '@/util'\n\nexport type VResponsiveSlots = {\n  default: []\n  additional: []\n}\n\nexport function useAspectStyles (props: { aspectRatio?: string | number }) {\n  return {\n    aspectStyles: computed(() => {\n      const ratio = Number(props.aspectRatio)\n\n      return ratio\n        ? { paddingBottom: String(1 / ratio * 100) + '%' }\n        : undefined\n    }),\n  }\n}\n\nexport const VResponsive = genericComponent<VResponsiveSlots>()({\n  name: 'VResponsive',\n\n  props: {\n    aspectRatio: [String, Number],\n    contentClass: String,\n\n    ...makeComponentProps(),\n    ...makeDimensionProps(),\n  },\n\n  setup (props, { slots }) {\n    const { aspectStyles } = useAspectStyles(props)\n    const { dimensionStyles } = useDimension(props)\n\n    useRender(() => (\n      <div\n        class={[\n          'v-responsive',\n          props.class,\n        ]}\n        style={[\n          dimensionStyles.value,\n          props.style,\n        ]}\n      >\n        <div class=\"v-responsive__sizer\" style={ aspectStyles.value } />\n\n        { slots.additional?.() }\n\n        { slots.default && (\n          <div class={['v-responsive__content', props.contentClass]}>{ slots.default() }</div>\n        )}\n      </div>\n    ))\n\n    return {}\n  },\n})\n\nexport type VResponsive = InstanceType<typeof VResponsive>\n"],"mappings":";AAAA;AACA;;AAEA;AAAA,SACSA,kBAAkB;AAAA,SAClBC,kBAAkB,EAAEC,YAAY,4CAEzC;AACA,SAASC,QAAQ,QAAQ,KAAK;AAAA,SACrBC,gBAAgB,EAAEC,SAAS;AAOpC,OAAO,SAASC,eAAeA,CAAEC,KAAwC,EAAE;EACzE,OAAO;IACLC,YAAY,EAAEL,QAAQ,CAAC,MAAM;MAC3B,MAAMM,KAAK,GAAGC,MAAM,CAACH,KAAK,CAACI,WAAW,CAAC;MAEvC,OAAOF,KAAK,GACR;QAAEG,aAAa,EAAEC,MAAM,CAAC,CAAC,GAAGJ,KAAK,GAAG,GAAG,CAAC,GAAG;MAAI,CAAC,GAChDK,SAAS;IACf,CAAC;EACH,CAAC;AACH;AAEA,OAAO,MAAMC,WAAW,GAAGX,gBAAgB,EAAoB,CAAC;EAC9DY,IAAI,EAAE,aAAa;EAEnBT,KAAK,EAAE;IACLI,WAAW,EAAE,CAACE,MAAM,EAAEH,MAAM,CAAC;IAC7BO,YAAY,EAAEJ,MAAM;IAEpB,GAAGb,kBAAkB,EAAE;IACvB,GAAGC,kBAAkB;EACvB,CAAC;EAEDiB,KAAKA,CAAEX,KAAK,EAAAY,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACrB,MAAM;MAAEX;IAAa,CAAC,GAAGF,eAAe,CAACC,KAAK,CAAC;IAC/C,MAAM;MAAEc;IAAgB,CAAC,GAAGnB,YAAY,CAACK,KAAK,CAAC;IAE/CF,SAAS,CAAC,MAAAiB,YAAA;MAAA,SAEC,CACL,cAAc,EACdf,KAAK,CAACgB,KAAK,CACZ;MAAA,SACM,CACLF,eAAe,CAACG,KAAK,EACrBjB,KAAK,CAACkB,KAAK;IACZ,IAAAH,YAAA;MAAA,SAEU,qBAAqB;MAAA,SAASd,YAAY,CAACgB;IAAK,UAEzDJ,KAAK,CAACM,UAAU,IAAI,EAEpBN,KAAK,CAACO,OAAO,IAAAL,YAAA;MAAA,SACD,CAAC,uBAAuB,EAAEf,KAAK,CAACU,YAAY;IAAC,IAAIG,KAAK,CAACO,OAAO,EAAE,EAC7E,EAEJ,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC"}
+{"version":3,"file":"VResponsive.mjs","names":["makeComponentProps","makeDimensionProps","useDimension","computed","genericComponent","propsFactory","useRender","useAspectStyles","props","aspectStyles","ratio","Number","aspectRatio","paddingBottom","String","undefined","makeVResponsiveProps","contentClass","VResponsive","name","setup","_ref","slots","dimensionStyles","_createVNode","class","value","style","additional","default"],"sources":["../../../src/components/VResponsive/VResponsive.tsx"],"sourcesContent":["// Styles\nimport './VResponsive.sass'\n\n// Composables\nimport { makeComponentProps } from '@/composables/component'\nimport { makeDimensionProps, useDimension } from '@/composables/dimensions'\n\n// Utilities\nimport { computed } from 'vue'\nimport { genericComponent, propsFactory, useRender } from '@/util'\n\nexport type VResponsiveSlots = {\n  default: []\n  additional: []\n}\n\nexport function useAspectStyles (props: { aspectRatio?: string | number }) {\n  return {\n    aspectStyles: computed(() => {\n      const ratio = Number(props.aspectRatio)\n\n      return ratio\n        ? { paddingBottom: String(1 / ratio * 100) + '%' }\n        : undefined\n    }),\n  }\n}\n\nexport const makeVResponsiveProps = propsFactory({\n  aspectRatio: [String, Number],\n  contentClass: String,\n\n  ...makeComponentProps(),\n  ...makeDimensionProps(),\n}, 'v-responsive')\n\nexport const VResponsive = genericComponent<VResponsiveSlots>()({\n  name: 'VResponsive',\n\n  props: makeVResponsiveProps(),\n\n  setup (props, { slots }) {\n    const { aspectStyles } = useAspectStyles(props)\n    const { dimensionStyles } = useDimension(props)\n\n    useRender(() => (\n      <div\n        class={[\n          'v-responsive',\n          props.class,\n        ]}\n        style={[\n          dimensionStyles.value,\n          props.style,\n        ]}\n      >\n        <div class=\"v-responsive__sizer\" style={ aspectStyles.value } />\n\n        { slots.additional?.() }\n\n        { slots.default && (\n          <div class={['v-responsive__content', props.contentClass]}>{ slots.default() }</div>\n        )}\n      </div>\n    ))\n\n    return {}\n  },\n})\n\nexport type VResponsive = InstanceType<typeof VResponsive>\n"],"mappings":";AAAA;AACA;;AAEA;AAAA,SACSA,kBAAkB;AAAA,SAClBC,kBAAkB,EAAEC,YAAY,4CAEzC;AACA,SAASC,QAAQ,QAAQ,KAAK;AAAA,SACrBC,gBAAgB,EAAEC,YAAY,EAAEC,SAAS;AAOlD,OAAO,SAASC,eAAeA,CAAEC,KAAwC,EAAE;EACzE,OAAO;IACLC,YAAY,EAAEN,QAAQ,CAAC,MAAM;MAC3B,MAAMO,KAAK,GAAGC,MAAM,CAACH,KAAK,CAACI,WAAW,CAAC;MAEvC,OAAOF,KAAK,GACR;QAAEG,aAAa,EAAEC,MAAM,CAAC,CAAC,GAAGJ,KAAK,GAAG,GAAG,CAAC,GAAG;MAAI,CAAC,GAChDK,SAAS;IACf,CAAC;EACH,CAAC;AACH;AAEA,OAAO,MAAMC,oBAAoB,GAAGX,YAAY,CAAC;EAC/CO,WAAW,EAAE,CAACE,MAAM,EAAEH,MAAM,CAAC;EAC7BM,YAAY,EAAEH,MAAM;EAEpB,GAAGd,kBAAkB,EAAE;EACvB,GAAGC,kBAAkB;AACvB,CAAC,EAAE,cAAc,CAAC;AAElB,OAAO,MAAMiB,WAAW,GAAGd,gBAAgB,EAAoB,CAAC;EAC9De,IAAI,EAAE,aAAa;EAEnBX,KAAK,EAAEQ,oBAAoB,EAAE;EAE7BI,KAAKA,CAAEZ,KAAK,EAAAa,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACrB,MAAM;MAAEZ;IAAa,CAAC,GAAGF,eAAe,CAACC,KAAK,CAAC;IAC/C,MAAM;MAAEe;IAAgB,CAAC,GAAGrB,YAAY,CAACM,KAAK,CAAC;IAE/CF,SAAS,CAAC,MAAAkB,YAAA;MAAA,SAEC,CACL,cAAc,EACdhB,KAAK,CAACiB,KAAK,CACZ;MAAA,SACM,CACLF,eAAe,CAACG,KAAK,EACrBlB,KAAK,CAACmB,KAAK;IACZ,IAAAH,YAAA;MAAA,SAEU,qBAAqB;MAAA,SAASf,YAAY,CAACiB;IAAK,UAEzDJ,KAAK,CAACM,UAAU,IAAI,EAEpBN,KAAK,CAACO,OAAO,IAAAL,YAAA;MAAA,SACD,CAAC,uBAAuB,EAAEhB,KAAK,CAACS,YAAY;IAAC,IAAIK,KAAK,CAACO,OAAO,EAAE,EAC7E,EAEJ,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC"}

package/lib/components/VSelect/VSelect.mjs

@@ -19,7 +19,7 @@ import { makeTransitionProps } from "../../composables/transition.mjs";
 import { useForm } from "../../composables/form.mjs";
 import { useLocale } from "../../composables/locale.mjs";
 import { useProxiedModel } from "../../composables/proxiedModel.mjs"; // Utility
-import { computed, mergeProps, ref } from 'vue';
+import { computed, mergeProps, ref, shallowRef } from 'vue';
 import { deepEqual, genericComponent, omit, propsFactory, useRender, wrapInArray } from "../../util/index.mjs"; // Types
 export const makeSelectProps = propsFactory({
   chips: Boolean,
@@ -48,20 +48,21 @@ export const makeSelectProps = propsFactory({
   ...makeItemsProps({
     itemChildren: false
   })
+}, 'select');
+export const makeVSelectProps = propsFactory({
+  ...makeSelectProps(),
+  ...omit(makeVTextFieldProps({
+    modelValue: null
+  }), ['validationValue', 'dirty', 'appendInnerIcon']),
+  ...makeTransitionProps({
+    transition: {
+      component: VDialogTransition
+    }
+  })
 }, 'v-select');
 export const VSelect = genericComponent()({
   name: 'VSelect',
-  props: {
-    ...makeSelectProps(),
-    ...omit(makeVTextFieldProps({
-      modelValue: null
-    }), ['validationValue', 'dirty', 'appendInnerIcon']),
-    ...makeTransitionProps({
-      transition: {
-        component: VDialogTransition
-      }
-    })
-  },
+  props: makeVSelectProps(),
   emits: {
     'update:focused': focused => true,
     'update:modelValue': val => true,
@@ -100,7 +101,7 @@ export const VSelect = genericComponent()({
       });
     });
     const selected = computed(() => selections.value.map(selection => selection.props.value));
-    const isFocused = ref(false);
+    const isFocused = shallowRef(false);
     let keyboardLookupPrefix = '';
     let keyboardLookupLastTime;
     const displayItems = computed(() => {
@@ -180,14 +181,14 @@ export const VSelect = genericComponent()({
         menu.value = false;
       }
     }
-    function onFocusin(e) {
-      isFocused.value = true;
-    }
-    function onFocusout(e) {
-      if (e.relatedTarget == null) {
+    function onAfterLeave() {
+      if (isFocused.value) {
         vTextFieldRef.value?.focus();
       }
     }
+    function onFocusin(e) {
+      isFocused.value = true;
+    }
     useRender(() => {
       const hasChips = !!(props.chips || slots.chip);
       const hasList = !!(!props.hideNoData || displayItems.value.length || slots.prepend || slots.append || slots['no-data']);
@@ -231,15 +232,15 @@ export const VSelect = genericComponent()({
           "maxHeight": 310,
           "openOnClick": false,
           "closeOnContentClick": false,
-          "transition": props.transition
+          "transition": props.transition,
+          "onAfterLeave": onAfterLeave
         }, props.menuProps), {
           default: () => [hasList && _createVNode(VList, {
             "ref": listRef,
             "selected": selected.value,
             "selectStrategy": props.multiple ? 'independent' : 'single-independent',
             "onMousedown": e => e.preventDefault(),
-            "onFocusin": onFocusin,
-            "onFocusout": onFocusout
+            "onFocusin": onFocusin
           }, {
             default: () => [!displayItems.value.length && !props.hideNoData && (slots['no-data']?.() ?? _createVNode(VListItem, {
               "title": t(props.noDataText)