@sfxcode/formkit-primevue 3.3.1 → 3.3.3

package/dist/components/PrimeDatePicker.vue

@@ -0,0 +1,153 @@
+<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 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)
+}
+
+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>
+
+<template>
+  <div class="p-formkit">
+    <DatePicker
+      v-model="modelValue"
+      v-bind="context?.attrs"
+      :input-id="context.id"
+      :disabled="!!context?.disabled"
+      :readonly="context?.attrs.readonly ?? false"
+      :input-style="context?.attrs.style"
+      :input-class="context?.attrs?.class"
+      :invalid="isInvalid"
+      :tabindex="context?.attrs.tabindex"
+      :aria-label="context?.attrs.ariaLabel"
+      :aria-labelledby="context?.attrs.ariaLabelledby"
+      :size="context?.size ?? undefined"
+      :date-format="context?.dateFormat"
+      :placeholder="context?.placeholder"
+      :selection-mode="context?.selectionMode ?? 'single'"
+      :inline="context?.inline ?? false"
+      :show-other-months="context?.showOtherMonths ?? true"
+      :select-other-months="context?.selectOtherMonths ?? false"
+      :icon="context?.icon"
+      :show-icon="context.showIcon"
+      :previous-icon="context?.previousIcon"
+      :next-icon="context?.nextIcon"
+      :increment-icon="context?.incrementIcon"
+      :decrement-icon="context?.decrementIcon"
+      :number-of-months="context?.numberOfMonths ?? 1"
+      :responsive-options="context?.responsiveOptions"
+      :view="context?.view ?? 'date'"
+      :touch-u-i="context?.touchUI ?? false"
+      :min-date="context?.minDate"
+      :max-date="context?.maxDate"
+      :disabled-dates="context?.disabledDates"
+      :disabled-days="context?.disabledDays"
+      :max-date-count="context?.maxDateCount"
+      :show-on-focus="context?.showOnFocus ?? true"
+      :auto-z-index="context?.autoZIndex ?? true"
+      :base-z-index="context?.baseZIndex ?? 0"
+      :show-button-bar="context?.showButtonBar ?? false"
+      :show-time="context?.showTime ?? false"
+      :time-only="context?.timeOnly ?? false"
+      :short-year-cutoff="context?.shortYearCutoff ?? '+10'"
+      :hour-format="context?.hourFormat ?? '24'"
+      :step-hour="context?.stepHour ?? 1"
+      :step-minute="context?.stepMinute ?? 1"
+      :step-second="context?.stepSecond ?? 1"
+      :show-seconds="context?.showSeconds ?? false"
+      :hide-on-date-time-select="context?.hideOnDateTimeSelect ?? false"
+      :hide-on-range-selection="context?.hideOnRangeSelection ?? false"
+      :time-separator="context?.timeSeparator ?? ':'"
+      :show-week="context?.showWeek ?? false"
+      :manual-input="context?.manualInput ?? true"
+      :append-to="context?.appendTo ?? 'body'"
+      :panel-style="context?.panelStyle"
+      :panel-class="context?.panelClass"
+      :pt="context?.pt"
+      :pt-options="context?.ptOptions"
+      :unstyled="unstyled"
+      :update-model-type="context?.updateModelType ?? 'date'"
+      @date-select="handleSelect"
+      @blur="handleBlur"
+      @clear-click="handleClearClick"
+      @value-change="handleInput"
+    >
+      <template v-for="slotName in validSlotNames" :key="slotName" #[slotName]="slotProps">
+        <component :is="context?.slots[slotName]" v-bind="{ ...context, ...slotProps }" />
+      </template>
+    </DatePicker>
+  </div>
+</template>

package/dist/components/PrimeDatePicker.vue.d.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/PrimeInputMask.d.vue.ts

@@ -0,0 +1,28 @@
+import type { FormKitFrameworkContext } from '@formkit/core';
+import type { InputMaskProps } from 'primevue/inputmask';
+import type { PropType } from 'vue';
+export interface FormKitPrimeInputMaskProps {
+    mask?: InputMaskProps['mask'];
+    slotChar?: InputMaskProps['slotChar'];
+    autoClear?: InputMaskProps['autoClear'];
+    unmask?: InputMaskProps['unmask'];
+    pt?: InputMaskProps['pt'];
+    ptOptions?: InputMaskProps['ptOptions'];
+    unstyled?: InputMaskProps['unstyled'];
+    invalid?: InputMaskProps['invalid'];
+    variant?: InputMaskProps['variant'];
+    size?: InputMaskProps['size'];
+}
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeInputMaskProps>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeInputMaskProps>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/PrimeInputMask.vue

@@ -0,0 +1,88 @@
+<script setup lang='ts'>
+import type { FormKitFrameworkContext } from '@formkit/core'
+import type { InputMaskProps } from 'primevue/inputmask'
+
+import type { PropType } from 'vue'
+import IconField from 'primevue/iconfield'
+import InputIcon from 'primevue/inputicon'
+import { useFormKitInput, useFormKitSection } from '../composables'
+
+export interface FormKitPrimeInputMaskProps {
+  mask?: InputMaskProps['mask']
+  slotChar?: InputMaskProps['slotChar']
+  autoClear?: InputMaskProps['autoClear']
+  unmask?: InputMaskProps['unmask']
+  pt?: InputMaskProps['pt']
+  ptOptions?: InputMaskProps['ptOptions']
+  unstyled?: InputMaskProps['unstyled']
+  invalid?: InputMaskProps['invalid']
+  variant?: InputMaskProps['variant']
+  size?: InputMaskProps['size']
+}
+
+const props = defineProps({
+  context: {
+    type: Object as PropType<FormKitFrameworkContext & FormKitPrimeInputMaskProps>,
+    required: true,
+  },
+})
+
+const { unstyled, isInvalid, handleInput, handleBlur, modelValue } = useFormKitInput(props.context)
+const { hasPrefixIcon, hasSuffixIcon } = useFormKitSection(props.context)
+</script>
+
+<template>
+  <div class="p-formkit">
+    <IconField v-if="hasPrefixIcon || hasSuffixIcon">
+      <InputIcon v-if="hasPrefixIcon" :class="context?.iconPrefix" />
+      <InputMask
+        :id="context.id"
+        v-model="modelValue"
+        v-bind="context?.attrs"
+        :disabled="!!context?.disabled"
+        :readonly="context?.attrs.readonly ?? false"
+        :class="context?.attrs?.class"
+        :invalid="isInvalid"
+        :tabindex="context?.attrs.tabindex"
+        :aria-label="context?.attrs.ariaLabel"
+        :aria-labelledby="context?.attrs.ariaLabelledby"
+        :size="context?.size ?? undefined"
+        :mask="context.mask ?? undefined"
+        :slot-char="context.slotChar ?? '_'"
+        :auto-clear="context.autoClear ?? true"
+        :unmask="context.unmask ?? false"
+        :pt="context.pt"
+        :variant="context.variant"
+        :pt-options="context.ptOptions"
+        :unstyled="unstyled"
+        @update:model-value="handleInput"
+        @blur="handleBlur"
+      />
+      <InputIcon v-if="hasSuffixIcon" :class="context?.iconSuffix" />
+    </IconField>
+    <InputMask
+      v-if="!hasPrefixIcon && !hasSuffixIcon"
+      :id="context.id"
+      v-model="modelValue"
+      v-bind="context?.attrs"
+      :disabled="!!context?.disabled"
+      :readonly="context?.attrs.readonly ?? false"
+      :class="context?.attrs?.class"
+      :invalid="isInvalid"
+      :tabindex="context?.attrs.tabindex"
+      :aria-label="context?.attrs.ariaLabel"
+      :aria-labelledby="context?.attrs.ariaLabelledby"
+      :size="context?.size ?? undefined"
+      :mask="context.mask ?? undefined"
+      :slot-char="context.slotChar ?? '_'"
+      :auto-clear="context.autoClear ?? true"
+      :unmask="context.unmask ?? false"
+      :pt="context.pt"
+      :variant="context.variant"
+      :pt-options="context.ptOptions"
+      :unstyled="unstyled"
+      @update:model-value="handleInput"
+      @blur="handleBlur"
+    />
+  </div>
+</template>

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

@@ -0,0 +1,28 @@
+import type { FormKitFrameworkContext } from '@formkit/core';
+import type { InputMaskProps } from 'primevue/inputmask';
+import type { PropType } from 'vue';
+export interface FormKitPrimeInputMaskProps {
+    mask?: InputMaskProps['mask'];
+    slotChar?: InputMaskProps['slotChar'];
+    autoClear?: InputMaskProps['autoClear'];
+    unmask?: InputMaskProps['unmask'];
+    pt?: InputMaskProps['pt'];
+    ptOptions?: InputMaskProps['ptOptions'];
+    unstyled?: InputMaskProps['unstyled'];
+    invalid?: InputMaskProps['invalid'];
+    variant?: InputMaskProps['variant'];
+    size?: InputMaskProps['size'];
+}
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeInputMaskProps>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeInputMaskProps>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

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

@@ -0,0 +1,36 @@
+import type { FormKitFrameworkContext } from '@formkit/core';
+import type { InputNumberProps } from 'primevue/inputnumber';
+import type { PropType } from 'vue';
+export interface FormKitPrimeInputNumberProps {
+    useGrouping?: InputNumberProps['useGrouping'];
+    min?: InputNumberProps['min'];
+    max?: InputNumberProps['max'];
+    minFractionDigits?: InputNumberProps['minFractionDigits'];
+    maxFractionDigits?: InputNumberProps['maxFractionDigits'];
+    locale?: InputNumberProps['locale'];
+    mode?: InputNumberProps['mode'];
+    currency?: InputNumberProps['currency'];
+    prefix?: InputNumberProps['prefix'];
+    suffix?: InputNumberProps['suffix'];
+    showButtons?: InputNumberProps['showButtons'];
+    buttonLayout?: InputNumberProps['buttonLayout'];
+    step?: InputNumberProps['step'];
+    pt?: InputNumberProps['pt'];
+    ptOptions?: InputNumberProps['ptOptions'];
+    unstyled?: InputNumberProps['unstyled'];
+    placeholder?: InputNumberProps['placeholder'];
+    size?: InputNumberProps['size'];
+}
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeInputNumberProps>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeInputNumberProps>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/PrimeInputNumber.vue

@@ -0,0 +1,110 @@
+<script setup lang='ts'>
+import type { FormKitFrameworkContext } from '@formkit/core'
+import type { InputNumberBlurEvent, InputNumberProps } from 'primevue/inputnumber'
+
+import type { PropType } from 'vue'
+import { watch } from 'vue'
+import { useFormKitInput } from '../composables'
+
+export interface FormKitPrimeInputNumberProps {
+  useGrouping?: InputNumberProps['useGrouping']
+  min?: InputNumberProps['min']
+  max?: InputNumberProps['max']
+  minFractionDigits?: InputNumberProps['minFractionDigits']
+  maxFractionDigits?: InputNumberProps['maxFractionDigits']
+  locale?: InputNumberProps['locale']
+  mode?: InputNumberProps['mode']
+  currency?: InputNumberProps['currency']
+  prefix?: InputNumberProps['prefix']
+  suffix?: InputNumberProps['suffix']
+  showButtons?: InputNumberProps['showButtons']
+  buttonLayout?: InputNumberProps['buttonLayout']
+  step?: InputNumberProps['step']
+  pt?: InputNumberProps['pt']
+  ptOptions?: InputNumberProps['ptOptions']
+  unstyled?: InputNumberProps['unstyled']
+  placeholder?: InputNumberProps['placeholder']
+  size?: InputNumberProps['size']
+}
+
+const props = defineProps({
+  context: {
+    type: Object as PropType<FormKitFrameworkContext & FormKitPrimeInputNumberProps>,
+    required: true,
+  },
+})
+
+const { validSlotNames, unstyled, isInvalid, modelValue } = useFormKitInput(props.context)
+
+function handleBlur(e: InputNumberBlurEvent) {
+  props.context?.handlers.blur(e.originalEvent as FocusEvent)
+}
+
+function handleInput(_: any) {
+  if (typeof _.value === 'number' || _.value === null)
+    props.context?.node.input(_.value)
+}
+
+function roundToDecimals(value: any, decimals: number) {
+  const factor = 10 ** decimals
+  return Math.round(value * factor) / factor
+}
+
+watch(
+  () => props.context._value,
+  (newValue) => {
+    // Only update if the value is different
+    if (newValue !== props.context.node.value && typeof newValue === 'number') {
+      if (props.context.maxFractionDigits && props.context.maxFractionDigits > 0) {
+        // fix floating-point precision issues
+        props.context?.node.input(roundToDecimals(newValue, props.context.maxFractionDigits))
+      }
+      else {
+        props.context?.node.input(newValue)
+      }
+    }
+  },
+)
+</script>
+
+<template>
+  <div class="p-formkit">
+    <InputNumber
+      v-model="modelValue"
+      v-bind="context?.attrs"
+      :input-id="context.id"
+      :disabled="!!context?.disabled"
+      :readonly="context?.attrs.readonly ?? false"
+      :input-style="context?.attrs.style"
+      :input-class="context?.attrs?.class"
+      :invalid="isInvalid"
+      :tabindex="context?.attrs.tabindex"
+      :aria-label="context?.attrs.ariaLabel"
+      :aria-labelledby="context?.attrs.ariaLabelledby"
+      :size="context?.size ?? undefined"
+      :placeholder="context.placeholder"
+      :use-grouping="context.useGrouping ?? true"
+      :min="context.min ?? undefined"
+      :max="context.max ?? undefined"
+      :min-fraction-digits="context.minFractionDigits ?? undefined"
+      :max-fraction-digits="context.maxFractionDigits ?? undefined"
+      :locale="context.locale ?? undefined"
+      :mode="context.mode ?? undefined"
+      :currency="context.currency ?? undefined"
+      :prefix="context.prefix ?? undefined"
+      :suffix="context.suffix ?? undefined"
+      :show-buttons="context.showButtons ?? undefined"
+      :button-layout="context.buttonLayout ?? 'stacked'"
+      :step="context.step ?? undefined"
+      :pt="context.pt"
+      :pt-options="context.ptOptions"
+      :unstyled="unstyled"
+      @input="handleInput"
+      @blur="handleBlur"
+    >
+      <template v-for="slotName in validSlotNames" :key="slotName" #[slotName]="slotProps">
+        <component :is="context?.slots[slotName]" v-bind="{ ...context, ...slotProps }" />
+      </template>
+    </InputNumber>
+  </div>
+</template>

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

@@ -0,0 +1,36 @@
+import type { FormKitFrameworkContext } from '@formkit/core';
+import type { InputNumberProps } from 'primevue/inputnumber';
+import type { PropType } from 'vue';
+export interface FormKitPrimeInputNumberProps {
+    useGrouping?: InputNumberProps['useGrouping'];
+    min?: InputNumberProps['min'];
+    max?: InputNumberProps['max'];
+    minFractionDigits?: InputNumberProps['minFractionDigits'];
+    maxFractionDigits?: InputNumberProps['maxFractionDigits'];
+    locale?: InputNumberProps['locale'];
+    mode?: InputNumberProps['mode'];
+    currency?: InputNumberProps['currency'];
+    prefix?: InputNumberProps['prefix'];
+    suffix?: InputNumberProps['suffix'];
+    showButtons?: InputNumberProps['showButtons'];
+    buttonLayout?: InputNumberProps['buttonLayout'];
+    step?: InputNumberProps['step'];
+    pt?: InputNumberProps['pt'];
+    ptOptions?: InputNumberProps['ptOptions'];
+    unstyled?: InputNumberProps['unstyled'];
+    placeholder?: InputNumberProps['placeholder'];
+    size?: InputNumberProps['size'];
+}
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeInputNumberProps>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeInputNumberProps>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

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

@@ -0,0 +1,26 @@
+import type { FormKitFrameworkContext } from '@formkit/core';
+import type { InputOtpProps } from 'primevue/inputotp';
+import type { PropType } from 'vue';
+export interface FormKitPrimeInputOtpProps {
+    unstyled?: InputOtpProps['unstyled'];
+    ptOptions?: InputOtpProps['ptOptions'];
+    pt?: InputOtpProps['pt'];
+    length?: InputOtpProps['length'];
+    variant?: InputOtpProps['variant'];
+    mask?: InputOtpProps['mask'];
+    integerOnly?: InputOtpProps['integerOnly'];
+    size?: InputOtpProps['size'];
+}
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeInputOtpProps>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeInputOtpProps>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/PrimeInputOtp.vue

@@ -0,0 +1,59 @@
+<script setup lang='ts'>
+import type { FormKitFrameworkContext } from '@formkit/core'
+import type { InputOtpProps } from 'primevue/inputotp'
+
+import type { PropType } from 'vue'
+import { useFormKitInput } from '../composables'
+
+export interface FormKitPrimeInputOtpProps {
+  unstyled?: InputOtpProps['unstyled']
+  ptOptions?: InputOtpProps['ptOptions']
+  pt?: InputOtpProps['pt']
+  length?: InputOtpProps['length']
+  variant?: InputOtpProps['variant']
+  mask?: InputOtpProps['mask']
+  integerOnly?: InputOtpProps['integerOnly']
+  size?: InputOtpProps['size']
+}
+
+const props = defineProps({
+  context: {
+    type: Object as PropType<FormKitFrameworkContext & FormKitPrimeInputOtpProps>,
+    required: true,
+  },
+})
+
+const { validSlotNames, unstyled, isInvalid, handleBlur, handleInput, modelValue } = useFormKitInput(props.context)
+</script>
+
+<template>
+  <div class="p-formkit">
+    <InputOtp
+      :id="context.id"
+      v-model="modelValue"
+      v-bind="context?.attrs"
+      :disabled="!!context?.disabled"
+      :readonly="context?.attrs.readonly ?? false"
+      :style="context?.attrs.style"
+      :class="context?.attrs?.class"
+      :invalid="isInvalid"
+      :tabindex="context?.attrs.tabindex"
+      :aria-label="context?.attrs.ariaLabel"
+      :aria-labelledby="context?.attrs.ariaLabelledby"
+      :size="context?.size ?? undefined"
+      :length="context.length"
+      :variant="context.variant"
+      :mask="context.mask"
+      :integer-only="context.integerOnly"
+      :pt="context.pt"
+      :pt-options="context.ptOptions"
+      :unstyled="unstyled"
+      @change="handleInput"
+      @blur="handleBlur"
+    >
+      <template v-for="slotName in validSlotNames" :key="slotName" #[slotName]="slotProps">
+        <component :is="context?.slots[slotName]" v-bind="{ ...context, ...slotProps }" />
+      </template>
+    </InputOtp>
+  </div>
+</template>

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

@@ -0,0 +1,26 @@
+import type { FormKitFrameworkContext } from '@formkit/core';
+import type { InputOtpProps } from 'primevue/inputotp';
+import type { PropType } from 'vue';
+export interface FormKitPrimeInputOtpProps {
+    unstyled?: InputOtpProps['unstyled'];
+    ptOptions?: InputOtpProps['ptOptions'];
+    pt?: InputOtpProps['pt'];
+    length?: InputOtpProps['length'];
+    variant?: InputOtpProps['variant'];
+    mask?: InputOtpProps['mask'];
+    integerOnly?: InputOtpProps['integerOnly'];
+    size?: InputOtpProps['size'];
+}
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeInputOtpProps>;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    context: {
+        type: PropType<FormKitFrameworkContext & FormKitPrimeInputOtpProps>;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;