vuetify 3.6.0-alpha.2 → 3.6.0

package/lib/labs/VDateInput/VDateInput.mjs

@@ -0,0 +1,129 @@
+import { createVNode as _createVNode, mergeProps as _mergeProps } from "vue";
+// Components
+import { makeVDatePickerProps, VDatePicker } from "../../components/VDatePicker/VDatePicker.mjs";
+import { VMenu } from "../../components/VMenu/VMenu.mjs";
+import { makeVTextFieldProps, VTextField } from "../../components/VTextField/VTextField.mjs";
+import { makeVConfirmEditProps, VConfirmEdit } from "../VConfirmEdit/VConfirmEdit.mjs"; // Composables
+import { useDate } from "../../composables/date/index.mjs";
+import { makeFocusProps, useFocus } from "../../composables/focus.mjs";
+import { useLocale } from "../../composables/locale.mjs";
+import { useProxiedModel } from "../../composables/proxiedModel.mjs"; // Utilities
+import { computed, shallowRef } from 'vue';
+import { genericComponent, omit, propsFactory, useRender, wrapInArray } from "../../util/index.mjs"; // Types
+export const makeVDateInputProps = propsFactory({
+  hideActions: Boolean,
+  ...makeFocusProps(),
+  ...makeVConfirmEditProps(),
+  ...makeVTextFieldProps({
+    placeholder: 'mm/dd/yyyy',
+    prependIcon: '$calendar'
+  }),
+  ...omit(makeVDatePickerProps({
+    weeksInMonth: 'dynamic',
+    hideHeader: true
+  }), ['active'])
+}, 'VDateInput');
+export const VDateInput = genericComponent()({
+  name: 'VDateInput',
+  props: makeVDateInputProps(),
+  emits: {
+    'update:modelValue': val => true
+  },
+  setup(props, _ref) {
+    let {
+      slots
+    } = _ref;
+    const {
+      t
+    } = useLocale();
+    const adapter = useDate();
+    const {
+      isFocused,
+      focus,
+      blur
+    } = useFocus(props);
+    const model = useProxiedModel(props, 'modelValue', props.multiple ? [] : null);
+    const menu = shallowRef(false);
+    const display = computed(() => {
+      const value = wrapInArray(model.value);
+      if (!value.length) return null;
+      if (props.multiple === true) {
+        return t('$vuetify.datePicker.itemsSelected', value.length);
+      }
+      if (props.multiple === 'range') {
+        const start = value[0];
+        const end = value[value.length - 1];
+        return adapter.isValid(start) && adapter.isValid(end) ? `${adapter.format(start, 'keyboardDate')} - ${adapter.format(end, 'keyboardDate')}` : '';
+      }
+      return adapter.isValid(model.value) ? adapter.format(model.value, 'keyboardDate') : '';
+    });
+    function onKeydown(e) {
+      if (e.key !== 'Enter') return;
+      if (!menu.value || !isFocused.value) {
+        menu.value = true;
+        return;
+      }
+      const target = e.target;
+      model.value = adapter.date(target.value);
+    }
+    function onClick(e) {
+      e.preventDefault();
+      e.stopPropagation();
+      menu.value = true;
+    }
+    function onSave() {
+      menu.value = false;
+    }
+    useRender(() => {
+      const confirmEditProps = VConfirmEdit.filterProps(props);
+      const datePickerProps = VDatePicker.filterProps(omit(props, ['active']));
+      const textFieldProps = VTextField.filterProps(props);
+      return _createVNode(VTextField, _mergeProps(textFieldProps, {
+        "modelValue": display.value,
+        "onKeydown": onKeydown,
+        "focused": menu.value || isFocused.value,
+        "onFocus": focus,
+        "onBlur": blur,
+        "onClick:control": onClick,
+        "onClick:prepend": onClick
+      }), {
+        default: () => [_createVNode(VMenu, {
+          "modelValue": menu.value,
+          "onUpdate:modelValue": $event => menu.value = $event,
+          "activator": "parent",
+          "min-width": "0",
+          "closeOnContentClick": false,
+          "openOnClick": false
+        }, {
+          default: () => [_createVNode(VConfirmEdit, _mergeProps(confirmEditProps, {
+            "modelValue": model.value,
+            "onUpdate:modelValue": $event => model.value = $event,
+            "onSave": onSave
+          }), {
+            default: _ref2 => {
+              let {
+                actions,
+                model: proxyModel
+              } = _ref2;
+              return _createVNode(VDatePicker, _mergeProps(datePickerProps, {
+                "modelValue": props.hideActions ? model.value : proxyModel.value,
+                "onUpdate:modelValue": val => {
+                  if (!props.hideActions) {
+                    proxyModel.value = val;
+                  } else {
+                    model.value = val;
+                    if (!props.multiple) menu.value = false;
+                  }
+                },
+                "onMousedown": e => e.preventDefault()
+              }), {
+                actions: !props.hideActions ? () => actions : undefined
+              });
+            }
+          })]
+        }), slots.default?.()]
+      });
+    });
+  }
+});
+//# sourceMappingURL=VDateInput.mjs.map

package/lib/labs/VDateInput/VDateInput.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"VDateInput.mjs","names":["makeVDatePickerProps","VDatePicker","VMenu","makeVTextFieldProps","VTextField","makeVConfirmEditProps","VConfirmEdit","useDate","makeFocusProps","useFocus","useLocale","useProxiedModel","computed","shallowRef","genericComponent","omit","propsFactory","useRender","wrapInArray","makeVDateInputProps","hideActions","Boolean","placeholder","prependIcon","weeksInMonth","hideHeader","VDateInput","name","props","emits","val","setup","_ref","slots","t","adapter","isFocused","focus","blur","model","multiple","menu","display","value","length","start","end","isValid","format","onKeydown","e","key","target","date","onClick","preventDefault","stopPropagation","onSave","confirmEditProps","filterProps","datePickerProps","textFieldProps","_createVNode","_mergeProps","default","$event","_ref2","actions","proxyModel","undefined"],"sources":["../../../src/labs/VDateInput/VDateInput.tsx"],"sourcesContent":["// Components\nimport { makeVDatePickerProps, VDatePicker } from '@/components/VDatePicker/VDatePicker'\nimport { VMenu } from '@/components/VMenu/VMenu'\nimport { makeVTextFieldProps, VTextField } from '@/components/VTextField/VTextField'\nimport { makeVConfirmEditProps, VConfirmEdit } from '@/labs/VConfirmEdit/VConfirmEdit'\n\n// Composables\nimport { useDate } from '@/composables/date'\nimport { makeFocusProps, useFocus } from '@/composables/focus'\nimport { useLocale } from '@/composables/locale'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { computed, shallowRef } from 'vue'\nimport { genericComponent, omit, propsFactory, useRender, wrapInArray } from '@/util'\n\n// Types\nexport interface VDateInputSlots {\n  default: never\n}\n\nexport const makeVDateInputProps = propsFactory({\n  hideActions: Boolean,\n\n  ...makeFocusProps(),\n  ...makeVConfirmEditProps(),\n  ...makeVTextFieldProps({\n    placeholder: 'mm/dd/yyyy',\n    prependIcon: '$calendar',\n  }),\n  ...omit(makeVDatePickerProps({\n    weeksInMonth: 'dynamic' as const,\n    hideHeader: true,\n  }), ['active']),\n}, 'VDateInput')\n\nexport const VDateInput = genericComponent()({\n  name: 'VDateInput',\n\n  props: makeVDateInputProps(),\n\n  emits: {\n    'update:modelValue': (val: string) => true,\n  },\n\n  setup (props, { slots }) {\n    const { t } = useLocale()\n    const adapter = useDate()\n    const { isFocused, focus, blur } = useFocus(props)\n    const model = useProxiedModel(props, 'modelValue', props.multiple ? [] : null)\n    const menu = shallowRef(false)\n\n    const display = computed(() => {\n      const value = wrapInArray(model.value)\n\n      if (!value.length) return null\n\n      if (props.multiple === true) {\n        return t('$vuetify.datePicker.itemsSelected', value.length)\n      }\n\n      if (props.multiple === 'range') {\n        const start = value[0]\n        const end = value[value.length - 1]\n\n        return adapter.isValid(start) && adapter.isValid(end)\n          ? `${adapter.format(start, 'keyboardDate')} - ${adapter.format(end, 'keyboardDate')}`\n          : ''\n      }\n\n      return adapter.isValid(model.value) ? adapter.format(model.value, 'keyboardDate') : ''\n    })\n\n    function onKeydown (e: KeyboardEvent) {\n      if (e.key !== 'Enter') return\n\n      if (!menu.value || !isFocused.value) {\n        menu.value = true\n\n        return\n      }\n\n      const target = e.target as HTMLInputElement\n\n      model.value = adapter.date(target.value)\n    }\n\n    function onClick (e: MouseEvent) {\n      e.preventDefault()\n      e.stopPropagation()\n\n      menu.value = true\n    }\n\n    function onSave () {\n      menu.value = false\n    }\n\n    useRender(() => {\n      const confirmEditProps = VConfirmEdit.filterProps(props)\n      const datePickerProps = VDatePicker.filterProps(omit(props, ['active']))\n      const textFieldProps = VTextField.filterProps(props)\n\n      return (\n        <VTextField\n          { ...textFieldProps }\n          modelValue={ display.value }\n          onKeydown={ onKeydown }\n          focused={ menu.value || isFocused.value }\n          onFocus={ focus }\n          onBlur={ blur }\n          onClick:control={ onClick }\n          onClick:prepend={ onClick }\n        >\n          <VMenu\n            v-model={ menu.value }\n            activator=\"parent\"\n            min-width=\"0\"\n            closeOnContentClick={ false }\n            openOnClick={ false }\n          >\n            <VConfirmEdit\n              { ...confirmEditProps }\n              v-model={ model.value }\n              onSave={ onSave }\n            >\n              {{\n                default: ({ actions, model: proxyModel }) => {\n                  return (\n                    <VDatePicker\n                      { ...datePickerProps }\n                      modelValue={ props.hideActions ? model.value : proxyModel.value }\n                      onUpdate:modelValue={ val => {\n                        if (!props.hideActions) {\n                          proxyModel.value = val\n                        } else {\n                          model.value = val\n\n                          if (!props.multiple) menu.value = false\n                        }\n                      }}\n                      onMousedown={ (e: MouseEvent) => e.preventDefault() }\n                    >\n                      {{\n                        actions: !props.hideActions ? () => actions : undefined,\n                      }}\n                    </VDatePicker>\n                  )\n                },\n              }}\n            </VConfirmEdit>\n          </VMenu>\n\n          { slots.default?.() }\n        </VTextField>\n      )\n    })\n  },\n})\n\nexport type VDateInput = InstanceType<typeof VDateInput>\n"],"mappings":";AAAA;AAAA,SACSA,oBAAoB,EAAEC,WAAW;AAAA,SACjCC,KAAK;AAAA,SACLC,mBAAmB,EAAEC,UAAU;AAAA,SAC/BC,qBAAqB,EAAEC,YAAY,4CAE5C;AAAA,SACSC,OAAO;AAAA,SACPC,cAAc,EAAEC,QAAQ;AAAA,SACxBC,SAAS;AAAA,SACTC,eAAe,8CAExB;AACA,SAASC,QAAQ,EAAEC,UAAU,QAAQ,KAAK;AAAA,SACjCC,gBAAgB,EAAEC,IAAI,EAAEC,YAAY,EAAEC,SAAS,EAAEC,WAAW,gCAErE;AAKA,OAAO,MAAMC,mBAAmB,GAAGH,YAAY,CAAC;EAC9CI,WAAW,EAAEC,OAAO;EAEpB,GAAGb,cAAc,CAAC,CAAC;EACnB,GAAGH,qBAAqB,CAAC,CAAC;EAC1B,GAAGF,mBAAmB,CAAC;IACrBmB,WAAW,EAAE,YAAY;IACzBC,WAAW,EAAE;EACf,CAAC,CAAC;EACF,GAAGR,IAAI,CAACf,oBAAoB,CAAC;IAC3BwB,YAAY,EAAE,SAAkB;IAChCC,UAAU,EAAE;EACd,CAAC,CAAC,EAAE,CAAC,QAAQ,CAAC;AAChB,CAAC,EAAE,YAAY,CAAC;AAEhB,OAAO,MAAMC,UAAU,GAAGZ,gBAAgB,CAAC,CAAC,CAAC;EAC3Ca,IAAI,EAAE,YAAY;EAElBC,KAAK,EAAET,mBAAmB,CAAC,CAAC;EAE5BU,KAAK,EAAE;IACL,mBAAmB,EAAGC,GAAW,IAAK;EACxC,CAAC;EAEDC,KAAKA,CAAEH,KAAK,EAAAI,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACrB,MAAM;MAAEE;IAAE,CAAC,GAAGxB,SAAS,CAAC,CAAC;IACzB,MAAMyB,OAAO,GAAG5B,OAAO,CAAC,CAAC;IACzB,MAAM;MAAE6B,SAAS;MAAEC,KAAK;MAAEC;IAAK,CAAC,GAAG7B,QAAQ,CAACmB,KAAK,CAAC;IAClD,MAAMW,KAAK,GAAG5B,eAAe,CAACiB,KAAK,EAAE,YAAY,EAAEA,KAAK,CAACY,QAAQ,GAAG,EAAE,GAAG,IAAI,CAAC;IAC9E,MAAMC,IAAI,GAAG5B,UAAU,CAAC,KAAK,CAAC;IAE9B,MAAM6B,OAAO,GAAG9B,QAAQ,CAAC,MAAM;MAC7B,MAAM+B,KAAK,GAAGzB,WAAW,CAACqB,KAAK,CAACI,KAAK,CAAC;MAEtC,IAAI,CAACA,KAAK,CAACC,MAAM,EAAE,OAAO,IAAI;MAE9B,IAAIhB,KAAK,CAACY,QAAQ,KAAK,IAAI,EAAE;QAC3B,OAAON,CAAC,CAAC,mCAAmC,EAAES,KAAK,CAACC,MAAM,CAAC;MAC7D;MAEA,IAAIhB,KAAK,CAACY,QAAQ,KAAK,OAAO,EAAE;QAC9B,MAAMK,KAAK,GAAGF,KAAK,CAAC,CAAC,CAAC;QACtB,MAAMG,GAAG,GAAGH,KAAK,CAACA,KAAK,CAACC,MAAM,GAAG,CAAC,CAAC;QAEnC,OAAOT,OAAO,CAACY,OAAO,CAACF,KAAK,CAAC,IAAIV,OAAO,CAACY,OAAO,CAACD,GAAG,CAAC,GAChD,GAAEX,OAAO,CAACa,MAAM,CAACH,KAAK,EAAE,cAAc,CAAE,MAAKV,OAAO,CAACa,MAAM,CAACF,GAAG,EAAE,cAAc,CAAE,EAAC,GACnF,EAAE;MACR;MAEA,OAAOX,OAAO,CAACY,OAAO,CAACR,KAAK,CAACI,KAAK,CAAC,GAAGR,OAAO,CAACa,MAAM,CAACT,KAAK,CAACI,KAAK,EAAE,cAAc,CAAC,GAAG,EAAE;IACxF,CAAC,CAAC;IAEF,SAASM,SAASA,CAAEC,CAAgB,EAAE;MACpC,IAAIA,CAAC,CAACC,GAAG,KAAK,OAAO,EAAE;MAEvB,IAAI,CAACV,IAAI,CAACE,KAAK,IAAI,CAACP,SAAS,CAACO,KAAK,EAAE;QACnCF,IAAI,CAACE,KAAK,GAAG,IAAI;QAEjB;MACF;MAEA,MAAMS,MAAM,GAAGF,CAAC,CAACE,MAA0B;MAE3Cb,KAAK,CAACI,KAAK,GAAGR,OAAO,CAACkB,IAAI,CAACD,MAAM,CAACT,KAAK,CAAC;IAC1C;IAEA,SAASW,OAAOA,CAAEJ,CAAa,EAAE;MAC/BA,CAAC,CAACK,cAAc,CAAC,CAAC;MAClBL,CAAC,CAACM,eAAe,CAAC,CAAC;MAEnBf,IAAI,CAACE,KAAK,GAAG,IAAI;IACnB;IAEA,SAASc,MAAMA,CAAA,EAAI;MACjBhB,IAAI,CAACE,KAAK,GAAG,KAAK;IACpB;IAEA1B,SAAS,CAAC,MAAM;MACd,MAAMyC,gBAAgB,GAAGpD,YAAY,CAACqD,WAAW,CAAC/B,KAAK,CAAC;MACxD,MAAMgC,eAAe,GAAG3D,WAAW,CAAC0D,WAAW,CAAC5C,IAAI,CAACa,KAAK,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;MACxE,MAAMiC,cAAc,GAAGzD,UAAU,CAACuD,WAAW,CAAC/B,KAAK,CAAC;MAEpD,OAAAkC,YAAA,CAAA1D,UAAA,EAAA2D,WAAA,CAESF,cAAc;QAAA,cACNnB,OAAO,CAACC,KAAK;QAAA,aACdM,SAAS;QAAA,WACXR,IAAI,CAACE,KAAK,IAAIP,SAAS,CAACO,KAAK;QAAA,WAC7BN,KAAK;QAAA,UACNC,IAAI;QAAA,mBACKgB,OAAO;QAAA,mBACPA;MAAO;QAAAU,OAAA,EAAAA,CAAA,MAAAF,YAAA,CAAA5D,KAAA;UAAA,cAGbuC,IAAI,CAACE,KAAK;UAAA,uBAAAsB,MAAA,IAAVxB,IAAI,CAACE,KAAK,GAAAsB,MAAA;UAAA;UAAA;UAAA,uBAGE,KAAK;UAAA,eACb;QAAK;UAAAD,OAAA,EAAAA,CAAA,MAAAF,YAAA,CAAAxD,YAAA,EAAAyD,WAAA,CAGZL,gBAAgB;YAAA,cACXnB,KAAK,CAACI,KAAK;YAAA,uBAAAsB,MAAA,IAAX1B,KAAK,CAACI,KAAK,GAAAsB,MAAA;YAAA,UACZR;UAAM;YAGbO,OAAO,EAAEE,KAAA,IAAoC;cAAA,IAAnC;gBAAEC,OAAO;gBAAE5B,KAAK,EAAE6B;cAAW,CAAC,GAAAF,KAAA;cACtC,OAAAJ,YAAA,CAAA7D,WAAA,EAAA8D,WAAA,CAESH,eAAe;gBAAA,cACPhC,KAAK,CAACR,WAAW,GAAGmB,KAAK,CAACI,KAAK,GAAGyB,UAAU,CAACzB,KAAK;gBAAA,uBACzCb,GAAG,IAAI;kBAC3B,IAAI,CAACF,KAAK,CAACR,WAAW,EAAE;oBACtBgD,UAAU,CAACzB,KAAK,GAAGb,GAAG;kBACxB,CAAC,MAAM;oBACLS,KAAK,CAACI,KAAK,GAAGb,GAAG;oBAEjB,IAAI,CAACF,KAAK,CAACY,QAAQ,EAAEC,IAAI,CAACE,KAAK,GAAG,KAAK;kBACzC;gBACF,CAAC;gBAAA,eACcO,CAAa,IAAKA,CAAC,CAACK,cAAc,CAAC;cAAC;gBAGjDY,OAAO,EAAE,CAACvC,KAAK,CAACR,WAAW,GAAG,MAAM+C,OAAO,GAAGE;cAAS;YAI/D;UAAC;QAAA,IAKLpC,KAAK,CAAC+B,OAAO,GAAG,CAAC;MAAA;IAGzB,CAAC,CAAC;EACJ;AACF,CAAC,CAAC","ignoreList":[]}