@gxp-dev/mod-ui 2.0.0 → 2.0.1

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

@@ -1 +1 @@
-{"version":3,"file":"MapPicker.vue2.js","sources":["../../../../../src/components/compositions/elements/picker/MapPicker.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, onMounted, onUnmounted, shallowRef, watch } from \"vue\"\nimport type { LeafletMouseEvent, Map as LeafletMap, Marker } from \"leaflet\"\nimport { FieldFrame } from \"@/components/ui/field-frame\"\nimport \"leaflet/dist/leaflet.css\"\nimport markerIconUrl from \"leaflet/dist/images/marker-icon.png\"\nimport markerIcon2xUrl from \"leaflet/dist/images/marker-icon-2x.png\"\nimport markerShadowUrl from \"leaflet/dist/images/marker-shadow.png\"\n\n/**\n * Props-driven map picker. Renders a Leaflet map inside a FieldFrame.\n * Clicking the map drops a pin and emits the {lat, lng} pair via\n * `update:modelValue`.\n *\n * Leaflet is imported dynamically inside `onMounted` so it never runs\n * its initialisation code during SSR or module evaluation — avoiding\n * the `L.Icon.Default` crash that plagues wrapper packages in Vite.\n */\n\nexport interface LatLng {\n  lat: number\n  lng: number\n}\n\nexport interface MapPickerProps {\n  modelValue?: LatLng | null\n  id?: string\n  name?: string\n  label?: string\n  hideLabel?: boolean\n  required?: boolean\n  readonly?: boolean\n  disabled?: boolean\n  helpText?: string\n  errors?: string[]\n  /** Centre used when `modelValue` is empty. Defaults to London. */\n  defaultCenter?: LatLng\n  /** Initial zoom level. */\n  defaultZoom?: number\n  /** CSS height applied to the map container. */\n  height?: string\n  /** Tile server URL template. Defaults to OpenStreetMap. */\n  tileUrl?: string\n  /** Tile attribution string rendered by Leaflet. */\n  tileAttribution?: string\n}\n\nconst props = withDefaults(defineProps<MapPickerProps>(), {\n  errors: () => [],\n  defaultCenter: () => ({ lat: 51.505, lng: -0.09 }),\n  defaultZoom: 13,\n  height: \"24rem\",\n  tileUrl: \"https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png\",\n  tileAttribution:\n    '&copy; <a href=\"https://www.openstreetmap.org/copyright\">OpenStreetMap</a>',\n})\n\nconst model = defineModel<LatLng | null>(\"modelValue\")\n\nconst mapEl = shallowRef<HTMLDivElement>()\nconst leafletMap = shallowRef<LeafletMap | null>(null)\nconst leafletMarker = shallowRef<Marker | null>(null)\n\n// Non-reactive Leaflet library reference populated after mount.\nlet L: typeof import(\"leaflet\") | null = null\n\nconst isInteractive = computed(() => !props.disabled && !props.readonly)\n\nconst formattedLatLng = computed<string>(() => {\n  if (!model.value) return \"\"\n  const { lat, lng } = model.value\n  return `${lat.toFixed(4)}, ${lng.toFixed(4)}`\n})\n\nconst containerStyle = computed<Record<string, string>>(() => ({\n  height: props.height,\n  width: \"100%\",\n}))\n\n// Sync external modelValue changes into the live map marker.\nwatch(\n  () => model.value,\n  (val) => {\n    if (!L || !leafletMap.value) return\n    if (!val) {\n      leafletMarker.value?.remove()\n      leafletMarker.value = null\n      return\n    }\n    const pos: [number, number] = [val.lat, val.lng]\n    if (leafletMarker.value) {\n      leafletMarker.value.setLatLng(pos)\n    } else {\n      leafletMarker.value = L.marker(pos).addTo(leafletMap.value)\n    }\n  },\n)\n\nonMounted(async () => {\n  if (!mapEl.value) return\n  try {\n    const mod = await import(\"leaflet\")\n    L = (mod.default ?? mod) as typeof import(\"leaflet\")\n\n    // Vite hashes asset filenames; patch the default icon so the marker\n    // renders correctly in both dev and production builds.\n    delete (L.Icon.Default.prototype as unknown as Record<string, unknown>)._getIconUrl\n    L.Icon.Default.mergeOptions({\n      iconUrl: markerIconUrl,\n      iconRetinaUrl: markerIcon2xUrl,\n      shadowUrl: markerShadowUrl,\n    })\n\n    const center = model.value ?? props.defaultCenter\n    const map = L.map(mapEl.value, {\n      center: [center.lat, center.lng],\n      zoom: props.defaultZoom,\n    })\n\n    L.tileLayer(props.tileUrl, {\n      attribution: props.tileAttribution,\n    }).addTo(map)\n\n    if (model.value) {\n      leafletMarker.value = L.marker([model.value.lat, model.value.lng]).addTo(map)\n    }\n\n    map.on(\"click\", (e: LeafletMouseEvent) => {\n      if (!isInteractive.value) return\n      const { lat, lng } = e.latlng\n      model.value = { lat, lng }\n      const pos: [number, number] = [lat, lng]\n      if (leafletMarker.value) {\n        leafletMarker.value.setLatLng(pos)\n      } else {\n        leafletMarker.value = L!.marker(pos).addTo(map)\n      }\n    })\n\n    leafletMap.value = map\n  } catch {\n    // Leaflet unavailable in this environment.\n  }\n})\n\nonUnmounted(() => {\n  leafletMap.value?.remove()\n  leafletMap.value = null\n  leafletMarker.value = null\n  L = null\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    <div\n      :id=\"id\"\n      :data-element-name=\"name ?? undefined\"\n      :data-readonly=\"readonly || undefined\"\n      :data-disabled=\"disabled || undefined\"\n      :class=\"[\n        'overflow-hidden rounded-md border',\n        errors.length ? 'border-destructive' : 'border-input',\n        !isInteractive ? 'pointer-events-none opacity-70' : '',\n      ]\"\n      data-testid=\"map-picker-container\"\n    >\n      <div ref=\"mapEl\" :style=\"containerStyle\" data-testid=\"map-picker-map\" />\n    </div>\n    <p\n      v-if=\"formattedLatLng\"\n      class=\"text-xs text-muted-foreground\"\n      data-testid=\"map-picker-latlng\"\n    >\n      {{ formattedLatLng }}\n    </p>\n  </FieldFrame>\n</template>\n"],"names":["props","__props","model","_useModel","mapEl","shallowRef","leafletMap","leafletMarker","L","isInteractive","computed","formattedLatLng","lat","lng","containerStyle","watch","val","_a","pos","onMounted","mod","markerIconUrl","markerIcon2xUrl","markerShadowUrl","center","map","e","onUnmounted","_createBlock","_unref","FieldFrame","_createElementVNode","_normalizeClass","_createElementBlock","_hoisted_2","_toDisplayString"],"mappings":"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"}
+{"version":3,"file":"MapPicker.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

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

@@ -0,0 +1,26 @@
+export interface TimePickerProps {
+    modelValue?: string | null;
+    id?: string;
+    name?: string;
+    label?: string;
+    hideLabel?: boolean;
+    required?: boolean;
+    readonly?: boolean;
+    disabled?: boolean;
+    helpText?: string;
+    errors?: string[];
+    minuteStep?: number;
+}
+type __VLS_Props = TimePickerProps;
+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=TimePicker.vue.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TimePicker.vue.d.ts","sourceRoot":"","sources":["../../../../../src/components/compositions/elements/picker/TimePicker.vue"],"names":[],"mappings":"AA6IA,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,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,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB;AAED,KAAK,WAAW,GAAG,eAAe,CAAC;AA4DnC,KAAK,iBAAiB,GAAG;IACzB,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC5B,GAAG,WAAW,CAAC;;;;;;YAlEL,MAAM,EAAE;;AAiOnB,wBASG"}

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

@@ -1,5 +1,109 @@
-import f from "./TimePicker.vue2.js";
+import { defineComponent as x, useModel as y, ref as s, watchEffect as M, computed as q, openBlock as g, createBlock as S, unref as o, withCtx as V, createElementVNode as c, createVNode as u, mergeModels as B } from "vue";
+import { Clock as w } from "lucide-vue-next";
+import f from "../../../ui/input/Input.vue.js";
+import I from "../../../ui/field-frame/FieldFrame.vue.js";
+const k = ["data-element-name"], E = /* @__PURE__ */ x({
+  __name: "TimePicker",
+  props: /* @__PURE__ */ B({
+    modelValue: {},
+    id: {},
+    name: {},
+    label: {},
+    hideLabel: { type: Boolean },
+    required: { type: Boolean },
+    readonly: { type: Boolean },
+    disabled: { type: Boolean },
+    helpText: {},
+    errors: { default: () => [] },
+    minuteStep: {}
+  }, {
+    modelValue: {},
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(e) {
+    const v = e, d = y(e, "modelValue"), l = s(""), n = s("");
+    M(() => {
+      const t = d.value;
+      if (!t) {
+        l.value = "", n.value = "";
+        return;
+      }
+      const [a, r] = t.split(":");
+      l.value = a ?? "", n.value = (r ?? "").slice(0, 2);
+    });
+    function i(t) {
+      return Math.max(0, parseInt(t, 10) || 0).toString().padStart(2, "0");
+    }
+    function m() {
+      if (l.value === "" && n.value === "") {
+        d.value = "";
+        return;
+      }
+      d.value = `${i(l.value || "0")}:${i(n.value || "0")}`;
+    }
+    function h(t) {
+      const a = String(t ?? ""), r = Math.min(23, Math.max(0, parseInt(a, 10) || 0));
+      l.value = r.toString(), m();
+    }
+    function b(t) {
+      const a = String(t ?? ""), r = Math.min(59, Math.max(0, parseInt(a, 10) || 0));
+      n.value = r.toString(), m();
+    }
+    const p = q(() => {
+      const t = v.minuteStep;
+      return typeof t == "number" && t > 0 ? t : 1;
+    });
+    return (t, a) => (g(), S(o(I), {
+      label: e.label,
+      required: e.required,
+      "hide-label": e.hideLabel,
+      for: e.id,
+      "help-text": e.helpText,
+      errors: e.errors
+    }, {
+      default: V(() => [
+        c("div", {
+          class: "flex items-center gap-2",
+          "data-element-name": e.name ?? void 0
+        }, [
+          u(o(w), { class: "size-4 text-muted-foreground" }),
+          u(o(f), {
+            type: "number",
+            min: "0",
+            max: "23",
+            step: "1",
+            "model-value": l.value,
+            class: "w-20",
+            disabled: e.disabled,
+            readonly: e.readonly,
+            required: e.required,
+            placeholder: "HH",
+            "data-testid": "time-hour",
+            "onUpdate:modelValue": h
+          }, null, 8, ["model-value", "disabled", "readonly", "required"]),
+          a[0] || (a[0] = c("span", { class: "text-muted-foreground" }, ":", -1)),
+          u(o(f), {
+            type: "number",
+            min: "0",
+            max: "59",
+            step: p.value,
+            "model-value": n.value,
+            class: "w-20",
+            disabled: e.disabled,
+            readonly: e.readonly,
+            required: e.required,
+            placeholder: "MM",
+            "data-testid": "time-minute",
+            "onUpdate:modelValue": b
+          }, null, 8, ["step", "model-value", "disabled", "readonly", "required"])
+        ], 8, k)
+      ]),
+      _: 1
+    }, 8, ["label", "required", "hide-label", "for", "help-text", "errors"]));
+  }
+});
 export {
-  f as default
+  E as default
 };
 //# sourceMappingURL=TimePicker.vue.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"TimePicker.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"TimePicker.vue.js","sources":["../../../../../src/components/compositions/elements/picker/TimePicker.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven time picker composition. Two numeric inputs (hours /\n * minutes) with a leading clock icon. Round-trips an `HH:mm` string.\n * `minuteStep` is applied to the minute input's `step` attribute.\n *\n *   <TimePicker v-model=\"opensAt\" label=\"Opens at\" />\n */\nimport { computed, ref, watchEffect } from \"vue\"\nimport { Clock } from \"lucide-vue-next\"\nimport { Input } from \"@/components/ui/input\"\nimport { FieldFrame } from \"@/components/ui/field-frame\"\n\nexport interface TimePickerProps {\n  modelValue?: string | null\n  id?: string\n  name?: string\n  label?: string\n  hideLabel?: boolean\n  required?: boolean\n  readonly?: boolean\n  disabled?: boolean\n  helpText?: string\n  errors?: string[]\n  minuteStep?: number\n}\n\nconst props = withDefaults(defineProps<TimePickerProps>(), {\n  errors: () => [],\n})\n\nconst model = defineModel<string | null>(\"modelValue\")\n\nconst hour = ref<string>(\"\")\nconst minute = ref<string>(\"\")\n\nwatchEffect(() => {\n  const value = model.value\n  if (!value) {\n    hour.value = \"\"\n    minute.value = \"\"\n    return\n  }\n  const [hh, mm] = value.split(\":\")\n  hour.value = hh ?? \"\"\n  minute.value = (mm ?? \"\").slice(0, 2)\n})\n\nfunction pad(value: string): string {\n  const n = Math.max(0, parseInt(value, 10) || 0)\n  return n.toString().padStart(2, \"0\")\n}\n\nfunction emitCombined(): void {\n  if (hour.value === \"\" && minute.value === \"\") {\n    model.value = \"\"\n    return\n  }\n  model.value = `${pad(hour.value || \"0\")}:${pad(minute.value || \"0\")}`\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  hour.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  minute.value = numeric.toString()\n  emitCombined()\n}\n\nconst step = computed<number>(() => {\n  const raw = props.minuteStep\n  return typeof raw === \"number\" && raw > 0 ? raw : 1\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    <div\n      class=\"flex items-center gap-2\"\n      :data-element-name=\"name ?? undefined\"\n    >\n      <Clock class=\"size-4 text-muted-foreground\" />\n      <Input\n        type=\"number\"\n        min=\"0\"\n        max=\"23\"\n        step=\"1\"\n        :model-value=\"hour\"\n        class=\"w-20\"\n        :disabled=\"disabled\"\n        :readonly=\"readonly\"\n        :required=\"required\"\n        placeholder=\"HH\"\n        data-testid=\"time-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        :step=\"step\"\n        :model-value=\"minute\"\n        class=\"w-20\"\n        :disabled=\"disabled\"\n        :readonly=\"readonly\"\n        :required=\"required\"\n        placeholder=\"MM\"\n        data-testid=\"time-minute\"\n        @update:model-value=\"onMinuteInput\"\n      />\n    </div>\n  </FieldFrame>\n</template>\n"],"names":["props","__props","model","_useModel","hour","ref","minute","watchEffect","value","hh","mm","pad","emitCombined","onHourInput","next","numeric","onMinuteInput","step","computed","raw","_createBlock","_unref","FieldFrame","_createElementVNode","_createVNode","Clock","Input","_cache"],"mappings":"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"}

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

@@ -1,109 +1,5 @@
-import { defineComponent as x, useModel as y, ref as s, watchEffect as M, computed as q, openBlock as g, createBlock as S, unref as o, withCtx as V, createElementVNode as c, createVNode as u, mergeModels as B } from "vue";
-import { Clock as w } from "lucide-vue-next";
-import f from "../../../ui/input/Input.vue.js";
-import I from "../../../ui/field-frame/FieldFrame.vue.js";
-const k = ["data-element-name"], E = /* @__PURE__ */ x({
-  __name: "TimePicker",
-  props: /* @__PURE__ */ B({
-    modelValue: {},
-    id: {},
-    name: {},
-    label: {},
-    hideLabel: { type: Boolean },
-    required: { type: Boolean },
-    readonly: { type: Boolean },
-    disabled: { type: Boolean },
-    helpText: {},
-    errors: { default: () => [] },
-    minuteStep: {}
-  }, {
-    modelValue: {},
-    modelModifiers: {}
-  }),
-  emits: ["update:modelValue"],
-  setup(e) {
-    const v = e, d = y(e, "modelValue"), l = s(""), n = s("");
-    M(() => {
-      const t = d.value;
-      if (!t) {
-        l.value = "", n.value = "";
-        return;
-      }
-      const [a, r] = t.split(":");
-      l.value = a ?? "", n.value = (r ?? "").slice(0, 2);
-    });
-    function i(t) {
-      return Math.max(0, parseInt(t, 10) || 0).toString().padStart(2, "0");
-    }
-    function m() {
-      if (l.value === "" && n.value === "") {
-        d.value = "";
-        return;
-      }
-      d.value = `${i(l.value || "0")}:${i(n.value || "0")}`;
-    }
-    function h(t) {
-      const a = String(t ?? ""), r = Math.min(23, Math.max(0, parseInt(a, 10) || 0));
-      l.value = r.toString(), m();
-    }
-    function b(t) {
-      const a = String(t ?? ""), r = Math.min(59, Math.max(0, parseInt(a, 10) || 0));
-      n.value = r.toString(), m();
-    }
-    const p = q(() => {
-      const t = v.minuteStep;
-      return typeof t == "number" && t > 0 ? t : 1;
-    });
-    return (t, a) => (g(), S(o(I), {
-      label: e.label,
-      required: e.required,
-      "hide-label": e.hideLabel,
-      for: e.id,
-      "help-text": e.helpText,
-      errors: e.errors
-    }, {
-      default: V(() => [
-        c("div", {
-          class: "flex items-center gap-2",
-          "data-element-name": e.name ?? void 0
-        }, [
-          u(o(w), { class: "size-4 text-muted-foreground" }),
-          u(o(f), {
-            type: "number",
-            min: "0",
-            max: "23",
-            step: "1",
-            "model-value": l.value,
-            class: "w-20",
-            disabled: e.disabled,
-            readonly: e.readonly,
-            required: e.required,
-            placeholder: "HH",
-            "data-testid": "time-hour",
-            "onUpdate:modelValue": h
-          }, null, 8, ["model-value", "disabled", "readonly", "required"]),
-          a[0] || (a[0] = c("span", { class: "text-muted-foreground" }, ":", -1)),
-          u(o(f), {
-            type: "number",
-            min: "0",
-            max: "59",
-            step: p.value,
-            "model-value": n.value,
-            class: "w-20",
-            disabled: e.disabled,
-            readonly: e.readonly,
-            required: e.required,
-            placeholder: "MM",
-            "data-testid": "time-minute",
-            "onUpdate:modelValue": b
-          }, null, 8, ["step", "model-value", "disabled", "readonly", "required"])
-        ], 8, k)
-      ]),
-      _: 1
-    }, 8, ["label", "required", "hide-label", "for", "help-text", "errors"]));
-  }
-});
+import f from "./TimePicker.vue.js";
 export {
-  E as default
+  f as default
 };
 //# sourceMappingURL=TimePicker.vue2.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"TimePicker.vue2.js","sources":["../../../../../src/components/compositions/elements/picker/TimePicker.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven time picker composition. Two numeric inputs (hours /\n * minutes) with a leading clock icon. Round-trips an `HH:mm` string.\n * `minuteStep` is applied to the minute input's `step` attribute.\n *\n *   <TimePicker v-model=\"opensAt\" label=\"Opens at\" />\n */\nimport { computed, ref, watchEffect } from \"vue\"\nimport { Clock } from \"lucide-vue-next\"\nimport { Input } from \"@/components/ui/input\"\nimport { FieldFrame } from \"@/components/ui/field-frame\"\n\nexport interface TimePickerProps {\n  modelValue?: string | null\n  id?: string\n  name?: string\n  label?: string\n  hideLabel?: boolean\n  required?: boolean\n  readonly?: boolean\n  disabled?: boolean\n  helpText?: string\n  errors?: string[]\n  minuteStep?: number\n}\n\nconst props = withDefaults(defineProps<TimePickerProps>(), {\n  errors: () => [],\n})\n\nconst model = defineModel<string | null>(\"modelValue\")\n\nconst hour = ref<string>(\"\")\nconst minute = ref<string>(\"\")\n\nwatchEffect(() => {\n  const value = model.value\n  if (!value) {\n    hour.value = \"\"\n    minute.value = \"\"\n    return\n  }\n  const [hh, mm] = value.split(\":\")\n  hour.value = hh ?? \"\"\n  minute.value = (mm ?? \"\").slice(0, 2)\n})\n\nfunction pad(value: string): string {\n  const n = Math.max(0, parseInt(value, 10) || 0)\n  return n.toString().padStart(2, \"0\")\n}\n\nfunction emitCombined(): void {\n  if (hour.value === \"\" && minute.value === \"\") {\n    model.value = \"\"\n    return\n  }\n  model.value = `${pad(hour.value || \"0\")}:${pad(minute.value || \"0\")}`\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  hour.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  minute.value = numeric.toString()\n  emitCombined()\n}\n\nconst step = computed<number>(() => {\n  const raw = props.minuteStep\n  return typeof raw === \"number\" && raw > 0 ? raw : 1\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    <div\n      class=\"flex items-center gap-2\"\n      :data-element-name=\"name ?? undefined\"\n    >\n      <Clock class=\"size-4 text-muted-foreground\" />\n      <Input\n        type=\"number\"\n        min=\"0\"\n        max=\"23\"\n        step=\"1\"\n        :model-value=\"hour\"\n        class=\"w-20\"\n        :disabled=\"disabled\"\n        :readonly=\"readonly\"\n        :required=\"required\"\n        placeholder=\"HH\"\n        data-testid=\"time-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        :step=\"step\"\n        :model-value=\"minute\"\n        class=\"w-20\"\n        :disabled=\"disabled\"\n        :readonly=\"readonly\"\n        :required=\"required\"\n        placeholder=\"MM\"\n        data-testid=\"time-minute\"\n        @update:model-value=\"onMinuteInput\"\n      />\n    </div>\n  </FieldFrame>\n</template>\n"],"names":["props","__props","model","_useModel","hour","ref","minute","watchEffect","value","hh","mm","pad","emitCombined","onHourInput","next","numeric","onMinuteInput","step","computed","raw","_createBlock","_unref","FieldFrame","_createElementVNode","_createVNode","Clock","Input","_cache"],"mappings":"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"}
+{"version":3,"file":"TimePicker.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

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

@@ -0,0 +1,26 @@
+export interface TimezonePickerProps {
+    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 = TimezonePickerProps;
+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=TimezonePicker.vue.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TimezonePicker.vue.d.ts","sourceRoot":"","sources":["../../../../../src/components/compositions/elements/picker/TimezonePicker.vue"],"names":[],"mappings":"AAiJA,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;AAwDvC,KAAK,iBAAiB,GAAG;IACzB,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC5B,GAAG,WAAW,CAAC;;;;;;YA7DL,MAAM,EAAE;;AAyOnB,wBASG"}

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

@@ -1,5 +1,127 @@
-import f from "./TimezonePicker.vue2.js";
+import { defineComponent as h, useModel as v, ref as b, computed as s, openBlock as d, createBlock as f, unref as r, withCtx as t, createVNode as a, createTextVNode as c, createElementBlock as V, Fragment as q, renderList as x, toDisplayString as k, mergeModels as A } from "vue";
+import { Globe as B } from "lucide-vue-next";
+import $ from "../../../ui/combobox/Combobox.vue.js";
+import g from "../../../ui/combobox/ComboboxAnchor.vue.js";
+import L from "../../../ui/combobox/ComboboxContent.vue.js";
+import C from "../../../ui/combobox/ComboboxEmpty.vue.js";
+import "@vueuse/core";
+import "reka-ui";
+import "clsx";
+import "tailwind-merge";
+import T from "../../../ui/combobox/ComboboxInput.vue.js";
+import S from "../../../ui/combobox/ComboboxItem.vue.js";
+import w from "../../../ui/combobox/ComboboxItemIndicator.vue.js";
+import E from "../../../ui/field-frame/FieldFrame.vue.js";
+const H = /* @__PURE__ */ h({
+  __name: "TimezonePicker",
+  props: /* @__PURE__ */ A({
+    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(e) {
+    const m = v(e, "modelValue"), n = b(""), u = s(() => {
+      const l = Intl;
+      if (typeof l.supportedValuesOf == "function")
+        try {
+          return l.supportedValuesOf("timeZone");
+        } catch {
+          return [];
+        }
+      return [
+        "UTC",
+        "America/New_York",
+        "America/Chicago",
+        "America/Denver",
+        "America/Los_Angeles",
+        "Europe/London",
+        "Europe/Paris",
+        "Europe/Berlin",
+        "Asia/Tokyo",
+        "Asia/Shanghai",
+        "Australia/Sydney"
+      ];
+    }), p = s(() => {
+      const l = n.value.trim().toLowerCase();
+      return l ? u.value.filter((o) => o.toLowerCase().includes(l)).slice(0, 200) : u.value.slice(0, 200);
+    });
+    function y(l) {
+      const o = typeof l == "string" ? l : "";
+      m.value = o;
+    }
+    return (l, o) => (d(), f(r(E), {
+      label: e.label,
+      required: e.required,
+      "hide-label": e.hideLabel,
+      for: e.id,
+      "help-text": e.helpText,
+      errors: e.errors
+    }, {
+      default: t(() => [
+        a(r($), {
+          "model-value": m.value ?? "",
+          disabled: e.disabled,
+          "onUpdate:modelValue": y
+        }, {
+          default: t(() => [
+            a(r(g), {
+              "data-element-name": e.name ?? void 0,
+              "data-readonly": e.readonly || void 0
+            }, {
+              default: t(() => [
+                a(r(B), { class: "mr-2 size-4 shrink-0 opacity-50" }),
+                a(r(T), {
+                  modelValue: n.value,
+                  "onUpdate:modelValue": o[0] || (o[0] = (i) => n.value = i),
+                  placeholder: e.placeholder ?? "Select a timezone…",
+                  readonly: e.readonly,
+                  required: e.required
+                }, null, 8, ["modelValue", "placeholder", "readonly", "required"])
+              ]),
+              _: 1
+            }, 8, ["data-element-name", "data-readonly"]),
+            a(r(L), null, {
+              default: t(() => [
+                a(r(C), null, {
+                  default: t(() => [...o[1] || (o[1] = [
+                    c("No timezones match.", -1)
+                  ])]),
+                  _: 1
+                }),
+                (d(!0), V(q, null, x(p.value, (i) => (d(), f(r(S), {
+                  key: i,
+                  value: i
+                }, {
+                  default: t(() => [
+                    a(r(w)),
+                    c(" " + k(i), 1)
+                  ]),
+                  _: 2
+                }, 1032, ["value"]))), 128))
+              ]),
+              _: 1
+            })
+          ]),
+          _: 1
+        }, 8, ["model-value", "disabled"])
+      ]),
+      _: 1
+    }, 8, ["label", "required", "hide-label", "for", "help-text", "errors"]));
+  }
+});
 export {
-  f as default
+  H as default
 };
 //# sourceMappingURL=TimezonePicker.vue.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"TimezonePicker.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"TimezonePicker.vue.js","sources":["../../../../../src/components/compositions/elements/picker/TimezonePicker.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven timezone picker composition. Searchable combobox over\n * every IANA timezone reported by the runtime (`Intl.supportedValuesOf`).\n * Falls back to a curated list when `Intl.supportedValuesOf` is missing\n * (older jsdom).\n *\n *   <TimezonePicker v-model=\"tz\" label=\"Timezone\" />\n */\nimport { computed, ref } from \"vue\"\nimport { Globe } from \"lucide-vue-next\"\nimport {\n  Combobox,\n  ComboboxAnchor,\n  ComboboxContent,\n  ComboboxEmpty,\n  ComboboxInput,\n  ComboboxItem,\n  ComboboxItemIndicator,\n} from \"@/components/ui/combobox\"\nimport { FieldFrame } from \"@/components/ui/field-frame\"\n\nexport interface TimezonePickerProps {\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<TimezonePickerProps>(), {\n  errors: () => [],\n})\n\nconst model = defineModel<string | null>(\"modelValue\")\n\nconst query = ref<string>(\"\")\n\nconst timezones = computed<string[]>(() => {\n  const intl = Intl as unknown as {\n    supportedValuesOf?: (key: string) => string[]\n  }\n  if (typeof intl.supportedValuesOf === \"function\") {\n    try {\n      return intl.supportedValuesOf(\"timeZone\")\n    } catch {\n      return []\n    }\n  }\n  return [\n    \"UTC\",\n    \"America/New_York\",\n    \"America/Chicago\",\n    \"America/Denver\",\n    \"America/Los_Angeles\",\n    \"Europe/London\",\n    \"Europe/Paris\",\n    \"Europe/Berlin\",\n    \"Asia/Tokyo\",\n    \"Asia/Shanghai\",\n    \"Australia/Sydney\",\n  ]\n})\n\nconst filtered = computed<string[]>(() => {\n  const q = query.value.trim().toLowerCase()\n  if (!q) {\n    return timezones.value.slice(0, 200)\n  }\n  return timezones.value\n    .filter((tz) => tz.toLowerCase().includes(q))\n    .slice(0, 200)\n})\n\nfunction onSelect(value: unknown): void {\n  const next = typeof value === \"string\" ? value : \"\"\n  model.value = next\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    <Combobox\n      :model-value=\"model ?? ''\"\n      :disabled=\"disabled\"\n      @update:model-value=\"onSelect\"\n    >\n      <ComboboxAnchor\n        :data-element-name=\"name ?? undefined\"\n        :data-readonly=\"readonly || undefined\"\n      >\n        <Globe class=\"mr-2 size-4 shrink-0 opacity-50\" />\n        <ComboboxInput\n          v-model=\"query\"\n          :placeholder=\"placeholder ?? 'Select a timezone…'\"\n          :readonly=\"readonly\"\n          :required=\"required\"\n        />\n      </ComboboxAnchor>\n      <ComboboxContent>\n        <ComboboxEmpty>No timezones match.</ComboboxEmpty>\n        <ComboboxItem v-for=\"tz in filtered\" :key=\"tz\" :value=\"tz\">\n          <ComboboxItemIndicator />\n          {{ tz }}\n        </ComboboxItem>\n      </ComboboxContent>\n    </Combobox>\n  </FieldFrame>\n</template>\n"],"names":["model","_useModel","__props","query","ref","timezones","computed","intl","filtered","q","tz","onSelect","value","next","_createBlock","_unref","FieldFrame","_createVNode","Combobox","ComboboxAnchor","Globe","ComboboxInput","$event","ComboboxContent","ComboboxEmpty","_cache","_createElementBlock","_Fragment","_renderList","ComboboxItem","ComboboxItemIndicator","_createTextVNode"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwCA,UAAMA,IAAQC,EAA0BC,GAAC,YAAY,GAE/CC,IAAQC,EAAY,EAAE,GAEtBC,IAAYC,EAAmB,MAAM;AACzC,YAAMC,IAAO;AAGb,UAAI,OAAOA,EAAK,qBAAsB;AACpC,YAAI;AACF,iBAAOA,EAAK,kBAAkB,UAAU;AAAA,QAC1C,QAAQ;AACN,iBAAO,CAAA;AAAA,QACT;AAEF,aAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MAAA;AAAA,IAEJ,CAAC,GAEKC,IAAWF,EAAmB,MAAM;AACxC,YAAMG,IAAIN,EAAM,MAAM,KAAA,EAAO,YAAA;AAC7B,aAAKM,IAGEJ,EAAU,MACd,OAAO,CAACK,MAAOA,EAAG,cAAc,SAASD,CAAC,CAAC,EAC3C,MAAM,GAAG,GAAG,IAJNJ,EAAU,MAAM,MAAM,GAAG,GAAG;AAAA,IAKvC,CAAC;AAED,aAASM,EAASC,GAAsB;AACtC,YAAMC,IAAO,OAAOD,KAAU,WAAWA,IAAQ;AACjD,MAAAZ,EAAM,QAAQa;AAAA,IAChB;2BAIEC,EAiCaC,EAAAC,CAAA,GAAA;AAAA,MAhCV,OAAOd,EAAA;AAAA,MACP,UAAUA,EAAA;AAAA,MACV,cAAYA,EAAA;AAAA,MACZ,KAAKA,EAAA;AAAA,MACL,aAAWA,EAAA;AAAA,MACX,QAAQA,EAAA;AAAA,IAAA;iBAET,MAwBW;AAAA,QAxBXe,EAwBWF,EAAAG,CAAA,GAAA;AAAA,UAvBR,eAAalB,EAAA,SAAK;AAAA,UAClB,UAAUE,EAAA;AAAA,UACV,uBAAoBS;AAAA,QAAA;qBAErB,MAWiB;AAAA,YAXjBM,EAWiBF,EAAAI,CAAA,GAAA;AAAA,cAVd,qBAAmBjB,EAAA,QAAQ;AAAA,cAC3B,iBAAeA,EAAA,YAAY;AAAA,YAAA;yBAE5B,MAAiD;AAAA,gBAAjDe,EAAiDF,EAAAK,CAAA,GAAA,EAA1C,OAAM,mCAAiC;AAAA,gBAC9CH,EAKEF,EAAAM,CAAA,GAAA;AAAA,8BAJSlB,EAAA;AAAA,gEAAAA,EAAK,QAAAmB;AAAA,kBACb,aAAapB,EAAA,eAAW;AAAA,kBACxB,UAAUA,EAAA;AAAA,kBACV,UAAUA,EAAA;AAAA,gBAAA;;;;YAGfe,EAMkBF,EAAAQ,CAAA,GAAA,MAAA;AAAA,yBALhB,MAAkD;AAAA,gBAAlDN,EAAkDF,EAAAS,CAAA,GAAA,MAAA;AAAA,6BAAnC,MAAmB,CAAA,GAAAC,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA;AAAA,sBAAnB,uBAAmB,EAAA;AAAA,kBAAA;;;wBAClCC,EAGeC,GAAA,MAAAC,EAHYpB,EAAA,OAAQ,CAAdE,YAArBI,EAGeC,EAAAc,CAAA,GAAA;AAAA,kBAHuB,KAAKnB;AAAA,kBAAK,OAAOA;AAAA,gBAAA;6BACrD,MAAyB;AAAA,oBAAzBO,EAAyBF,EAAAe,CAAA,CAAA;AAAA,oBAAAC,EAAA,QACtBrB,CAAE,GAAA,CAAA;AAAA,kBAAA;;;;;;;;;;;;;;"}

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

@@ -1,127 +1,5 @@
-import { defineComponent as h, useModel as v, ref as b, computed as s, openBlock as d, createBlock as f, unref as r, withCtx as t, createVNode as a, createTextVNode as c, createElementBlock as V, Fragment as q, renderList as x, toDisplayString as k, mergeModels as A } from "vue";
-import { Globe as B } from "lucide-vue-next";
-import $ from "../../../ui/combobox/Combobox.vue.js";
-import g from "../../../ui/combobox/ComboboxAnchor.vue.js";
-import L from "../../../ui/combobox/ComboboxContent.vue.js";
-import C from "../../../ui/combobox/ComboboxEmpty.vue.js";
-import "@vueuse/core";
-import "reka-ui";
-import "clsx";
-import "tailwind-merge";
-import T from "../../../ui/combobox/ComboboxInput.vue.js";
-import S from "../../../ui/combobox/ComboboxItem.vue.js";
-import w from "../../../ui/combobox/ComboboxItemIndicator.vue.js";
-import E from "../../../ui/field-frame/FieldFrame.vue.js";
-const H = /* @__PURE__ */ h({
-  __name: "TimezonePicker",
-  props: /* @__PURE__ */ A({
-    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(e) {
-    const m = v(e, "modelValue"), n = b(""), u = s(() => {
-      const l = Intl;
-      if (typeof l.supportedValuesOf == "function")
-        try {
-          return l.supportedValuesOf("timeZone");
-        } catch {
-          return [];
-        }
-      return [
-        "UTC",
-        "America/New_York",
-        "America/Chicago",
-        "America/Denver",
-        "America/Los_Angeles",
-        "Europe/London",
-        "Europe/Paris",
-        "Europe/Berlin",
-        "Asia/Tokyo",
-        "Asia/Shanghai",
-        "Australia/Sydney"
-      ];
-    }), p = s(() => {
-      const l = n.value.trim().toLowerCase();
-      return l ? u.value.filter((o) => o.toLowerCase().includes(l)).slice(0, 200) : u.value.slice(0, 200);
-    });
-    function y(l) {
-      const o = typeof l == "string" ? l : "";
-      m.value = o;
-    }
-    return (l, o) => (d(), f(r(E), {
-      label: e.label,
-      required: e.required,
-      "hide-label": e.hideLabel,
-      for: e.id,
-      "help-text": e.helpText,
-      errors: e.errors
-    }, {
-      default: t(() => [
-        a(r($), {
-          "model-value": m.value ?? "",
-          disabled: e.disabled,
-          "onUpdate:modelValue": y
-        }, {
-          default: t(() => [
-            a(r(g), {
-              "data-element-name": e.name ?? void 0,
-              "data-readonly": e.readonly || void 0
-            }, {
-              default: t(() => [
-                a(r(B), { class: "mr-2 size-4 shrink-0 opacity-50" }),
-                a(r(T), {
-                  modelValue: n.value,
-                  "onUpdate:modelValue": o[0] || (o[0] = (i) => n.value = i),
-                  placeholder: e.placeholder ?? "Select a timezone…",
-                  readonly: e.readonly,
-                  required: e.required
-                }, null, 8, ["modelValue", "placeholder", "readonly", "required"])
-              ]),
-              _: 1
-            }, 8, ["data-element-name", "data-readonly"]),
-            a(r(L), null, {
-              default: t(() => [
-                a(r(C), null, {
-                  default: t(() => [...o[1] || (o[1] = [
-                    c("No timezones match.", -1)
-                  ])]),
-                  _: 1
-                }),
-                (d(!0), V(q, null, x(p.value, (i) => (d(), f(r(S), {
-                  key: i,
-                  value: i
-                }, {
-                  default: t(() => [
-                    a(r(w)),
-                    c(" " + k(i), 1)
-                  ]),
-                  _: 2
-                }, 1032, ["value"]))), 128))
-              ]),
-              _: 1
-            })
-          ]),
-          _: 1
-        }, 8, ["model-value", "disabled"])
-      ]),
-      _: 1
-    }, 8, ["label", "required", "hide-label", "for", "help-text", "errors"]));
-  }
-});
+import f from "./TimezonePicker.vue.js";
 export {
-  H as default
+  f as default
 };
 //# sourceMappingURL=TimezonePicker.vue2.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"TimezonePicker.vue2.js","sources":["../../../../../src/components/compositions/elements/picker/TimezonePicker.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven timezone picker composition. Searchable combobox over\n * every IANA timezone reported by the runtime (`Intl.supportedValuesOf`).\n * Falls back to a curated list when `Intl.supportedValuesOf` is missing\n * (older jsdom).\n *\n *   <TimezonePicker v-model=\"tz\" label=\"Timezone\" />\n */\nimport { computed, ref } from \"vue\"\nimport { Globe } from \"lucide-vue-next\"\nimport {\n  Combobox,\n  ComboboxAnchor,\n  ComboboxContent,\n  ComboboxEmpty,\n  ComboboxInput,\n  ComboboxItem,\n  ComboboxItemIndicator,\n} from \"@/components/ui/combobox\"\nimport { FieldFrame } from \"@/components/ui/field-frame\"\n\nexport interface TimezonePickerProps {\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<TimezonePickerProps>(), {\n  errors: () => [],\n})\n\nconst model = defineModel<string | null>(\"modelValue\")\n\nconst query = ref<string>(\"\")\n\nconst timezones = computed<string[]>(() => {\n  const intl = Intl as unknown as {\n    supportedValuesOf?: (key: string) => string[]\n  }\n  if (typeof intl.supportedValuesOf === \"function\") {\n    try {\n      return intl.supportedValuesOf(\"timeZone\")\n    } catch {\n      return []\n    }\n  }\n  return [\n    \"UTC\",\n    \"America/New_York\",\n    \"America/Chicago\",\n    \"America/Denver\",\n    \"America/Los_Angeles\",\n    \"Europe/London\",\n    \"Europe/Paris\",\n    \"Europe/Berlin\",\n    \"Asia/Tokyo\",\n    \"Asia/Shanghai\",\n    \"Australia/Sydney\",\n  ]\n})\n\nconst filtered = computed<string[]>(() => {\n  const q = query.value.trim().toLowerCase()\n  if (!q) {\n    return timezones.value.slice(0, 200)\n  }\n  return timezones.value\n    .filter((tz) => tz.toLowerCase().includes(q))\n    .slice(0, 200)\n})\n\nfunction onSelect(value: unknown): void {\n  const next = typeof value === \"string\" ? value : \"\"\n  model.value = next\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    <Combobox\n      :model-value=\"model ?? ''\"\n      :disabled=\"disabled\"\n      @update:model-value=\"onSelect\"\n    >\n      <ComboboxAnchor\n        :data-element-name=\"name ?? undefined\"\n        :data-readonly=\"readonly || undefined\"\n      >\n        <Globe class=\"mr-2 size-4 shrink-0 opacity-50\" />\n        <ComboboxInput\n          v-model=\"query\"\n          :placeholder=\"placeholder ?? 'Select a timezone…'\"\n          :readonly=\"readonly\"\n          :required=\"required\"\n        />\n      </ComboboxAnchor>\n      <ComboboxContent>\n        <ComboboxEmpty>No timezones match.</ComboboxEmpty>\n        <ComboboxItem v-for=\"tz in filtered\" :key=\"tz\" :value=\"tz\">\n          <ComboboxItemIndicator />\n          {{ tz }}\n        </ComboboxItem>\n      </ComboboxContent>\n    </Combobox>\n  </FieldFrame>\n</template>\n"],"names":["model","_useModel","__props","query","ref","timezones","computed","intl","filtered","q","tz","onSelect","value","next","_createBlock","_unref","FieldFrame","_createVNode","Combobox","ComboboxAnchor","Globe","ComboboxInput","$event","ComboboxContent","ComboboxEmpty","_cache","_createElementBlock","_Fragment","_renderList","ComboboxItem","ComboboxItemIndicator","_createTextVNode"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwCA,UAAMA,IAAQC,EAA0BC,GAAC,YAAY,GAE/CC,IAAQC,EAAY,EAAE,GAEtBC,IAAYC,EAAmB,MAAM;AACzC,YAAMC,IAAO;AAGb,UAAI,OAAOA,EAAK,qBAAsB;AACpC,YAAI;AACF,iBAAOA,EAAK,kBAAkB,UAAU;AAAA,QAC1C,QAAQ;AACN,iBAAO,CAAA;AAAA,QACT;AAEF,aAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MAAA;AAAA,IAEJ,CAAC,GAEKC,IAAWF,EAAmB,MAAM;AACxC,YAAMG,IAAIN,EAAM,MAAM,KAAA,EAAO,YAAA;AAC7B,aAAKM,IAGEJ,EAAU,MACd,OAAO,CAACK,MAAOA,EAAG,cAAc,SAASD,CAAC,CAAC,EAC3C,MAAM,GAAG,GAAG,IAJNJ,EAAU,MAAM,MAAM,GAAG,GAAG;AAAA,IAKvC,CAAC;AAED,aAASM,EAASC,GAAsB;AACtC,YAAMC,IAAO,OAAOD,KAAU,WAAWA,IAAQ;AACjD,MAAAZ,EAAM,QAAQa;AAAA,IAChB;2BAIEC,EAiCaC,EAAAC,CAAA,GAAA;AAAA,MAhCV,OAAOd,EAAA;AAAA,MACP,UAAUA,EAAA;AAAA,MACV,cAAYA,EAAA;AAAA,MACZ,KAAKA,EAAA;AAAA,MACL,aAAWA,EAAA;AAAA,MACX,QAAQA,EAAA;AAAA,IAAA;iBAET,MAwBW;AAAA,QAxBXe,EAwBWF,EAAAG,CAAA,GAAA;AAAA,UAvBR,eAAalB,EAAA,SAAK;AAAA,UAClB,UAAUE,EAAA;AAAA,UACV,uBAAoBS;AAAA,QAAA;qBAErB,MAWiB;AAAA,YAXjBM,EAWiBF,EAAAI,CAAA,GAAA;AAAA,cAVd,qBAAmBjB,EAAA,QAAQ;AAAA,cAC3B,iBAAeA,EAAA,YAAY;AAAA,YAAA;yBAE5B,MAAiD;AAAA,gBAAjDe,EAAiDF,EAAAK,CAAA,GAAA,EAA1C,OAAM,mCAAiC;AAAA,gBAC9CH,EAKEF,EAAAM,CAAA,GAAA;AAAA,8BAJSlB,EAAA;AAAA,gEAAAA,EAAK,QAAAmB;AAAA,kBACb,aAAapB,EAAA,eAAW;AAAA,kBACxB,UAAUA,EAAA;AAAA,kBACV,UAAUA,EAAA;AAAA,gBAAA;;;;YAGfe,EAMkBF,EAAAQ,CAAA,GAAA,MAAA;AAAA,yBALhB,MAAkD;AAAA,gBAAlDN,EAAkDF,EAAAS,CAAA,GAAA,MAAA;AAAA,6BAAnC,MAAmB,CAAA,GAAAC,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA;AAAA,sBAAnB,uBAAmB,EAAA;AAAA,kBAAA;;;wBAClCC,EAGeC,GAAA,MAAAC,EAHYpB,EAAA,OAAQ,CAAdE,YAArBI,EAGeC,EAAAc,CAAA,GAAA;AAAA,kBAHuB,KAAKnB;AAAA,kBAAK,OAAOA;AAAA,gBAAA;6BACrD,MAAyB;AAAA,oBAAzBO,EAAyBF,EAAAe,CAAA,CAAA;AAAA,oBAAAC,EAAA,QACtBrB,CAAE,GAAA,CAAA;AAAA,kBAAA;;;;;;;;;;;;;;"}
+{"version":3,"file":"TimezonePicker.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}