vuetify 3.6.3 → 3.6.5

package/lib/components/VDatePicker/VDatePickerYears.mjs

@@ -6,8 +6,8 @@ import "./VDatePickerYears.css";
 import { VBtn } from "../VBtn/index.mjs"; // Composables
 import { useDate } from "../../composables/date/index.mjs";
 import { useProxiedModel } from "../../composables/proxiedModel.mjs"; // Utilities
-import { computed, nextTick, onMounted, ref, watchEffect } from 'vue';
-import { convertToUnit, createRange, genericComponent, propsFactory, useRender } from "../../util/index.mjs"; // Types
+import { computed, nextTick, onMounted, watchEffect } from 'vue';
+import { convertToUnit, createRange, genericComponent, propsFactory, templateRef, useRender } from "../../util/index.mjs"; // Types
 // Types
 export const makeVDatePickerYearsProps = propsFactory({
   color: String,
@@ -53,10 +53,10 @@ export const VDatePickerYears = genericComponent()({
     watchEffect(() => {
       model.value = model.value ?? adapter.getYear(adapter.date());
     });
-    const yearRef = ref();
+    const yearRef = templateRef();
     onMounted(async () => {
       await nextTick();
-      yearRef.value?.$el.scrollIntoView({
+      yearRef.el?.scrollIntoView({
         block: 'center'
       });
     });

package/lib/components/VDatePicker/VDatePickerYears.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VDatePickerYears.mjs","names":["VBtn","useDate","useProxiedModel","computed","nextTick","onMounted","ref","watchEffect","convertToUnit","createRange","genericComponent","propsFactory","useRender","makeVDatePickerYearsProps","color","String","height","Number","min","max","modelValue","VDatePickerYears","name","props","emits","year","setup","_ref","emit","slots","adapter","model","years","getYear","date","startOfYear","setYear","map","i","text","format","value","yearRef","$el","scrollIntoView","block","_createVNode","btnProps","undefined","active","rounded","variant","onClick","_mergeProps"],"sources":["../../../src/components/VDatePicker/VDatePickerYears.tsx"],"sourcesContent":["// Styles\nimport './VDatePickerYears.sass'\n\n// Components\nimport { VBtn } from '@/components/VBtn'\n\n// Composables\nimport { useDate } from '@/composables/date'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { computed, nextTick, onMounted, ref, watchEffect } from 'vue'\nimport { convertToUnit, createRange, genericComponent, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\n\n// Types\nexport type VDatePickerYearsSlots = {\n  year: {\n    year: {\n      text: string\n      value: number\n    }\n    i: number\n    props: {\n      active: boolean\n      color?: string\n      rounded: boolean\n      text: string\n      variant: 'flat' | 'text'\n      onClick: () => void\n    }\n  }\n}\n\nexport const makeVDatePickerYearsProps = propsFactory({\n  color: String,\n  height: [String, Number],\n  min: null as any as PropType<unknown>,\n  max: null as any as PropType<unknown>,\n  modelValue: Number,\n}, 'VDatePickerYears')\n\nexport const VDatePickerYears = genericComponent<VDatePickerYearsSlots>()({\n  name: 'VDatePickerYears',\n\n  props: makeVDatePickerYearsProps(),\n\n  emits: {\n    'update:modelValue': (year: number) => true,\n  },\n\n  setup (props, { emit, slots }) {\n    const adapter = useDate()\n    const model = useProxiedModel(props, 'modelValue')\n    const years = computed(() => {\n      const year = adapter.getYear(adapter.date())\n\n      let min = year - 100\n      let max = year + 52\n\n      if (props.min) {\n        min = adapter.getYear(adapter.date(props.min))\n      }\n\n      if (props.max) {\n        max = adapter.getYear(adapter.date(props.max))\n      }\n\n      let date = adapter.startOfYear(adapter.date())\n\n      date = adapter.setYear(date, min)\n\n      return createRange(max - min + 1, min).map(i => {\n        const text = adapter.format(date, 'year')\n        date = adapter.setYear(date, adapter.getYear(date) + 1)\n\n        return {\n          text,\n          value: i,\n        }\n      })\n    })\n\n    watchEffect(() => {\n      model.value = model.value ?? adapter.getYear(adapter.date())\n    })\n\n    const yearRef = ref<VBtn>()\n    onMounted(async () => {\n      await nextTick()\n      yearRef.value?.$el.scrollIntoView({ block: 'center' })\n    })\n\n    useRender(() => (\n      <div\n        class=\"v-date-picker-years\"\n        style={{\n          height: convertToUnit(props.height),\n        }}\n      >\n        <div class=\"v-date-picker-years__content\">\n          { years.value.map((year, i) => {\n            const btnProps = {\n              ref: model.value === year.value ? yearRef : undefined,\n              active: model.value === year.value,\n              color: model.value === year.value ? props.color : undefined,\n              rounded: true,\n              text: year.text,\n              variant: model.value === year.value ? 'flat' : 'text',\n              onClick: () => {\n                if (model.value === year.value) {\n                  emit('update:modelValue', model.value)\n                  return\n                }\n                model.value = year.value\n              },\n            } as const\n\n            return slots.year?.({\n              year,\n              i,\n              props: btnProps,\n            }) ?? (\n              <VBtn\n                key=\"month\"\n                { ...btnProps }\n              />\n            )\n          })}\n        </div>\n      </div>\n    ))\n\n    return {}\n  },\n})\n\nexport type VDatePickerYears = InstanceType<typeof VDatePickerYears>\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"VDatePickerYears.mjs","names":["VBtn","useDate","useProxiedModel","computed","nextTick","onMounted","watchEffect","convertToUnit","createRange","genericComponent","propsFactory","templateRef","useRender","makeVDatePickerYearsProps","color","String","height","Number","min","max","modelValue","VDatePickerYears","name","props","emits","year","setup","_ref","emit","slots","adapter","model","years","getYear","date","startOfYear","setYear","map","i","text","format","value","yearRef","el","scrollIntoView","block","_createVNode","btnProps","ref","undefined","active","rounded","variant","onClick","_mergeProps"],"sources":["../../../src/components/VDatePicker/VDatePickerYears.tsx"],"sourcesContent":["// Styles\nimport './VDatePickerYears.sass'\n\n// Components\nimport { VBtn } from '@/components/VBtn'\n\n// Composables\nimport { useDate } from '@/composables/date'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { computed, nextTick, onMounted, watchEffect } from 'vue'\nimport { convertToUnit, createRange, genericComponent, propsFactory, templateRef, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\n\n// Types\nexport type VDatePickerYearsSlots = {\n  year: {\n    year: {\n      text: string\n      value: number\n    }\n    i: number\n    props: {\n      active: boolean\n      color?: string\n      rounded: boolean\n      text: string\n      variant: 'flat' | 'text'\n      onClick: () => void\n    }\n  }\n}\n\nexport const makeVDatePickerYearsProps = propsFactory({\n  color: String,\n  height: [String, Number],\n  min: null as any as PropType<unknown>,\n  max: null as any as PropType<unknown>,\n  modelValue: Number,\n}, 'VDatePickerYears')\n\nexport const VDatePickerYears = genericComponent<VDatePickerYearsSlots>()({\n  name: 'VDatePickerYears',\n\n  props: makeVDatePickerYearsProps(),\n\n  emits: {\n    'update:modelValue': (year: number) => true,\n  },\n\n  setup (props, { emit, slots }) {\n    const adapter = useDate()\n    const model = useProxiedModel(props, 'modelValue')\n    const years = computed(() => {\n      const year = adapter.getYear(adapter.date())\n\n      let min = year - 100\n      let max = year + 52\n\n      if (props.min) {\n        min = adapter.getYear(adapter.date(props.min))\n      }\n\n      if (props.max) {\n        max = adapter.getYear(adapter.date(props.max))\n      }\n\n      let date = adapter.startOfYear(adapter.date())\n\n      date = adapter.setYear(date, min)\n\n      return createRange(max - min + 1, min).map(i => {\n        const text = adapter.format(date, 'year')\n        date = adapter.setYear(date, adapter.getYear(date) + 1)\n\n        return {\n          text,\n          value: i,\n        }\n      })\n    })\n\n    watchEffect(() => {\n      model.value = model.value ?? adapter.getYear(adapter.date())\n    })\n\n    const yearRef = templateRef()\n\n    onMounted(async () => {\n      await nextTick()\n      yearRef.el?.scrollIntoView({ block: 'center' })\n    })\n\n    useRender(() => (\n      <div\n        class=\"v-date-picker-years\"\n        style={{\n          height: convertToUnit(props.height),\n        }}\n      >\n        <div class=\"v-date-picker-years__content\">\n          { years.value.map((year, i) => {\n            const btnProps = {\n              ref: model.value === year.value ? yearRef : undefined,\n              active: model.value === year.value,\n              color: model.value === year.value ? props.color : undefined,\n              rounded: true,\n              text: year.text,\n              variant: model.value === year.value ? 'flat' : 'text',\n              onClick: () => {\n                if (model.value === year.value) {\n                  emit('update:modelValue', model.value)\n                  return\n                }\n                model.value = year.value\n              },\n            } as const\n\n            return slots.year?.({\n              year,\n              i,\n              props: btnProps,\n            }) ?? (\n              <VBtn\n                key=\"month\"\n                { ...btnProps }\n              />\n            )\n          })}\n        </div>\n      </div>\n    ))\n\n    return {}\n  },\n})\n\nexport type VDatePickerYears = InstanceType<typeof VDatePickerYears>\n"],"mappings":"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","ignoreList":[]}