@sfxcode/nuxt-ui-formkit 1.2.0 → 1.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -288,9 +288,12 @@ Refer to the [Nuxt UI documentation](https://ui.nuxt.com/) for component-specifi
288
288
  The playground includes comprehensive examples for all components:
289
289
 
290
290
  ### Input Components
291
+ - [Calendar](./playground/app/pages/components/input/calendar.vue)
291
292
  - [Checkbox](./playground/app/pages/components/input/checkbox.vue)
292
293
  - [CheckboxGroup](./playground/app/pages/components/input/checkbox-group.vue)
293
294
  - [ColorPicker](./playground/app/pages/components/input/color-picker.vue)
295
+ - [Editor](./playground/app/pages/components/input/editor.vue)
296
+ - [FileUpload](./playground/app/pages/components/input/file-upload.vue)
294
297
  - [Input](./playground/app/pages/components/input/input.vue)
295
298
  - [InputDate](./playground/app/pages/components/input/input-date.vue)
296
299
  - [InputMenu](./playground/app/pages/components/input/input-menu.vue)
@@ -314,6 +317,10 @@ The playground includes comprehensive examples for all components:
314
317
  - [OutputNumber](./playground/app/pages/components/output/number.vue)
315
318
  - [OutputText](./playground/app/pages/components/output/text.vue)
316
319
 
320
+ ### Repeater
321
+ - [Repeater](./playground/app/pages/form/repeater-sample.vue)
322
+ - [Drag-and-Drop Repeater](./playground/app/pages/form/repeater-drag.vue)
323
+
317
324
  ## Development
318
325
 
319
326
  <details>
package/dist/module.json CHANGED
@@ -4,7 +4,7 @@
4
4
  "compatibility": {
5
5
  "nuxt": ">=4.0.0"
6
6
  },
7
- "version": "1.2.0",
7
+ "version": "1.2.1",
8
8
  "builder": {
9
9
  "@nuxt/module-builder": "1.0.2",
10
10
  "unbuild": "3.6.1"
@@ -1,9 +1,11 @@
1
1
  import type { FormKitFrameworkContext } from '@formkit/core';
2
2
  import type { DateValue } from '@internationalized/date';
3
3
  import type { PropType } from 'vue';
4
+ import type { DateValueType } from '../../utils/dateValueConversion.js';
5
+ type DateLike = DateValue | Date | string;
4
6
  export interface CalendarDateRange {
5
- start: DateValue;
6
- end: DateValue;
7
+ start: DateLike;
8
+ end: DateLike;
7
9
  }
8
10
  export interface FormKitCalendarProps {
9
11
  type?: 'date' | 'month' | 'year';
@@ -16,9 +18,17 @@ export interface FormKitCalendarProps {
16
18
  monthControls?: boolean;
17
19
  yearControls?: boolean;
18
20
  viewControl?: boolean;
19
- defaultValue?: DateValue | DateValue[] | CalendarDateRange;
20
- minValue?: DateValue;
21
- maxValue?: DateValue;
21
+ /**
22
+ * Shape of the value read from / written to the FormKit form data.
23
+ * `'calendar'` (default) keeps the native `@internationalized/date` `DateValue`.
24
+ * `'date'` converts to/from a JS `Date`. `'iso'` converts to/from an ISO 8601 string.
25
+ */
26
+ valueType?: DateValueType;
27
+ /** Timezone used when converting to/from `'date'`/`'iso'`. Defaults to the local timezone. */
28
+ timeZone?: string;
29
+ defaultValue?: DateLike | DateLike[] | CalendarDateRange;
30
+ minValue?: DateLike;
31
+ maxValue?: DateLike;
22
32
  isDateDisabled?: (date: DateValue) => boolean;
23
33
  isDateUnavailable?: (date: DateValue) => boolean;
24
34
  ui?: Record<string, unknown>;
@@ -1,12 +1,24 @@
1
1
  <script setup>
2
+ import { computed } from "vue";
2
3
  import { useFormKitInput } from "../../utils/useFormKitInput";
4
+ import { toDateValue, toDateValueOrRangeOrArray, fromDateValueOrRangeOrArray } from "../../utils/dateValueConversion";
3
5
  const props = defineProps({
4
6
  context: {
5
7
  type: Object,
6
8
  required: true
7
9
  }
8
10
  });
9
- const { handleInput, styleClass, color, modelValue, validSlotNames } = useFormKitInput(props.context);
11
+ const { handleInput, styleClass, color, validSlotNames } = useFormKitInput(props.context);
12
+ const conversionOptions = computed(() => ({ timeZone: props.context.timeZone }));
13
+ const modelValue = computed({
14
+ get: () => toDateValueOrRangeOrArray(props.context._value, conversionOptions.value),
15
+ set: (value) => {
16
+ props.context.node.input(fromDateValueOrRangeOrArray(value, props.context.valueType ?? "calendar", props.context.timeZone));
17
+ }
18
+ });
19
+ const defaultValue = computed(() => toDateValueOrRangeOrArray(props.context.defaultValue, conversionOptions.value));
20
+ const minValue = computed(() => toDateValue(props.context.minValue, conversionOptions.value));
21
+ const maxValue = computed(() => toDateValue(props.context.maxValue, conversionOptions.value));
10
22
  </script>
11
23
 
12
24
  <template>
@@ -27,9 +39,9 @@ const { handleInput, styleClass, color, modelValue, validSlotNames } = useFormKi
27
39
  :month-controls="context.monthControls"
28
40
  :year-controls="context.yearControls"
29
41
  :view-control="context.viewControl"
30
- :default-value="context.defaultValue"
31
- :min-value="context.minValue"
32
- :max-value="context.maxValue"
42
+ :default-value="defaultValue"
43
+ :min-value="minValue"
44
+ :max-value="maxValue"
33
45
  :is-date-disabled="context.isDateDisabled"
34
46
  :is-date-unavailable="context.isDateUnavailable"
35
47
  :ui="context.ui"
@@ -1,9 +1,11 @@
1
1
  import type { FormKitFrameworkContext } from '@formkit/core';
2
2
  import type { DateValue } from '@internationalized/date';
3
3
  import type { PropType } from 'vue';
4
+ import type { DateValueType } from '../../utils/dateValueConversion.js';
5
+ type DateLike = DateValue | Date | string;
4
6
  export interface CalendarDateRange {
5
- start: DateValue;
6
- end: DateValue;
7
+ start: DateLike;
8
+ end: DateLike;
7
9
  }
8
10
  export interface FormKitCalendarProps {
9
11
  type?: 'date' | 'month' | 'year';
@@ -16,9 +18,17 @@ export interface FormKitCalendarProps {
16
18
  monthControls?: boolean;
17
19
  yearControls?: boolean;
18
20
  viewControl?: boolean;
19
- defaultValue?: DateValue | DateValue[] | CalendarDateRange;
20
- minValue?: DateValue;
21
- maxValue?: DateValue;
21
+ /**
22
+ * Shape of the value read from / written to the FormKit form data.
23
+ * `'calendar'` (default) keeps the native `@internationalized/date` `DateValue`.
24
+ * `'date'` converts to/from a JS `Date`. `'iso'` converts to/from an ISO 8601 string.
25
+ */
26
+ valueType?: DateValueType;
27
+ /** Timezone used when converting to/from `'date'`/`'iso'`. Defaults to the local timezone. */
28
+ timeZone?: string;
29
+ defaultValue?: DateLike | DateLike[] | CalendarDateRange;
30
+ minValue?: DateLike;
31
+ maxValue?: DateLike;
22
32
  isDateDisabled?: (date: DateValue) => boolean;
23
33
  isDateUnavailable?: (date: DateValue) => boolean;
24
34
  ui?: Record<string, unknown>;
@@ -1,11 +1,13 @@
1
1
  import type { FormKitFrameworkContext } from '@formkit/core';
2
2
  import type { CalendarDate, CalendarDateTime, DateValue, ZonedDateTime } from '@internationalized/date';
3
3
  import type { PropType } from 'vue';
4
+ import type { DateValueType } from '../../utils/dateValueConversion.js';
4
5
  import type { AvatarProps } from '#ui/components/Avatar.vue';
5
6
  export interface DateRange {
6
7
  start: CalendarDate | CalendarDateTime | ZonedDateTime;
7
8
  end: CalendarDate | CalendarDateTime | ZonedDateTime;
8
9
  }
10
+ type DateLike = CalendarDate | CalendarDateTime | ZonedDateTime | Date | string;
9
11
  export interface FormKitInputDateProps {
10
12
  color?: 'primary' | 'secondary' | 'success' | 'info' | 'warning' | 'error' | 'neutral';
11
13
  variant?: 'outline' | 'soft' | 'subtle' | 'ghost' | 'none';
@@ -24,15 +26,26 @@ export interface FormKitInputDateProps {
24
26
  trailingIcon?: string;
25
27
  loading?: boolean;
26
28
  loadingIcon?: string;
27
- defaultValue: CalendarDate | CalendarDateTime | ZonedDateTime | DateRange;
28
- placeholder?: CalendarDate | CalendarDateTime | ZonedDateTime;
29
- defaultPlaceholder?: CalendarDate | CalendarDateTime | ZonedDateTime;
29
+ /**
30
+ * Shape of the value read from / written to the FormKit form data.
31
+ * `'calendar'` (default) keeps the native `@internationalized/date` `DateValue`.
32
+ * `'date'` converts to/from a JS `Date`. `'iso'` converts to/from an ISO 8601 string.
33
+ */
34
+ valueType?: DateValueType;
35
+ /** Timezone used when converting to/from `'date'`/`'iso'`. Defaults to the local timezone. */
36
+ timeZone?: string;
37
+ defaultValue: DateLike | {
38
+ start: DateLike;
39
+ end: DateLike;
40
+ };
41
+ placeholder?: DateLike;
42
+ defaultPlaceholder?: DateLike;
30
43
  hourCycle?: 12 | 24;
31
44
  step?: Record<string, number>;
32
45
  granularity?: 'day' | 'hour' | 'minute' | 'second';
33
46
  hideTimeZone?: boolean;
34
- maxValue?: CalendarDate | CalendarDateTime | ZonedDateTime;
35
- minValue?: CalendarDate | CalendarDateTime | ZonedDateTime;
47
+ maxValue?: DateLike;
48
+ minValue?: DateLike;
36
49
  isDateUnavailable?: (date: DateValue) => boolean;
37
50
  ui?: Record<string, unknown>;
38
51
  }
@@ -1,12 +1,30 @@
1
1
  <script setup>
2
+ import { computed } from "vue";
2
3
  import { useFormKitInput } from "../../utils/useFormKitInput";
4
+ import { fromDateValueOrRange, toDateValue, toDateValueOrRange } from "../../utils/dateValueConversion";
3
5
  const props = defineProps({
4
6
  context: {
5
7
  type: Object,
6
8
  required: true
7
9
  }
8
10
  });
9
- const { handleInput, handleChange, isInvalid, styleClass, color, modelValue, validSlotNames } = useFormKitInput(props.context);
11
+ const { handleInput, handleChange, isInvalid, styleClass, color, validSlotNames } = useFormKitInput(props.context);
12
+ const conversionOptions = computed(() => ({
13
+ granularity: props.context.granularity,
14
+ hideTimeZone: props.context.hideTimeZone,
15
+ timeZone: props.context.timeZone
16
+ }));
17
+ const modelValue = computed({
18
+ get: () => toDateValueOrRange(props.context._value, conversionOptions.value),
19
+ set: (value) => {
20
+ props.context.node.input(fromDateValueOrRange(value, props.context.valueType ?? "calendar", props.context.timeZone));
21
+ }
22
+ });
23
+ const defaultValue = computed(() => toDateValueOrRange(props.context.defaultValue, conversionOptions.value));
24
+ const placeholder = computed(() => toDateValue(props.context.placeholder, conversionOptions.value));
25
+ const defaultPlaceholder = computed(() => toDateValue(props.context.defaultPlaceholder, conversionOptions.value));
26
+ const maxValue = computed(() => toDateValue(props.context.maxValue, conversionOptions.value));
27
+ const minValue = computed(() => toDateValue(props.context.minValue, conversionOptions.value));
10
28
  </script>
11
29
 
12
30
  <template>
@@ -14,7 +32,7 @@ const { handleInput, handleChange, isInvalid, styleClass, color, modelValue, val
14
32
  :id="context.id"
15
33
  v-model="modelValue"
16
34
  v-bind="{ ...context?.attrs }"
17
- :default-value="context.defaultValue"
35
+ :default-value="defaultValue"
18
36
  :class="styleClass"
19
37
  :disabled="!!context?.disabled"
20
38
  :readonly="context?.attrs.readonly ?? false"
@@ -23,8 +41,8 @@ const { handleInput, handleChange, isInvalid, styleClass, color, modelValue, val
23
41
  :highlight="isInvalid || context.highlight"
24
42
  :size="context.size ?? 'md'"
25
43
  :variant="context.variant ?? 'outline'"
26
- :placeholder="context.placeholder"
27
- :default-placeholder="context.defaultPlaceholder"
44
+ :placeholder="placeholder"
45
+ :default-placeholder="defaultPlaceholder"
28
46
  :autofocus="context.autofocus"
29
47
  :autofocus-delay="context.autofocusDelay"
30
48
  :fixed="context.fixed"
@@ -42,8 +60,8 @@ const { handleInput, handleChange, isInvalid, styleClass, color, modelValue, val
42
60
  :step="context.step"
43
61
  :granularity="context.granularity"
44
62
  :hide-time-zone="context.hideTimeZone"
45
- :max-value="context.maxValue"
46
- :min-value="context.minValue"
63
+ :max-value="maxValue"
64
+ :min-value="minValue"
47
65
  :is-date-unavailable="context.isDateUnavailable"
48
66
  :ui="context.ui"
49
67
  @change="handleChange"
@@ -1,11 +1,13 @@
1
1
  import type { FormKitFrameworkContext } from '@formkit/core';
2
2
  import type { CalendarDate, CalendarDateTime, DateValue, ZonedDateTime } from '@internationalized/date';
3
3
  import type { PropType } from 'vue';
4
+ import type { DateValueType } from '../../utils/dateValueConversion.js';
4
5
  import type { AvatarProps } from '#ui/components/Avatar.vue';
5
6
  export interface DateRange {
6
7
  start: CalendarDate | CalendarDateTime | ZonedDateTime;
7
8
  end: CalendarDate | CalendarDateTime | ZonedDateTime;
8
9
  }
10
+ type DateLike = CalendarDate | CalendarDateTime | ZonedDateTime | Date | string;
9
11
  export interface FormKitInputDateProps {
10
12
  color?: 'primary' | 'secondary' | 'success' | 'info' | 'warning' | 'error' | 'neutral';
11
13
  variant?: 'outline' | 'soft' | 'subtle' | 'ghost' | 'none';
@@ -24,15 +26,26 @@ export interface FormKitInputDateProps {
24
26
  trailingIcon?: string;
25
27
  loading?: boolean;
26
28
  loadingIcon?: string;
27
- defaultValue: CalendarDate | CalendarDateTime | ZonedDateTime | DateRange;
28
- placeholder?: CalendarDate | CalendarDateTime | ZonedDateTime;
29
- defaultPlaceholder?: CalendarDate | CalendarDateTime | ZonedDateTime;
29
+ /**
30
+ * Shape of the value read from / written to the FormKit form data.
31
+ * `'calendar'` (default) keeps the native `@internationalized/date` `DateValue`.
32
+ * `'date'` converts to/from a JS `Date`. `'iso'` converts to/from an ISO 8601 string.
33
+ */
34
+ valueType?: DateValueType;
35
+ /** Timezone used when converting to/from `'date'`/`'iso'`. Defaults to the local timezone. */
36
+ timeZone?: string;
37
+ defaultValue: DateLike | {
38
+ start: DateLike;
39
+ end: DateLike;
40
+ };
41
+ placeholder?: DateLike;
42
+ defaultPlaceholder?: DateLike;
30
43
  hourCycle?: 12 | 24;
31
44
  step?: Record<string, number>;
32
45
  granularity?: 'day' | 'hour' | 'minute' | 'second';
33
46
  hideTimeZone?: boolean;
34
- maxValue?: CalendarDate | CalendarDateTime | ZonedDateTime;
35
- minValue?: CalendarDate | CalendarDateTime | ZonedDateTime;
47
+ maxValue?: DateLike;
48
+ minValue?: DateLike;
36
49
  isDateUnavailable?: (date: DateValue) => boolean;
37
50
  ui?: Record<string, unknown>;
38
51
  }
@@ -20,7 +20,7 @@ import FUSlider from "../../../runtime/components/inputs/FUSlider.vue";
20
20
  import FUSwitch from "../../../runtime/components/inputs/FUSwitch.vue";
21
21
  import FUTextarea from "../../../runtime/components/inputs/FUTextarea.vue";
22
22
  export const nuxtUICalendarDefinition = createInput(FUCalendar, {
23
- props: ["type", "range", "multiple", "color", "variant", "size", "weekNumbers", "monthControls", "yearControls", "viewControl", "defaultValue", "minValue", "maxValue", "isDateDisabled", "isDateUnavailable", "ui"],
23
+ props: ["type", "range", "multiple", "color", "variant", "size", "weekNumbers", "monthControls", "yearControls", "viewControl", "defaultValue", "minValue", "maxValue", "isDateDisabled", "isDateUnavailable", "ui", "valueType", "timeZone"],
24
24
  family: "NuxtUIInput"
25
25
  });
26
26
  export const nuxtUICheckboxDefinition = createInput(FUCheckbox, {
@@ -48,7 +48,7 @@ export const nuxtUIInputDefinition = createInput(FUInput, {
48
48
  family: "NuxtUIInput"
49
49
  });
50
50
  export const nuxtUIInputDateDefinition = createInput(FUInputDate, {
51
- props: ["defaultValue", "color", "variant", "size", "highlight", "fixed", "autofocus", "autofocusDelay", "range", "separatorIcon", "icon", "avatar", "leading", "leadingIcon", "trailing", "trailingIcon", "loading", "loadingIcon", "placeholder", "defaultPlaceholder", "hourCycle", "step", "granularity", "hideTimeZone", "maxValue", "minValue", "isDateUnavailable", "ui"],
51
+ props: ["defaultValue", "color", "variant", "size", "highlight", "fixed", "autofocus", "autofocusDelay", "range", "separatorIcon", "icon", "avatar", "leading", "leadingIcon", "trailing", "trailingIcon", "loading", "loadingIcon", "placeholder", "defaultPlaceholder", "hourCycle", "step", "granularity", "hideTimeZone", "maxValue", "minValue", "isDateUnavailable", "ui", "valueType", "timeZone"],
52
52
  family: "NuxtUIInput"
53
53
  });
54
54
  export const nuxtUIInputMenuDefinition = createInput(FUInputMenu, {
@@ -20,7 +20,7 @@ import FUSlider from "../../../runtime/components/inputs/FUSlider.vue";
20
20
  import FUSwitch from "../../../runtime/components/inputs/FUSwitch.vue";
21
21
  import FUTextarea from "../../../runtime/components/inputs/FUTextarea.vue";
22
22
  export const nuxtUICalendarDefinition = createInput(FUCalendar, {
23
- props: ["type", "range", "multiple", "color", "variant", "size", "weekNumbers", "monthControls", "yearControls", "viewControl", "defaultValue", "minValue", "maxValue", "isDateDisabled", "isDateUnavailable", "ui"],
23
+ props: ["type", "range", "multiple", "color", "variant", "size", "weekNumbers", "monthControls", "yearControls", "viewControl", "defaultValue", "minValue", "maxValue", "isDateDisabled", "isDateUnavailable", "ui", "valueType", "timeZone"],
24
24
  family: "NuxtUIInput"
25
25
  });
26
26
  export const nuxtUICheckboxDefinition = createInput(FUCheckbox, {
@@ -48,7 +48,7 @@ export const nuxtUIInputDefinition = createInput(FUInput, {
48
48
  family: "NuxtUIInput"
49
49
  });
50
50
  export const nuxtUIInputDateDefinition = createInput(FUInputDate, {
51
- props: ["defaultValue", "color", "variant", "size", "highlight", "fixed", "autofocus", "autofocusDelay", "range", "separatorIcon", "icon", "avatar", "leading", "leadingIcon", "trailing", "trailingIcon", "loading", "loadingIcon", "placeholder", "defaultPlaceholder", "hourCycle", "step", "granularity", "hideTimeZone", "maxValue", "minValue", "isDateUnavailable", "ui"],
51
+ props: ["defaultValue", "color", "variant", "size", "highlight", "fixed", "autofocus", "autofocusDelay", "range", "separatorIcon", "icon", "avatar", "leading", "leadingIcon", "trailing", "trailingIcon", "loading", "loadingIcon", "placeholder", "defaultPlaceholder", "hourCycle", "step", "granularity", "hideTimeZone", "maxValue", "minValue", "isDateUnavailable", "ui", "valueType", "timeZone"],
52
52
  family: "NuxtUIInput"
53
53
  });
54
54
  export const nuxtUIInputMenuDefinition = createInput(FUInputMenu, {
@@ -0,0 +1,35 @@
1
+ import type { DateValue } from '@internationalized/date';
2
+ import { CalendarDate, CalendarDateTime, ZonedDateTime } from '@internationalized/date';
3
+ export type DateValueType = 'calendar' | 'date' | 'iso';
4
+ export interface DateConversionOptions {
5
+ granularity?: 'day' | 'hour' | 'minute' | 'second';
6
+ hideTimeZone?: boolean;
7
+ timeZone?: string;
8
+ }
9
+ /**
10
+ * Converts an external value (JS `Date`, ISO 8601 string, or an already-native
11
+ * `DateValue`) into the `DateValue` that `UInputDate`/`UCalendar` require.
12
+ */
13
+ export declare function toDateValue(value: unknown, options?: DateConversionOptions): DateValue | undefined;
14
+ /** Same as {@link toDateValue}, but also handles the `{ start, end }` range shape. */
15
+ export declare function toDateValueOrRange(value: unknown, options?: DateConversionOptions): CalendarDate | CalendarDateTime | ZonedDateTime | {
16
+ start: DateValue | undefined;
17
+ end: DateValue | undefined;
18
+ } | undefined;
19
+ /** Same as {@link toDateValueOrRange}, but also handles arrays (multiple-selection mode). */
20
+ export declare function toDateValueOrRangeOrArray(value: unknown, options?: DateConversionOptions): CalendarDate | CalendarDateTime | ZonedDateTime | {
21
+ start: DateValue | undefined;
22
+ end: DateValue | undefined;
23
+ } | DateValue[] | undefined;
24
+ /** Converts a `DateValue` emitted by `UInputDate`/`UCalendar` back into the shape the form value should take. */
25
+ export declare function fromDateValue(value: DateValue | undefined, valueType: DateValueType, timeZone?: string): DateValue | Date | string | undefined;
26
+ /** Same as {@link fromDateValue}, but also handles the `{ start, end }` range shape. */
27
+ export declare function fromDateValueOrRange(value: unknown, valueType: DateValueType, timeZone?: string): string | Date | CalendarDate | CalendarDateTime | ZonedDateTime | {
28
+ start: string | Date | DateValue | undefined;
29
+ end: string | Date | DateValue | undefined;
30
+ } | undefined;
31
+ /** Same as {@link fromDateValueOrRange}, but also handles arrays (multiple-selection mode). */
32
+ export declare function fromDateValueOrRangeOrArray(value: unknown, valueType: DateValueType, timeZone?: string): string | Date | CalendarDate | CalendarDateTime | ZonedDateTime | {
33
+ start: string | Date | DateValue | undefined;
34
+ end: string | Date | DateValue | undefined;
35
+ } | (string | Date | DateValue | undefined)[] | undefined;
@@ -0,0 +1,80 @@
1
+ import { CalendarDate, CalendarDateTime, ZonedDateTime, fromDate, getLocalTimeZone, parseAbsolute, parseDate, parseDateTime, toCalendarDate, toCalendarDateTime } from "@internationalized/date";
2
+ const ISO_DATE_ONLY = /^\d{4}-\d{2}-\d{2}$/;
3
+ const ISO_HAS_ZONE = /(?:Z|[+-]\d{2}:\d{2})(?:\[[^\]]+\])?$/;
4
+ function isDateValue(value) {
5
+ return value instanceof CalendarDate || value instanceof CalendarDateTime || value instanceof ZonedDateTime;
6
+ }
7
+ function isRangeLike(value) {
8
+ return typeof value === "object" && value !== null && "start" in value && "end" in value;
9
+ }
10
+ export function toDateValue(value, options = {}) {
11
+ if (value === void 0 || value === null || value === "") {
12
+ return void 0;
13
+ }
14
+ if (isDateValue(value)) {
15
+ return value;
16
+ }
17
+ const timeZone = options.timeZone ?? getLocalTimeZone();
18
+ const withTime = options.granularity != null && options.granularity !== "day";
19
+ if (value instanceof Date) {
20
+ const zoned = fromDate(value, timeZone);
21
+ if (!withTime) {
22
+ return toCalendarDate(zoned);
23
+ }
24
+ return options.hideTimeZone ? toCalendarDateTime(zoned) : zoned;
25
+ }
26
+ if (typeof value === "string") {
27
+ if (!withTime && ISO_DATE_ONLY.test(value)) {
28
+ return parseDate(value);
29
+ }
30
+ if (withTime && !ISO_HAS_ZONE.test(value)) {
31
+ return parseDateTime(value);
32
+ }
33
+ const zoned = parseAbsolute(value, timeZone);
34
+ return withTime ? options.hideTimeZone ? toCalendarDateTime(zoned) : zoned : toCalendarDate(zoned);
35
+ }
36
+ return void 0;
37
+ }
38
+ export function toDateValueOrRange(value, options = {}) {
39
+ if (isRangeLike(value)) {
40
+ return {
41
+ start: toDateValue(value.start, options),
42
+ end: toDateValue(value.end, options)
43
+ };
44
+ }
45
+ return toDateValue(value, options);
46
+ }
47
+ export function toDateValueOrRangeOrArray(value, options = {}) {
48
+ if (Array.isArray(value)) {
49
+ return value.map((item) => toDateValue(item, options)).filter((item) => item !== void 0);
50
+ }
51
+ return toDateValueOrRange(value, options);
52
+ }
53
+ export function fromDateValue(value, valueType, timeZone) {
54
+ if (value === void 0 || value === null) {
55
+ return void 0;
56
+ }
57
+ if (valueType === "calendar") {
58
+ return value;
59
+ }
60
+ const jsDate = value instanceof ZonedDateTime ? value.toDate() : value.toDate(timeZone ?? getLocalTimeZone());
61
+ if (valueType === "date") {
62
+ return jsDate;
63
+ }
64
+ return value.toString();
65
+ }
66
+ export function fromDateValueOrRange(value, valueType, timeZone) {
67
+ if (isRangeLike(value)) {
68
+ return {
69
+ start: fromDateValue(value.start, valueType, timeZone),
70
+ end: fromDateValue(value.end, valueType, timeZone)
71
+ };
72
+ }
73
+ return fromDateValue(value, valueType, timeZone);
74
+ }
75
+ export function fromDateValueOrRangeOrArray(value, valueType, timeZone) {
76
+ if (Array.isArray(value)) {
77
+ return value.map((item) => fromDateValue(item, valueType, timeZone));
78
+ }
79
+ return fromDateValueOrRange(value, valueType, timeZone);
80
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sfxcode/nuxt-ui-formkit",
3
- "version": "1.2.0",
3
+ "version": "1.2.1",
4
4
  "description": "FormKit integration for Nuxt UI - Seamlessly connect FormKit form handling with Nuxt UI components",
5
5
  "author": {
6
6
  "name": "Tom",
@@ -78,7 +78,7 @@
78
78
  "dev": "npm run dev:prepare && nuxi dev playground",
79
79
  "dev:build": "nuxi build playground",
80
80
  "dev:prepare": "nuxt-module-build build --stub && nuxt-module-build prepare && nuxi prepare playground",
81
- "release": "npm run lint && npm run test && npm run prepack && changelogen --minor --release && npm publish --access=public && git push --follow-tags",
81
+ "release": "npm run lint && npm run test && npm run prepack && changelogen --patch --release && npm publish --access=public && git push --follow-tags",
82
82
  "lint": "eslint .",
83
83
  "test": "vitest run",
84
84
  "test:watch": "vitest watch",