@gxp-dev/mod-ui 2.0.0 → 2.0.3

package/dist/components/compositions/elements/picker/DatePicker.vue.d.ts

@@ -0,0 +1,32 @@
+export interface DatePickerProps {
+    modelValue?: string | null;
+    id?: string;
+    name?: string;
+    label?: string;
+    hideLabel?: boolean;
+    placeholder?: string;
+    required?: boolean;
+    readonly?: boolean;
+    disabled?: boolean;
+    helpText?: string;
+    errors?: string[];
+    /** ISO date string, e.g. "2024-06-10" */
+    minDate?: string;
+    /** ISO date string, e.g. "2024-06-25" */
+    maxDate?: string;
+    /** Display format. Default `yyyy-MM-dd`. */
+    format?: string;
+}
+type __VLS_Props = DatePickerProps;
+type __VLS_PublicProps = {
+    "modelValue"?: string | null;
+} & __VLS_Props;
+declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: string | null) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string | null) => any) | undefined;
+}>, {
+    errors: string[];
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;
+//# sourceMappingURL=DatePicker.vue.d.ts.map

package/dist/components/compositions/elements/picker/DatePicker.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DatePicker.vue.d.ts","sourceRoot":"","sources":["../../../../../src/components/compositions/elements/picker/DatePicker.vue"],"names":[],"mappings":"AAiMA,MAAM,WAAW,eAAe;IAC9B,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC1B,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,MAAM,CAAC,EAAE,MAAM,EAAE,CAAA;IACjB,yCAAyC;IACzC,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,yCAAyC;IACzC,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,4CAA4C;IAC5C,MAAM,CAAC,EAAE,MAAM,CAAA;CAChB;AAED,KAAK,WAAW,GAAG,eAAe,CAAC;AAkFnC,KAAK,iBAAiB,GAAG;IACzB,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC5B,GAAG,WAAW,CAAC;;;;;;YA7FL,MAAM,EAAE;;AA4QnB,wBASG"}

package/dist/components/compositions/elements/picker/DatePicker.vue.js

@@ -1,5 +1,143 @@
-import f from "./DatePicker.vue2.js";
+import { defineComponent as b, useModel as V, ref as g, computed as u, openBlock as w, createBlock as B, unref as o, withCtx as i, createVNode as r, normalizeClass as $, createElementVNode as C, toDisplayString as M, mergeModels as S } from "vue";
+import { Calendar as k } from "lucide-vue-next";
+import { parseDate as q, CalendarDate as y } from "@internationalized/date";
+import "../../../ui/button/index.js";
+import T from "../../../ui/calendar/Calendar.vue.js";
+import "@vueuse/core";
+import "reka-ui";
+import { cn as P } from "../../../../lib/utils.js";
+import z from "../../../ui/field-frame/FieldFrame.vue.js";
+import L from "../../../ui/popover/Popover.vue.js";
+import N from "../../../ui/popover/PopoverContent.vue.js";
+import U from "../../../ui/popover/PopoverTrigger.vue.js";
+import j from "../../../ui/button/Button.vue.js";
+const Y = /* @__PURE__ */ b({
+  __name: "DatePicker",
+  props: /* @__PURE__ */ S({
+    modelValue: {},
+    id: {},
+    name: {},
+    label: {},
+    hideLabel: { type: Boolean },
+    placeholder: {},
+    required: { type: Boolean },
+    readonly: { type: Boolean },
+    disabled: { type: Boolean },
+    helpText: {},
+    errors: { default: () => [] },
+    minDate: {},
+    maxDate: {},
+    format: {}
+  }, {
+    modelValue: {},
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(a) {
+    const n = a, d = V(a, "modelValue"), s = g(!1), c = u(() => {
+      const e = d.value;
+      if (e)
+        return m(e);
+    }), f = u(
+      () => n.minDate ? m(n.minDate) : void 0
+    ), p = u(
+      () => n.maxDate ? m(n.maxDate) : void 0
+    ), v = u(() => {
+      const e = d.value;
+      return e ? h(e, n.format) : "";
+    });
+    function m(e) {
+      try {
+        const t = e.includes("T") ? e.slice(0, 10) : e;
+        return q(t);
+      } catch {
+        return;
+      }
+    }
+    function h(e, t) {
+      const l = m(e);
+      if (!l)
+        return e;
+      if (!t || t === "yyyy-MM-dd")
+        return l.toString();
+      const D = new Date(l.year, l.month - 1, l.day);
+      try {
+        return new Intl.DateTimeFormat(void 0, {
+          year: "numeric",
+          month: "short",
+          day: "2-digit"
+        }).format(D);
+      } catch {
+        return l.toString();
+      }
+    }
+    function x(e) {
+      if (!e) {
+        d.value = null;
+        return;
+      }
+      const t = e instanceof y ? e : new y(e.year, e.month, e.day);
+      d.value = t.toString(), s.value = !1;
+    }
+    return (e, t) => (w(), B(o(z), {
+      label: a.label,
+      required: a.required,
+      "hide-label": a.hideLabel,
+      for: a.id,
+      "help-text": a.helpText,
+      errors: a.errors
+    }, {
+      default: i(() => [
+        r(o(L), {
+          open: s.value,
+          "onUpdate:open": t[0] || (t[0] = (l) => s.value = l)
+        }, {
+          default: i(() => [
+            r(o(U), { "as-child": "" }, {
+              default: i(() => [
+                r(o(j), {
+                  type: "button",
+                  variant: "outline",
+                  disabled: a.disabled,
+                  class: $(
+                    o(P)(
+                      "w-full justify-start text-left font-normal",
+                      !d.value && "text-muted-foreground"
+                    )
+                  ),
+                  "data-element-name": a.name ?? void 0,
+                  "data-readonly": a.readonly || void 0
+                }, {
+                  default: i(() => [
+                    r(o(k), { class: "mr-2 size-4" }),
+                    C("span", null, M(v.value || a.placeholder || "Pick a date"), 1)
+                  ]),
+                  _: 1
+                }, 8, ["disabled", "class", "data-element-name", "data-readonly"])
+              ]),
+              _: 1
+            }),
+            r(o(N), { class: "w-auto p-0" }, {
+              default: i(() => [
+                r(o(T), {
+                  "model-value": c.value,
+                  "min-value": f.value,
+                  "max-value": p.value,
+                  placeholder: c.value ?? f.value ?? p.value,
+                  "onUpdate:modelValue": x
+                }, null, 8, ["model-value", "min-value", "max-value", "placeholder"])
+              ]),
+              _: 1
+            })
+          ]),
+          _: 1
+        }, 8, ["open"])
+      ]),
+      _: 1
+    }, 8, ["label", "required", "hide-label", "for", "help-text", "errors"]));
+  }
+});
 export {
-  f as default
+  Y as default
 };
 //# sourceMappingURL=DatePicker.vue.js.map

package/dist/components/compositions/elements/picker/DatePicker.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"DatePicker.vue.js","sources":["../../../../../src/components/compositions/elements/picker/DatePicker.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven date picker composition. Popover trigger Button shows the\n * formatted current date; the popover hosts the shadcn `Calendar`.\n * Values round-trip as ISO date strings (`yyyy-MM-dd` by default).\n *\n *   <DatePicker v-model=\"startsAt\" label=\"Starts at\" />\n *\n * Self-contained — no Pinia / store coupling. Composes `FieldFrame` for\n * label / helpText / errors chrome.\n */\nimport { computed, ref } from \"vue\"\nimport { Calendar as CalendarIcon } from \"lucide-vue-next\"\nimport {\n  CalendarDate,\n  parseDate,\n  type DateValue,\n} from \"@internationalized/date\"\nimport { Button } from \"@/components/ui/button\"\nimport { Calendar } from \"@/components/ui/calendar\"\nimport { FieldFrame } from \"@/components/ui/field-frame\"\nimport {\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from \"@/components/ui/popover\"\nimport { cn } from \"@/lib/utils\"\n\nexport interface DatePickerProps {\n  modelValue?: string | null\n  id?: string\n  name?: string\n  label?: string\n  hideLabel?: boolean\n  placeholder?: string\n  required?: boolean\n  readonly?: boolean\n  disabled?: boolean\n  helpText?: string\n  errors?: string[]\n  /** ISO date string, e.g. \"2024-06-10\" */\n  minDate?: string\n  /** ISO date string, e.g. \"2024-06-25\" */\n  maxDate?: string\n  /** Display format. Default `yyyy-MM-dd`. */\n  format?: string\n}\n\nconst props = withDefaults(defineProps<DatePickerProps>(), {\n  errors: () => [],\n})\n\nconst model = defineModel<string | null>(\"modelValue\")\n\nconst open = ref(false)\n\nconst calendarValue = computed<DateValue | undefined>(() => {\n  const iso = model.value\n  if (!iso) {\n    return undefined\n  }\n  return safeParseDate(iso)\n})\n\nconst min = computed<DateValue | undefined>(() =>\n  props.minDate ? safeParseDate(props.minDate) : undefined,\n)\n\nconst max = computed<DateValue | undefined>(() =>\n  props.maxDate ? safeParseDate(props.maxDate) : undefined,\n)\n\nconst displayValue = computed<string>(() => {\n  const iso = model.value\n  if (!iso) {\n    return \"\"\n  }\n  return formatDate(iso, props.format)\n})\n\nfunction safeParseDate(value: string): DateValue | undefined {\n  try {\n    // Accept full ISO datetime (\"2024-06-15T00:00:00Z\") or date-only.\n    const dateOnly = value.includes(\"T\") ? value.slice(0, 10) : value\n    return parseDate(dateOnly)\n  } catch {\n    return undefined\n  }\n}\n\nfunction formatDate(iso: string, format?: string): string {\n  const parsed = safeParseDate(iso)\n  if (!parsed) {\n    return iso\n  }\n  if (!format || format === \"yyyy-MM-dd\") {\n    return parsed.toString()\n  }\n  const date = new Date(parsed.year, parsed.month - 1, parsed.day)\n  try {\n    return new Intl.DateTimeFormat(undefined, {\n      year: \"numeric\",\n      month: \"short\",\n      day: \"2-digit\",\n    }).format(date)\n  } catch {\n    return parsed.toString()\n  }\n}\n\nfunction onSelect(value: DateValue | undefined): void {\n  if (!value) {\n    model.value = null\n    return\n  }\n  const calendar =\n    value instanceof CalendarDate\n      ? value\n      : new CalendarDate(value.year, value.month, value.day)\n  model.value = calendar.toString()\n  open.value = false\n}\n</script>\n\n<template>\n  <FieldFrame\n    :label=\"label\"\n    :required=\"required\"\n    :hide-label=\"hideLabel\"\n    :for=\"id\"\n    :help-text=\"helpText\"\n    :errors=\"errors\"\n  >\n    <Popover v-model:open=\"open\">\n      <PopoverTrigger as-child>\n        <Button\n          type=\"button\"\n          variant=\"outline\"\n          :disabled=\"disabled\"\n          :class=\"\n            cn(\n              'w-full justify-start text-left font-normal',\n              !model && 'text-muted-foreground',\n            )\n          \"\n          :data-element-name=\"name ?? undefined\"\n          :data-readonly=\"readonly || undefined\"\n        >\n          <CalendarIcon class=\"mr-2 size-4\" />\n          <span>{{ displayValue || placeholder || \"Pick a date\" }}</span>\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent class=\"w-auto p-0\">\n        <Calendar\n          :model-value=\"calendarValue\"\n          :min-value=\"min\"\n          :max-value=\"max\"\n          :placeholder=\"calendarValue ?? min ?? max\"\n          @update:model-value=\"onSelect\"\n        />\n      </PopoverContent>\n    </Popover>\n  </FieldFrame>\n</template>\n"],"names":["props","__props","model","_useModel","open","ref","calendarValue","computed","iso","safeParseDate","min","max","displayValue","formatDate","value","dateOnly","parseDate","format","parsed","date","onSelect","calendar","CalendarDate","_createBlock","_unref","FieldFrame","_createVNode","Popover","$event","PopoverTrigger","Button","_normalizeClass","cn","CalendarIcon","_createElementVNode","_toDisplayString","PopoverContent","Calendar"],"mappings":"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"}

package/dist/components/compositions/elements/picker/DatePicker.vue2.js

@@ -1,143 +1,5 @@
-import { defineComponent as b, useModel as V, ref as g, computed as u, openBlock as w, createBlock as B, unref as o, withCtx as i, createVNode as r, normalizeClass as $, createElementVNode as C, toDisplayString as M, mergeModels as S } from "vue";
-import { Calendar as k } from "lucide-vue-next";
-import { parseDate as q, CalendarDate as y } from "@internationalized/date";
-import "../../../ui/button/index.js";
-import T from "../../../ui/calendar/Calendar.vue.js";
-import "@vueuse/core";
-import "reka-ui";
-import { cn as P } from "../../../../lib/utils.js";
-import z from "../../../ui/field-frame/FieldFrame.vue.js";
-import L from "../../../ui/popover/Popover.vue.js";
-import N from "../../../ui/popover/PopoverContent.vue.js";
-import U from "../../../ui/popover/PopoverTrigger.vue.js";
-import j from "../../../ui/button/Button.vue.js";
-const Y = /* @__PURE__ */ b({
-  __name: "DatePicker",
-  props: /* @__PURE__ */ S({
-    modelValue: {},
-    id: {},
-    name: {},
-    label: {},
-    hideLabel: { type: Boolean },
-    placeholder: {},
-    required: { type: Boolean },
-    readonly: { type: Boolean },
-    disabled: { type: Boolean },
-    helpText: {},
-    errors: { default: () => [] },
-    minDate: {},
-    maxDate: {},
-    format: {}
-  }, {
-    modelValue: {},
-    modelModifiers: {}
-  }),
-  emits: ["update:modelValue"],
-  setup(a) {
-    const n = a, d = V(a, "modelValue"), s = g(!1), c = u(() => {
-      const e = d.value;
-      if (e)
-        return m(e);
-    }), f = u(
-      () => n.minDate ? m(n.minDate) : void 0
-    ), p = u(
-      () => n.maxDate ? m(n.maxDate) : void 0
-    ), v = u(() => {
-      const e = d.value;
-      return e ? h(e, n.format) : "";
-    });
-    function m(e) {
-      try {
-        const t = e.includes("T") ? e.slice(0, 10) : e;
-        return q(t);
-      } catch {
-        return;
-      }
-    }
-    function h(e, t) {
-      const l = m(e);
-      if (!l)
-        return e;
-      if (!t || t === "yyyy-MM-dd")
-        return l.toString();
-      const D = new Date(l.year, l.month - 1, l.day);
-      try {
-        return new Intl.DateTimeFormat(void 0, {
-          year: "numeric",
-          month: "short",
-          day: "2-digit"
-        }).format(D);
-      } catch {
-        return l.toString();
-      }
-    }
-    function x(e) {
-      if (!e) {
-        d.value = null;
-        return;
-      }
-      const t = e instanceof y ? e : new y(e.year, e.month, e.day);
-      d.value = t.toString(), s.value = !1;
-    }
-    return (e, t) => (w(), B(o(z), {
-      label: a.label,
-      required: a.required,
-      "hide-label": a.hideLabel,
-      for: a.id,
-      "help-text": a.helpText,
-      errors: a.errors
-    }, {
-      default: i(() => [
-        r(o(L), {
-          open: s.value,
-          "onUpdate:open": t[0] || (t[0] = (l) => s.value = l)
-        }, {
-          default: i(() => [
-            r(o(U), { "as-child": "" }, {
-              default: i(() => [
-                r(o(j), {
-                  type: "button",
-                  variant: "outline",
-                  disabled: a.disabled,
-                  class: $(
-                    o(P)(
-                      "w-full justify-start text-left font-normal",
-                      !d.value && "text-muted-foreground"
-                    )
-                  ),
-                  "data-element-name": a.name ?? void 0,
-                  "data-readonly": a.readonly || void 0
-                }, {
-                  default: i(() => [
-                    r(o(k), { class: "mr-2 size-4" }),
-                    C("span", null, M(v.value || a.placeholder || "Pick a date"), 1)
-                  ]),
-                  _: 1
-                }, 8, ["disabled", "class", "data-element-name", "data-readonly"])
-              ]),
-              _: 1
-            }),
-            r(o(N), { class: "w-auto p-0" }, {
-              default: i(() => [
-                r(o(T), {
-                  "model-value": c.value,
-                  "min-value": f.value,
-                  "max-value": p.value,
-                  placeholder: c.value ?? f.value ?? p.value,
-                  "onUpdate:modelValue": x
-                }, null, 8, ["model-value", "min-value", "max-value", "placeholder"])
-              ]),
-              _: 1
-            })
-          ]),
-          _: 1
-        }, 8, ["open"])
-      ]),
-      _: 1
-    }, 8, ["label", "required", "hide-label", "for", "help-text", "errors"]));
-  }
-});
+import f from "./DatePicker.vue.js";
 export {
-  Y as default
+  f as default
 };
 //# sourceMappingURL=DatePicker.vue2.js.map

package/dist/components/compositions/elements/picker/DatePicker.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.vue2.js","sources":["../../../../../src/components/compositions/elements/picker/DatePicker.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven date picker composition. Popover trigger Button shows the\n * formatted current date; the popover hosts the shadcn `Calendar`.\n * Values round-trip as ISO date strings (`yyyy-MM-dd` by default).\n *\n *   <DatePicker v-model=\"startsAt\" label=\"Starts at\" />\n *\n * Self-contained — no Pinia / store coupling. Composes `FieldFrame` for\n * label / helpText / errors chrome.\n */\nimport { computed, ref } from \"vue\"\nimport { Calendar as CalendarIcon } from \"lucide-vue-next\"\nimport {\n  CalendarDate,\n  parseDate,\n  type DateValue,\n} from \"@internationalized/date\"\nimport { Button } from \"@/components/ui/button\"\nimport { Calendar } from \"@/components/ui/calendar\"\nimport { FieldFrame } from \"@/components/ui/field-frame\"\nimport {\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from \"@/components/ui/popover\"\nimport { cn } from \"@/lib/utils\"\n\nexport interface DatePickerProps {\n  modelValue?: string | null\n  id?: string\n  name?: string\n  label?: string\n  hideLabel?: boolean\n  placeholder?: string\n  required?: boolean\n  readonly?: boolean\n  disabled?: boolean\n  helpText?: string\n  errors?: string[]\n  /** ISO date string, e.g. \"2024-06-10\" */\n  minDate?: string\n  /** ISO date string, e.g. \"2024-06-25\" */\n  maxDate?: string\n  /** Display format. Default `yyyy-MM-dd`. */\n  format?: string\n}\n\nconst props = withDefaults(defineProps<DatePickerProps>(), {\n  errors: () => [],\n})\n\nconst model = defineModel<string | null>(\"modelValue\")\n\nconst open = ref(false)\n\nconst calendarValue = computed<DateValue | undefined>(() => {\n  const iso = model.value\n  if (!iso) {\n    return undefined\n  }\n  return safeParseDate(iso)\n})\n\nconst min = computed<DateValue | undefined>(() =>\n  props.minDate ? safeParseDate(props.minDate) : undefined,\n)\n\nconst max = computed<DateValue | undefined>(() =>\n  props.maxDate ? safeParseDate(props.maxDate) : undefined,\n)\n\nconst displayValue = computed<string>(() => {\n  const iso = model.value\n  if (!iso) {\n    return \"\"\n  }\n  return formatDate(iso, props.format)\n})\n\nfunction safeParseDate(value: string): DateValue | undefined {\n  try {\n    // Accept full ISO datetime (\"2024-06-15T00:00:00Z\") or date-only.\n    const dateOnly = value.includes(\"T\") ? value.slice(0, 10) : value\n    return parseDate(dateOnly)\n  } catch {\n    return undefined\n  }\n}\n\nfunction formatDate(iso: string, format?: string): string {\n  const parsed = safeParseDate(iso)\n  if (!parsed) {\n    return iso\n  }\n  if (!format || format === \"yyyy-MM-dd\") {\n    return parsed.toString()\n  }\n  const date = new Date(parsed.year, parsed.month - 1, parsed.day)\n  try {\n    return new Intl.DateTimeFormat(undefined, {\n      year: \"numeric\",\n      month: \"short\",\n      day: \"2-digit\",\n    }).format(date)\n  } catch {\n    return parsed.toString()\n  }\n}\n\nfunction onSelect(value: DateValue | undefined): void {\n  if (!value) {\n    model.value = null\n    return\n  }\n  const calendar =\n    value instanceof CalendarDate\n      ? value\n      : new CalendarDate(value.year, value.month, value.day)\n  model.value = calendar.toString()\n  open.value = false\n}\n</script>\n\n<template>\n  <FieldFrame\n    :label=\"label\"\n    :required=\"required\"\n    :hide-label=\"hideLabel\"\n    :for=\"id\"\n    :help-text=\"helpText\"\n    :errors=\"errors\"\n  >\n    <Popover v-model:open=\"open\">\n      <PopoverTrigger as-child>\n        <Button\n          type=\"button\"\n          variant=\"outline\"\n          :disabled=\"disabled\"\n          :class=\"\n            cn(\n              'w-full justify-start text-left font-normal',\n              !model && 'text-muted-foreground',\n            )\n          \"\n          :data-element-name=\"name ?? undefined\"\n          :data-readonly=\"readonly || undefined\"\n        >\n          <CalendarIcon class=\"mr-2 size-4\" />\n          <span>{{ displayValue || placeholder || \"Pick a date\" }}</span>\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent class=\"w-auto p-0\">\n        <Calendar\n          :model-value=\"calendarValue\"\n          :min-value=\"min\"\n          :max-value=\"max\"\n          :placeholder=\"calendarValue ?? min ?? max\"\n          @update:model-value=\"onSelect\"\n        />\n      </PopoverContent>\n    </Popover>\n  </FieldFrame>\n</template>\n"],"names":["props","__props","model","_useModel","open","ref","calendarValue","computed","iso","safeParseDate","min","max","displayValue","formatDate","value","dateOnly","parseDate","format","parsed","date","onSelect","calendar","CalendarDate","_createBlock","_unref","FieldFrame","_createVNode","Popover","$event","PopoverTrigger","Button","_normalizeClass","cn","CalendarIcon","_createElementVNode","_toDisplayString","PopoverContent","Calendar"],"mappings":"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"}
+{"version":3,"file":"DatePicker.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/compositions/elements/picker/DateTimePicker.vue.d.ts

@@ -0,0 +1,26 @@
+export interface DateTimePickerProps {
+    modelValue?: string | null;
+    id?: string;
+    name?: string;
+    label?: string;
+    hideLabel?: boolean;
+    placeholder?: string;
+    required?: boolean;
+    readonly?: boolean;
+    disabled?: boolean;
+    helpText?: string;
+    errors?: string[];
+}
+type __VLS_Props = DateTimePickerProps;
+type __VLS_PublicProps = {
+    "modelValue"?: string | null;
+} & __VLS_Props;
+declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: string | null) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string | null) => any) | undefined;
+}>, {
+    errors: string[];
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;
+//# sourceMappingURL=DateTimePicker.vue.d.ts.map

package/dist/components/compositions/elements/picker/DateTimePicker.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateTimePicker.vue.d.ts","sourceRoot":"","sources":["../../../../../src/components/compositions/elements/picker/DateTimePicker.vue"],"names":[],"mappings":"AA2OA,MAAM,WAAW,mBAAmB;IAClC,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC1B,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,MAAM,CAAC,EAAE,MAAM,EAAE,CAAA;CAClB;AAED,KAAK,WAAW,GAAG,mBAAmB,CAAC;AA4GvC,KAAK,iBAAiB,GAAG;IACzB,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC5B,GAAG,WAAW,CAAC;;;;;;YAjHL,MAAM,EAAE;;AA4WnB,wBASG"}

package/dist/components/compositions/elements/picker/DateTimePicker.vue.js

@@ -1,5 +1,174 @@
-import f from "./DateTimePicker.vue2.js";
+import { defineComponent as C, useModel as B, ref as f, watchEffect as T, computed as x, openBlock as k, createBlock as D, unref as n, withCtx as i, createVNode as u, normalizeClass as I, createElementVNode as p, toDisplayString as P, mergeModels as q } from "vue";
+import { Calendar as U, Clock as z } from "lucide-vue-next";
+import { parseDate as H, CalendarDate as y } from "@internationalized/date";
+import "../../../ui/button/index.js";
+import E from "../../../ui/calendar/Calendar.vue.js";
+import "@vueuse/core";
+import "reka-ui";
+import { cn as L } from "../../../../lib/utils.js";
+import $ from "../../../ui/input/Input.vue.js";
+import N from "../../../ui/field-frame/FieldFrame.vue.js";
+import j from "../../../ui/popover/Popover.vue.js";
+import A from "../../../ui/popover/PopoverContent.vue.js";
+import F from "../../../ui/popover/PopoverTrigger.vue.js";
+import G from "../../../ui/button/Button.vue.js";
+const J = { class: "flex items-center gap-2 border-t p-3" }, oe = /* @__PURE__ */ C({
+  __name: "DateTimePicker",
+  props: /* @__PURE__ */ q({
+    modelValue: {},
+    id: {},
+    name: {},
+    label: {},
+    hideLabel: { type: Boolean },
+    placeholder: {},
+    required: { type: Boolean },
+    readonly: { type: Boolean },
+    disabled: { type: Boolean },
+    helpText: {},
+    errors: { default: () => [] }
+  }, {
+    modelValue: {},
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(t) {
+    const m = B(t, "modelValue"), l = f(""), o = f(""), r = f("");
+    T(() => {
+      const e = m.value;
+      if (!e) {
+        l.value = "", o.value = "", r.value = "";
+        return;
+      }
+      const [a, d] = e.split("T");
+      if (l.value = a ?? "", d) {
+        const [S, w] = d.split(":");
+        o.value = S ?? "", r.value = (w ?? "").slice(0, 2);
+      } else
+        o.value = "", r.value = "";
+    });
+    const v = f(!1), h = x(() => {
+      if (l.value)
+        try {
+          return H(l.value);
+        } catch {
+          return;
+        }
+    });
+    function s() {
+      if (!l.value) {
+        m.value = null;
+        return;
+      }
+      if (o.value === "" && r.value === "") {
+        m.value = l.value;
+        return;
+      }
+      const e = c(o.value || "0"), a = c(r.value || "0");
+      m.value = `${l.value}T${e}:${a}:00`;
+    }
+    function c(e) {
+      return Math.max(0, parseInt(e, 10) || 0).toString().padStart(2, "0");
+    }
+    function g(e) {
+      if (!e) {
+        l.value = "", s();
+        return;
+      }
+      const a = e instanceof y ? e : new y(e.year, e.month, e.day);
+      l.value = a.toString(), s(), v.value = !1;
+    }
+    function M(e) {
+      const a = String(e ?? ""), d = Math.min(23, Math.max(0, parseInt(a, 10) || 0));
+      o.value = d.toString(), s();
+    }
+    function V(e) {
+      const a = String(e ?? ""), d = Math.min(59, Math.max(0, parseInt(a, 10) || 0));
+      r.value = d.toString(), s();
+    }
+    const b = x(() => l.value ? o.value === "" && r.value === "" ? l.value : `${l.value} ${c(o.value || "0")}:${c(r.value || "0")}` : "");
+    return (e, a) => (k(), D(n(N), {
+      label: t.label,
+      required: t.required,
+      "hide-label": t.hideLabel,
+      for: t.id,
+      "help-text": t.helpText,
+      errors: t.errors
+    }, {
+      default: i(() => [
+        u(n(j), {
+          open: v.value,
+          "onUpdate:open": a[0] || (a[0] = (d) => v.value = d)
+        }, {
+          default: i(() => [
+            u(n(F), { "as-child": "" }, {
+              default: i(() => [
+                u(n(G), {
+                  type: "button",
+                  variant: "outline",
+                  disabled: t.disabled,
+                  class: I(
+                    n(L)(
+                      "w-full justify-start text-left font-normal",
+                      !b.value && "text-muted-foreground"
+                    )
+                  ),
+                  "data-element-name": t.name ?? void 0,
+                  "data-readonly": t.readonly || void 0
+                }, {
+                  default: i(() => [
+                    u(n(U), { class: "mr-2 size-4" }),
+                    p("span", null, P(b.value || t.placeholder || "Pick a date & time"), 1)
+                  ]),
+                  _: 1
+                }, 8, ["disabled", "class", "data-element-name", "data-readonly"])
+              ]),
+              _: 1
+            }),
+            u(n(A), { class: "w-auto p-0" }, {
+              default: i(() => [
+                u(n(E), {
+                  "model-value": h.value,
+                  placeholder: h.value,
+                  "onUpdate:modelValue": g
+                }, null, 8, ["model-value", "placeholder"]),
+                p("div", J, [
+                  u(n(z), { class: "size-4 text-muted-foreground" }),
+                  u(n($), {
+                    type: "number",
+                    min: "0",
+                    max: "23",
+                    "model-value": o.value,
+                    class: "w-16",
+                    disabled: t.disabled,
+                    placeholder: "HH",
+                    "data-testid": "datetime-hour",
+                    "onUpdate:modelValue": M
+                  }, null, 8, ["model-value", "disabled"]),
+                  a[1] || (a[1] = p("span", { class: "text-muted-foreground" }, ":", -1)),
+                  u(n($), {
+                    type: "number",
+                    min: "0",
+                    max: "59",
+                    "model-value": r.value,
+                    class: "w-16",
+                    disabled: t.disabled,
+                    placeholder: "MM",
+                    "data-testid": "datetime-minute",
+                    "onUpdate:modelValue": V
+                  }, null, 8, ["model-value", "disabled"])
+                ])
+              ]),
+              _: 1
+            })
+          ]),
+          _: 1
+        }, 8, ["open"])
+      ]),
+      _: 1
+    }, 8, ["label", "required", "hide-label", "for", "help-text", "errors"]));
+  }
+});
 export {
-  f as default
+  oe as default
 };
 //# sourceMappingURL=DateTimePicker.vue.js.map

package/dist/components/compositions/elements/picker/DateTimePicker.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateTimePicker.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"DateTimePicker.vue.js","sources":["../../../../../src/components/compositions/elements/picker/DateTimePicker.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven date+time picker composition. DatePicker-style Popover\n * (Calendar) plus two numeric inputs for hour/minute. Round-trips ISO\n * 8601 (e.g. `2024-06-15T13:30:00`). When only the date half is set the\n * value falls back to a date-only ISO string.\n *\n *   <DateTimePicker v-model=\"when\" label=\"Starts at\" />\n */\nimport { computed, ref, watchEffect } from \"vue\"\nimport { Calendar as CalendarIcon, Clock } from \"lucide-vue-next\"\nimport {\n  CalendarDate,\n  parseDate,\n  type DateValue,\n} from \"@internationalized/date\"\nimport { Button } from \"@/components/ui/button\"\nimport { Calendar } from \"@/components/ui/calendar\"\nimport { Input } from \"@/components/ui/input\"\nimport { FieldFrame } from \"@/components/ui/field-frame\"\nimport {\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from \"@/components/ui/popover\"\nimport { cn } from \"@/lib/utils\"\n\nexport interface DateTimePickerProps {\n  modelValue?: string | null\n  id?: string\n  name?: string\n  label?: string\n  hideLabel?: boolean\n  placeholder?: string\n  required?: boolean\n  readonly?: boolean\n  disabled?: boolean\n  helpText?: string\n  errors?: string[]\n}\n\nwithDefaults(defineProps<DateTimePickerProps>(), {\n  errors: () => [],\n})\n\nconst model = defineModel<string | null>(\"modelValue\")\n\nconst datePart = ref<string>(\"\")\nconst hourPart = ref<string>(\"\")\nconst minutePart = ref<string>(\"\")\n\nwatchEffect(() => {\n  const iso = model.value\n  if (!iso) {\n    datePart.value = \"\"\n    hourPart.value = \"\"\n    minutePart.value = \"\"\n    return\n  }\n  const [d, t] = iso.split(\"T\")\n  datePart.value = d ?? \"\"\n  if (t) {\n    const [hh, mm] = t.split(\":\")\n    hourPart.value = hh ?? \"\"\n    minutePart.value = (mm ?? \"\").slice(0, 2)\n  } else {\n    hourPart.value = \"\"\n    minutePart.value = \"\"\n  }\n})\n\nconst open = ref(false)\n\nconst calendarValue = computed<DateValue | undefined>(() => {\n  if (!datePart.value) {\n    return undefined\n  }\n  try {\n    return parseDate(datePart.value)\n  } catch {\n    return undefined\n  }\n})\n\nfunction emitCombined(): void {\n  if (!datePart.value) {\n    model.value = null\n    return\n  }\n  if (hourPart.value === \"\" && minutePart.value === \"\") {\n    model.value = datePart.value\n    return\n  }\n  const hh = padTwo(hourPart.value || \"0\")\n  const mm = padTwo(minutePart.value || \"0\")\n  model.value = `${datePart.value}T${hh}:${mm}:00`\n}\n\nfunction padTwo(value: string): string {\n  const n = Math.max(0, parseInt(value, 10) || 0)\n  return n.toString().padStart(2, \"0\")\n}\n\nfunction onDateSelected(value: DateValue | undefined): void {\n  if (!value) {\n    datePart.value = \"\"\n    emitCombined()\n    return\n  }\n  const calendar =\n    value instanceof CalendarDate\n      ? value\n      : new CalendarDate(value.year, value.month, value.day)\n  datePart.value = calendar.toString()\n  emitCombined()\n  open.value = false\n}\n\nfunction onHourInput(value: string | number | undefined): void {\n  const next = String(value ?? \"\")\n  const numeric = Math.min(23, Math.max(0, parseInt(next, 10) || 0))\n  hourPart.value = numeric.toString()\n  emitCombined()\n}\n\nfunction onMinuteInput(value: string | number | undefined): void {\n  const next = String(value ?? \"\")\n  const numeric = Math.min(59, Math.max(0, parseInt(next, 10) || 0))\n  minutePart.value = numeric.toString()\n  emitCombined()\n}\n\nconst displayValue = computed<string>(() => {\n  if (!datePart.value) {\n    return \"\"\n  }\n  if (hourPart.value === \"\" && minutePart.value === \"\") {\n    return datePart.value\n  }\n  return `${datePart.value} ${padTwo(hourPart.value || \"0\")}:${padTwo(minutePart.value || \"0\")}`\n})\n</script>\n\n<template>\n  <FieldFrame\n    :label=\"label\"\n    :required=\"required\"\n    :hide-label=\"hideLabel\"\n    :for=\"id\"\n    :help-text=\"helpText\"\n    :errors=\"errors\"\n  >\n    <Popover v-model:open=\"open\">\n      <PopoverTrigger as-child>\n        <Button\n          type=\"button\"\n          variant=\"outline\"\n          :disabled=\"disabled\"\n          :class=\"\n            cn(\n              'w-full justify-start text-left font-normal',\n              !displayValue && 'text-muted-foreground',\n            )\n          \"\n          :data-element-name=\"name ?? undefined\"\n          :data-readonly=\"readonly || undefined\"\n        >\n          <CalendarIcon class=\"mr-2 size-4\" />\n          <span>{{ displayValue || placeholder || \"Pick a date & time\" }}</span>\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent class=\"w-auto p-0\">\n        <Calendar\n          :model-value=\"calendarValue\"\n          :placeholder=\"calendarValue\"\n          @update:model-value=\"onDateSelected\"\n        />\n        <div class=\"flex items-center gap-2 border-t p-3\">\n          <Clock class=\"size-4 text-muted-foreground\" />\n          <Input\n            type=\"number\"\n            min=\"0\"\n            max=\"23\"\n            :model-value=\"hourPart\"\n            class=\"w-16\"\n            :disabled=\"disabled\"\n            placeholder=\"HH\"\n            data-testid=\"datetime-hour\"\n            @update:model-value=\"onHourInput\"\n          />\n          <span class=\"text-muted-foreground\">:</span>\n          <Input\n            type=\"number\"\n            min=\"0\"\n            max=\"59\"\n            :model-value=\"minutePart\"\n            class=\"w-16\"\n            :disabled=\"disabled\"\n            placeholder=\"MM\"\n            data-testid=\"datetime-minute\"\n            @update:model-value=\"onMinuteInput\"\n          />\n        </div>\n      </PopoverContent>\n    </Popover>\n  </FieldFrame>\n</template>\n"],"names":["model","_useModel","__props","datePart","ref","hourPart","minutePart","watchEffect","iso","d","t","hh","mm","open","calendarValue","computed","parseDate","emitCombined","padTwo","value","onDateSelected","calendar","CalendarDate","onHourInput","next","numeric","onMinuteInput","displayValue","_createBlock","_unref","FieldFrame","_createVNode","Popover","$event","PopoverTrigger","Button","_normalizeClass","cn","CalendarIcon","_createElementVNode","_toDisplayString","PopoverContent","Calendar","_hoisted_1","Clock","Input","_cache"],"mappings":"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"}