routie dev init since i didn't adhere to any proper guidance up until now

2026-04-29 22:27:29 -06:00
commit e1dabb71e2
15301 changed files with 3562618 additions and 0 deletions
@@ -0,0 +1,125 @@
+import { mergeProps as _mergeProps, createVNode as _createVNode, createElementVNode as _createElementVNode, withDirectives as _withDirectives } from "vue";
+// Styles
+import "./VDatePickerYears.css";
+
+// Components
+import { VBtn } from "../VBtn/index.js"; // Composables
+import { useDate } from "../../composables/date/index.js";
+import { useProxiedModel } from "../../composables/proxiedModel.js"; // Directives
+import vIntersect from "../../directives/intersect/index.js"; // Utilities
+import { computed, shallowRef, watchEffect } from 'vue';
+import { convertToUnit, createRange, genericComponent, propsFactory, templateRef, useRender } from "../../util/index.js"; // Types
+// Types
+export const makeVDatePickerYearsProps = propsFactory({
+  color: String,
+  height: [String, Number],
+  min: null,
+  max: null,
+  modelValue: Number,
+  allowedYears: [Array, Function]
+}, 'VDatePickerYears');
+export const VDatePickerYears = genericComponent()({
+  name: 'VDatePickerYears',
+  props: makeVDatePickerYearsProps(),
+  directives: {
+    vIntersect
+  },
+  emits: {
+    'update:modelValue': year => true
+  },
+  setup(props, {
+    emit,
+    slots
+  }) {
+    const adapter = useDate();
+    const model = useProxiedModel(props, 'modelValue');
+    const hasFocusedItem = shallowRef(false);
+    const years = computed(() => {
+      const year = adapter.getYear(adapter.date());
+      let min = year - 100;
+      let max = year + 52;
+      if (props.min) {
+        min = adapter.getYear(adapter.date(props.min));
+      }
+      if (props.max) {
+        max = adapter.getYear(adapter.date(props.max));
+      }
+      let date = adapter.startOfYear(adapter.date());
+      date = adapter.setYear(date, min);
+      return createRange(max - min + 1, min).map(i => {
+        const text = adapter.format(date, 'year');
+        date = adapter.setYear(date, adapter.getYear(date) + 1);
+        return {
+          text,
+          value: i,
+          isDisabled: !isYearAllowed(i)
+        };
+      });
+    });
+    watchEffect(() => {
+      model.value = model.value ?? adapter.getYear(adapter.date());
+    });
+    const containerRef = templateRef();
+    const yearRef = templateRef();
+    function focusSelectedYear() {
+      const container = containerRef.el;
+      const target = yearRef.el;
+      if (!container || !target) return;
+      const containerRect = container.getBoundingClientRect();
+      const targetRect = target.getBoundingClientRect();
+      container.scrollTop += targetRect.top - containerRect.top - container.clientHeight / 2 + targetRect.height / 2;
+    }
+    function isYearAllowed(year) {
+      if (Array.isArray(props.allowedYears) && props.allowedYears.length) {
+        return props.allowedYears.includes(year);
+      }
+      if (typeof props.allowedYears === 'function') {
+        return props.allowedYears(year);
+      }
+      return true;
+    }
+    useRender(() => _withDirectives(_createElementVNode("div", {
+      "class": "v-date-picker-years",
+      "ref": containerRef,
+      "style": {
+        height: convertToUnit(props.height)
+      }
+    }, [_createElementVNode("div", {
+      "class": "v-date-picker-years__content",
+      "onFocus": () => yearRef.el?.focus(),
+      "onFocusin": () => hasFocusedItem.value = true,
+      "onFocusout": () => hasFocusedItem.value = false,
+      "tabindex": hasFocusedItem.value ? -1 : 0
+    }, [years.value.map((year, i) => {
+      const btnProps = {
+        ref: model.value === year.value ? yearRef : undefined,
+        active: model.value === year.value,
+        color: model.value === year.value ? props.color : undefined,
+        rounded: true,
+        text: year.text,
+        disabled: year.isDisabled,
+        variant: model.value === year.value ? 'flat' : 'text',
+        onClick: () => {
+          if (model.value === year.value) {
+            emit('update:modelValue', model.value);
+            return;
+          }
+          model.value = year.value;
+        }
+      };
+      return slots.year?.({
+        year,
+        i,
+        props: btnProps
+      }) ?? _createVNode(VBtn, _mergeProps({
+        "key": "month"
+      }, btnProps), null);
+    })])]), [[vIntersect, {
+      handler: focusSelectedYear
+    }, null, {
+      once: true
+    }]]));
+    return {};
+  }
+});
+//# sourceMappingURL=VDatePickerYears.js.map