@gxp-dev/mod-ui 2.0.0 → 2.0.3

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

@@ -1,274 +1,5 @@
-import { defineComponent as j, useModel as O, ref as q, watch as G, computed as x, openBlock as r, createBlock as i, unref as a, withCtx as s, createVNode as c, normalizeClass as b, createElementVNode as f, resolveDynamicComponent as D, createCommentVNode as u, createElementBlock as p, toDisplayString as m, createTextVNode as C, Fragment as H, renderList as J, withModifiers as K, mergeModels as Q } from "vue";
-import { Plug as W, ChevronsUpDown as X, Search as Y, Loader2 as U } from "lucide-vue-next";
-import Z from "../../../ui/combobox/Combobox.vue.js";
-import ee from "../../../ui/combobox/ComboboxAnchor.vue.js";
-import te from "../../../ui/combobox/ComboboxContent.vue.js";
-import oe from "../../../ui/combobox/ComboboxEmpty.vue.js";
-import "@vueuse/core";
-import "reka-ui";
-import "clsx";
-import "tailwind-merge";
-import ae from "../../../ui/combobox/ComboboxInput.vue.js";
-import ne from "../../../ui/combobox/ComboboxItem.vue.js";
-import re from "../../../ui/combobox/ComboboxItemIndicator.vue.js";
-import "../../../ui/button/index.js";
-import "../../../ui/badge/index.js";
-import ie from "../../../ui/field-frame/FieldFrame.vue.js";
-import { useConnectorLoader as le } from "../../../../composables/useConnectorLoader.js";
-import N from "../../../ui/button/Button.vue.js";
-import se from "../../../ui/badge/Badge.vue.js";
-const de = { class: "flex min-w-0 flex-1 items-center gap-2" }, ce = {
-  key: 2,
-  class: "truncate text-sm",
-  "data-testid": "integration-connector-picker-label"
-}, ue = {
-  key: 3,
-  class: "truncate text-sm text-muted-foreground",
-  "data-testid": "integration-connector-picker-placeholder"
-}, me = ["data-status"], fe = { class: "flex items-center border-b px-2 py-1.5" }, pe = {
-  key: 0,
-  class: "px-2 py-2 text-sm text-muted-foreground",
-  "data-testid": "integration-connector-picker-loading-text"
-}, ve = {
-  key: 1,
-  class: "flex flex-col gap-2 px-2 py-2",
-  "data-testid": "integration-connector-picker-error"
-}, ge = { class: "text-sm text-destructive" }, ke = { class: "flex flex-1 items-center gap-2" }, ye = { class: "truncate text-sm" }, he = ["data-status", "data-testid"], Ie = /* @__PURE__ */ j({
-  __name: "IntegrationConnectorPicker",
-  props: /* @__PURE__ */ Q({
-    modelValue: {},
-    id: {},
-    name: {},
-    label: {},
-    hideLabel: { type: Boolean },
-    placeholder: {},
-    required: { type: Boolean },
-    readonly: { type: Boolean },
-    disabled: { type: Boolean },
-    helpText: {},
-    errors: { default: () => [] },
-    onLoadConnectors: {},
-    onConnect: {},
-    loadingText: { default: "Loading connectors..." },
-    emptyText: { default: "No connectors available" },
-    errorText: { default: "Could not load connectors" }
-  }, {
-    modelValue: {},
-    modelModifiers: {}
-  }),
-  emits: ["update:modelValue"],
-  setup(n, { expose: A }) {
-    const _ = n, d = O(n, "modelValue"), { connectors: v, isLoading: w, error: M, refresh: $, isConnecting: L, connect: P } = le(() => _.onLoadConnectors()), T = {
-      connected: "bg-success",
-      disconnected: "bg-muted-foreground/40",
-      error: "bg-destructive"
-    };
-    function z(e) {
-      return e && T[e] ? T[e] : "bg-muted-foreground/40";
-    }
-    function V(e) {
-      return e.replace(/[-_\s]+(.)?/g, (o, t) => t ? t.toUpperCase() : "").replace(/^(.)/, (o) => o.toUpperCase());
-    }
-    const g = q({});
-    async function I(e) {
-      if (!e)
-        return;
-      const o = V(e);
-      if (o in g.value)
-        return;
-      const h = await import("lucide-vue-next");
-      g.value = {
-        ...g.value,
-        [o]: h[o] ?? null
-      };
-    }
-    G(
-      v,
-      (e) => {
-        for (const o of e)
-          o.icon && I(o.icon);
-      },
-      { immediate: !0 }
-    );
-    function k(e) {
-      return e ? g.value[V(e)] ?? null : null;
-    }
-    const y = q(""), B = x(() => {
-      const e = y.value.trim().toLowerCase();
-      return e ? v.value.filter(
-        (o) => [o.label, o.type ?? "", o.id].some(
-          (t) => t.toLowerCase().includes(e)
-        )
-      ) : v.value;
-    }), l = x(() => d.value === void 0 || d.value === null ? null : v.value.find((e) => e.id === d.value) ?? null), R = x(() => {
-      if (!(d.value === void 0 || d.value === null))
-        return d.value;
-    });
-    function E(e) {
-      y.value = e.target.value;
-    }
-    function F(e) {
-      if (Array.isArray(e)) {
-        d.value = e[0] === void 0 ? null : e[0];
-        return;
-      }
-      d.value = e === void 0 ? null : e;
-    }
-    async function S(e, o) {
-      o == null || o.stopPropagation(), o == null || o.preventDefault(), await P(e, _.onConnect);
-    }
-    return A({ refresh: $, handleConnect: S }), (e, o) => (r(), i(a(ie), {
-      label: n.label,
-      required: n.required,
-      "hide-label": n.hideLabel,
-      for: n.id,
-      "help-text": n.helpText,
-      errors: n.errors
-    }, {
-      default: s(() => [
-        c(a(Z), {
-          "model-value": R.value,
-          disabled: n.disabled || n.readonly,
-          "ignore-filter": "",
-          "onUpdate:modelValue": F
-        }, {
-          default: s(() => [
-            c(a(ee), {
-              "data-element-name": n.name ?? void 0,
-              "data-testid": "integration-connector-picker-anchor",
-              class: b([
-                "justify-between text-left",
-                n.errors.length ? "border-destructive ring-destructive" : ""
-              ])
-            }, {
-              default: s(() => {
-                var t;
-                return [
-                  f("div", de, [
-                    l.value && k(l.value.icon) ? (r(), i(D(k((t = l.value) == null ? void 0 : t.icon)), {
-                      key: 0,
-                      class: "size-4 shrink-0"
-                    })) : l.value ? u("", !0) : (r(), i(a(W), {
-                      key: 1,
-                      class: "size-4 shrink-0 text-muted-foreground/60"
-                    })),
-                    l.value ? (r(), p("span", ce, m(l.value.label), 1)) : (r(), p("span", ue, m(n.placeholder ?? "Select connector…"), 1)),
-                    l.value ? (r(), p("span", {
-                      key: 4,
-                      class: b([
-                        "inline-block size-2 shrink-0 rounded-full",
-                        z(l.value.status)
-                      ]),
-                      "data-status": l.value.status ?? "unknown",
-                      "data-testid": "integration-connector-picker-status"
-                    }, null, 10, me)) : u("", !0)
-                  ]),
-                  c(a(X), { class: "ml-2 h-4 w-4 shrink-0 opacity-50" })
-                ];
-              }),
-              _: 1
-            }, 8, ["data-element-name", "class"]),
-            c(a(te), null, {
-              default: s(() => [
-                f("div", fe, [
-                  c(a(Y), { class: "mr-2 h-4 w-4 shrink-0 opacity-50" }),
-                  c(a(ae), {
-                    id: n.id,
-                    "model-value": y.value,
-                    placeholder: "Search connectors…",
-                    class: "h-8",
-                    "data-testid": "integration-connector-picker-input",
-                    onInput: E
-                  }, null, 8, ["id", "model-value"]),
-                  a(w) ? (r(), i(a(U), {
-                    key: 0,
-                    "data-testid": "integration-connector-picker-loader",
-                    class: "ml-2 h-4 w-4 shrink-0 animate-spin text-muted-foreground"
-                  })) : u("", !0)
-                ]),
-                a(w) ? (r(), p("div", pe, m(n.loadingText), 1)) : a(M) ? (r(), p("div", ve, [
-                  f("p", ge, m(n.errorText), 1),
-                  c(a(N), {
-                    type: "button",
-                    size: "sm",
-                    variant: "outline",
-                    "data-testid": "integration-connector-picker-retry",
-                    onClick: a($)
-                  }, {
-                    default: s(() => [...o[0] || (o[0] = [
-                      C(" Retry ", -1)
-                    ])]),
-                    _: 1
-                  }, 8, ["onClick"])
-                ])) : B.value.length === 0 ? (r(), i(a(oe), { key: 2 }, {
-                  default: s(() => [
-                    C(m(n.emptyText), 1)
-                  ]),
-                  _: 1
-                })) : u("", !0),
-                (r(!0), p(H, null, J(B.value, (t) => (r(), i(a(ne), {
-                  key: t.id,
-                  value: t.id,
-                  "data-testid": `integration-connector-picker-item-${t.id}`
-                }, {
-                  default: s(() => [
-                    c(a(re)),
-                    f("div", ke, [
-                      k(t.icon) ? (r(), i(D(k(t.icon)), {
-                        key: 0,
-                        class: "size-4 shrink-0"
-                      })) : u("", !0),
-                      f("span", ye, m(t.label), 1),
-                      t.type ? (r(), i(a(se), {
-                        key: 1,
-                        variant: "outline",
-                        size: "sm"
-                      }, {
-                        default: s(() => [
-                          C(m(t.type), 1)
-                        ]),
-                        _: 2
-                      }, 1024)) : u("", !0),
-                      f("span", {
-                        class: b(["ml-auto inline-block size-2 rounded-full", z(t.status)]),
-                        "data-status": t.status ?? "unknown",
-                        "data-testid": `integration-connector-picker-status-${t.id}`
-                      }, null, 10, he),
-                      n.onConnect && t.status !== "connected" ? (r(), i(a(N), {
-                        key: 2,
-                        type: "button",
-                        size: "sm",
-                        variant: "outline",
-                        class: "ml-2",
-                        disabled: !!a(L)[t.id],
-                        "data-testid": `integration-connector-picker-connect-${t.id}`,
-                        onClick: K((h) => S(t.id, h), ["stop"])
-                      }, {
-                        default: s(() => [
-                          a(L)[t.id] ? (r(), i(a(U), {
-                            key: 0,
-                            class: "size-3 animate-spin"
-                          })) : u("", !0),
-                          f("span", null, m(t.status === "error" ? "Reconnect" : "Connect"), 1)
-                        ]),
-                        _: 2
-                      }, 1032, ["disabled", "data-testid", "onClick"])) : u("", !0)
-                    ])
-                  ]),
-                  _: 2
-                }, 1032, ["value", "data-testid"]))), 128))
-              ]),
-              _: 1
-            })
-          ]),
-          _: 1
-        }, 8, ["model-value", "disabled"])
-      ]),
-      _: 1
-    }, 8, ["label", "required", "hide-label", "for", "help-text", "errors"]));
-  }
-});
+import f from "./IntegrationConnectorPicker.vue.js";
 export {
-  Ie as default
+  f as default
 };
 //# sourceMappingURL=IntegrationConnectorPicker.vue2.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"IntegrationConnectorPicker.vue2.js","sources":["../../../../../src/components/compositions/elements/picker/IntegrationConnectorPicker.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven integration-connector picker. Same connector-loading\n * surface as `IntegrationConnectorOption`, presented as a button-style\n * picker: the trigger renders the selected connector's icon + label +\n * status dot, and clicking opens a searchable Combobox panel.\n *\n *   <IntegrationConnectorPicker\n *     v-model=\"connectorId\"\n *     label=\"Connector\"\n *     :on-load-connectors=\"() => fetch('/connectors').then((r) => r.json())\"\n *     :on-connect=\"(id) => beginOAuth(id)\"\n *   />\n */\nimport { computed, ref, watch, type Component } from \"vue\"\nimport { ChevronsUpDown, Loader2, Plug, Search } 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 { Button } from \"@/components/ui/button\"\nimport { Badge } from \"@/components/ui/badge\"\nimport { FieldFrame } from \"@/components/ui/field-frame\"\nimport type { Connector } from \"@/definitions/shared/connector\"\nimport { useConnectorLoader } from \"@/composables/useConnectorLoader\"\n\nexport interface IntegrationConnectorPickerProps {\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  /** REQUIRED. Returns the list of connectors. */\n  onLoadConnectors: () => Promise<Connector[]>\n  /** When supplied, surfaces a per-row Connect button on non-connected rows. */\n  onConnect?: (id: string) => Promise<void>\n  loadingText?: string\n  emptyText?: string\n  errorText?: string\n}\n\nconst props = withDefaults(defineProps<IntegrationConnectorPickerProps>(), {\n  errors: () => [],\n  loadingText: \"Loading connectors...\",\n  emptyText: \"No connectors available\",\n  errorText: \"Could not load connectors\",\n})\n\nconst model = defineModel<string | null>(\"modelValue\")\n\nconst { connectors, isLoading, error, refresh, isConnecting, connect } =\n  useConnectorLoader(() => props.onLoadConnectors())\n\nconst STATUS_DOT_CLASS: Record<NonNullable<Connector[\"status\"]>, string> = {\n  connected: \"bg-success\",\n  disconnected: \"bg-muted-foreground/40\",\n  error: \"bg-destructive\",\n}\n\nfunction statusDotClass(status: Connector[\"status\"]): string {\n  if (status && STATUS_DOT_CLASS[status]) {\n    return STATUS_DOT_CLASS[status]\n  }\n  return \"bg-muted-foreground/40\"\n}\n\nfunction toPascalCase(input: string): string {\n  return input\n    .replace(/[-_\\s]+(.)?/g, (_, ch?: string) => (ch ? ch.toUpperCase() : \"\"))\n    .replace(/^(.)/, (m) => m.toUpperCase())\n}\n\nconst iconRegistry = ref<Record<string, Component | null>>({})\n\nasync function ensureIcon(name: string): Promise<void> {\n  if (!name) {\n    return\n  }\n  const pascal = toPascalCase(name)\n  if (pascal in iconRegistry.value) {\n    return\n  }\n  const mod = await import(\"lucide-vue-next\")\n  const registry = mod as unknown as Record<string, Component | undefined>\n  iconRegistry.value = {\n    ...iconRegistry.value,\n    [pascal]: registry[pascal] ?? null,\n  }\n}\n\nwatch(\n  connectors,\n  (next) => {\n    for (const c of next) {\n      if (c.icon) {\n        void ensureIcon(c.icon)\n      }\n    }\n  },\n  { immediate: true },\n)\n\nfunction iconFor(name?: string): Component | null {\n  if (!name) {\n    return null\n  }\n  return iconRegistry.value[toPascalCase(name)] ?? null\n}\n\nconst query = ref<string>(\"\")\n\nconst filteredConnectors = computed<Connector[]>(() => {\n  const q = query.value.trim().toLowerCase()\n  if (!q) {\n    return connectors.value\n  }\n  return connectors.value.filter((c) =>\n    [c.label, c.type ?? \"\", c.id].some((field) =>\n      field.toLowerCase().includes(q),\n    ),\n  )\n})\n\nconst selectedConnector = computed<Connector | null>(() => {\n  if (model.value === undefined || model.value === null) {\n    return null\n  }\n  return connectors.value.find((c) => c.id === model.value) ?? null\n})\n\nconst currentValue = computed<string | undefined>(() => {\n  if (model.value === undefined || model.value === null) {\n    return undefined\n  }\n  return model.value\n})\n\nfunction onInput(event: Event): void {\n  query.value = (event.target as HTMLInputElement).value\n}\n\nfunction onUpdate(next: unknown): void {\n  if (Array.isArray(next)) {\n    model.value = next[0] === undefined ? null : (next[0] as string)\n    return\n  }\n  model.value = next === undefined ? null : (next as string)\n}\n\nasync function handleConnect(id: string, event?: Event): Promise<void> {\n  event?.stopPropagation()\n  event?.preventDefault()\n  await connect(id, props.onConnect)\n}\n\ndefineExpose({ refresh, handleConnect })\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=\"currentValue\"\n      :disabled=\"disabled || readonly\"\n      ignore-filter\n      @update:model-value=\"onUpdate\"\n    >\n      <ComboboxAnchor\n        :data-element-name=\"name ?? undefined\"\n        data-testid=\"integration-connector-picker-anchor\"\n        :class=\"[\n          'justify-between text-left',\n          errors.length ? 'border-destructive ring-destructive' : '',\n        ]\"\n      >\n        <div class=\"flex min-w-0 flex-1 items-center gap-2\">\n          <component\n            :is=\"iconFor(selectedConnector?.icon)\"\n            v-if=\"selectedConnector && iconFor(selectedConnector.icon)\"\n            class=\"size-4 shrink-0\"\n          />\n          <Plug\n            v-else-if=\"!selectedConnector\"\n            class=\"size-4 shrink-0 text-muted-foreground/60\"\n          />\n          <span\n            v-if=\"selectedConnector\"\n            class=\"truncate text-sm\"\n            data-testid=\"integration-connector-picker-label\"\n          >\n            {{ selectedConnector.label }}\n          </span>\n          <span\n            v-else\n            class=\"truncate text-sm text-muted-foreground\"\n            data-testid=\"integration-connector-picker-placeholder\"\n          >\n            {{ placeholder ?? \"Select connector…\" }}\n          </span>\n          <span\n            v-if=\"selectedConnector\"\n            :class=\"[\n              'inline-block size-2 shrink-0 rounded-full',\n              statusDotClass(selectedConnector.status),\n            ]\"\n            :data-status=\"selectedConnector.status ?? 'unknown'\"\n            data-testid=\"integration-connector-picker-status\"\n          />\n        </div>\n        <ChevronsUpDown class=\"ml-2 h-4 w-4 shrink-0 opacity-50\" />\n      </ComboboxAnchor>\n      <ComboboxContent>\n        <div class=\"flex items-center border-b px-2 py-1.5\">\n          <Search class=\"mr-2 h-4 w-4 shrink-0 opacity-50\" />\n          <ComboboxInput\n            :id=\"id\"\n            :model-value=\"query\"\n            placeholder=\"Search connectors…\"\n            class=\"h-8\"\n            data-testid=\"integration-connector-picker-input\"\n            @input=\"onInput\"\n          />\n          <Loader2\n            v-if=\"isLoading\"\n            data-testid=\"integration-connector-picker-loader\"\n            class=\"ml-2 h-4 w-4 shrink-0 animate-spin text-muted-foreground\"\n          />\n        </div>\n        <div\n          v-if=\"isLoading\"\n          class=\"px-2 py-2 text-sm text-muted-foreground\"\n          data-testid=\"integration-connector-picker-loading-text\"\n        >\n          {{ loadingText }}\n        </div>\n        <div\n          v-else-if=\"error\"\n          class=\"flex flex-col gap-2 px-2 py-2\"\n          data-testid=\"integration-connector-picker-error\"\n        >\n          <p class=\"text-sm text-destructive\">{{ errorText }}</p>\n          <Button\n            type=\"button\"\n            size=\"sm\"\n            variant=\"outline\"\n            data-testid=\"integration-connector-picker-retry\"\n            @click=\"refresh\"\n          >\n            Retry\n          </Button>\n        </div>\n        <ComboboxEmpty v-else-if=\"filteredConnectors.length === 0\">\n          {{ emptyText }}\n        </ComboboxEmpty>\n        <ComboboxItem\n          v-for=\"conn in filteredConnectors\"\n          :key=\"conn.id\"\n          :value=\"conn.id\"\n          :data-testid=\"`integration-connector-picker-item-${conn.id}`\"\n        >\n          <ComboboxItemIndicator />\n          <div class=\"flex flex-1 items-center gap-2\">\n            <component\n              :is=\"iconFor(conn.icon)\"\n              v-if=\"iconFor(conn.icon)\"\n              class=\"size-4 shrink-0\"\n            />\n            <span class=\"truncate text-sm\">{{ conn.label }}</span>\n            <Badge v-if=\"conn.type\" variant=\"outline\" size=\"sm\">\n              {{ conn.type }}\n            </Badge>\n            <span\n              :class=\"['ml-auto inline-block size-2 rounded-full', statusDotClass(conn.status)]\"\n              :data-status=\"conn.status ?? 'unknown'\"\n              :data-testid=\"`integration-connector-picker-status-${conn.id}`\"\n            />\n            <Button\n              v-if=\"onConnect && conn.status !== 'connected'\"\n              type=\"button\"\n              size=\"sm\"\n              variant=\"outline\"\n              class=\"ml-2\"\n              :disabled=\"Boolean(isConnecting[conn.id])\"\n              :data-testid=\"`integration-connector-picker-connect-${conn.id}`\"\n              @click.stop=\"handleConnect(conn.id, $event)\"\n            >\n              <Loader2\n                v-if=\"isConnecting[conn.id]\"\n                class=\"size-3 animate-spin\"\n              />\n              <span>{{\n                conn.status === \"error\" ? \"Reconnect\" : \"Connect\"\n              }}</span>\n            </Button>\n          </div>\n        </ComboboxItem>\n      </ComboboxContent>\n    </Combobox>\n  </FieldFrame>\n</template>\n"],"names":["props","__props","model","_useModel","connectors","isLoading","error","refresh","isConnecting","connect","useConnectorLoader","STATUS_DOT_CLASS","statusDotClass","status","toPascalCase","input","_","ch","m","iconRegistry","ref","ensureIcon","name","pascal","registry","watch","next","c","iconFor","query","filteredConnectors","computed","q","field","selectedConnector","currentValue","onInput","event","onUpdate","handleConnect","id","__expose","_createBlock","_unref","FieldFrame","_createVNode","Combobox","ComboboxAnchor","_normalizeClass","_createElementVNode","_hoisted_1","_openBlock","_resolveDynamicComponent","_a","Plug","_createElementBlock","_hoisted_2","_toDisplayString","_hoisted_3","ChevronsUpDown","ComboboxContent","_hoisted_5","Search","ComboboxInput","Loader2","_hoisted_6","_hoisted_7","_hoisted_8","Button","_cache","ComboboxEmpty","_Fragment","_renderList","conn","ComboboxItem","ComboboxItemIndicator","_hoisted_9","_hoisted_10","Badge","_createTextVNode","$event"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoDA,UAAMA,IAAQC,GAORC,IAAQC,EAA0BF,GAAC,YAAY,GAE/C,EAAE,YAAAG,GAAY,WAAAC,GAAW,OAAAC,GAAO,SAAAC,GAAS,cAAAC,GAAc,SAAAC,EAAA,IAC3DC,GAAmB,MAAMV,EAAM,iBAAA,CAAkB,GAE7CW,IAAqE;AAAA,MACzE,WAAW;AAAA,MACX,cAAc;AAAA,MACd,OAAO;AAAA,IAAA;AAGT,aAASC,EAAeC,GAAqC;AAC3D,aAAIA,KAAUF,EAAiBE,CAAM,IAC5BF,EAAiBE,CAAM,IAEzB;AAAA,IACT;AAEA,aAASC,EAAaC,GAAuB;AAC3C,aAAOA,EACJ,QAAQ,gBAAgB,CAACC,GAAGC,MAAiBA,IAAKA,EAAG,YAAA,IAAgB,EAAG,EACxE,QAAQ,QAAQ,CAACC,MAAMA,EAAE,aAAa;AAAA,IAC3C;AAEA,UAAMC,IAAeC,EAAsC,EAAE;AAE7D,mBAAeC,EAAWC,GAA6B;AACrD,UAAI,CAACA;AACH;AAEF,YAAMC,IAAST,EAAaQ,CAAI;AAChC,UAAIC,KAAUJ,EAAa;AACzB;AAGF,YAAMK,IADM,MAAM,OAAO,iBAAiB;AAE1C,MAAAL,EAAa,QAAQ;AAAA,QACnB,GAAGA,EAAa;AAAA,QAChB,CAACI,CAAM,GAAGC,EAASD,CAAM,KAAK;AAAA,MAAA;AAAA,IAElC;AAEA,IAAAE;AAAA,MACErB;AAAA,MACA,CAACsB,MAAS;AACR,mBAAWC,KAAKD;AACd,UAAIC,EAAE,QACCN,EAAWM,EAAE,IAAI;AAAA,MAG5B;AAAA,MACA,EAAE,WAAW,GAAA;AAAA,IAAK;AAGpB,aAASC,EAAQN,GAAiC;AAChD,aAAKA,IAGEH,EAAa,MAAML,EAAaQ,CAAI,CAAC,KAAK,OAFxC;AAAA,IAGX;AAEA,UAAMO,IAAQT,EAAY,EAAE,GAEtBU,IAAqBC,EAAsB,MAAM;AACrD,YAAMC,IAAIH,EAAM,MAAM,KAAA,EAAO,YAAA;AAC7B,aAAKG,IAGE5B,EAAW,MAAM;AAAA,QAAO,CAACuB,MAC9B,CAACA,EAAE,OAAOA,EAAE,QAAQ,IAAIA,EAAE,EAAE,EAAE;AAAA,UAAK,CAACM,MAClCA,EAAM,YAAA,EAAc,SAASD,CAAC;AAAA,QAAA;AAAA,MAChC,IALO5B,EAAW;AAAA,IAOtB,CAAC,GAEK8B,IAAoBH,EAA2B,MAC/C7B,EAAM,UAAU,UAAaA,EAAM,UAAU,OACxC,OAEFE,EAAW,MAAM,KAAK,CAACuB,MAAMA,EAAE,OAAOzB,EAAM,KAAK,KAAK,IAC9D,GAEKiC,IAAeJ,EAA6B,MAAM;AACtD,UAAI,EAAA7B,EAAM,UAAU,UAAaA,EAAM,UAAU;AAGjD,eAAOA,EAAM;AAAA,IACf,CAAC;AAED,aAASkC,EAAQC,GAAoB;AACnC,MAAAR,EAAM,QAASQ,EAAM,OAA4B;AAAA,IACnD;AAEA,aAASC,EAASZ,GAAqB;AACrC,UAAI,MAAM,QAAQA,CAAI,GAAG;AACvB,QAAAxB,EAAM,QAAQwB,EAAK,CAAC,MAAM,SAAY,OAAQA,EAAK,CAAC;AACpD;AAAA,MACF;AACA,MAAAxB,EAAM,QAAQwB,MAAS,SAAY,OAAQA;AAAA,IAC7C;AAEA,mBAAea,EAAcC,GAAYH,GAA8B;AACrE,MAAAA,KAAA,QAAAA,EAAO,mBACPA,KAAA,QAAAA,EAAO,kBACP,MAAM5B,EAAQ+B,GAAIxC,EAAM,SAAS;AAAA,IACnC;AAEA,WAAAyC,EAAa,EAAE,SAAAlC,GAAS,eAAAgC,GAAe,mBAIrCG,EAiJaC,EAAAC,EAAA,GAAA;AAAA,MAhJV,OAAO3C,EAAA;AAAA,MACP,UAAUA,EAAA;AAAA,MACV,cAAYA,EAAA;AAAA,MACZ,KAAKA,EAAA;AAAA,MACL,aAAWA,EAAA;AAAA,MACX,QAAQA,EAAA;AAAA,IAAA;iBAET,MAwIW;AAAA,QAxIX4C,EAwIWF,EAAAG,CAAA,GAAA;AAAA,UAvIR,eAAaX,EAAA;AAAA,UACb,UAAUlC,EAAA,YAAYA,EAAA;AAAA,UACvB,iBAAA;AAAA,UACC,uBAAoBqC;AAAA,QAAA;qBAErB,MA2CiB;AAAA,YA3CjBO,EA2CiBF,EAAAI,EAAA,GAAA;AAAA,cA1Cd,qBAAmB9C,EAAA,QAAQ;AAAA,cAC5B,eAAY;AAAA,cACX,OAAK+C,EAAA;AAAA;gBAAqD/C,EAAA,OAAO,SAAM,wCAAA;AAAA,cAAA;;yBAKxE,MAAA;;AAiCM;AAAA,kBAjCNgD,EAiCM,OAjCNC,IAiCM;AAAA,oBA9BIhB,EAAA,SAAqBN,EAAQM,EAAA,MAAkB,IAAI,KAF3DiB,EAAA,GAAAT,EAIEU,EAHKxB,GAAQyB,IAAAnB,EAAA,UAAA,gBAAAmB,EAAmB,IAAI,CAAA,GAAA;AAAA;sBAEpC,OAAM;AAAA,oBAAA,MAGMnB,EAAA,0BADdQ,EAGEC,EAAAW,CAAA,GAAA;AAAA;sBADA,OAAM;AAAA,oBAAA;oBAGApB,EAAA,SADRiB,EAAA,GAAAI,EAMO,QANPC,IAMOC,EADFvB,EAAA,MAAkB,KAAK,GAAA,CAAA,WAE5BqB,EAMO,QANPG,IAMOD,EADFxD,EAAA,eAAW,mBAAA,GAAA,CAAA;AAAA,oBAGRiC,EAAA,cADRqB,EAQE,QAAA;AAAA;sBANC,OAAKP,EAAA;AAAA;wBAA6EpC,EAAesB,EAAA,MAAkB,MAAM;AAAA,sBAAA;sBAIzH,eAAaA,EAAA,MAAkB,UAAM;AAAA,sBACtC,eAAY;AAAA,oBAAA;;kBAGhBW,EAA2DF,EAAAgB,CAAA,GAAA,EAA3C,OAAM,oCAAkC;AAAA,gBAAA;AAAA;;;YAE1Dd,EAqFkBF,EAAAiB,EAAA,GAAA,MAAA;AAAA,yBApFhB,MAeM;AAAA,gBAfNX,EAeM,OAfNY,IAeM;AAAA,kBAdJhB,EAAmDF,EAAAmB,CAAA,GAAA,EAA3C,OAAM,oCAAkC;AAAA,kBAChDjB,EAOEF,EAAAoB,EAAA,GAAA;AAAA,oBANC,IAAI9D,EAAA;AAAA,oBACJ,eAAa4B,EAAA;AAAA,oBACd,aAAY;AAAA,oBACZ,OAAM;AAAA,oBACN,eAAY;AAAA,oBACX,SAAAO;AAAA,kBAAA;kBAGKO,EAAAtC,CAAA,UADRqC,EAIEC,EAAAqB,CAAA,GAAA;AAAA;oBAFA,eAAY;AAAA,oBACZ,OAAM;AAAA,kBAAA;;gBAIFrB,EAAAtC,CAAA,UADRkD,EAMM,OANNU,IAMMR,EADDxD,EAAA,WAAW,GAAA,CAAA,KAGH0C,EAAArC,CAAA,KADb6C,KAAAI,EAeM,OAfNW,IAeM;AAAA,kBAVJjB,EAAuD,KAAvDkB,IAAuDV,EAAhBxD,EAAA,SAAS,GAAA,CAAA;AAAA,kBAChD4C,EAQSF,EAAAyB,CAAA,GAAA;AAAA,oBAPP,MAAK;AAAA,oBACL,MAAK;AAAA,oBACL,SAAQ;AAAA,oBACR,eAAY;AAAA,oBACX,SAAOzB,EAAApC,CAAA;AAAA,kBAAA;+BACT,MAED,CAAA,GAAA8D,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA;AAAA,wBAFC,WAED,EAAA;AAAA,oBAAA;;;sBAEwBvC,EAAA,MAAmB,WAAM,UAAnDY,EAEgBC,EAAA2B,EAAA,GAAA,EAAA,KAAA,KAAA;AAAA,6BADd,MAAe;AAAA,wBAAZrE,EAAA,SAAS,GAAA,CAAA;AAAA,kBAAA;;;wBAEdsD,EAyCegB,GAAA,MAAAC,EAxCE1C,EAAA,OAAkB,CAA1B2C,YADT/B,EAyCeC,EAAA+B,EAAA,GAAA;AAAA,kBAvCZ,KAAKD,EAAK;AAAA,kBACV,OAAOA,EAAK;AAAA,kBACZ,eAAW,qCAAuCA,EAAK,EAAE;AAAA,gBAAA;6BAE1D,MAAyB;AAAA,oBAAzB5B,EAAyBF,EAAAgC,EAAA,CAAA;AAAA,oBACzB1B,EAiCM,OAjCN2B,IAiCM;AAAA,sBA9BIhD,EAAQ6C,EAAK,IAAI,KAFzBtB,EAAA,GAAAT,EAIEU,EAHKxB,EAAQ6C,EAAK,IAAI,CAAA,GAAA;AAAA;wBAEtB,OAAM;AAAA,sBAAA;sBAERxB,EAAsD,QAAtD4B,IAAsDpB,EAApBgB,EAAK,KAAK,GAAA,CAAA;AAAA,sBAC/BA,EAAK,aAAlB/B,EAEQC,EAAAmC,EAAA,GAAA;AAAA;wBAFgB,SAAQ;AAAA,wBAAU,MAAK;AAAA,sBAAA;mCAC7C,MAAe;AAAA,0BAAZC,EAAAtB,EAAAgB,EAAK,IAAI,GAAA,CAAA;AAAA,wBAAA;;;sBAEdxB,EAIE,QAAA;AAAA,wBAHC,OAAKD,EAAA,CAAA,4CAA+CpC,EAAe6D,EAAK,MAAM,CAAA,CAAA;AAAA,wBAC9E,eAAaA,EAAK,UAAM;AAAA,wBACxB,eAAW,uCAAyCA,EAAK,EAAE;AAAA,sBAAA;sBAGtDxE,EAAA,aAAawE,EAAK,WAAM,oBADhC/B,EAiBSC,EAAAyB,CAAA,GAAA;AAAA;wBAfP,MAAK;AAAA,wBACL,MAAK;AAAA,wBACL,SAAQ;AAAA,wBACR,OAAM;AAAA,wBACL,UAAU,EAAQzB,KAAa8B,EAAK,EAAE;AAAA,wBACtC,eAAW,wCAA0CA,EAAK,EAAE;AAAA,wBAC5D,kBAAYlC,EAAckC,EAAK,IAAIO,CAAM,GAAA,CAAA,MAAA,CAAA;AAAA,sBAAA;mCAE1C,MAGE;AAAA,0BAFMrC,EAAAnC,CAAA,EAAaiE,EAAK,EAAE,UAD5B/B,EAGEC,EAAAqB,CAAA,GAAA;AAAA;4BADA,OAAM;AAAA,0BAAA;0BAERf,EAES,QAAA,MAAAQ,EADPgB,EAAK,WAAM,UAAA,cAAA,SAAA,GAAA,CAAA;AAAA,wBAAA;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"IntegrationConnectorPicker.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

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

@@ -0,0 +1,55 @@
+/**
+ * Props-driven map picker. Renders a Leaflet map inside a FieldFrame.
+ * Clicking the map drops a pin and emits the {lat, lng} pair via
+ * `update:modelValue`.
+ *
+ * Leaflet is imported dynamically inside `onMounted` so it never runs
+ * its initialisation code during SSR or module evaluation — avoiding
+ * the `L.Icon.Default` crash that plagues wrapper packages in Vite.
+ */
+export interface LatLng {
+    lat: number;
+    lng: number;
+}
+export interface MapPickerProps {
+    modelValue?: LatLng | null;
+    id?: string;
+    name?: string;
+    label?: string;
+    hideLabel?: boolean;
+    required?: boolean;
+    readonly?: boolean;
+    disabled?: boolean;
+    helpText?: string;
+    errors?: string[];
+    /** Centre used when `modelValue` is empty. Defaults to London. */
+    defaultCenter?: LatLng;
+    /** Initial zoom level. */
+    defaultZoom?: number;
+    /** CSS height applied to the map container. */
+    height?: string;
+    /** Tile server URL template. Defaults to OpenStreetMap. */
+    tileUrl?: string;
+    /** Tile attribution string rendered by Leaflet. */
+    tileAttribution?: string;
+}
+type __VLS_Props = MapPickerProps;
+type __VLS_PublicProps = {
+    "modelValue"?: LatLng | null;
+} & __VLS_Props;
+declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: LatLng | null) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: LatLng | null) => any) | undefined;
+}>, {
+    height: string;
+    defaultZoom: number;
+    errors: string[];
+    defaultCenter: LatLng;
+    tileUrl: string;
+    tileAttribution: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    mapEl: HTMLDivElement;
+}, HTMLDivElement>;
+export default _default;
+//# sourceMappingURL=MapPicker.vue.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"MapPicker.vue.d.ts","sourceRoot":"","sources":["../../../../../src/components/compositions/elements/picker/MapPicker.vue"],"names":[],"mappings":"AA8LA,OAAO,0BAA0B,CAAA;AAKjC;;;;;;;;GAQG;AAEH,MAAM,WAAW,MAAM;IACrB,GAAG,EAAE,MAAM,CAAA;IACX,GAAG,EAAE,MAAM,CAAA;CACZ;AAED,MAAM,WAAW,cAAc;IAC7B,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,kEAAkE;IAClE,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,0BAA0B;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,+CAA+C;IAC/C,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,2DAA2D;IAC3D,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,mDAAmD;IACnD,eAAe,CAAC,EAAE,MAAM,CAAA;CACzB;AAED,KAAK,WAAW,GAAG,cAAc,CAAC;AAsHlC,KAAK,iBAAiB,GAAG;IACzB,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC5B,GAAG,WAAW,CAAC;;;;;;YA/HL,MAAM;iBAFD,MAAM;YAJX,MAAM,EAAE;mBAED,MAAM;aAMZ,MAAM;qBAEE,MAAM;;;;AAwN1B,wBAUG"}

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

@@ -1,5 +1,121 @@
-import f from "./MapPicker.vue2.js";
+import { defineComponent as x, useModel as w, shallowRef as m, computed as c, watch as L, onMounted as U, onUnmounted as M, openBlock as g, createBlock as B, unref as C, withCtx as I, createElementVNode as y, normalizeClass as T, normalizeStyle as V, createElementBlock as S, toDisplayString as q, createCommentVNode as z, mergeModels as E } from "vue";
+import D from "../../../ui/field-frame/FieldFrame.vue.js";
+/* empty css                                                                                 */
+import $ from "../../../../node_modules/.pnpm/leaflet@1.9.4/node_modules/leaflet/dist/images/marker-icon.png.js";
+import A from "../../../../node_modules/.pnpm/leaflet@1.9.4/node_modules/leaflet/dist/images/marker-icon-2x.png.js";
+import F from "../../../../node_modules/.pnpm/leaflet@1.9.4/node_modules/leaflet/dist/images/marker-shadow.png.js";
+const N = ["id", "data-element-name", "data-readonly", "data-disabled"], O = {
+  key: 0,
+  class: "text-xs text-muted-foreground",
+  "data-testid": "map-picker-latlng"
+}, J = /* @__PURE__ */ x({
+  __name: "MapPicker",
+  props: /* @__PURE__ */ E({
+    modelValue: {},
+    id: {},
+    name: {},
+    label: {},
+    hideLabel: { type: Boolean },
+    required: { type: Boolean },
+    readonly: { type: Boolean },
+    disabled: { type: Boolean },
+    helpText: {},
+    errors: { default: () => [] },
+    defaultCenter: { default: () => ({ lat: 51.505, lng: -0.09 }) },
+    defaultZoom: { default: 13 },
+    height: { default: "24rem" },
+    tileUrl: { default: "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" },
+    tileAttribution: { default: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>' }
+  }, {
+    modelValue: {},
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(e) {
+    const d = e, o = w(e, "modelValue"), u = m(), i = m(null), l = m(null);
+    let a = null;
+    const s = c(() => !d.disabled && !d.readonly), f = c(() => {
+      if (!o.value) return "";
+      const { lat: t, lng: r } = o.value;
+      return `${t.toFixed(4)}, ${r.toFixed(4)}`;
+    }), b = c(() => ({
+      height: d.height,
+      width: "100%"
+    }));
+    return L(
+      () => o.value,
+      (t) => {
+        var n;
+        if (!a || !i.value) return;
+        if (!t) {
+          (n = l.value) == null || n.remove(), l.value = null;
+          return;
+        }
+        const r = [t.lat, t.lng];
+        l.value ? l.value.setLatLng(r) : l.value = a.marker(r).addTo(i.value);
+      }
+    ), U(async () => {
+      if (u.value)
+        try {
+          const t = await import("leaflet");
+          a = t.default ?? t, delete a.Icon.Default.prototype._getIconUrl, a.Icon.Default.mergeOptions({
+            iconUrl: $,
+            iconRetinaUrl: A,
+            shadowUrl: F
+          });
+          const r = o.value ?? d.defaultCenter, n = a.map(u.value, {
+            center: [r.lat, r.lng],
+            zoom: d.defaultZoom
+          });
+          a.tileLayer(d.tileUrl, {
+            attribution: d.tileAttribution
+          }).addTo(n), o.value && (l.value = a.marker([o.value.lat, o.value.lng]).addTo(n)), n.on("click", (k) => {
+            if (!s.value) return;
+            const { lat: v, lng: p } = k.latlng;
+            o.value = { lat: v, lng: p };
+            const h = [v, p];
+            l.value ? l.value.setLatLng(h) : l.value = a.marker(h).addTo(n);
+          }), i.value = n;
+        } catch {
+        }
+    }), M(() => {
+      var t;
+      (t = i.value) == null || t.remove(), i.value = null, l.value = null, a = null;
+    }), (t, r) => (g(), B(C(D), {
+      label: e.label,
+      required: e.required,
+      "hide-label": e.hideLabel,
+      for: e.id,
+      "help-text": e.helpText,
+      errors: e.errors
+    }, {
+      default: I(() => [
+        y("div", {
+          id: e.id,
+          "data-element-name": e.name ?? void 0,
+          "data-readonly": e.readonly || void 0,
+          "data-disabled": e.disabled || void 0,
+          class: T([
+            "overflow-hidden rounded-md border",
+            e.errors.length ? "border-destructive" : "border-input",
+            s.value ? "" : "pointer-events-none opacity-70"
+          ]),
+          "data-testid": "map-picker-container"
+        }, [
+          y("div", {
+            ref_key: "mapEl",
+            ref: u,
+            style: V(b.value),
+            "data-testid": "map-picker-map"
+          }, null, 4)
+        ], 10, N),
+        f.value ? (g(), S("p", O, q(f.value), 1)) : z("", !0)
+      ]),
+      _: 1
+    }, 8, ["label", "required", "hide-label", "for", "help-text", "errors"]));
+  }
+});
 export {
-  f as default
+  J as default
 };
 //# sourceMappingURL=MapPicker.vue.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"MapPicker.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"MapPicker.vue.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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+CA,UAAMA,IAAQC,GAURC,IAAQC,EAA0BF,GAAC,YAAY,GAE/CG,IAAQC,EAAA,GACRC,IAAaD,EAA8B,IAAI,GAC/CE,IAAgBF,EAA0B,IAAI;AAGpD,QAAIG,IAAqC;AAEzC,UAAMC,IAAgBC,EAAS,MAAM,CAACV,EAAM,YAAY,CAACA,EAAM,QAAQ,GAEjEW,IAAkBD,EAAiB,MAAM;AAC7C,UAAI,CAACR,EAAM,MAAO,QAAO;AACzB,YAAM,EAAE,KAAAU,GAAK,KAAAC,EAAA,IAAQX,EAAM;AAC3B,aAAO,GAAGU,EAAI,QAAQ,CAAC,CAAC,KAAKC,EAAI,QAAQ,CAAC,CAAC;AAAA,IAC7C,CAAC,GAEKC,IAAiBJ,EAAiC,OAAO;AAAA,MAC7D,QAAQV,EAAM;AAAA,MACd,OAAO;AAAA,IAAA,EACP;AAGF,WAAAe;AAAA,MACE,MAAMb,EAAM;AAAA,MACZ,CAACc,MAAQ;;AACP,YAAI,CAACR,KAAK,CAACF,EAAW,MAAO;AAC7B,YAAI,CAACU,GAAK;AACR,WAAAC,IAAAV,EAAc,UAAd,QAAAU,EAAqB,UACrBV,EAAc,QAAQ;AACtB;AAAA,QACF;AACA,cAAMW,IAAwB,CAACF,EAAI,KAAKA,EAAI,GAAG;AAC/C,QAAIT,EAAc,QAChBA,EAAc,MAAM,UAAUW,CAAG,IAEjCX,EAAc,QAAQC,EAAE,OAAOU,CAAG,EAAE,MAAMZ,EAAW,KAAK;AAAA,MAE9D;AAAA,IAAA,GAGFa,EAAU,YAAY;AACpB,UAAKf,EAAM;AACX,YAAI;AACF,gBAAMgB,IAAM,MAAM,OAAO,SAAS;AAClC,UAAAZ,IAAKY,EAAI,WAAWA,GAIpB,OAAQZ,EAAE,KAAK,QAAQ,UAAiD,aACxEA,EAAE,KAAK,QAAQ,aAAa;AAAA,YAC1B,SAASa;AAAA,YACT,eAAeC;AAAA,YACf,WAAWC;AAAA,UAAA,CACZ;AAED,gBAAMC,IAAStB,EAAM,SAASF,EAAM,eAC9ByB,IAAMjB,EAAE,IAAIJ,EAAM,OAAO;AAAA,YAC7B,QAAQ,CAACoB,EAAO,KAAKA,EAAO,GAAG;AAAA,YAC/B,MAAMxB,EAAM;AAAA,UAAA,CACb;AAED,UAAAQ,EAAE,UAAUR,EAAM,SAAS;AAAA,YACzB,aAAaA,EAAM;AAAA,UAAA,CACpB,EAAE,MAAMyB,CAAG,GAERvB,EAAM,UACRK,EAAc,QAAQC,EAAE,OAAO,CAACN,EAAM,MAAM,KAAKA,EAAM,MAAM,GAAG,CAAC,EAAE,MAAMuB,CAAG,IAG9EA,EAAI,GAAG,SAAS,CAACC,MAAyB;AACxC,gBAAI,CAACjB,EAAc,MAAO;AAC1B,kBAAM,EAAE,KAAAG,GAAK,KAAAC,EAAA,IAAQa,EAAE;AACvB,YAAAxB,EAAM,QAAQ,EAAE,KAAAU,GAAK,KAAAC,EAAA;AACrB,kBAAMK,IAAwB,CAACN,GAAKC,CAAG;AACvC,YAAIN,EAAc,QAChBA,EAAc,MAAM,UAAUW,CAAG,IAEjCX,EAAc,QAAQC,EAAG,OAAOU,CAAG,EAAE,MAAMO,CAAG;AAAA,UAElD,CAAC,GAEDnB,EAAW,QAAQmB;AAAA,QACrB,QAAQ;AAAA,QAER;AAAA,IACF,CAAC,GAEDE,EAAY,MAAM;;AAChB,OAAAV,IAAAX,EAAW,UAAX,QAAAW,EAAkB,UAClBX,EAAW,QAAQ,MACnBC,EAAc,QAAQ,MACtBC,IAAI;AAAA,IACN,CAAC,mBAICoB,EA6BaC,EAAAC,CAAA,GAAA;AAAA,MA5BV,OAAO7B,EAAA;AAAA,MACP,UAAUA,EAAA;AAAA,MACV,cAAYA,EAAA;AAAA,MACZ,KAAKA,EAAA;AAAA,MACL,aAAWA,EAAA;AAAA,MACX,QAAQA,EAAA;AAAA,IAAA;iBAET,MAaM;AAAA,QAbN8B,EAaM,OAAA;AAAA,UAZH,IAAI9B,EAAA;AAAA,UACJ,qBAAmBA,EAAA,QAAQ;AAAA,UAC3B,iBAAeA,EAAA,YAAY;AAAA,UAC3B,iBAAeA,EAAA,YAAY;AAAA,UAC3B,OAAK+B,EAAA;AAAA;YAAyD/B,EAAA,OAAO,SAAM,uBAAA;AAAA,YAAmDQ,EAAA,QAAa,KAAA;AAAA,UAAA;UAK5I,eAAY;AAAA,QAAA;UAEZsB,EAAwE,OAAA;AAAA,qBAA/D;AAAA,YAAJ,KAAI3B;AAAA,YAAS,SAAOU,EAAA,KAAc;AAAA,YAAE,eAAY;AAAA,UAAA;;QAG/CH,EAAA,cADRsB,EAMI,KANJC,GAMIC,EADCxB,EAAA,KAAe,GAAA,CAAA;;;;;;"}

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

@@ -1,121 +1,5 @@
-import { defineComponent as x, useModel as w, shallowRef as m, computed as c, watch as L, onMounted as U, onUnmounted as M, openBlock as g, createBlock as B, unref as C, withCtx as I, createElementVNode as y, normalizeClass as T, normalizeStyle as V, createElementBlock as S, toDisplayString as q, createCommentVNode as z, mergeModels as E } from "vue";
-import D from "../../../ui/field-frame/FieldFrame.vue.js";
-/* empty css                                                                                 */
-import $ from "../../../../node_modules/.pnpm/leaflet@1.9.4/node_modules/leaflet/dist/images/marker-icon.png.js";
-import A from "../../../../node_modules/.pnpm/leaflet@1.9.4/node_modules/leaflet/dist/images/marker-icon-2x.png.js";
-import F from "../../../../node_modules/.pnpm/leaflet@1.9.4/node_modules/leaflet/dist/images/marker-shadow.png.js";
-const N = ["id", "data-element-name", "data-readonly", "data-disabled"], O = {
-  key: 0,
-  class: "text-xs text-muted-foreground",
-  "data-testid": "map-picker-latlng"
-}, J = /* @__PURE__ */ x({
-  __name: "MapPicker",
-  props: /* @__PURE__ */ E({
-    modelValue: {},
-    id: {},
-    name: {},
-    label: {},
-    hideLabel: { type: Boolean },
-    required: { type: Boolean },
-    readonly: { type: Boolean },
-    disabled: { type: Boolean },
-    helpText: {},
-    errors: { default: () => [] },
-    defaultCenter: { default: () => ({ lat: 51.505, lng: -0.09 }) },
-    defaultZoom: { default: 13 },
-    height: { default: "24rem" },
-    tileUrl: { default: "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" },
-    tileAttribution: { default: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>' }
-  }, {
-    modelValue: {},
-    modelModifiers: {}
-  }),
-  emits: ["update:modelValue"],
-  setup(e) {
-    const d = e, o = w(e, "modelValue"), u = m(), i = m(null), l = m(null);
-    let a = null;
-    const s = c(() => !d.disabled && !d.readonly), f = c(() => {
-      if (!o.value) return "";
-      const { lat: t, lng: r } = o.value;
-      return `${t.toFixed(4)}, ${r.toFixed(4)}`;
-    }), b = c(() => ({
-      height: d.height,
-      width: "100%"
-    }));
-    return L(
-      () => o.value,
-      (t) => {
-        var n;
-        if (!a || !i.value) return;
-        if (!t) {
-          (n = l.value) == null || n.remove(), l.value = null;
-          return;
-        }
-        const r = [t.lat, t.lng];
-        l.value ? l.value.setLatLng(r) : l.value = a.marker(r).addTo(i.value);
-      }
-    ), U(async () => {
-      if (u.value)
-        try {
-          const t = await import("leaflet");
-          a = t.default ?? t, delete a.Icon.Default.prototype._getIconUrl, a.Icon.Default.mergeOptions({
-            iconUrl: $,
-            iconRetinaUrl: A,
-            shadowUrl: F
-          });
-          const r = o.value ?? d.defaultCenter, n = a.map(u.value, {
-            center: [r.lat, r.lng],
-            zoom: d.defaultZoom
-          });
-          a.tileLayer(d.tileUrl, {
-            attribution: d.tileAttribution
-          }).addTo(n), o.value && (l.value = a.marker([o.value.lat, o.value.lng]).addTo(n)), n.on("click", (k) => {
-            if (!s.value) return;
-            const { lat: v, lng: p } = k.latlng;
-            o.value = { lat: v, lng: p };
-            const h = [v, p];
-            l.value ? l.value.setLatLng(h) : l.value = a.marker(h).addTo(n);
-          }), i.value = n;
-        } catch {
-        }
-    }), M(() => {
-      var t;
-      (t = i.value) == null || t.remove(), i.value = null, l.value = null, a = null;
-    }), (t, r) => (g(), B(C(D), {
-      label: e.label,
-      required: e.required,
-      "hide-label": e.hideLabel,
-      for: e.id,
-      "help-text": e.helpText,
-      errors: e.errors
-    }, {
-      default: I(() => [
-        y("div", {
-          id: e.id,
-          "data-element-name": e.name ?? void 0,
-          "data-readonly": e.readonly || void 0,
-          "data-disabled": e.disabled || void 0,
-          class: T([
-            "overflow-hidden rounded-md border",
-            e.errors.length ? "border-destructive" : "border-input",
-            s.value ? "" : "pointer-events-none opacity-70"
-          ]),
-          "data-testid": "map-picker-container"
-        }, [
-          y("div", {
-            ref_key: "mapEl",
-            ref: u,
-            style: V(b.value),
-            "data-testid": "map-picker-map"
-          }, null, 4)
-        ], 10, N),
-        f.value ? (g(), S("p", O, q(f.value), 1)) : z("", !0)
-      ]),
-      _: 1
-    }, 8, ["label", "required", "hide-label", "for", "help-text", "errors"]));
-  }
-});
+import f from "./MapPicker.vue.js";
 export {
-  J as default
+  f as default
 };
 //# sourceMappingURL=MapPicker.vue2.js.map