@stachelock/ui 0.1.1 → 0.1.4

package/dist/form-DQKuKVqJ.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"form-DQKuKVqJ.js","sources":["../node_modules/@headlessui/vue/dist/hooks/use-controllable.js","../node_modules/@headlessui/vue/dist/hooks/use-resolve-button-type.js","../node_modules/@headlessui/vue/dist/utils/form.js"],"sourcesContent":["import{computed as p,ref as s}from\"vue\";function d(u,e,r){let i=s(r==null?void 0:r.value),f=p(()=>u.value!==void 0);return[p(()=>f.value?u.value:i.value),function(t){return f.value||(i.value=t),e==null?void 0:e(t)}]}export{d as useControllable};\n","import{onMounted as i,ref as f,watchEffect as l}from\"vue\";import{dom as o}from'../utils/dom.js';function r(t,e){if(t)return t;let n=e!=null?e:\"button\";if(typeof n==\"string\"&&n.toLowerCase()===\"button\")return\"button\"}function s(t,e){let n=f(r(t.value.type,t.value.as));return i(()=>{n.value=r(t.value.type,t.value.as)}),l(()=>{var u;n.value||o(e)&&o(e)instanceof HTMLButtonElement&&!((u=o(e))!=null&&u.hasAttribute(\"type\"))&&(n.value=\"button\")}),n}export{s as useResolveButtonType};\n","function e(i={},s=null,t=[]){for(let[r,n]of Object.entries(i))o(t,f(s,r),n);return t}function f(i,s){return i?i+\"[\"+s+\"]\":s}function o(i,s,t){if(Array.isArray(t))for(let[r,n]of t.entries())o(i,f(s,r.toString()),n);else t instanceof Date?i.push([s,t.toISOString()]):typeof t==\"boolean\"?i.push([s,t?\"1\":\"0\"]):typeof t==\"string\"?i.push([s,t]):typeof t==\"number\"?i.push([s,`${t}`]):t==null?i.push([s,\"\"]):e(t,s,i)}function p(i){var t,r;let s=(t=i==null?void 0:i.form)!=null?t:i.closest(\"form\");if(s){for(let n of s.elements)if(n!==i&&(n.tagName===\"INPUT\"&&n.type===\"submit\"||n.tagName===\"BUTTON\"&&n.type===\"submit\"||n.nodeName===\"INPUT\"&&n.type===\"image\")){n.click();return}(r=s.requestSubmit)==null||r.call(s)}}export{p as attemptSubmit,e as objectToFormEntries};\n"],"names":["u","e","r","i","s","f","p","t","n","l","o"],"mappings":";;AAAwC,SAAS,EAAEA,GAAEC,GAAEC,GAAE;AAAC,MAAIC,IAAEC,EAAiBF,GAAE,KAAK,GAAEG,IAAEC,EAAE,MAAIN,EAAE,UAAQ,MAAM;AAAE,SAAM,CAACM,EAAE,MAAID,EAAE,QAAML,EAAE,QAAMG,EAAE,KAAK,GAAE,SAASI,GAAE;AAAC,WAAOF,EAAE,UAAQF,EAAE,QAAMI,IAAkBN,IAAEM,CAAC;AAAA,EAAC,CAAC;AAAC;ACAvH,SAASL,EAAEK,GAAEN,GAAE;AAAC,MAAGM,EAAE,QAAOA;AAAE,MAAIC,IAAEP,KAAU;AAAS,MAAG,OAAOO,KAAG,YAAUA,EAAE,YAAW,MAAK,SAAS,QAAM;AAAQ;AAAC,SAASJ,EAAEG,GAAEN,GAAE;AAAC,MAAIO,IAAEH,EAAEH,EAAEK,EAAE,MAAM,MAAKA,EAAE,MAAM,EAAE,CAAC;AAAE,SAAOJ,EAAE,MAAI;AAAC,IAAAK,EAAE,QAAMN,EAAEK,EAAE,MAAM,MAAKA,EAAE,MAAM,EAAE;AAAA,EAAC,CAAC,GAAEE,EAAE,MAAI;AAAC,QAAIT;AAAE,IAAAQ,EAAE,SAAOE,EAAET,CAAC,KAAGS,EAAET,CAAC,aAAY,qBAAmB,GAAGD,IAAEU,EAAET,CAAC,MAAI,QAAMD,EAAE,aAAa,MAAM,OAAKQ,EAAE,QAAM;AAAA,EAAS,CAAC,GAAEA;AAAC;ACA9b,SAASP,EAAEE,IAAE,CAAA,GAAGC,IAAE,MAAKG,IAAE,CAAA,GAAG;AAAC,WAAO,CAACL,GAAEM,CAAC,KAAI,OAAO,QAAQL,CAAC,EAAE,CAAAO,EAAEH,GAAEF,EAAED,GAAEF,CAAC,GAAEM,CAAC;AAAE,SAAOD;AAAC;AAAC,SAASF,EAAEF,GAAEC,GAAE;AAAC,SAAOD,IAAEA,IAAE,MAAIC,IAAE,MAAIA;AAAC;AAAC,SAASM,EAAEP,GAAEC,GAAEG,GAAE;AAAC,MAAG,MAAM,QAAQA,CAAC,EAAE,UAAO,CAACL,GAAEM,CAAC,KAAID,EAAE,QAAO,EAAG,CAAAG,EAAEP,GAAEE,EAAED,GAAEF,EAAE,SAAQ,CAAE,GAAEM,CAAC;AAAA,MAAO,CAAAD,aAAa,OAAKJ,EAAE,KAAK,CAACC,GAAEG,EAAE,YAAW,CAAE,CAAC,IAAE,OAAOA,KAAG,YAAUJ,EAAE,KAAK,CAACC,GAAEG,IAAE,MAAI,GAAG,CAAC,IAAE,OAAOA,KAAG,WAASJ,EAAE,KAAK,CAACC,GAAEG,CAAC,CAAC,IAAE,OAAOA,KAAG,WAASJ,EAAE,KAAK,CAACC,GAAE,GAAGG,CAAC,EAAE,CAAC,IAAEA,KAAG,OAAKJ,EAAE,KAAK,CAACC,GAAE,EAAE,CAAC,IAAEH,EAAEM,GAAEH,GAAED,CAAC;AAAC;AAAC,SAASG,EAAEH,GAAE;AAAC,MAAI,GAAED;AAAE,MAAIE,KAAG,IAAiBD,GAAE,SAAO,OAAK,IAAEA,EAAE,QAAQ,MAAM;AAAE,MAAGC,GAAE;AAAC,aAAQI,KAAKJ,EAAE,SAAS,KAAGI,MAAIL,MAAIK,EAAE,YAAU,WAASA,EAAE,SAAO,YAAUA,EAAE,YAAU,YAAUA,EAAE,SAAO,YAAUA,EAAE,aAAW,WAASA,EAAE,SAAO,UAAS;AAAC,MAAAA,EAAE,MAAK;AAAG;AAAA,IAAM;AAAC,KAACN,IAAEE,EAAE,kBAAgB,QAAMF,EAAE,KAAKE,CAAC;AAAA,EAAC;AAAC;","x_google_ignoreList":[0,1,2]}

package/dist/forms/DynamicForm.d.ts

@@ -0,0 +1,3 @@
+export * from '../src/components/forms/DynamicForm'
+import StachelockUI from '../src/components/forms/DynamicForm'
+export default StachelockUI

package/dist/forms/DynamicForm.js

@@ -0,0 +1,5 @@
+import { _ as f } from "../DynamicForm.vue_vue_type_script_setup_true_lang-BpfPAZiT.js";
+export {
+  f as default
+};
+//# sourceMappingURL=DynamicForm.js.map

package/dist/forms/DynamicForm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DynamicForm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/forms/DynamicFormField.d.ts

@@ -0,0 +1,3 @@
+export * from '../src/components/forms/DynamicFormField'
+import StachelockUI from '../src/components/forms/DynamicFormField'
+export default StachelockUI

package/dist/forms/DynamicFormField.js

@@ -0,0 +1,5 @@
+import { _ as f } from "../DynamicFormField.vue_vue_type_script_setup_true_lang-DvT03FIS.js";
+export {
+  f as default
+};
+//# sourceMappingURL=DynamicFormField.js.map

package/dist/forms/DynamicFormField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DynamicFormField.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/forms/FormFieldWrapper.d.ts

@@ -0,0 +1,3 @@
+export * from '../src/components/forms/FormFieldWrapper'
+import StachelockUI from '../src/components/forms/FormFieldWrapper'
+export default StachelockUI

package/dist/forms/FormFieldWrapper.js

@@ -0,0 +1,187 @@
+import { createElementBlock as l, openBlock as t, createElementVNode as a, defineComponent as b, useSlots as w, computed as c, normalizeClass as n, createVNode as f, createCommentVNode as o, createTextVNode as d, toDisplayString as i, Fragment as g, renderSlot as r, unref as h, Transition as k, withCtx as C } from "vue";
+import { _ as M } from "../_plugin-vue_export-helper-CHgC5LLL.js";
+function B(u, e) {
+  return t(), l("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 20 20",
+    fill: "currentColor",
+    "aria-hidden": "true",
+    "data-slot": "icon"
+  }, [
+    a("path", {
+      "fill-rule": "evenodd",
+      d: "M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16Zm3.857-9.809a.75.75 0 0 0-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 1 0-1.06 1.061l2.5 2.5a.75.75 0 0 0 1.137-.089l4-5.5Z",
+      "clip-rule": "evenodd"
+    })
+  ]);
+}
+function T(u, e) {
+  return t(), l("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 20 20",
+    fill: "currentColor",
+    "aria-hidden": "true",
+    "data-slot": "icon"
+  }, [
+    a("path", {
+      "fill-rule": "evenodd",
+      d: "M18 10a8 8 0 1 1-16 0 8 8 0 0 1 16 0Zm-8-5a.75.75 0 0 1 .75.75v4.5a.75.75 0 0 1-1.5 0v-4.5A.75.75 0 0 1 10 5Zm0 10a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z",
+      "clip-rule": "evenodd"
+    })
+  ]);
+}
+const V = { class: "sl-grid sl-grid-cols-3 sl-items-center" }, x = ["for"], E = {
+  key: 0,
+  class: "sl-text-red-500 sl-ml-1"
+}, $ = { class: "disabled-message sl-text-xs sl-text-gray-400 sl-col-start-3 sl-text-right" }, F = {
+  key: 0,
+  class: "sl-text-xs sl-uppercase sl-text-gray-500 sl-truncate sl-text-right sl-font-semibold sl-justify-self-end sl-col-start-3"
+}, S = {
+  key: 0,
+  class: "sl-text-2xs sl-uppercase sl-text-gray-500 sl-truncate sl-text-right sl-font-semibold sl-justify-self-end sl-col-start-3"
+}, L = {
+  key: 0,
+  class: "sl-absolute sl-inset-y-0 sl-right-0 sl-flex sl-items-center sl-pr-3 sl-z-10 sl-pointer-events-none"
+}, Z = {
+  key: 1,
+  class: "sl-absolute sl-inset-y-0 sl-right-0 sl-flex sl-items-center sl-pr-3 sl-z-10 sl-pointer-events-none"
+}, I = { class: "sl-flex sl-select-none sl-items-center sl-pl-3 sl-text-gray-500 sm:sl-text-sm" }, N = { class: "sl-flex-1 sl-min-w-0" }, z = {
+  key: 3,
+  class: "sl-relative"
+}, j = { class: "sl-flex-1 sl-min-w-0 sl-pl-2 sl-pr-2" }, H = { class: "sl-absolute sl-inset-y-0 sl-right-0 sl-flex sl-items-center" }, R = {
+  key: 0,
+  class: "error-message sl-mt-2 sl-text-sm sl-text-red-600 sl-bg-red-50 sl-ring-1 sl-ring-red-100 sl-rounded-md sl-p-2"
+}, W = {
+  key: 1,
+  class: "success-message sl-mt-2 sl-text-sm sl-text-green-600 sl-bg-green-50 sl-p-2 sl-rounded-md"
+}, A = "sl-block sl-w-full sl-border-0 sl-bg-transparent sl-py-1.5 sl-text-gray-800 sl-placeholder:text-gray-400 focus:sl-ring-0 sm:sl-text-sm sm:sl-leading-6", D = "sl-block sl-w-full sl-rounded-md sl-border-0 sl-py-1.5 sl-text-gray-800 sl-shadow-sm sl-ring-1 sl-ring-inset sl-placeholder:text-gray-400 focus:sl-ring-2 focus:sl-ring-inset focus:sl-ring-stachelock-600 sm:sl-text-sm sm:sl-leading-6", P = "sl-block sl-w-full sl-border-0 sl-bg-transparent sl-py-1 sl-text-gray-400 sl-placeholder:text-gray-400 focus:sl-ring-0 sm:sl-text-sm sm:sl-leading-6 sl-cursor-not-allowed", q = /* @__PURE__ */ b({
+  __name: "FormFieldWrapper",
+  props: {
+    id: {},
+    name: {},
+    label: { default: "" },
+    tertiaryLabel: { default: "" },
+    errorMessage: { default: null },
+    successMessage: { default: "" },
+    isValid: { type: Boolean, default: !1 },
+    isTouched: { type: Boolean, default: !1 },
+    showErrors: { type: Boolean, default: !1 },
+    showValidCheck: { type: Boolean, default: !0 },
+    colorfulValidation: { type: Boolean, default: !1 },
+    disabled: { type: Boolean, default: !1 },
+    disabledMessage: { default: "" },
+    optional: { type: Boolean, default: !1 },
+    boxShadow: { type: Boolean, default: !1 },
+    formTracking: { type: Boolean, default: !1 },
+    isFocused: { type: Boolean, default: !1 },
+    isHovered: { type: Boolean, default: !1 },
+    externalErrors: { default: null }
+  },
+  setup(u) {
+    const e = u, m = w(), y = c(() => !!m.prefix), v = c(() => [
+      e.boxShadow ? "sl-shadow sm:sl-rounded-lg sl-mt-2 sl-mb-4 sl-px-4 sl-py-5 sm:sl-p-6" : "",
+      e.formTracking && (e.isFocused || e.isHovered) ? "sl-ring-1 sl-ring-stachelock-600 sl-bg-white/80" : "",
+      e.externalErrors && e.externalErrors[e.name] ? "has-error" : ""
+    ]), p = c(() => e.disabled || !e.colorfulValidation ? "sl-ring-gray-300" : e.isValid && (e.isTouched || e.showValidCheck) ? "sl-ring-green-500" : e.errorMessage && (e.isTouched || e.showErrors) ? "sl-ring-red-500" : "sl-ring-gray-300");
+    return (s, G) => (t(), l("div", {
+      class: n([[
+        {
+          "has-error": !!s.errorMessage && (s.isTouched || s.showErrors),
+          success: s.isValid && s.isTouched
+        },
+        v.value
+      ], "sl-text-sm"]),
+      "data-testid": "form-field-wrapper"
+    }, [
+      a("div", V, [
+        s.label ? (t(), l("label", {
+          key: 0,
+          for: s.id,
+          class: "sl-text-sm sl-col-span-2 sl-font-medium sl-text-gray-700"
+        }, [
+          d(i(s.label) + " ", 1),
+          s.optional ? o("", !0) : (t(), l("span", E, "*"))
+        ], 8, x)) : o("", !0),
+        s.disabled && s.disabledMessage ? (t(), l(g, { key: 1 }, [
+          a("p", $, i(s.disabledMessage), 1),
+          s.tertiaryLabel ? (t(), l("span", F, [
+            d(i(s.tertiaryLabel) + " ", 1),
+            r(s.$slots, "tertiary-label-overlay", {}, void 0, !0)
+          ])) : o("", !0)
+        ], 64)) : (t(), l(g, { key: 2 }, [
+          s.tertiaryLabel ? (t(), l("span", S, [
+            d(i(s.tertiaryLabel) + " ", 1),
+            r(s.$slots, "tertiary-label-overlay", {}, void 0, !0)
+          ])) : o("", !0)
+        ], 64))
+      ]),
+      a("div", {
+        class: n(["sl-relative", { "sl-mt-2": s.label }])
+      }, [
+        s.errorMessage && (s.isTouched || s.showErrors) ? (t(), l("div", L, [
+          f(h(T), {
+            class: "sl-h-5 sl-w-5 sl-text-red-500",
+            "aria-hidden": "true",
+            "data-testid": "error-icon"
+          })
+        ])) : s.showValidCheck && s.isValid && s.isTouched ? (t(), l("div", Z, [
+          f(h(B), {
+            class: "sl-h-5 sl-w-5 sl-text-green-500",
+            "aria-hidden": "true",
+            "data-testid": "check-icon"
+          })
+        ])) : o("", !0),
+        y.value ? (t(), l("div", {
+          key: 2,
+          class: n(["sl-flex sl-rounded-md sl-shadow-sm sl-ring-1 sl-ring-inset focus-within:sl-ring-2 focus-within:sl-ring-inset focus-within:sl-ring-stachelock-600", p.value])
+        }, [
+          a("div", I, [
+            r(s.$slots, "prefix", {}, void 0, !0)
+          ]),
+          a("div", N, [
+            r(s.$slots, "default", { inputClasses: A }, void 0, !0)
+          ]),
+          r(s.$slots, "input-right", {}, void 0, !0)
+        ], 2)) : (t(), l("div", z, [
+          s.disabled ? (t(), l("div", {
+            key: 0,
+            class: n(["sl-flex sl-rounded-md sl-shadow-sm sl-ring-1 sl-ring-inset sl-bg-gray-50", p.value])
+          }, [
+            a("div", j, [
+              r(s.$slots, "default", { inputClasses: P }, void 0, !0)
+            ]),
+            r(s.$slots, "input-right", {}, void 0, !0)
+          ], 2)) : (t(), l(g, { key: 1 }, [
+            r(s.$slots, "default", { inputClasses: D }, void 0, !0),
+            a("div", H, [
+              r(s.$slots, "input-right", {}, void 0, !0)
+            ])
+          ], 64))
+        ]))
+      ], 2),
+      f(k, {
+        show: !!s.errorMessage && (s.isTouched || s.showErrors) || s.isValid && !!s.successMessage && s.isTouched,
+        appear: !0,
+        "enter-active-class": "sl-transition sl-ease-out sl-duration-300",
+        "enter-from-class": "sl-opacity-0 sl-transform sl-scale-95",
+        "enter-to-class": "sl-opacity-100 sl-transform sl-scale-100",
+        "leave-active-class": "sl-transition sl-ease-in sl-duration-200",
+        "leave-from-class": "sl-opacity-100 sl-transform sl-scale-100",
+        "leave-to-class": "sl-opacity-0 sl-transform sl-scale-95"
+      }, {
+        default: C(() => [
+          s.errorMessage && (s.isTouched || s.showErrors) ? (t(), l("p", R, i(s.errorMessage), 1)) : s.isValid && s.successMessage && s.isTouched ? (t(), l("p", W, [
+            r(s.$slots, "success-message", {}, () => [
+              d(i(s.successMessage), 1)
+            ], !0)
+          ])) : o("", !0)
+        ]),
+        _: 3
+      }, 8, ["show"])
+    ], 2));
+  }
+}), O = /* @__PURE__ */ M(q, [["__scopeId", "data-v-23518b3b"]]);
+export {
+  O as default
+};
+//# sourceMappingURL=FormFieldWrapper.js.map

package/dist/forms/FormFieldWrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormFieldWrapper.js","sources":["../../node_modules/@heroicons/vue/20/solid/esm/CheckCircleIcon.js","../../node_modules/@heroicons/vue/20/solid/esm/ExclamationCircleIcon.js","../../src/components/forms/FormFieldWrapper.vue"],"sourcesContent":["import { createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\n\nexport default function render(_ctx, _cache) {\n  return (_openBlock(), _createElementBlock(\"svg\", {\n    xmlns: \"http://www.w3.org/2000/svg\",\n    viewBox: \"0 0 20 20\",\n    fill: \"currentColor\",\n    \"aria-hidden\": \"true\",\n    \"data-slot\": \"icon\"\n  }, [\n    _createElementVNode(\"path\", {\n      \"fill-rule\": \"evenodd\",\n      d: \"M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16Zm3.857-9.809a.75.75 0 0 0-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 1 0-1.06 1.061l2.5 2.5a.75.75 0 0 0 1.137-.089l4-5.5Z\",\n      \"clip-rule\": \"evenodd\"\n    })\n  ]))\n}","import { createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\n\nexport default function render(_ctx, _cache) {\n  return (_openBlock(), _createElementBlock(\"svg\", {\n    xmlns: \"http://www.w3.org/2000/svg\",\n    viewBox: \"0 0 20 20\",\n    fill: \"currentColor\",\n    \"aria-hidden\": \"true\",\n    \"data-slot\": \"icon\"\n  }, [\n    _createElementVNode(\"path\", {\n      \"fill-rule\": \"evenodd\",\n      d: \"M18 10a8 8 0 1 1-16 0 8 8 0 0 1 16 0Zm-8-5a.75.75 0 0 1 .75.75v4.5a.75.75 0 0 1-1.5 0v-4.5A.75.75 0 0 1 10 5Zm0 10a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z\",\n      \"clip-rule\": \"evenodd\"\n    })\n  ]))\n}","<template>\n  <div :class=\"[\n    {\n      'has-error': !!errorMessage && (isTouched || showErrors),\n      'success': isValid && isTouched,\n    },\n    fieldClasses\n  ]\" class=\"sl-text-sm\" data-testid=\"form-field-wrapper\">\n    <div class=\"sl-grid sl-grid-cols-3 sl-items-center\">\n      <label v-if=\"label\" :for=\"id\" class=\"sl-text-sm sl-col-span-2 sl-font-medium sl-text-gray-700\">\n        {{ label }}\n        <span v-if=\"!optional\" class=\"sl-text-red-500 sl-ml-1\">*</span>\n      </label>\n      <template v-if=\"disabled && disabledMessage\">\n        <p class=\"disabled-message sl-text-xs sl-text-gray-400 sl-col-start-3 sl-text-right\">\n          {{ disabledMessage }}\n        </p>\n        <span v-if=\"tertiaryLabel\"\n          class=\"sl-text-xs sl-uppercase sl-text-gray-500 sl-truncate sl-text-right sl-font-semibold sl-justify-self-end sl-col-start-3\">\n          {{ tertiaryLabel }}\n          <slot name=\"tertiary-label-overlay\"></slot>\n        </span>\n      </template>\n      <template v-else>\n        <span v-if=\"tertiaryLabel\"\n          class=\"sl-text-2xs sl-uppercase sl-text-gray-500 sl-truncate sl-text-right sl-font-semibold sl-justify-self-end sl-col-start-3\">\n          {{ tertiaryLabel }}\n          <slot name=\"tertiary-label-overlay\"></slot>\n        </span>\n      </template>\n    </div>\n\n    <div class=\"sl-relative\" :class=\"{ 'sl-mt-2': label }\">\n      <!-- Error Icon -->\n      <div v-if=\"!!errorMessage && (isTouched || showErrors)\"\n        class=\"sl-absolute sl-inset-y-0 sl-right-0 sl-flex sl-items-center sl-pr-3 sl-z-10 sl-pointer-events-none\">\n        <ExclamationCircleIcon class=\"sl-h-5 sl-w-5 sl-text-red-500\" aria-hidden=\"true\" data-testid=\"error-icon\" />\n      </div>\n      <!-- Success Icon -->\n      <div v-else-if=\"showValidCheck && isValid && isTouched\"\n        class=\"sl-absolute sl-inset-y-0 sl-right-0 sl-flex sl-items-center sl-pr-3 sl-z-10 sl-pointer-events-none\">\n        <CheckCircleIcon class=\"sl-h-5 sl-w-5 sl-text-green-500\" aria-hidden=\"true\" data-testid=\"check-icon\" />\n      </div>\n\n      <!-- Input with prefix slot -->\n      <div v-if=\"hasPrefixSlot\"\n        class=\"sl-flex sl-rounded-md sl-shadow-sm sl-ring-1 sl-ring-inset focus-within:sl-ring-2 focus-within:sl-ring-inset focus-within:sl-ring-stachelock-600\"\n        :class=\"wrapperRingClasses\">\n        <div class=\"sl-flex sl-select-none sl-items-center sl-pl-3 sl-text-gray-500 sm:sl-text-sm\">\n          <slot name=\"prefix\" />\n        </div>\n        <div class=\"sl-flex-1 sl-min-w-0\">\n          <slot :input-classes=\"defaultInputClasses\"></slot>\n        </div>\n        <slot name=\"input-right\" />\n      </div>\n\n      <!-- Plain input (default slot):\n           - When disabled, show a unified wrapper ring to match design\n           - Otherwise, apply ring directly on the input element\n      -->\n      <div v-else class=\"sl-relative\">\n        <template v-if=\"disabled\">\n          <div class=\"sl-flex sl-rounded-md sl-shadow-sm sl-ring-1 sl-ring-inset sl-bg-gray-50\"\n            :class=\"wrapperRingClasses\">\n            <div class=\"sl-flex-1 sl-min-w-0 sl-pl-2 sl-pr-2\">\n              <slot :input-classes=\"disabledInputClasses\"></slot>\n            </div>\n            <slot name=\"input-right\" />\n          </div>\n        </template>\n        <template v-else>\n          <slot :input-classes=\"defaultInputRingClasses\"></slot>\n          <div class=\"sl-absolute sl-inset-y-0 sl-right-0 sl-flex sl-items-center\">\n            <slot name=\"input-right\" />\n          </div>\n        </template>\n      </div>\n    </div>\n\n    <Transition :show=\"(!!errorMessage && (isTouched || showErrors)) || (isValid && !!successMessage && isTouched)\"\n      :appear=\"true\" enter-active-class=\"sl-transition sl-ease-out sl-duration-300\"\n      enter-from-class=\"sl-opacity-0 sl-transform sl-scale-95\" enter-to-class=\"sl-opacity-100 sl-transform sl-scale-100\"\n      leave-active-class=\"sl-transition sl-ease-in sl-duration-200\"\n      leave-from-class=\"sl-opacity-100 sl-transform sl-scale-100\"\n      leave-to-class=\"sl-opacity-0 sl-transform sl-scale-95\">\n      <p v-if=\"!!errorMessage && (isTouched || showErrors)\"\n        class=\"error-message sl-mt-2 sl-text-sm sl-text-red-600 sl-bg-red-50 sl-ring-1 sl-ring-red-100 sl-rounded-md sl-p-2\">\n        {{ errorMessage }}\n      </p>\n      <p v-else-if=\"isValid && !!successMessage && isTouched\"\n        class=\"success-message sl-mt-2 sl-text-sm sl-text-green-600 sl-bg-green-50 sl-p-2 sl-rounded-md\">\n        <slot name=\"success-message\">{{ successMessage }}</slot>\n      </p>\n    </Transition>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, useSlots } from 'vue'\nimport { CheckCircleIcon, ExclamationCircleIcon } from '@heroicons/vue/20/solid'\n// (Transition is used in the template via built-in component)\n\ninterface FormFieldWrapperProps {\n  id: string\n  name: string\n  label?: string\n  tertiaryLabel?: string\n  errorMessage?: string | null\n  successMessage?: string\n  isValid?: boolean\n  isTouched?: boolean\n  showErrors?: boolean // To force show errors\n  showValidCheck?: boolean\n  colorfulValidation?: boolean\n  disabled?: boolean\n  disabledMessage?: string\n  optional?: boolean\n  boxShadow?: boolean\n  formTracking?: boolean\n  isFocused?: boolean\n  isHovered?: boolean\n  externalErrors?: Record<string, unknown> | null\n}\n\nconst props = withDefaults(defineProps<FormFieldWrapperProps>(), {\n  label: '',\n  tertiaryLabel: '',\n  errorMessage: null,\n  successMessage: '',\n  isValid: false,\n  isTouched: false,\n  showErrors: false,\n  showValidCheck: true,\n  colorfulValidation: false,\n  disabled: false,\n  disabledMessage: '',\n  optional: false,\n  boxShadow: false,\n  formTracking: false,\n  isFocused: false,\n  isHovered: false,\n  externalErrors: null,\n})\n\nconst slots = useSlots()\nconst hasPrefixSlot = computed(() => !!slots.prefix)\n\n// Optional card-like container and form-tracking ring classes\nconst fieldClasses = computed(() => [\n  props.boxShadow ? 'sl-shadow sm:sl-rounded-lg sl-mt-2 sl-mb-4 sl-px-4 sl-py-5 sm:sl-p-6' : '',\n  (props.formTracking && (props.isFocused || props.isHovered)) ? 'sl-ring-1 sl-ring-stachelock-600 sl-bg-white/80' : '',\n  props.externalErrors && props.externalErrors[props.name] ? 'has-error' : ''\n])\n\nconst wrapperRingClasses = computed(() => {\n  if (props.disabled) return 'sl-ring-gray-300'\n  if (!props.colorfulValidation) return 'sl-ring-gray-300'\n  if (props.isValid && (props.isTouched || props.showValidCheck)) return 'sl-ring-green-500'\n  if (!!props.errorMessage && (props.isTouched || props.showErrors)) return 'sl-ring-red-500'\n  return 'sl-ring-gray-300'\n})\n\n// Default classes that can be passed to the slotted input for consistency with TextInput\nconst defaultInputClasses = \"sl-block sl-w-full sl-border-0 sl-bg-transparent sl-py-1.5 sl-text-gray-800 sl-placeholder:text-gray-400 focus:sl-ring-0 sm:sl-text-sm sm:sl-leading-6\"\nconst defaultInputRingClasses = \"sl-block sl-w-full sl-rounded-md sl-border-0 sl-py-1.5 sl-text-gray-800 sl-shadow-sm sl-ring-1 sl-ring-inset sl-placeholder:text-gray-400 focus:sl-ring-2 focus:sl-ring-inset focus:sl-ring-stachelock-600 sm:sl-text-sm sm:sl-leading-6\"\nconst disabledInputClasses = \"sl-block sl-w-full sl-border-0 sl-bg-transparent sl-py-1 sl-text-gray-400 sl-placeholder:text-gray-400 focus:sl-ring-0 sm:sl-text-sm sm:sl-leading-6 sl-cursor-not-allowed\"\n</script>\n\n<style scoped>\n.error-message,\n.success-message,\n.disabled-message {\n  min-height: 1.4em;\n  /* Match TextInput for layout consistency */\n}\n</style>\n"],"names":["render","_ctx","_cache","_openBlock","_createElementBlock","_createElementVNode","defaultInputClasses","defaultInputRingClasses","disabledInputClasses","props","__props","slots","useSlots","hasPrefixSlot","computed","fieldClasses","wrapperRingClasses","_normalizeClass","errorMessage","isTouched","showErrors","isValid","_hoisted_1","label","id","optional","_hoisted_3","disabled","disabledMessage","_Fragment","_hoisted_4","_toDisplayString","tertiaryLabel","_hoisted_5","_renderSlot","_hoisted_6","_hoisted_7","_createVNode","_unref","ExclamationCircleIcon","showValidCheck","_hoisted_8","CheckCircleIcon","_hoisted_9","_hoisted_10","_hoisted_11","_hoisted_12","_hoisted_13","_Transition","successMessage","_hoisted_14","_hoisted_15"],"mappings":"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","x_google_ignoreList":[0,1]}

package/dist/id-DafBB_QF.js

@@ -0,0 +1,20 @@
+function o(e = "sl") {
+  return `${e}-${Math.random().toString(36).substr(2, 9)}-${Date.now().toString(36)}`;
+}
+function s(e, a = "sl") {
+  let t = 0;
+  for (let r = 0; r < e.length; r++) {
+    const n = e.charCodeAt(r);
+    t = (t << 5) - t + n, t = t & t;
+  }
+  return `${a}-${Math.abs(t).toString(36)}`;
+}
+function i(e) {
+  return e.toLowerCase().replace(/[^a-z0-9-_]/g, "-").replace(/-+/g, "-").replace(/^-|-$/g, "");
+}
+export {
+  s as a,
+  o as g,
+  i as s
+};
+//# sourceMappingURL=id-DafBB_QF.js.map

package/dist/id-DafBB_QF.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"id-DafBB_QF.js","sources":["../src/utils/id.ts"],"sourcesContent":["/**\n * Generate a unique ID with an optional prefix\n */\nexport function generateId(prefix = 'sl'): string {\n  return `${prefix}-${Math.random().toString(36).substr(2, 9)}-${Date.now().toString(36)}`\n}\n\n/**\n * Generate a deterministic ID based on a seed string\n */\nexport function generateDeterministicId(seed: string, prefix = 'sl'): string {\n  // Simple hash function for consistent IDs\n  let hash = 0\n  for (let i = 0; i < seed.length; i++) {\n    const char = seed.charCodeAt(i)\n    hash = ((hash << 5) - hash) + char\n    hash = hash & hash // Convert to 32-bit integer\n  }\n  return `${prefix}-${Math.abs(hash).toString(36)}`\n}\n\n/**\n * Sanitize a string to be used as a valid HTML ID\n */\nexport function sanitizeId(id: string): string {\n  return id\n    .toLowerCase()\n    .replace(/[^a-z0-9-_]/g, '-')\n    .replace(/-+/g, '-')\n    .replace(/^-|-$/g, '')\n}\n"],"names":["generateId","prefix","generateDeterministicId","seed","hash","i","char","sanitizeId","id"],"mappings":"AAGO,SAASA,EAAWC,IAAS,MAAc;AAChD,SAAO,GAAGA,CAAM,IAAI,KAAK,SAAS,SAAS,EAAE,EAAE,OAAO,GAAG,CAAC,CAAC,IAAI,KAAK,MAAM,SAAS,EAAE,CAAC;AACxF;AAKO,SAASC,EAAwBC,GAAcF,IAAS,MAAc;AAE3E,MAAIG,IAAO;AACX,WAASC,IAAI,GAAGA,IAAIF,EAAK,QAAQE,KAAK;AACpC,UAAMC,IAAOH,EAAK,WAAWE,CAAC;AAC9B,IAAAD,KAASA,KAAQ,KAAKA,IAAQE,GAC9BF,IAAOA,IAAOA;AAAA,EAChB;AACA,SAAO,GAAGH,CAAM,IAAI,KAAK,IAAIG,CAAI,EAAE,SAAS,EAAE,CAAC;AACjD;AAKO,SAASG,EAAWC,GAAoB;AAC7C,SAAOA,EACJ,YAAA,EACA,QAAQ,gBAAgB,GAAG,EAC3B,QAAQ,OAAO,GAAG,EAClB,QAAQ,UAAU,EAAE;AACzB;"}