vuetify 3.3.19 → 3.3.21

package/lib/labs/VDatePicker/index.d.mts

@@ -338,6 +338,7 @@ declare const VDateCard: {
             "onUpdate:displayDate"?: ((value: any) => any) | undefined;
             "onUpdate:inputMode"?: ((value: any) => any) | undefined;
             "onUpdate:viewMode"?: ((mode: "month" | "year") => any) | undefined;
+            allowedDates?: Function | unknown[] | undefined;
             hoverDate?: any;
             onCancel?: (() => any) | undefined;
             onSave?: (() => any) | undefined;
@@ -618,6 +619,7 @@ declare const VDateCard: {
             format?: string | undefined;
             side?: string | undefined;
             displayDate?: any;
+            allowedDates?: Function | unknown[] | undefined;
             hoverDate?: any;
         } & {
             $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
@@ -1180,6 +1182,7 @@ declare const VDateCard: {
         format?: string | undefined;
         side?: string | undefined;
         displayDate?: any;
+        allowedDates?: Function | unknown[] | undefined;
         hoverDate?: any;
     } & {
         $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
@@ -1462,6 +1465,7 @@ declare const VDateCard: {
     format?: string | undefined;
     side?: string | undefined;
     displayDate?: any;
+    allowedDates?: Function | unknown[] | undefined;
     hoverDate?: any;
 } & {
     $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
@@ -2209,6 +2213,7 @@ declare const VDateCard: {
         type: PropType<any[]>;
         default: () => never[];
     };
+    allowedDates: (FunctionConstructor | ArrayConstructor)[];
     showAdjacentMonths: BooleanConstructor;
     hideWeekdays: BooleanConstructor;
     showWeek: BooleanConstructor;
@@ -2693,6 +2698,7 @@ declare const VDateCard: {
         type: PropType<any[]>;
         default: () => never[];
     };
+    allowedDates: (FunctionConstructor | ArrayConstructor)[];
     showAdjacentMonths: BooleanConstructor;
     hideWeekdays: BooleanConstructor;
     showWeek: BooleanConstructor;
@@ -2865,6 +2871,7 @@ declare const VDatePicker: {
             "onUpdate:displayDate"?: ((date: any) => any) | undefined;
             "onUpdate:inputMode"?: ((inputMode: "calendar" | "keyboard") => any) | undefined;
             "onUpdate:viewMode"?: ((viewMode: "month" | "year") => any) | undefined;
+            allowedDates?: Function | unknown[] | undefined;
             hoverDate?: any;
             "onClick:cancel"?: (() => any) | undefined;
             "onClick:save"?: (() => any) | undefined;
@@ -2943,6 +2950,7 @@ declare const VDatePicker: {
             rounded?: string | number | boolean | undefined;
             bgColor?: string | undefined;
             displayDate?: any;
+            allowedDates?: Function | unknown[] | undefined;
             hoverDate?: any;
         } & {
             $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
@@ -3099,6 +3107,7 @@ declare const VDatePicker: {
         rounded?: string | number | boolean | undefined;
         bgColor?: string | undefined;
         displayDate?: any;
+        allowedDates?: Function | unknown[] | undefined;
         hoverDate?: any;
     } & {
         $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
@@ -3188,6 +3197,7 @@ declare const VDatePicker: {
     rounded?: string | number | boolean | undefined;
     bgColor?: string | undefined;
     displayDate?: any;
+    allowedDates?: Function | unknown[] | undefined;
     hoverDate?: any;
 } & {
     $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
@@ -3324,6 +3334,7 @@ declare const VDatePicker: {
         type: vue.PropType<any[]>;
         default: () => never[];
     };
+    allowedDates: (FunctionConstructor | ArrayConstructor)[];
     showAdjacentMonths: BooleanConstructor;
     hideWeekdays: BooleanConstructor;
     showWeek: BooleanConstructor;
@@ -3435,6 +3446,7 @@ declare const VDatePicker: {
         type: vue.PropType<any[]>;
         default: () => never[];
     };
+    allowedDates: (FunctionConstructor | ArrayConstructor)[];
     showAdjacentMonths: BooleanConstructor;
     hideWeekdays: BooleanConstructor;
     showWeek: BooleanConstructor;
@@ -4057,6 +4069,7 @@ declare const VDatePickerMonth: {
             "onUpdate:modelValue"?: ((date: readonly any[]) => any) | undefined;
             "onUpdate:focused"?: ((focused: boolean) => any) | undefined;
             "onUpdate:displayDate"?: ((date: any) => any) | undefined;
+            allowedDates?: Function | unknown[] | undefined;
             hoverDate?: any;
             "onUpdate:hoverDate"?: ((date: any) => any) | undefined;
         };
@@ -4088,6 +4101,7 @@ declare const VDatePickerMonth: {
             min?: string | number | Date | undefined;
             format?: string | undefined;
             side?: string | undefined;
+            allowedDates?: Function | unknown[] | undefined;
             hoverDate?: any;
         } & {
             $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
@@ -4153,6 +4167,7 @@ declare const VDatePickerMonth: {
         min?: string | number | Date | undefined;
         format?: string | undefined;
         side?: string | undefined;
+        allowedDates?: Function | unknown[] | undefined;
         hoverDate?: any;
     } & {
         $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
@@ -4185,6 +4200,7 @@ declare const VDatePickerMonth: {
     min?: string | number | Date | undefined;
     format?: string | undefined;
     side?: string | undefined;
+    allowedDates?: Function | unknown[] | undefined;
     hoverDate?: any;
 } & {
     $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
@@ -4227,6 +4243,7 @@ declare const VDatePickerMonth: {
         type: vue.PropType<any>;
         default: null;
     };
+    allowedDates: (FunctionConstructor | ArrayConstructor)[];
     color: {
         type: vue.PropType<string>;
         default: string;
@@ -4251,6 +4268,7 @@ declare const VDatePickerMonth: {
         type: vue.PropType<any>;
         default: null;
     };
+    allowedDates: (FunctionConstructor | ArrayConstructor)[];
     color: {
         type: vue.PropType<string>;
         default: string;

package/lib/labs/VDateRangePicker/index.d.mts

@@ -87,6 +87,7 @@ declare const VDateRangeCard: {
             "onUpdate:displayDate"?: ((date: any) => any) | undefined;
             "onUpdate:inputMode"?: ((inputMode: "calendar" | "keyboard") => any) | undefined;
             "onUpdate:viewMode"?: ((viewMode: "month" | "year") => any) | undefined;
+            readonly allowedDates?: Function | unknown[] | undefined;
             readonly hoverDate?: any;
         };
         $attrs: {
@@ -127,6 +128,7 @@ declare const VDateRangeCard: {
                 type: vue.PropType<any[]>;
                 default: () => never[];
             };
+            allowedDates: (FunctionConstructor | ArrayConstructor)[];
             showAdjacentMonths: BooleanConstructor;
             hideWeekdays: BooleanConstructor;
             showWeek: BooleanConstructor;
@@ -236,6 +238,7 @@ declare const VDateRangeCard: {
             type: vue.PropType<any[]>;
             default: () => never[];
         };
+        allowedDates: (FunctionConstructor | ArrayConstructor)[];
         showAdjacentMonths: BooleanConstructor;
         hideWeekdays: BooleanConstructor;
         showWeek: BooleanConstructor;
@@ -307,6 +310,7 @@ declare const VDateRangeCard: {
         type: vue.PropType<any[]>;
         default: () => never[];
     };
+    allowedDates: (FunctionConstructor | ArrayConstructor)[];
     showAdjacentMonths: BooleanConstructor;
     hideWeekdays: BooleanConstructor;
     showWeek: BooleanConstructor;
@@ -396,6 +400,7 @@ declare const VDateRangeCard: {
         type: vue.PropType<any[]>;
         default: () => never[];
     };
+    allowedDates: (FunctionConstructor | ArrayConstructor)[];
     showAdjacentMonths: BooleanConstructor;
     hideWeekdays: BooleanConstructor;
     showWeek: BooleanConstructor;
@@ -457,6 +462,7 @@ declare const VDateRangeCard: {
         type: vue.PropType<any[]>;
         default: () => never[];
     };
+    allowedDates: (FunctionConstructor | ArrayConstructor)[];
     showAdjacentMonths: BooleanConstructor;
     hideWeekdays: BooleanConstructor;
     showWeek: BooleanConstructor;
@@ -594,6 +600,7 @@ declare const VDateRangePicker: {
             "onUpdate:displayDate"?: ((date: any) => any) | undefined;
             "onUpdate:inputMode"?: ((input: string) => any) | undefined;
             "onUpdate:viewMode"?: ((mode: "month" | "year") => any) | undefined;
+            allowedDates?: Function | unknown[] | undefined;
             hoverDate?: any;
             onCancel?: (() => any) | undefined;
             onSave?: ((date: any) => any) | undefined;
@@ -655,6 +662,7 @@ declare const VDateRangePicker: {
             theme?: string | undefined;
             rounded?: string | number | boolean | undefined;
             bgColor?: string | undefined;
+            allowedDates?: Function | unknown[] | undefined;
             hoverDate?: any;
         } & {
             $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
@@ -765,6 +773,7 @@ declare const VDateRangePicker: {
         theme?: string | undefined;
         rounded?: string | number | boolean | undefined;
         bgColor?: string | undefined;
+        allowedDates?: Function | unknown[] | undefined;
         hoverDate?: any;
     } & {
         $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
@@ -828,6 +837,7 @@ declare const VDateRangePicker: {
     theme?: string | undefined;
     rounded?: string | number | boolean | undefined;
     bgColor?: string | undefined;
+    allowedDates?: Function | unknown[] | undefined;
     hoverDate?: any;
 } & {
     $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
@@ -900,6 +910,7 @@ declare const VDateRangePicker: {
         type: vue.PropType<any>;
         default: null;
     };
+    allowedDates: (FunctionConstructor | ArrayConstructor)[];
     color: StringConstructor;
     showAdjacentMonths: BooleanConstructor;
     hideWeekdays: {
@@ -997,6 +1008,7 @@ declare const VDateRangePicker: {
         type: vue.PropType<any>;
         default: null;
     };
+    allowedDates: (FunctionConstructor | ArrayConstructor)[];
     color: StringConstructor;
     showAdjacentMonths: BooleanConstructor;
     hideWeekdays: {

package/lib/labs/VOtpInput/VOtpInput.css

@@ -3,12 +3,11 @@
   align-items: center;
   display: flex;
   justify-content: center;
-  padding: 0.5rem;
+  padding: 0.5rem 0;
   position: relative;
 }
 .v-otp-input .v-field {
   height: 100%;
-  margin: 0 0.25rem;
 }
 
 .v-otp-input__divider {
@@ -18,6 +17,7 @@
 .v-otp-input__content {
   align-items: center;
   display: flex;
+  gap: 0.5rem;
   height: 64px;
   padding: 0.5rem;
   justify-content: center;
@@ -30,6 +30,7 @@
 }
 
 .v-otp-input__field {
+  color: inherit;
   font-size: 1.25rem;
   height: 100%;
   outline: none;

package/lib/labs/VOtpInput/VOtpInput.mjs

@@ -32,7 +32,7 @@ export const makeVOtpInputProps = propsFactory({
   placeholder: String,
   type: {
     type: String,
-    default: 'text'
+    default: 'number'
   },
   ...makeDimensionProps(),
   ...makeFocusProps(),
@@ -78,7 +78,7 @@ export const VOtpInput = genericComponent()({
       model.value = array;
       let target = null;
       if (focusIndex.value > model.value.length) {
-        target = model.value.length + 1;
+        target = model.value.length;
       } else if (focusIndex.value + 1 !== Number(props.length)) {
         target = 'next';
       } else {
@@ -103,7 +103,7 @@ export const VOtpInput = genericComponent()({
           target = 'prev';
         } else {
           requestAnimationFrame(() => {
-            inputRef.value[index].select();
+            inputRef.value[index]?.select();
           });
         }
       }
@@ -132,6 +132,9 @@ export const VOtpInput = genericComponent()({
     }
     provideDefaults({
       VField: {
+        color: computed(() => props.color),
+        bgColor: computed(() => props.color),
+        baseColor: computed(() => props.baseColor),
         disabled: computed(() => props.disabled),
         error: computed(() => props.error),
         variant: computed(() => props.variant)
@@ -147,7 +150,7 @@ export const VOtpInput = genericComponent()({
     watch(focusIndex, val => {
       if (val < 0) return;
       IN_BROWSER && window.requestAnimationFrame(() => {
-        inputRef.value[val].select();
+        inputRef.value[val]?.select();
       });
     });
     useRender(() => {

package/lib/labs/VOtpInput/VOtpInput.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VOtpInput.mjs","names":["makeVFieldProps","VField","VOverlay","VProgressCircular","provideDefaults","makeDimensionProps","useDimension","makeFocusProps","useFocus","useLocale","useProxiedModel","computed","ref","watch","filterInputAttrs","focusChild","genericComponent","IN_BROWSER","only","propsFactory","useRender","makeVOtpInputProps","autofocus","Boolean","divider","String","focusAll","label","type","default","length","Number","modelValue","undefined","placeholder","variant","VOtpInput","name","props","emits","finish","val","setup","_ref","attrs","emit","slots","dimensionStyles","isFocused","focus","blur","model","split","join","t","fields","Array","fill","focusIndex","contentRef","inputRef","current","value","onInput","array","slice","target","requestAnimationFrame","onKeydown","e","index","includes","key","preventDefault","select","onPaste","stopPropagation","clipboardData","getData","reset","onFocus","onBlur","disabled","error","scoped","deep","window","rootAttrs","inputAttrs","_createVNode","_mergeProps","class","style","map","_","i","_Fragment","event","loading","loader","some","input"],"sources":["../../../src/labs/VOtpInput/VOtpInput.tsx"],"sourcesContent":["// Styles\nimport './VOtpInput.sass'\n\n// Components\nimport { makeVFieldProps, VField } from '@/components/VField/VField'\nimport { VOverlay } from '@/components/VOverlay/VOverlay'\nimport { VProgressCircular } from '@/components/VProgressCircular/VProgressCircular'\n\n// Composables\nimport { provideDefaults } from '@/composables/defaults'\nimport { makeDimensionProps, useDimension } from '@/composables/dimensions'\nimport { makeFocusProps, useFocus } from '@/composables/focus'\nimport { useLocale } from '@/composables/locale'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { computed, ref, watch } from 'vue'\nimport { filterInputAttrs, focusChild, genericComponent, IN_BROWSER, only, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\n\n// Types\nexport type VOtpInputSlots = {\n  default: never\n  loader: never\n}\n\nexport const makeVOtpInputProps = propsFactory({\n  autofocus: Boolean,\n  divider: String,\n  focusAll: Boolean,\n  label: {\n    type: String,\n    default: '$vuetify.input.otp',\n  },\n  length: {\n    type: [Number, String],\n    default: 6,\n  },\n  modelValue: {\n    type: [Number, String],\n    default: undefined,\n  },\n  placeholder: String,\n  type: {\n    type: String as PropType<'text' | 'password' | 'number'>,\n    default: 'text',\n  },\n\n  ...makeDimensionProps(),\n  ...makeFocusProps(),\n  ...only(makeVFieldProps({\n    variant: 'outlined' as const,\n  }), [\n    'baseColor',\n    'bgColor',\n    'class',\n    'color',\n    'disabled',\n    'error',\n    'loading',\n    'rounded',\n    'style',\n    'theme',\n    'variant',\n  ]),\n}, 'VOtpInput')\n\nexport const VOtpInput = genericComponent<VOtpInputSlots>()({\n  name: 'VOtpInput',\n\n  props: makeVOtpInputProps(),\n\n  emits: {\n    finish: (val: string) => true,\n    'update:focused': (val: boolean) => true,\n    'update:modelValue': (val: string) => true,\n  },\n\n  setup (props, { attrs, emit, slots }) {\n    const { dimensionStyles } = useDimension(props)\n    const { isFocused, focus, blur } = useFocus(props)\n    const model = useProxiedModel(\n      props,\n      'modelValue',\n      '',\n      val => String(val).split(''),\n      val => val.join('')\n    )\n    const { t } = useLocale()\n\n    const fields = computed(() => Array(Number(props.length)).fill(0))\n    const focusIndex = ref(-1)\n    const contentRef = ref<HTMLElement>()\n    const inputRef = ref<HTMLInputElement[]>([])\n    const current = computed(() => inputRef.value[focusIndex.value])\n\n    function onInput () {\n      const array = model.value.slice()\n      const value = current.value.value\n\n      array[focusIndex.value] = value\n\n      model.value = array\n\n      let target: any = null\n\n      if (focusIndex.value > model.value.length) {\n        target = model.value.length + 1\n      } else if (focusIndex.value + 1 !== Number(props.length)) {\n        target = 'next'\n      } else {\n        requestAnimationFrame(() => current.value?.blur())\n      }\n\n      if (target) focusChild(contentRef.value!, target)\n    }\n\n    function onKeydown (e: KeyboardEvent) {\n      const array = model.value.slice()\n      const index = focusIndex.value\n      let target: 'next' | 'prev' | 'first' | 'last' | number | null = null\n\n      if (![\n        'ArrowLeft',\n        'ArrowRight',\n        'Backspace',\n        'Delete',\n      ].includes(e.key)) return\n\n      e.preventDefault()\n\n      if (e.key === 'ArrowLeft') {\n        target = 'prev'\n      } else if (e.key === 'ArrowRight') {\n        target = 'next'\n      } else if (['Backspace', 'Delete'].includes(e.key)) {\n        array[focusIndex.value] = ''\n\n        model.value = array\n\n        if (focusIndex.value > 0 && e.key === 'Backspace') {\n          target = 'prev'\n        } else {\n          requestAnimationFrame(() => {\n            inputRef.value[index].select()\n          })\n        }\n      }\n\n      requestAnimationFrame(() => {\n        if (target != null) {\n          focusChild(contentRef.value!, target)\n        }\n      })\n    }\n\n    function onPaste (index: number, e: ClipboardEvent) {\n      e.preventDefault()\n      e.stopPropagation()\n\n      model.value = (e?.clipboardData?.getData('Text') ?? '').split('')\n\n      inputRef.value?.[index].blur()\n    }\n\n    function reset () {\n      model.value = []\n    }\n\n    function onFocus (e: FocusEvent, index: number) {\n      focus()\n\n      focusIndex.value = index\n    }\n\n    function onBlur () {\n      blur()\n\n      focusIndex.value = -1\n    }\n\n    provideDefaults({\n      VField: {\n        disabled: computed(() => props.disabled),\n        error: computed(() => props.error),\n        variant: computed(() => props.variant),\n      },\n    }, { scoped: true })\n\n    watch(model, val => {\n      if (val.length === Number(props.length)) emit('finish', val.join(''))\n    }, { deep: true })\n\n    watch(focusIndex, val => {\n      if (val < 0) return\n\n      IN_BROWSER && window.requestAnimationFrame(() => {\n        inputRef.value[val].select()\n      })\n    })\n\n    useRender(() => {\n      const [rootAttrs, inputAttrs] = filterInputAttrs(attrs)\n\n      return (\n        <div\n          class={[\n            'v-otp-input',\n            {\n              'v-otp-input--divided': !!props.divider,\n            },\n            props.class,\n          ]}\n          style={[\n            props.style,\n          ]}\n          { ...rootAttrs }\n        >\n          <div\n            ref={ contentRef }\n            class=\"v-otp-input__content\"\n            style={[\n              dimensionStyles.value,\n            ]}\n          >\n            { fields.value.map((_, i) => (\n              <>\n                { props.divider && i !== 0 && (\n                  <span class=\"v-otp-input__divider\">{ props.divider }</span>\n                )}\n\n                <VField\n                  focused={ (isFocused.value && props.focusAll) || focusIndex.value === i }\n                  key={ i }\n                >\n                  {{\n                    ...slots,\n                    default: () => {\n                      return (\n                        <input\n                          ref={ val => inputRef.value[i] = val as HTMLInputElement }\n                          aria-label={ t(props.label, i + 1) }\n                          autofocus={ i === 0 && props.autofocus }\n                          autocomplete=\"one-time-code\"\n                          class={[\n                            'v-otp-input__field',\n                          ]}\n                          inputmode=\"text\"\n                          min={ props.type === 'number' ? 0 : undefined }\n                          maxlength=\"1\"\n                          placeholder={ props.placeholder }\n                          type={ props.type }\n                          value={ model.value[i] }\n                          onInput={ onInput }\n                          onFocus={ e => onFocus(e, i) }\n                          onBlur={ onBlur }\n                          onKeydown={ onKeydown }\n                          onPaste={ event => onPaste(i, event) }\n                        />\n                      )\n                    },\n                  }}\n                </VField>\n              </>\n            ))}\n\n            <input\n              class=\"v-otp-input-input\"\n              type=\"hidden\"\n              { ...inputAttrs }\n              value={ model.value.join('') }\n            />\n\n            <VOverlay\n              contained\n              content-class=\"v-otp-input__loader\"\n              model-value={ !!props.loading }\n              persistent\n            >\n              { slots.loader?.() ?? (\n                <VProgressCircular\n                  color={ typeof props.loading === 'boolean' ? undefined : props.loading }\n                  indeterminate\n                  size=\"24\"\n                  width=\"2\"\n                />\n              )}\n            </VOverlay>\n\n            { slots.default?.() }\n          </div>\n        </div>\n      )\n    })\n\n    return {\n      blur: () => {\n        inputRef.value?.some(input => input.blur())\n      },\n      focus: () => {\n        inputRef.value?.[0].focus()\n      },\n      reset,\n      isFocused,\n    }\n  },\n})\n\nexport type VOtpInput = InstanceType<typeof VOtpInput>\n"],"mappings":";AAAA;AACA;;AAEA;AAAA,SACSA,eAAe,EAAEC,MAAM;AAAA,SACvBC,QAAQ;AAAA,SACRC,iBAAiB,oEAE1B;AAAA,SACSC,eAAe;AAAA,SACfC,kBAAkB,EAAEC,YAAY;AAAA,SAChCC,cAAc,EAAEC,QAAQ;AAAA,SACxBC,SAAS;AAAA,SACTC,eAAe,8CAExB;AACA,SAASC,QAAQ,EAAEC,GAAG,EAAEC,KAAK,QAAQ,KAAK;AAAA,SACjCC,gBAAgB,EAAEC,UAAU,EAAEC,gBAAgB,EAAEC,UAAU,EAAEC,IAAI,EAAEC,YAAY,EAAEC,SAAS,gCAElG;AASA,OAAO,MAAMC,kBAAkB,GAAGF,YAAY,CAAC;EAC7CG,SAAS,EAAEC,OAAO;EAClBC,OAAO,EAAEC,MAAM;EACfC,QAAQ,EAAEH,OAAO;EACjBI,KAAK,EAAE;IACLC,IAAI,EAAEH,MAAM;IACZI,OAAO,EAAE;EACX,CAAC;EACDC,MAAM,EAAE;IACNF,IAAI,EAAE,CAACG,MAAM,EAAEN,MAAM,CAAC;IACtBI,OAAO,EAAE;EACX,CAAC;EACDG,UAAU,EAAE;IACVJ,IAAI,EAAE,CAACG,MAAM,EAAEN,MAAM,CAAC;IACtBI,OAAO,EAAEI;EACX,CAAC;EACDC,WAAW,EAAET,MAAM;EACnBG,IAAI,EAAE;IACJA,IAAI,EAAEH,MAAkD;IACxDI,OAAO,EAAE;EACX,CAAC;EAED,GAAGxB,kBAAkB,EAAE;EACvB,GAAGE,cAAc,EAAE;EACnB,GAAGW,IAAI,CAAClB,eAAe,CAAC;IACtBmC,OAAO,EAAE;EACX,CAAC,CAAC,EAAE,CACF,WAAW,EACX,SAAS,EACT,OAAO,EACP,OAAO,EACP,UAAU,EACV,OAAO,EACP,SAAS,EACT,SAAS,EACT,OAAO,EACP,OAAO,EACP,SAAS,CACV;AACH,CAAC,EAAE,WAAW,CAAC;AAEf,OAAO,MAAMC,SAAS,GAAGpB,gBAAgB,EAAkB,CAAC;EAC1DqB,IAAI,EAAE,WAAW;EAEjBC,KAAK,EAAEjB,kBAAkB,EAAE;EAE3BkB,KAAK,EAAE;IACLC,MAAM,EAAGC,GAAW,IAAK,IAAI;IAC7B,gBAAgB,EAAGA,GAAY,IAAK,IAAI;IACxC,mBAAmB,EAAGA,GAAW,IAAK;EACxC,CAAC;EAEDC,KAAKA,CAAEJ,KAAK,EAAAK,IAAA,EAA0B;IAAA,IAAxB;MAAEC,KAAK;MAAEC,IAAI;MAAEC;IAAM,CAAC,GAAAH,IAAA;IAClC,MAAM;MAAEI;IAAgB,CAAC,GAAGzC,YAAY,CAACgC,KAAK,CAAC;IAC/C,MAAM;MAAEU,SAAS;MAAEC,KAAK;MAAEC;IAAK,CAAC,GAAG1C,QAAQ,CAAC8B,KAAK,CAAC;IAClD,MAAMa,KAAK,GAAGzC,eAAe,CAC3B4B,KAAK,EACL,YAAY,EACZ,EAAE,EACFG,GAAG,IAAIhB,MAAM,CAACgB,GAAG,CAAC,CAACW,KAAK,CAAC,EAAE,CAAC,EAC5BX,GAAG,IAAIA,GAAG,CAACY,IAAI,CAAC,EAAE,CAAC,CACpB;IACD,MAAM;MAAEC;IAAE,CAAC,GAAG7C,SAAS,EAAE;IAEzB,MAAM8C,MAAM,GAAG5C,QAAQ,CAAC,MAAM6C,KAAK,CAACzB,MAAM,CAACO,KAAK,CAACR,MAAM,CAAC,CAAC,CAAC2B,IAAI,CAAC,CAAC,CAAC,CAAC;IAClE,MAAMC,UAAU,GAAG9C,GAAG,CAAC,CAAC,CAAC,CAAC;IAC1B,MAAM+C,UAAU,GAAG/C,GAAG,EAAe;IACrC,MAAMgD,QAAQ,GAAGhD,GAAG,CAAqB,EAAE,CAAC;IAC5C,MAAMiD,OAAO,GAAGlD,QAAQ,CAAC,MAAMiD,QAAQ,CAACE,KAAK,CAACJ,UAAU,CAACI,KAAK,CAAC,CAAC;IAEhE,SAASC,OAAOA,CAAA,EAAI;MAClB,MAAMC,KAAK,GAAGb,KAAK,CAACW,KAAK,CAACG,KAAK,EAAE;MACjC,MAAMH,KAAK,GAAGD,OAAO,CAACC,KAAK,CAACA,KAAK;MAEjCE,KAAK,CAACN,UAAU,CAACI,KAAK,CAAC,GAAGA,KAAK;MAE/BX,KAAK,CAACW,KAAK,GAAGE,KAAK;MAEnB,IAAIE,MAAW,GAAG,IAAI;MAEtB,IAAIR,UAAU,CAACI,KAAK,GAAGX,KAAK,CAACW,KAAK,CAAChC,MAAM,EAAE;QACzCoC,MAAM,GAAGf,KAAK,CAACW,KAAK,CAAChC,MAAM,GAAG,CAAC;MACjC,CAAC,MAAM,IAAI4B,UAAU,CAACI,KAAK,GAAG,CAAC,KAAK/B,MAAM,CAACO,KAAK,CAACR,MAAM,CAAC,EAAE;QACxDoC,MAAM,GAAG,MAAM;MACjB,CAAC,MAAM;QACLC,qBAAqB,CAAC,MAAMN,OAAO,CAACC,KAAK,EAAEZ,IAAI,EAAE,CAAC;MACpD;MAEA,IAAIgB,MAAM,EAAEnD,UAAU,CAAC4C,UAAU,CAACG,KAAK,EAAGI,MAAM,CAAC;IACnD;IAEA,SAASE,SAASA,CAAEC,CAAgB,EAAE;MACpC,MAAML,KAAK,GAAGb,KAAK,CAACW,KAAK,CAACG,KAAK,EAAE;MACjC,MAAMK,KAAK,GAAGZ,UAAU,CAACI,KAAK;MAC9B,IAAII,MAA0D,GAAG,IAAI;MAErE,IAAI,CAAC,CACH,WAAW,EACX,YAAY,EACZ,WAAW,EACX,QAAQ,CACT,CAACK,QAAQ,CAACF,CAAC,CAACG,GAAG,CAAC,EAAE;MAEnBH,CAAC,CAACI,cAAc,EAAE;MAElB,IAAIJ,CAAC,CAACG,GAAG,KAAK,WAAW,EAAE;QACzBN,MAAM,GAAG,MAAM;MACjB,CAAC,MAAM,IAAIG,CAAC,CAACG,GAAG,KAAK,YAAY,EAAE;QACjCN,MAAM,GAAG,MAAM;MACjB,CAAC,MAAM,IAAI,CAAC,WAAW,EAAE,QAAQ,CAAC,CAACK,QAAQ,CAACF,CAAC,CAACG,GAAG,CAAC,EAAE;QAClDR,KAAK,CAACN,UAAU,CAACI,KAAK,CAAC,GAAG,EAAE;QAE5BX,KAAK,CAACW,KAAK,GAAGE,KAAK;QAEnB,IAAIN,UAAU,CAACI,KAAK,GAAG,CAAC,IAAIO,CAAC,CAACG,GAAG,KAAK,WAAW,EAAE;UACjDN,MAAM,GAAG,MAAM;QACjB,CAAC,MAAM;UACLC,qBAAqB,CAAC,MAAM;YAC1BP,QAAQ,CAACE,KAAK,CAACQ,KAAK,CAAC,CAACI,MAAM,EAAE;UAChC,CAAC,CAAC;QACJ;MACF;MAEAP,qBAAqB,CAAC,MAAM;QAC1B,IAAID,MAAM,IAAI,IAAI,EAAE;UAClBnD,UAAU,CAAC4C,UAAU,CAACG,KAAK,EAAGI,MAAM,CAAC;QACvC;MACF,CAAC,CAAC;IACJ;IAEA,SAASS,OAAOA,CAAEL,KAAa,EAAED,CAAiB,EAAE;MAClDA,CAAC,CAACI,cAAc,EAAE;MAClBJ,CAAC,CAACO,eAAe,EAAE;MAEnBzB,KAAK,CAACW,KAAK,GAAG,CAACO,CAAC,EAAEQ,aAAa,EAAEC,OAAO,CAAC,MAAM,CAAC,IAAI,EAAE,EAAE1B,KAAK,CAAC,EAAE,CAAC;MAEjEQ,QAAQ,CAACE,KAAK,GAAGQ,KAAK,CAAC,CAACpB,IAAI,EAAE;IAChC;IAEA,SAAS6B,KAAKA,CAAA,EAAI;MAChB5B,KAAK,CAACW,KAAK,GAAG,EAAE;IAClB;IAEA,SAASkB,OAAOA,CAAEX,CAAa,EAAEC,KAAa,EAAE;MAC9CrB,KAAK,EAAE;MAEPS,UAAU,CAACI,KAAK,GAAGQ,KAAK;IAC1B;IAEA,SAASW,MAAMA,CAAA,EAAI;MACjB/B,IAAI,EAAE;MAENQ,UAAU,CAACI,KAAK,GAAG,CAAC,CAAC;IACvB;IAEA1D,eAAe,CAAC;MACdH,MAAM,EAAE;QACNiF,QAAQ,EAAEvE,QAAQ,CAAC,MAAM2B,KAAK,CAAC4C,QAAQ,CAAC;QACxCC,KAAK,EAAExE,QAAQ,CAAC,MAAM2B,KAAK,CAAC6C,KAAK,CAAC;QAClChD,OAAO,EAAExB,QAAQ,CAAC,MAAM2B,KAAK,CAACH,OAAO;MACvC;IACF,CAAC,EAAE;MAAEiD,MAAM,EAAE;IAAK,CAAC,CAAC;IAEpBvE,KAAK,CAACsC,KAAK,EAAEV,GAAG,IAAI;MAClB,IAAIA,GAAG,CAACX,MAAM,KAAKC,MAAM,CAACO,KAAK,CAACR,MAAM,CAAC,EAAEe,IAAI,CAAC,QAAQ,EAAEJ,GAAG,CAACY,IAAI,CAAC,EAAE,CAAC,CAAC;IACvE,CAAC,EAAE;MAAEgC,IAAI,EAAE;IAAK,CAAC,CAAC;IAElBxE,KAAK,CAAC6C,UAAU,EAAEjB,GAAG,IAAI;MACvB,IAAIA,GAAG,GAAG,CAAC,EAAE;MAEbxB,UAAU,IAAIqE,MAAM,CAACnB,qBAAqB,CAAC,MAAM;QAC/CP,QAAQ,CAACE,KAAK,CAACrB,GAAG,CAAC,CAACiC,MAAM,EAAE;MAC9B,CAAC,CAAC;IACJ,CAAC,CAAC;IAEFtD,SAAS,CAAC,MAAM;MACd,MAAM,CAACmE,SAAS,EAAEC,UAAU,CAAC,GAAG1E,gBAAgB,CAAC8B,KAAK,CAAC;MAEvD,OAAA6C,YAAA,QAAAC,WAAA;QAAA,SAEW,CACL,aAAa,EACb;UACE,sBAAsB,EAAE,CAAC,CAACpD,KAAK,CAACd;QAClC,CAAC,EACDc,KAAK,CAACqD,KAAK,CACZ;QAAA,SACM,CACLrD,KAAK,CAACsD,KAAK;MACZ,GACIL,SAAS,IAAAE,YAAA;QAAA,OAGN9B,UAAU;QAAA,SACV,sBAAsB;QAAA,SACrB,CACLZ,eAAe,CAACe,KAAK;MACtB,IAECP,MAAM,CAACO,KAAK,CAAC+B,GAAG,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAAN,YAAA,CAAAO,SAAA,SAElB1D,KAAK,CAACd,OAAO,IAAIuE,CAAC,KAAK,CAAC,IAAAN,YAAA;QAAA,SACZ;MAAsB,IAAGnD,KAAK,CAACd,OAAO,EACnD,EAAAiE,YAAA,CAAAxF,MAAA;QAAA,WAGY+C,SAAS,CAACc,KAAK,IAAIxB,KAAK,CAACZ,QAAQ,IAAKgC,UAAU,CAACI,KAAK,KAAKiC,CAAC;QAAA,OACjEA;MAAC;QAGL,GAAGjD,KAAK;QACRjB,OAAO,EAAEA,CAAA,KAAM;UACb,OAAA4D,YAAA;YAAA,OAEUhD,GAAG,IAAImB,QAAQ,CAACE,KAAK,CAACiC,CAAC,CAAC,GAAGtD,GAAuB;YAAA,cAC3Ca,CAAC,CAAChB,KAAK,CAACX,KAAK,EAAEoE,CAAC,GAAG,CAAC,CAAC;YAAA,aACtBA,CAAC,KAAK,CAAC,IAAIzD,KAAK,CAAChB,SAAS;YAAA,gBACzB,eAAe;YAAA,SACrB,CACL,oBAAoB,CACrB;YAAA,aACS,MAAM;YAAA,OACVgB,KAAK,CAACV,IAAI,KAAK,QAAQ,GAAG,CAAC,GAAGK,SAAS;YAAA,aACnC,GAAG;YAAA,eACCK,KAAK,CAACJ,WAAW;YAAA,QACxBI,KAAK,CAACV,IAAI;YAAA,SACTuB,KAAK,CAACW,KAAK,CAACiC,CAAC,CAAC;YAAA,WACZhC,OAAO;YAAA,WACPM,CAAC,IAAIW,OAAO,CAACX,CAAC,EAAE0B,CAAC,CAAC;YAAA,UACnBd,MAAM;YAAA,aACHb,SAAS;YAAA,WACX6B,KAAK,IAAItB,OAAO,CAACoB,CAAC,EAAEE,KAAK;UAAC;QAG1C;MAAC,IAIR,CAAC,EAAAR,YAAA,UAAAC,WAAA;QAAA,SAGM,mBAAmB;QAAA,QACpB;MAAQ,GACRF,UAAU;QAAA,SACPrC,KAAK,CAACW,KAAK,CAACT,IAAI,CAAC,EAAE;MAAC,WAAAoC,YAAA,CAAAvF,QAAA;QAAA;QAAA,iBAKd,qBAAqB;QAAA,eACrB,CAAC,CAACoC,KAAK,CAAC4D,OAAO;QAAA;MAAA;QAAArE,OAAA,EAAAA,CAAA,MAG3BiB,KAAK,CAACqD,MAAM,IAAI,IAAAV,YAAA,CAAAtF,iBAAA;UAAA,SAEN,OAAOmC,KAAK,CAAC4D,OAAO,KAAK,SAAS,GAAGjE,SAAS,GAAGK,KAAK,CAAC4D,OAAO;UAAA;UAAA,QAEjE,IAAI;UAAA,SACH;QAAG,QAEZ;MAAA,IAGDpD,KAAK,CAACjB,OAAO,IAAI;IAI3B,CAAC,CAAC;IAEF,OAAO;MACLqB,IAAI,EAAEA,CAAA,KAAM;QACVU,QAAQ,CAACE,KAAK,EAAEsC,IAAI,CAACC,KAAK,IAAIA,KAAK,CAACnD,IAAI,EAAE,CAAC;MAC7C,CAAC;MACDD,KAAK,EAAEA,CAAA,KAAM;QACXW,QAAQ,CAACE,KAAK,GAAG,CAAC,CAAC,CAACb,KAAK,EAAE;MAC7B,CAAC;MACD8B,KAAK;MACL/B;IACF,CAAC;EACH;AACF,CAAC,CAAC"}
+{"version":3,"file":"VOtpInput.mjs","names":["makeVFieldProps","VField","VOverlay","VProgressCircular","provideDefaults","makeDimensionProps","useDimension","makeFocusProps","useFocus","useLocale","useProxiedModel","computed","ref","watch","filterInputAttrs","focusChild","genericComponent","IN_BROWSER","only","propsFactory","useRender","makeVOtpInputProps","autofocus","Boolean","divider","String","focusAll","label","type","default","length","Number","modelValue","undefined","placeholder","variant","VOtpInput","name","props","emits","finish","val","setup","_ref","attrs","emit","slots","dimensionStyles","isFocused","focus","blur","model","split","join","t","fields","Array","fill","focusIndex","contentRef","inputRef","current","value","onInput","array","slice","target","requestAnimationFrame","onKeydown","e","index","includes","key","preventDefault","select","onPaste","stopPropagation","clipboardData","getData","reset","onFocus","onBlur","color","bgColor","baseColor","disabled","error","scoped","deep","window","rootAttrs","inputAttrs","_createVNode","_mergeProps","class","style","map","_","i","_Fragment","event","loading","loader","some","input"],"sources":["../../../src/labs/VOtpInput/VOtpInput.tsx"],"sourcesContent":["// Styles\nimport './VOtpInput.sass'\n\n// Components\nimport { makeVFieldProps, VField } from '@/components/VField/VField'\nimport { VOverlay } from '@/components/VOverlay/VOverlay'\nimport { VProgressCircular } from '@/components/VProgressCircular/VProgressCircular'\n\n// Composables\nimport { provideDefaults } from '@/composables/defaults'\nimport { makeDimensionProps, useDimension } from '@/composables/dimensions'\nimport { makeFocusProps, useFocus } from '@/composables/focus'\nimport { useLocale } from '@/composables/locale'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { computed, ref, watch } from 'vue'\nimport { filterInputAttrs, focusChild, genericComponent, IN_BROWSER, only, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\n\n// Types\nexport type VOtpInputSlots = {\n  default: never\n  loader: never\n}\n\nexport const makeVOtpInputProps = propsFactory({\n  autofocus: Boolean,\n  divider: String,\n  focusAll: Boolean,\n  label: {\n    type: String,\n    default: '$vuetify.input.otp',\n  },\n  length: {\n    type: [Number, String],\n    default: 6,\n  },\n  modelValue: {\n    type: [Number, String],\n    default: undefined,\n  },\n  placeholder: String,\n  type: {\n    type: String as PropType<'text' | 'password' | 'number'>,\n    default: 'number',\n  },\n\n  ...makeDimensionProps(),\n  ...makeFocusProps(),\n  ...only(makeVFieldProps({\n    variant: 'outlined' as const,\n  }), [\n    'baseColor',\n    'bgColor',\n    'class',\n    'color',\n    'disabled',\n    'error',\n    'loading',\n    'rounded',\n    'style',\n    'theme',\n    'variant',\n  ]),\n}, 'VOtpInput')\n\nexport const VOtpInput = genericComponent<VOtpInputSlots>()({\n  name: 'VOtpInput',\n\n  props: makeVOtpInputProps(),\n\n  emits: {\n    finish: (val: string) => true,\n    'update:focused': (val: boolean) => true,\n    'update:modelValue': (val: string) => true,\n  },\n\n  setup (props, { attrs, emit, slots }) {\n    const { dimensionStyles } = useDimension(props)\n    const { isFocused, focus, blur } = useFocus(props)\n    const model = useProxiedModel(\n      props,\n      'modelValue',\n      '',\n      val => String(val).split(''),\n      val => val.join('')\n    )\n    const { t } = useLocale()\n\n    const fields = computed(() => Array(Number(props.length)).fill(0))\n    const focusIndex = ref(-1)\n    const contentRef = ref<HTMLElement>()\n    const inputRef = ref<HTMLInputElement[]>([])\n    const current = computed(() => inputRef.value[focusIndex.value])\n\n    function onInput () {\n      const array = model.value.slice()\n      const value = current.value.value\n\n      array[focusIndex.value] = value\n\n      model.value = array\n\n      let target: any = null\n\n      if (focusIndex.value > model.value.length) {\n        target = model.value.length\n      } else if (focusIndex.value + 1 !== Number(props.length)) {\n        target = 'next'\n      } else {\n        requestAnimationFrame(() => current.value?.blur())\n      }\n\n      if (target) focusChild(contentRef.value!, target)\n    }\n\n    function onKeydown (e: KeyboardEvent) {\n      const array = model.value.slice()\n      const index = focusIndex.value\n      let target: 'next' | 'prev' | 'first' | 'last' | number | null = null\n\n      if (![\n        'ArrowLeft',\n        'ArrowRight',\n        'Backspace',\n        'Delete',\n      ].includes(e.key)) return\n\n      e.preventDefault()\n\n      if (e.key === 'ArrowLeft') {\n        target = 'prev'\n      } else if (e.key === 'ArrowRight') {\n        target = 'next'\n      } else if (['Backspace', 'Delete'].includes(e.key)) {\n        array[focusIndex.value] = ''\n\n        model.value = array\n\n        if (focusIndex.value > 0 && e.key === 'Backspace') {\n          target = 'prev'\n        } else {\n          requestAnimationFrame(() => {\n            inputRef.value[index]?.select()\n          })\n        }\n      }\n\n      requestAnimationFrame(() => {\n        if (target != null) {\n          focusChild(contentRef.value!, target)\n        }\n      })\n    }\n\n    function onPaste (index: number, e: ClipboardEvent) {\n      e.preventDefault()\n      e.stopPropagation()\n\n      model.value = (e?.clipboardData?.getData('Text') ?? '').split('')\n\n      inputRef.value?.[index].blur()\n    }\n\n    function reset () {\n      model.value = []\n    }\n\n    function onFocus (e: FocusEvent, index: number) {\n      focus()\n\n      focusIndex.value = index\n    }\n\n    function onBlur () {\n      blur()\n\n      focusIndex.value = -1\n    }\n\n    provideDefaults({\n      VField: {\n        color: computed(() => props.color),\n        bgColor: computed(() => props.color),\n        baseColor: computed(() => props.baseColor),\n        disabled: computed(() => props.disabled),\n        error: computed(() => props.error),\n        variant: computed(() => props.variant),\n      },\n    }, { scoped: true })\n\n    watch(model, val => {\n      if (val.length === Number(props.length)) emit('finish', val.join(''))\n    }, { deep: true })\n\n    watch(focusIndex, val => {\n      if (val < 0) return\n\n      IN_BROWSER && window.requestAnimationFrame(() => {\n        inputRef.value[val]?.select()\n      })\n    })\n\n    useRender(() => {\n      const [rootAttrs, inputAttrs] = filterInputAttrs(attrs)\n\n      return (\n        <div\n          class={[\n            'v-otp-input',\n            {\n              'v-otp-input--divided': !!props.divider,\n            },\n            props.class,\n          ]}\n          style={[\n            props.style,\n          ]}\n          { ...rootAttrs }\n        >\n          <div\n            ref={ contentRef }\n            class=\"v-otp-input__content\"\n            style={[\n              dimensionStyles.value,\n            ]}\n          >\n            { fields.value.map((_, i) => (\n              <>\n                { props.divider && i !== 0 && (\n                  <span class=\"v-otp-input__divider\">{ props.divider }</span>\n                )}\n\n                <VField\n                  focused={ (isFocused.value && props.focusAll) || focusIndex.value === i }\n                  key={ i }\n                >\n                  {{\n                    ...slots,\n                    default: () => {\n                      return (\n                        <input\n                          ref={ val => inputRef.value[i] = val as HTMLInputElement }\n                          aria-label={ t(props.label, i + 1) }\n                          autofocus={ i === 0 && props.autofocus }\n                          autocomplete=\"one-time-code\"\n                          class={[\n                            'v-otp-input__field',\n                          ]}\n                          inputmode=\"text\"\n                          min={ props.type === 'number' ? 0 : undefined }\n                          maxlength=\"1\"\n                          placeholder={ props.placeholder }\n                          type={ props.type }\n                          value={ model.value[i] }\n                          onInput={ onInput }\n                          onFocus={ e => onFocus(e, i) }\n                          onBlur={ onBlur }\n                          onKeydown={ onKeydown }\n                          onPaste={ event => onPaste(i, event) }\n                        />\n                      )\n                    },\n                  }}\n                </VField>\n              </>\n            ))}\n\n            <input\n              class=\"v-otp-input-input\"\n              type=\"hidden\"\n              { ...inputAttrs }\n              value={ model.value.join('') }\n            />\n\n            <VOverlay\n              contained\n              content-class=\"v-otp-input__loader\"\n              model-value={ !!props.loading }\n              persistent\n            >\n              { slots.loader?.() ?? (\n                <VProgressCircular\n                  color={ typeof props.loading === 'boolean' ? undefined : props.loading }\n                  indeterminate\n                  size=\"24\"\n                  width=\"2\"\n                />\n              )}\n            </VOverlay>\n\n            { slots.default?.() }\n          </div>\n        </div>\n      )\n    })\n\n    return {\n      blur: () => {\n        inputRef.value?.some(input => input.blur())\n      },\n      focus: () => {\n        inputRef.value?.[0].focus()\n      },\n      reset,\n      isFocused,\n    }\n  },\n})\n\nexport type VOtpInput = InstanceType<typeof VOtpInput>\n"],"mappings":"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"}

package/lib/labs/VOtpInput/VOtpInput.sass

@@ -9,31 +9,32 @@
   align-items: center
   display: flex
   justify-content: center
-  padding: .5rem
+  padding: $otp-input-padding
   position: relative
 
   .v-field
     height: 100%
-    margin: 0 .25rem
 
 .v-otp-input__divider
-  margin: 0 8px
+  margin: $otp-input-divider-margin
 
 .v-otp-input__content
   align-items: center
   display: flex
-  height: 64px
-  padding: .5rem
+  gap: $otp-input-content-gap
+  height: $otp-input-content-height
+  padding: $otp-input-content-padding
   justify-content: center
-  max-width: 320px
+  max-width: $otp-input-content-max-width
   position: relative
   border-radius: inherit
 
   .v-otp-input--divided &
-    max-width: 360px
+    max-width: $otp-input-divided-content-max-width
 
 .v-otp-input__field
-  font-size: 1.25rem
+  color: inherit
+  font-size: $otp-input-field-font-size
   height: 100%
   outline: none
   text-align: center

package/lib/labs/VOtpInput/_variables.scss

@@ -1,2 +1,11 @@
 @use '../../styles/settings';
 @use '../../styles/tools';
+
+$otp-input-content-gap: .5rem !default;
+$otp-input-content-height: 64px !default;
+$otp-input-content-max-width: 320px !default;
+$otp-input-content-padding: .5rem !default;
+$otp-input-divided-content-max-width: 360px !default;
+$otp-input-divider-margin: 0 8px !default;
+$otp-input-field-font-size: 1.25rem !default;
+$otp-input-padding: .5rem 0 !default;

package/lib/labs/VSkeletonLoader/VSkeletonLoader.css

@@ -10,12 +10,16 @@
 .v-skeleton-loader__actions {
   justify-content: end;
 }
+.v-skeleton-loader .v-skeleton-loader__ossein {
+  height: 100%;
+}
 .v-skeleton-loader .v-skeleton-loader__avatar,
 .v-skeleton-loader .v-skeleton-loader__button,
 .v-skeleton-loader .v-skeleton-loader__chip,
 .v-skeleton-loader .v-skeleton-loader__divider,
 .v-skeleton-loader .v-skeleton-loader__heading,
 .v-skeleton-loader .v-skeleton-loader__image,
+.v-skeleton-loader .v-skeleton-loader__ossein,
 .v-skeleton-loader .v-skeleton-loader__text {
   background: rgba(var(--v-theme-on-surface), var(--v-border-opacity));
 }

package/lib/labs/VSkeletonLoader/VSkeletonLoader.mjs

@@ -30,6 +30,7 @@ export const rootTypes = {
   'list-item-avatar-two-line': 'avatar, sentences',
   'list-item-three-line': 'paragraph',
   'list-item-avatar-three-line': 'avatar, paragraph',
+  ossein: 'ossein',
   paragraph: 'text@3',
   sentences: 'text@2',
   subtitle: 'text',
@@ -94,7 +95,7 @@ export const makeVSkeletonLoaderProps = propsFactory({
   },
   type: {
     type: [String, Array],
-    default: 'image'
+    default: 'ossein'
   },
   ...makeDimensionProps(),
   ...makeElevationProps(),

package/lib/labs/VSkeletonLoader/VSkeletonLoader.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VSkeletonLoader.mjs","names":["useBackgroundColor","makeDimensionProps","useDimension","makeElevationProps","useElevation","useLocale","makeThemeProps","provideTheme","computed","toRef","genericComponent","propsFactory","useRender","wrapInArray","rootTypes","actions","article","avatar","button","card","chip","divider","heading","image","paragraph","sentences","subtitle","table","text","genBone","type","children","arguments","length","undefined","_createVNode","genBones","bone","split","Array","from","map","genStructure","includes","mapBones","push","bones","replace","makeVSkeletonLoaderProps","boilerplate","Boolean","color","String","loading","loadingText","default","VSkeletonLoader","name","props","setup","_ref","slots","backgroundColorClasses","backgroundColorStyles","dimensionStyles","elevationClasses","themeClasses","t","items","join","isLoading","value"],"sources":["../../../src/labs/VSkeletonLoader/VSkeletonLoader.tsx"],"sourcesContent":["// Styles\nimport './VSkeletonLoader.sass'\n\n// Composables\nimport { useBackgroundColor } from '@/composables/color'\nimport { makeDimensionProps, useDimension } from '@/composables/dimensions'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { useLocale } from '@/composables/locale'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\n\n// Utilities\nimport { computed, toRef } from 'vue'\nimport { genericComponent, propsFactory, useRender, wrapInArray } from '@/util'\n\n// Types\nimport type { PropType, VNode } from 'vue'\n\ntype VSkeletonBone<T> = T | VSkeletonBone<T>[]\n\nexport type VSkeletonBones = VSkeletonBone<VNode>\nexport type VSkeletonLoaderType = keyof typeof rootTypes\n\nexport const rootTypes = {\n  actions: 'button@2',\n  article: 'heading, paragraph',\n  avatar: 'avatar',\n  button: 'button',\n  card: 'image, heading',\n  'card-avatar': 'image, list-item-avatar',\n  chip: 'chip',\n  'date-picker': 'list-item, heading, divider, date-picker-options, date-picker-days, actions',\n  'date-picker-options': 'text, avatar@2',\n  'date-picker-days': 'avatar@28',\n  divider: 'divider',\n  heading: 'heading',\n  image: 'image',\n  'list-item': 'text',\n  'list-item-avatar': 'avatar, text',\n  'list-item-two-line': 'sentences',\n  'list-item-avatar-two-line': 'avatar, sentences',\n  'list-item-three-line': 'paragraph',\n  'list-item-avatar-three-line': 'avatar, paragraph',\n  paragraph: 'text@3',\n  sentences: 'text@2',\n  subtitle: 'text',\n  table: 'table-heading, table-thead, table-tbody, table-tfoot',\n  'table-heading': 'chip, text',\n  'table-thead': 'heading@6',\n  'table-tbody': 'table-row-divider@6',\n  'table-row-divider': 'table-row, divider',\n  'table-row': 'text@6',\n  'table-tfoot': 'text@2, avatar@2',\n  text: 'text',\n} as const\n\nfunction genBone (type: string, children: VSkeletonBones = []) {\n  return (\n    <div\n      class={[\n        'v-skeleton-loader__bone',\n        `v-skeleton-loader__${type}`,\n      ]}\n    >\n      { children }\n    </div>\n  )\n}\n\nfunction genBones (bone: string) {\n  // e.g. 'text@3'\n  const [type, length] = bone.split('@') as [VSkeletonLoaderType, number]\n\n  // Generate a length array based upon\n  // value after @ in the bone string\n  return Array.from({ length }).map(() => genStructure(type))\n}\n\nfunction genStructure (type?: string): VSkeletonBones {\n  let children: VSkeletonBones = []\n\n  if (!type) return children\n\n  // TODO: figure out a better way to type this\n  const bone = (rootTypes as Record<string, string>)[type]\n\n  // End of recursion, do nothing\n  /* eslint-disable-next-line no-empty, brace-style */\n  if (type === bone) {}\n  // Array of values - e.g. 'heading, paragraph, text@2'\n  else if (type.includes(',')) return mapBones(type)\n  // Array of values - e.g. 'paragraph@4'\n  else if (type.includes('@')) return genBones(type)\n  // Array of values - e.g. 'card@2'\n  else if (bone.includes(',')) children = mapBones(bone)\n  // Array of values - e.g. 'list-item@2'\n  else if (bone.includes('@')) children = genBones(bone)\n  // Single value - e.g. 'card-heading'\n  else if (bone) children.push(genStructure(bone))\n\n  return [genBone(type, children)]\n}\n\nfunction mapBones (bones: string) {\n  // Remove spaces and return array of structures\n  return bones.replace(/\\s/g, '').split(',').map(genStructure)\n}\n\nexport const makeVSkeletonLoaderProps = propsFactory({\n  boilerplate: Boolean,\n  color: String,\n  loading: Boolean,\n  loadingText: {\n    type: String,\n    default: '$vuetify.loading',\n  },\n  type: {\n    type: [String, Array] as PropType<\n      | VSkeletonLoaderType | (string & {})\n      | ReadonlyArray<VSkeletonLoaderType | (string & {})>\n    >,\n    default: 'image',\n  },\n\n  ...makeDimensionProps(),\n  ...makeElevationProps(),\n  ...makeThemeProps(),\n}, 'VSkeletonLoader')\n\nexport const VSkeletonLoader = genericComponent()({\n  name: 'VSkeletonLoader',\n\n  props: makeVSkeletonLoaderProps(),\n\n  setup (props, { slots }) {\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(toRef(props, 'color'))\n    const { dimensionStyles } = useDimension(props)\n    const { elevationClasses } = useElevation(props)\n    const { themeClasses } = provideTheme(props)\n    const { t } = useLocale()\n\n    const items = computed(() => genStructure(wrapInArray(props.type).join(',')))\n\n    useRender(() => {\n      const isLoading = !slots.default || props.loading\n\n      return (\n        <div\n          class={[\n            'v-skeleton-loader',\n            {\n              'v-skeleton-loader--boilerplate': props.boilerplate,\n            },\n            themeClasses.value,\n            backgroundColorClasses.value,\n            elevationClasses.value,\n          ]}\n          style={[\n            backgroundColorStyles.value,\n            isLoading ? dimensionStyles.value : {},\n          ]}\n          aria-busy={ !props.boilerplate ? isLoading : undefined }\n          aria-live={ !props.boilerplate ? 'polite' : undefined }\n          aria-label={ !props.boilerplate ? t(props.loadingText) : undefined }\n          role={ !props.boilerplate ? 'alert' : undefined }\n        >\n          { isLoading ? items.value : slots.default?.() }\n        </div>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VSkeletonLoader = InstanceType<typeof VSkeletonLoader>\n"],"mappings":"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"}
+{"version":3,"file":"VSkeletonLoader.mjs","names":["useBackgroundColor","makeDimensionProps","useDimension","makeElevationProps","useElevation","useLocale","makeThemeProps","provideTheme","computed","toRef","genericComponent","propsFactory","useRender","wrapInArray","rootTypes","actions","article","avatar","button","card","chip","divider","heading","image","ossein","paragraph","sentences","subtitle","table","text","genBone","type","children","arguments","length","undefined","_createVNode","genBones","bone","split","Array","from","map","genStructure","includes","mapBones","push","bones","replace","makeVSkeletonLoaderProps","boilerplate","Boolean","color","String","loading","loadingText","default","VSkeletonLoader","name","props","setup","_ref","slots","backgroundColorClasses","backgroundColorStyles","dimensionStyles","elevationClasses","themeClasses","t","items","join","isLoading","value"],"sources":["../../../src/labs/VSkeletonLoader/VSkeletonLoader.tsx"],"sourcesContent":["// Styles\nimport './VSkeletonLoader.sass'\n\n// Composables\nimport { useBackgroundColor } from '@/composables/color'\nimport { makeDimensionProps, useDimension } from '@/composables/dimensions'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { useLocale } from '@/composables/locale'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\n\n// Utilities\nimport { computed, toRef } from 'vue'\nimport { genericComponent, propsFactory, useRender, wrapInArray } from '@/util'\n\n// Types\nimport type { PropType, VNode } from 'vue'\n\ntype VSkeletonBone<T> = T | VSkeletonBone<T>[]\n\nexport type VSkeletonBones = VSkeletonBone<VNode>\nexport type VSkeletonLoaderType = keyof typeof rootTypes\n\nexport const rootTypes = {\n  actions: 'button@2',\n  article: 'heading, paragraph',\n  avatar: 'avatar',\n  button: 'button',\n  card: 'image, heading',\n  'card-avatar': 'image, list-item-avatar',\n  chip: 'chip',\n  'date-picker': 'list-item, heading, divider, date-picker-options, date-picker-days, actions',\n  'date-picker-options': 'text, avatar@2',\n  'date-picker-days': 'avatar@28',\n  divider: 'divider',\n  heading: 'heading',\n  image: 'image',\n  'list-item': 'text',\n  'list-item-avatar': 'avatar, text',\n  'list-item-two-line': 'sentences',\n  'list-item-avatar-two-line': 'avatar, sentences',\n  'list-item-three-line': 'paragraph',\n  'list-item-avatar-three-line': 'avatar, paragraph',\n  ossein: 'ossein',\n  paragraph: 'text@3',\n  sentences: 'text@2',\n  subtitle: 'text',\n  table: 'table-heading, table-thead, table-tbody, table-tfoot',\n  'table-heading': 'chip, text',\n  'table-thead': 'heading@6',\n  'table-tbody': 'table-row-divider@6',\n  'table-row-divider': 'table-row, divider',\n  'table-row': 'text@6',\n  'table-tfoot': 'text@2, avatar@2',\n  text: 'text',\n} as const\n\nfunction genBone (type: string, children: VSkeletonBones = []) {\n  return (\n    <div\n      class={[\n        'v-skeleton-loader__bone',\n        `v-skeleton-loader__${type}`,\n      ]}\n    >\n      { children }\n    </div>\n  )\n}\n\nfunction genBones (bone: string) {\n  // e.g. 'text@3'\n  const [type, length] = bone.split('@') as [VSkeletonLoaderType, number]\n\n  // Generate a length array based upon\n  // value after @ in the bone string\n  return Array.from({ length }).map(() => genStructure(type))\n}\n\nfunction genStructure (type?: string): VSkeletonBones {\n  let children: VSkeletonBones = []\n\n  if (!type) return children\n\n  // TODO: figure out a better way to type this\n  const bone = (rootTypes as Record<string, string>)[type]\n\n  // End of recursion, do nothing\n  /* eslint-disable-next-line no-empty, brace-style */\n  if (type === bone) {}\n  // Array of values - e.g. 'heading, paragraph, text@2'\n  else if (type.includes(',')) return mapBones(type)\n  // Array of values - e.g. 'paragraph@4'\n  else if (type.includes('@')) return genBones(type)\n  // Array of values - e.g. 'card@2'\n  else if (bone.includes(',')) children = mapBones(bone)\n  // Array of values - e.g. 'list-item@2'\n  else if (bone.includes('@')) children = genBones(bone)\n  // Single value - e.g. 'card-heading'\n  else if (bone) children.push(genStructure(bone))\n\n  return [genBone(type, children)]\n}\n\nfunction mapBones (bones: string) {\n  // Remove spaces and return array of structures\n  return bones.replace(/\\s/g, '').split(',').map(genStructure)\n}\n\nexport const makeVSkeletonLoaderProps = propsFactory({\n  boilerplate: Boolean,\n  color: String,\n  loading: Boolean,\n  loadingText: {\n    type: String,\n    default: '$vuetify.loading',\n  },\n  type: {\n    type: [String, Array] as PropType<\n      | VSkeletonLoaderType | (string & {})\n      | ReadonlyArray<VSkeletonLoaderType | (string & {})>\n    >,\n    default: 'ossein',\n  },\n\n  ...makeDimensionProps(),\n  ...makeElevationProps(),\n  ...makeThemeProps(),\n}, 'VSkeletonLoader')\n\nexport const VSkeletonLoader = genericComponent()({\n  name: 'VSkeletonLoader',\n\n  props: makeVSkeletonLoaderProps(),\n\n  setup (props, { slots }) {\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(toRef(props, 'color'))\n    const { dimensionStyles } = useDimension(props)\n    const { elevationClasses } = useElevation(props)\n    const { themeClasses } = provideTheme(props)\n    const { t } = useLocale()\n\n    const items = computed(() => genStructure(wrapInArray(props.type).join(',')))\n\n    useRender(() => {\n      const isLoading = !slots.default || props.loading\n\n      return (\n        <div\n          class={[\n            'v-skeleton-loader',\n            {\n              'v-skeleton-loader--boilerplate': props.boilerplate,\n            },\n            themeClasses.value,\n            backgroundColorClasses.value,\n            elevationClasses.value,\n          ]}\n          style={[\n            backgroundColorStyles.value,\n            isLoading ? dimensionStyles.value : {},\n          ]}\n          aria-busy={ !props.boilerplate ? isLoading : undefined }\n          aria-live={ !props.boilerplate ? 'polite' : undefined }\n          aria-label={ !props.boilerplate ? t(props.loadingText) : undefined }\n          role={ !props.boilerplate ? 'alert' : undefined }\n        >\n          { isLoading ? items.value : slots.default?.() }\n        </div>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VSkeletonLoader = InstanceType<typeof VSkeletonLoader>\n"],"mappings":"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"}

package/lib/labs/VSkeletonLoader/VSkeletonLoader.sass

@@ -15,12 +15,16 @@
   &__actions
     justify-content: end
 
+  .v-skeleton-loader__ossein
+    height: 100%
+
   .v-skeleton-loader__avatar,
   .v-skeleton-loader__button,
   .v-skeleton-loader__chip,
   .v-skeleton-loader__divider,
   .v-skeleton-loader__heading,
   .v-skeleton-loader__image,
+  .v-skeleton-loader__ossein,
   .v-skeleton-loader__text
     background: $skeleton-loader-text-background