@sfxcode/formkit-primevue 3.3.5 → 3.3.6

package/dist/components/PrimeAutoComplete.vue

@@ -1,56 +1,101 @@
-<script setup>
-import { ref } from "vue";
-import { useFormKitInput } from "../composables/index.ts";
+<script setup lang='ts'>
+import type { FormKitFrameworkContext } from '@formkit/core'
+import type { AutoCompleteCompleteEvent, AutoCompleteProps } from 'primevue/autocomplete'
+import type { PropType } from 'vue'
+import { ref } from 'vue'
+import { useFormKitInput } from '../composables'
+
+export interface FormKitPrimeAutoCompleteProps {
+  pt?: AutoCompleteProps['pt']
+  ptOptions?: AutoCompleteProps['ptOptions']
+  unstyled?: AutoCompleteProps['unstyled']
+  dropdown?: AutoCompleteProps['dropdown']
+  multiple?: AutoCompleteProps['multiple']
+  typeahead?: AutoCompleteProps['typeahead']
+  optionLabel?: AutoCompleteProps['optionLabel']
+  options?: any[] | undefined
+  size?: AutoCompleteProps['size']
+  minLength?: AutoCompleteProps['minLength']
+  placeholder?: AutoCompleteProps['placeholder']
+  fluid?: AutoCompleteProps['fluid']
+  separators?: string[] | []
+}
+
 const props = defineProps({
   context: {
-    type: Object,
-    required: true
-  }
-});
-const { validSlotNames, unstyled, isInvalid, handleInput, handleBlur, modelValue } = useFormKitInput(props.context);
-const suggestions = ref(["", {}]);
-suggestions.value = [];
-const loading = ref(false);
-async function search(event) {
+    type: Object as PropType<FormKitFrameworkContext & FormKitPrimeAutoCompleteProps>,
+    required: true,
+  },
+})
+
+const { validSlotNames, unstyled, isInvalid, handleInput, handleBlur, modelValue } = useFormKitInput(props.context)
+
+const suggestions = ref(['', {}])
+suggestions.value = []
+const loading = ref(false)
+
+/**
+ * Searches for suggestions based on the input query.
+ */
+async function search(event: AutoCompleteCompleteEvent) {
   if (props.context?.options && props.context?.optionLabel) {
     suggestions.value = props.context.options.filter((option) => {
-      return option[`${props.context.optionLabel}`].toString().toLowerCase().includes(event.query.toLowerCase());
-    });
-  } else {
-    loading.value = true;
+      return option[`${props.context.optionLabel}`].toString().toLowerCase().includes(event.query.toLowerCase())
+    })
+  }
+  else {
+    loading.value = true
     try {
-      suggestions.value = await props.context?.attrs.complete(event.query);
-    } catch (error) {
-      console.error("Error fetching suggestions:", error);
-      suggestions.value = [];
-    } finally {
-      loading.value = false;
+      suggestions.value = await props.context?.attrs.complete(event.query)
+    }
+    catch (error) {
+      console.error('Error fetching suggestions:', error)
+      suggestions.value = []
+    }
+    finally {
+      loading.value = false
     }
   }
 }
-function handlePaste(event) {
-  if (!props.context?.multiple) return;
-  const clipboardData = event.clipboardData;
-  if (!clipboardData) return;
-  const pastedText = clipboardData.getData("text");
-  const separators = Array.isArray(props.context?.separators) && props.context.separators.length > 0 ? props.context.separators : [","];
-  const regex = new RegExp(
-    `[${separators.map((s) => s.replace(/[-/\\^$*+?.()|[\]{}]/g, "\\$&")).join("")}]`
-  );
+
+/**
+ * Handles paste event to transform a string separated by any of the provided separators into multiple items.
+ */
+function handlePaste(event: ClipboardEvent) {
+  if (!props.context?.multiple)
+    return
+  const clipboardData = event.clipboardData
+  if (!clipboardData)
+    return
+  const pastedText = clipboardData.getData('text')
+  const separators = Array.isArray(props.context?.separators) && props.context.separators.length > 0
+    ? props.context.separators
+    : [',']
+  const regex = new RegExp(`[${separators.map(s => s.replace(/[-/\\^$*+?.()|[\]{}]/g, '\\$&')).join('')}]`)
+  // If separators are provided, split the pasted text by them
   if (pastedText && regex.test(pastedText)) {
-    event.preventDefault();
-    const items = pastedText.split(regex).map((item) => item.trim()).filter((item) => item.length > 0);
+    event.preventDefault()
+    const items = pastedText
+      .split(regex)
+      .map(item => item.trim())
+      .filter(item => item.length > 0)
+    // Use a local ref, never mutate context._value directly
     if (Array.isArray(modelValue.value)) {
-      modelValue.value = [...modelValue.value, ...items];
-    } else {
-      modelValue.value = items;
+      modelValue.value = [...modelValue.value, ...items]
     }
-  } else if (pastedText) {
-    event.preventDefault();
+    else {
+      modelValue.value = items
+    }
+  }
+  // If no separators, just set the value directly
+  else if (pastedText) {
+    event.preventDefault()
+    // If no separators, just set the value directly
     if (Array.isArray(modelValue.value)) {
-      modelValue.value = [...modelValue.value, pastedText.trim()];
-    } else {
-      modelValue.value = [pastedText.trim()];
+      modelValue.value = [...modelValue.value, pastedText.trim()]
+    }
+    else {
+      modelValue.value = [pastedText.trim()]
     }
   }
 }

package/dist/components/PrimeAutoComplete.vue.d.ts

@@ -0,0 +1,31 @@
+import type { FormKitFrameworkContext } from '@formkit/core';
+import type { AutoCompleteProps } from 'primevue/autocomplete';
+import type { PropType } from 'vue';
+export interface FormKitPrimeAutoCompleteProps {
+    pt?: AutoCompleteProps['pt'];
+    ptOptions?: AutoCompleteProps['ptOptions'];
+    unstyled?: AutoCompleteProps['unstyled'];
+    dropdown?: AutoCompleteProps['dropdown'];
+    multiple?: AutoCompleteProps['multiple'];
+    typeahead?: AutoCompleteProps['typeahead'];
+    optionLabel?: AutoCompleteProps['optionLabel'];
+    options?: any[] | undefined;
+    size?: AutoCompleteProps['size'];
+    minLength?: AutoCompleteProps['minLength'];
+    placeholder?: AutoCompleteProps['placeholder'];
+    fluid?: AutoCompleteProps['fluid'];
+    separators?: string[] | [];
+}
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeAutoCompleteProps>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeAutoCompleteProps>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/PrimeCascadeSelect.d.vue.ts

@@ -0,0 +1,28 @@
+import type { FormKitFrameworkContext } from '@formkit/core';
+import type { CascadeSelectProps } from 'primevue/cascadeselect';
+import type { PropType } from 'vue';
+export interface FormKitPrimeCascadeSelectProps {
+    options?: CascadeSelectProps['options'];
+    optionLabel?: CascadeSelectProps['optionLabel'];
+    optionValue?: CascadeSelectProps['optionValue'];
+    optionGroupLabel?: CascadeSelectProps['optionGroupLabel'];
+    optionGroupChildren?: CascadeSelectProps['optionGroupChildren'];
+    placeholder?: CascadeSelectProps['placeholder'];
+    pt?: CascadeSelectProps['pt'];
+    ptOptions?: CascadeSelectProps['ptOptions'];
+    unstyled?: CascadeSelectProps['unstyled'];
+    size?: CascadeSelectProps['size'];
+}
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeCascadeSelectProps>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeCascadeSelectProps>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/PrimeCascadeSelect.vue

@@ -1,12 +1,31 @@
-<script setup>
-import { useFormKitInput } from "../composables/index.ts";
+<script setup lang='ts'>
+import type { FormKitFrameworkContext } from '@formkit/core'
+import type { CascadeSelectProps } from 'primevue/cascadeselect'
+
+import type { PropType } from 'vue'
+import { useFormKitInput } from '../composables'
+
+export interface FormKitPrimeCascadeSelectProps {
+  options?: CascadeSelectProps['options']
+  optionLabel?: CascadeSelectProps['optionLabel']
+  optionValue?: CascadeSelectProps['optionValue']
+  optionGroupLabel?: CascadeSelectProps['optionGroupLabel']
+  optionGroupChildren?: CascadeSelectProps['optionGroupChildren']
+  placeholder?: CascadeSelectProps['placeholder']
+  pt?: CascadeSelectProps['pt']
+  ptOptions?: CascadeSelectProps['ptOptions']
+  unstyled?: CascadeSelectProps['unstyled']
+  size?: CascadeSelectProps['size']
+}
+
 const props = defineProps({
   context: {
-    type: Object,
-    required: true
-  }
-});
-const { validSlotNames, unstyled, isInvalid, handleInput, handleBlur, modelValue } = useFormKitInput(props.context);
+    type: Object as PropType<FormKitFrameworkContext & FormKitPrimeCascadeSelectProps>,
+    required: true,
+  },
+})
+
+const { validSlotNames, unstyled, isInvalid, handleInput, handleBlur, modelValue } = useFormKitInput(props.context)
 </script>
 
 <template>

package/dist/components/PrimeCascadeSelect.vue.d.ts

@@ -0,0 +1,28 @@
+import type { FormKitFrameworkContext } from '@formkit/core';
+import type { CascadeSelectProps } from 'primevue/cascadeselect';
+import type { PropType } from 'vue';
+export interface FormKitPrimeCascadeSelectProps {
+    options?: CascadeSelectProps['options'];
+    optionLabel?: CascadeSelectProps['optionLabel'];
+    optionValue?: CascadeSelectProps['optionValue'];
+    optionGroupLabel?: CascadeSelectProps['optionGroupLabel'];
+    optionGroupChildren?: CascadeSelectProps['optionGroupChildren'];
+    placeholder?: CascadeSelectProps['placeholder'];
+    pt?: CascadeSelectProps['pt'];
+    ptOptions?: CascadeSelectProps['ptOptions'];
+    unstyled?: CascadeSelectProps['unstyled'];
+    size?: CascadeSelectProps['size'];
+}
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeCascadeSelectProps>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeCascadeSelectProps>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/PrimeCheckbox.d.vue.ts

@@ -0,0 +1,27 @@
+import type { FormKitFrameworkContext } from '@formkit/core';
+import type { CheckboxProps } from 'primevue/checkbox';
+import type { PropType } from 'vue';
+export interface FormKitPrimeCheckboxProps {
+    binary?: CheckboxProps['binary'];
+    trueValue?: CheckboxProps['trueValue'];
+    falseValue?: CheckboxProps['falseValue'];
+    pt?: CheckboxProps['pt'];
+    ptOptions?: CheckboxProps['ptOptions'];
+    unstyled?: CheckboxProps['unstyled'];
+    indeterminate?: CheckboxProps['indeterminate'];
+    variant?: CheckboxProps['variant'];
+    size?: CheckboxProps['size'];
+}
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeCheckboxProps>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeCheckboxProps>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/PrimeCheckbox.vue

@@ -1,14 +1,34 @@
-<script setup>
-import { useFormKitInput, useFormKitSection } from "../composables/index.ts";
+<script setup lang='ts'>
+import type { FormKitFrameworkContext } from '@formkit/core'
+import type { CheckboxProps } from 'primevue/checkbox'
+
+import type { PropType } from 'vue'
+import { useFormKitInput, useFormKitSection } from '../composables'
+
+export interface FormKitPrimeCheckboxProps {
+  binary?: CheckboxProps['binary']
+  trueValue?: CheckboxProps['trueValue']
+  falseValue?: CheckboxProps['falseValue']
+  pt?: CheckboxProps['pt']
+  ptOptions?: CheckboxProps['ptOptions']
+  unstyled?: CheckboxProps['unstyled']
+  indeterminate?: CheckboxProps['indeterminate']
+  variant?: CheckboxProps['variant']
+  size?: CheckboxProps['size']
+}
+
 const props = defineProps({
   context: {
-    type: Object,
-    required: true
-  }
-});
-const { hasPrefix, hasSuffix, generateId } = useFormKitSection(props.context);
-const { validSlotNames, unstyled, isInvalid, handleInput, handleBlur, modelValue } = useFormKitInput(props.context);
-const generatedId = generateId();
+    type: Object as PropType<FormKitFrameworkContext & FormKitPrimeCheckboxProps>,
+    required: true,
+  },
+})
+
+const { hasPrefix, hasSuffix, generateId } = useFormKitSection(props.context)
+
+const { validSlotNames, unstyled, isInvalid, handleInput, handleBlur, modelValue } = useFormKitInput(props.context)
+
+const generatedId = generateId()
 </script>
 
 <template>

package/dist/components/PrimeCheckbox.vue.d.ts

@@ -0,0 +1,27 @@
+import type { FormKitFrameworkContext } from '@formkit/core';
+import type { CheckboxProps } from 'primevue/checkbox';
+import type { PropType } from 'vue';
+export interface FormKitPrimeCheckboxProps {
+    binary?: CheckboxProps['binary'];
+    trueValue?: CheckboxProps['trueValue'];
+    falseValue?: CheckboxProps['falseValue'];
+    pt?: CheckboxProps['pt'];
+    ptOptions?: CheckboxProps['ptOptions'];
+    unstyled?: CheckboxProps['unstyled'];
+    indeterminate?: CheckboxProps['indeterminate'];
+    variant?: CheckboxProps['variant'];
+    size?: CheckboxProps['size'];
+}
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeCheckboxProps>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeCheckboxProps>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/PrimeColorPicker.d.vue.ts

@@ -0,0 +1,24 @@
+import type { FormKitFrameworkContext } from '@formkit/core';
+import type { ColorPickerProps } from 'primevue/colorpicker';
+import type { PropType } from 'vue';
+export interface FormKitPrimeColorPickerProps {
+    defaultColor?: ColorPickerProps['defaultColor'];
+    inline?: ColorPickerProps['inline'];
+    format?: ColorPickerProps['format'];
+    pt?: ColorPickerProps['pt'];
+    ptOptions?: ColorPickerProps['ptOptions'];
+    unstyled?: ColorPickerProps['unstyled'];
+}
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeColorPickerProps>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeColorPickerProps>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/PrimeColorPicker.vue

@@ -1,12 +1,27 @@
-<script setup>
-import { useFormKitInput } from "../composables/index.ts";
+<script setup lang='ts'>
+import type { FormKitFrameworkContext } from '@formkit/core'
+import type { ColorPickerProps } from 'primevue/colorpicker'
+
+import type { PropType } from 'vue'
+import { useFormKitInput } from '../composables'
+
+export interface FormKitPrimeColorPickerProps {
+  defaultColor?: ColorPickerProps['defaultColor']
+  inline?: ColorPickerProps['inline']
+  format?: ColorPickerProps['format']
+  pt?: ColorPickerProps['pt']
+  ptOptions?: ColorPickerProps['ptOptions']
+  unstyled?: ColorPickerProps['unstyled']
+}
+
 const props = defineProps({
   context: {
-    type: Object,
-    required: true
-  }
-});
-const { unstyled, handleChange, modelValue } = useFormKitInput(props.context);
+    type: Object as PropType<FormKitFrameworkContext & FormKitPrimeColorPickerProps>,
+    required: true,
+  },
+})
+
+const { unstyled, handleChange, modelValue } = useFormKitInput(props.context)
 </script>
 
 <template>

package/dist/components/PrimeColorPicker.vue.d.ts

@@ -0,0 +1,24 @@
+import type { FormKitFrameworkContext } from '@formkit/core';
+import type { ColorPickerProps } from 'primevue/colorpicker';
+import type { PropType } from 'vue';
+export interface FormKitPrimeColorPickerProps {
+    defaultColor?: ColorPickerProps['defaultColor'];
+    inline?: ColorPickerProps['inline'];
+    format?: ColorPickerProps['format'];
+    pt?: ColorPickerProps['pt'];
+    ptOptions?: ColorPickerProps['ptOptions'];
+    unstyled?: ColorPickerProps['unstyled'];
+}
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeColorPickerProps>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeColorPickerProps>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/PrimeDatePicker.d.vue.ts

@@ -0,0 +1,63 @@
+import type { FormKitFrameworkContext } from '@formkit/core';
+import type { DatePickerProps } from 'primevue/datepicker';
+import type { PropType } from 'vue';
+export interface FormKitPrimeDatePickerProps {
+    dateFormat?: DatePickerProps['dateFormat'];
+    placeholder?: DatePickerProps['placeholder'];
+    selectionMode?: DatePickerProps['selectionMode'];
+    inline?: DatePickerProps['inline'];
+    icon?: DatePickerProps['icon'];
+    showOtherMonths?: DatePickerProps['showOtherMonths'];
+    selectOtherMonths?: DatePickerProps['selectOtherMonths'];
+    showIcon?: DatePickerProps['showIcon'];
+    prevIcon?: DatePickerProps['prevIcon'];
+    nextIcon?: DatePickerProps['nextIcon'];
+    incrementIcon?: DatePickerProps['incrementIcon'];
+    decrementIcon?: DatePickerProps['decrementIcon'];
+    numberOfMonths?: DatePickerProps['numberOfMonths'];
+    responsiveOptions?: DatePickerProps['responsiveOptions'];
+    view?: DatePickerProps['view'];
+    minDate?: DatePickerProps['minDate'];
+    maxDate?: DatePickerProps['maxDate'];
+    disabledDates?: DatePickerProps['disabledDates'];
+    disabledDays?: DatePickerProps['disabledDays'];
+    maxDateCount?: DatePickerProps['maxDateCount'];
+    showOnFocus?: DatePickerProps['showOnFocus'];
+    autoZIndex?: DatePickerProps['autoZIndex'];
+    baseZIndex?: DatePickerProps['baseZIndex'];
+    showButtonBar?: DatePickerProps['showButtonBar'];
+    showTime?: DatePickerProps['showTime'];
+    timeOnly?: DatePickerProps['timeOnly'];
+    shortYearCutoff?: DatePickerProps['shortYearCutoff'];
+    hourFormat?: DatePickerProps['hourFormat'];
+    stepHour?: DatePickerProps['stepHour'];
+    stepMinute?: DatePickerProps['stepMinute'];
+    stepSecond?: DatePickerProps['stepSecond'];
+    showSeconds?: DatePickerProps['showSeconds'];
+    hideOnDateTimeSelect?: DatePickerProps['hideOnDateTimeSelect'];
+    hideOnRangeSelection?: DatePickerProps['hideOnRangeSelection'];
+    timeSeparator?: DatePickerProps['timeSeparator'];
+    showWeek?: DatePickerProps['showWeek'];
+    manualInput?: DatePickerProps['manualInput'];
+    appendTo?: DatePickerProps['appendTo'];
+    panelStyle?: DatePickerProps['panelStyle'];
+    panelClass?: DatePickerProps['panelClass'];
+    pt?: DatePickerProps['pt'];
+    ptOptions?: DatePickerProps['ptOptions'];
+    unstyled?: DatePickerProps['unstyled'];
+    size?: DatePickerProps['size'];
+    updateModelType?: DatePickerProps['updateModelType'];
+}
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeDatePickerProps>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeDatePickerProps>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/PrimeDatePicker.vue

@@ -1,25 +1,81 @@
-<script setup>
-import { useFormKitInput } from "../composables/index.ts";
+<script setup lang='ts'>
+import type { FormKitFrameworkContext } from '@formkit/core'
+import type { DatePickerBlurEvent, DatePickerProps } from 'primevue/datepicker'
+
+import type { PropType } from 'vue'
+import { useFormKitInput } from '../composables'
+
+export interface FormKitPrimeDatePickerProps {
+  dateFormat?: DatePickerProps['dateFormat']
+  placeholder?: DatePickerProps['placeholder']
+  selectionMode?: DatePickerProps['selectionMode']
+  inline?: DatePickerProps['inline']
+  icon?: DatePickerProps['icon']
+  showOtherMonths?: DatePickerProps['showOtherMonths']
+  selectOtherMonths?: DatePickerProps['selectOtherMonths']
+  showIcon?: DatePickerProps['showIcon']
+  prevIcon?: DatePickerProps['prevIcon']
+  nextIcon?: DatePickerProps['nextIcon']
+  incrementIcon?: DatePickerProps['incrementIcon']
+  decrementIcon?: DatePickerProps['decrementIcon']
+  numberOfMonths?: DatePickerProps['numberOfMonths']
+  responsiveOptions?: DatePickerProps['responsiveOptions']
+  view?: DatePickerProps['view']
+  minDate?: DatePickerProps['minDate']
+  maxDate?: DatePickerProps['maxDate']
+  disabledDates?: DatePickerProps['disabledDates']
+  disabledDays?: DatePickerProps['disabledDays']
+  maxDateCount?: DatePickerProps['maxDateCount']
+  showOnFocus?: DatePickerProps['showOnFocus']
+  autoZIndex?: DatePickerProps['autoZIndex']
+  baseZIndex?: DatePickerProps['baseZIndex']
+  showButtonBar?: DatePickerProps['showButtonBar']
+  showTime?: DatePickerProps['showTime']
+  timeOnly?: DatePickerProps['timeOnly']
+  shortYearCutoff?: DatePickerProps['shortYearCutoff']
+  hourFormat?: DatePickerProps['hourFormat']
+  stepHour?: DatePickerProps['stepHour']
+  stepMinute?: DatePickerProps['stepMinute']
+  stepSecond?: DatePickerProps['stepSecond']
+  showSeconds?: DatePickerProps['showSeconds']
+  hideOnDateTimeSelect?: DatePickerProps['hideOnDateTimeSelect']
+  hideOnRangeSelection?: DatePickerProps['hideOnRangeSelection']
+  timeSeparator?: DatePickerProps['timeSeparator']
+  showWeek?: DatePickerProps['showWeek']
+  manualInput?: DatePickerProps['manualInput']
+  appendTo?: DatePickerProps['appendTo']
+  panelStyle?: DatePickerProps['panelStyle']
+  panelClass?: DatePickerProps['panelClass']
+  pt?: DatePickerProps['pt']
+  ptOptions?: DatePickerProps['ptOptions']
+  unstyled?: DatePickerProps['unstyled']
+  size?: DatePickerProps['size']
+  updateModelType?: DatePickerProps['updateModelType']
+}
+
 const props = defineProps({
   context: {
-    type: Object,
-    required: true
-  }
-});
-const { validSlotNames, unstyled, isInvalid, handleInput, modelValue } = useFormKitInput(
-  props.context
-);
-function handleBlur(e) {
-  props.context?.handlers.blur(e.originalEvent);
+    type: Object as PropType<FormKitFrameworkContext & FormKitPrimeDatePickerProps>,
+    required: true,
+  },
+})
+
+const { validSlotNames, unstyled, isInvalid, handleInput, modelValue } = useFormKitInput(props.context)
+
+function handleBlur(e: DatePickerBlurEvent) {
+  props.context?.handlers.blur(e.originalEvent as FocusEvent)
 }
+
 function handleClearClick() {
-  props.context?.node.input(null);
+  props.context?.node.input(null)
 }
-function handleSelect(e) {
-  if (props.context?.selectionMode === "range" || props.context?.selectionMode === "multiple") {
-    props.context?.node.input(props.context._value);
-  } else {
-    props.context?.node.input(e);
+
+function handleSelect(e: any) {
+  if (props.context?.selectionMode === 'range' || props.context?.selectionMode === 'multiple') {
+    props.context?.node.input(props.context._value)
+  }
+  else {
+    props.context?.node.input(e)
   }
 }
 </script>