@incodetech/web 0.0.0-dev-20260407-4580f1c → 0.0.0-dev-20260407-2c382da

package/dist/dropdownComposed-BpinYlrx.js

@@ -0,0 +1,367 @@
+import { u as o, c as U } from "./loadingIcon-DmuPXh70.js";
+import { d as g, A as p, y as C } from "./vendor-preact-BoMmvSgn.js";
+import { C as ie } from "./chevronDown-DSHaPKbi.js";
+import { E as le } from "./errorIcon-DEARBrGx.js";
+import { S as pe } from "./successIcon-Bjsdc4lF.js";
+const ue = ({ size: c = 20 }) => /* @__PURE__ */ o(
+  "svg",
+  {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: c,
+    height: c,
+    viewBox: "0 0 20 20",
+    fill: "none",
+    class: "IncodeSearchIcon",
+    "aria-hidden": "true",
+    children: [
+      /* @__PURE__ */ o("title", { children: "Search" }),
+      /* @__PURE__ */ o(
+        "path",
+        {
+          d: "M9 17C13.4183 17 17 13.4183 17 9C17 4.58172 13.4183 1 9 1C4.58172 1 1 4.58172 1 9C1 13.4183 4.58172 17 9 17Z",
+          stroke: "var(--icon-neutral-300)",
+          "stroke-width": "2",
+          "stroke-linecap": "round",
+          "stroke-linejoin": "round"
+        }
+      ),
+      /* @__PURE__ */ o(
+        "path",
+        {
+          d: "M19 19L14.65 14.65",
+          stroke: "var(--icon-neutral-300)",
+          "stroke-width": "2",
+          "stroke-linecap": "round",
+          "stroke-linejoin": "round"
+        }
+      )
+    ]
+  }
+), De = ({
+  id: c,
+  label: u,
+  placeholder: W = "Choose an option",
+  value: b,
+  options: k,
+  onChange: V,
+  error: l,
+  helper: y,
+  showErrorIcon: Z,
+  showHelperIcon: _,
+  suppressMessages: S = !1,
+  disabled: f = !1,
+  required: $,
+  searchable: h = !1,
+  searchPlaceholder: H = "Search...",
+  noResultsText: K = "No results found",
+  name: L,
+  tabIndex: G,
+  onKeyDown: J,
+  onBlur: P,
+  renderSelectedLabel: O,
+  siblingElement: T,
+  enterKeyHint: fe,
+  class: X,
+  "aria-label": B,
+  "data-testid": Y
+}) => {
+  const [r, d] = g(!1), [ee, j] = g(!1), [a, t] = g(-1), [w, z] = g(""), N = p(null), m = p(null), q = p(null), x = p([]), R = p(null), A = p(""), v = p(), I = k.find((e) => e.value === b), oe = I ? O ? O(I) : I.label : W, s = h && w ? k.filter(
+    (e) => e.label.toLowerCase().includes(w.toLowerCase())
+  ) : k, E = `${c}-label`, F = `${c}-listbox`, M = `${c}-helper`, Q = `${c}-error`, re = S ? "" : [y ? M : null, l ? Q : null].filter(Boolean).join(" ");
+  C(() => {
+    if (!r) return;
+    const e = requestAnimationFrame(() => {
+      h && R.current && R.current.focus(), requestAnimationFrame(() => {
+        q.current?.scrollIntoView({
+          behavior: "smooth",
+          block: "nearest",
+          inline: "nearest"
+        });
+      });
+    });
+    return () => cancelAnimationFrame(e);
+  }, [r, h]), C(() => {
+    r || (t(-1), z(""));
+  }, [r]), C(() => {
+    a >= 0 && x.current[a] && x.current[a]?.scrollIntoView({
+      block: "nearest",
+      inline: "nearest"
+    });
+  }, [a]), C(() => () => {
+    v.current && clearTimeout(v.current);
+  }, []);
+  const ne = () => {
+    f || d((e) => !e);
+  }, D = (e) => {
+    V(e), d(!1), t(-1), m.current?.focus();
+  }, te = () => {
+    j(!0);
+  }, ae = (e) => {
+    j(!1), N.current?.contains(e.relatedTarget) || (d(!1), P?.());
+  }, se = (e) => {
+    if (f) return;
+    J?.(e);
+    const { key: i } = e;
+    if (i.length === 1 && /^[a-zA-Z0-9]$/.test(i)) {
+      e.preventDefault(), v.current && clearTimeout(v.current), A.current += i.toLowerCase();
+      const n = s.findIndex(
+        (de) => de.label.toLowerCase().startsWith(A.current)
+      );
+      n !== -1 && (r || d(!0), t(n)), v.current = setTimeout(() => {
+        A.current = "";
+      }, 500);
+      return;
+    }
+    switch (i) {
+      case "ArrowDown":
+        e.preventDefault(), r ? t(
+          (n) => n < s.length - 1 ? n + 1 : n
+        ) : (d(!0), t(0));
+        break;
+      case "ArrowUp":
+        e.preventDefault(), r ? t((n) => n > 0 ? n - 1 : n) : (d(!0), t(s.length - 1));
+        break;
+      case "Home":
+        e.preventDefault(), r && t(0);
+        break;
+      case "End":
+        e.preventDefault(), r && t(s.length - 1);
+        break;
+      case "Enter":
+        e.preventDefault(), r && a >= 0 && s[a] ? D(s[a].value) : r || d(!0);
+        break;
+      case " ":
+        e.preventDefault(), r && a >= 0 && s[a] ? D(s[a].value) : r || (d(!0), t(0));
+        break;
+      case "Escape":
+        e.preventDefault(), r && (d(!1), t(-1), m.current?.focus());
+        break;
+      case "Tab":
+        r && (d(!1), t(-1));
+        break;
+    }
+  }, ce = (e) => {
+    const { key: i } = e;
+    switch (i) {
+      case "ArrowDown":
+        e.preventDefault(), t(
+          (n) => n < s.length - 1 ? n + 1 : n
+        );
+        break;
+      case "ArrowUp":
+        e.preventDefault(), t((n) => n > 0 ? n - 1 : n);
+        break;
+      case "Home":
+        e.preventDefault(), t(0);
+        break;
+      case "End":
+        e.preventDefault(), t(s.length - 1);
+        break;
+      case "Enter":
+        e.preventDefault(), a >= 0 && s[a] && D(s[a].value);
+        break;
+      case "Escape":
+        e.preventDefault(), d(!1), t(-1), m.current?.focus();
+        break;
+      case "Tab":
+        d(!1), t(-1);
+        break;
+    }
+  };
+  return /* @__PURE__ */ o(
+    "div",
+    {
+      class: U("IncodeDropdownComposed", X),
+      ref: N,
+      onBlur: ae,
+      children: [
+        L && /* @__PURE__ */ o(
+          "input",
+          {
+            type: "hidden",
+            name: L,
+            value: b || "",
+            disabled: f,
+            required: $
+          }
+        ),
+        u && /* @__PURE__ */ o(
+          "label",
+          {
+            class: "IncodeDropdownComposedLabel",
+            id: E,
+            htmlFor: c,
+            "data-testid": `${c}-label`,
+            children: [
+              u,
+              $ && /* @__PURE__ */ o("span", { class: "IncodeDropdownComposedRequired", children: " *" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ o("div", { class: "IncodeDropdownComposedWrapper", children: [
+          /* @__PURE__ */ o(
+            "div",
+            {
+              class: U("IncodeDropdownComposedTriggerRow", {
+                IncodeDropdownComposedTriggerRowWithSibling: !!T
+              }),
+              children: [
+                /* @__PURE__ */ o(
+                  "button",
+                  {
+                    ref: m,
+                    type: "button",
+                    id: c,
+                    class: "IncodeDropdownComposedTrigger",
+                    onClick: ne,
+                    onFocus: te,
+                    onKeyDown: se,
+                    tabIndex: f ? -1 : G ?? 0,
+                    disabled: f,
+                    "aria-haspopup": "listbox",
+                    "aria-expanded": r ? "true" : "false",
+                    "aria-disabled": f ? "true" : void 0,
+                    "aria-labelledby": u ? E : void 0,
+                    "aria-label": u ? void 0 : B,
+                    "aria-controls": r ? F : void 0,
+                    "aria-activedescendant": r && a >= 0 ? `${c}-option-${a}` : void 0,
+                    "aria-invalid": l ? "true" : void 0,
+                    "aria-required": $ ? "true" : void 0,
+                    "aria-describedby": re || void 0,
+                    "data-error": l ? "true" : void 0,
+                    "data-focused": ee || r ? "true" : void 0,
+                    "data-testid": Y,
+                    children: [
+                      /* @__PURE__ */ o(
+                        "span",
+                        {
+                          class: I ? "IncodeDropdownComposedTriggerText" : "IncodeDropdownComposedTriggerPlaceholder",
+                          children: oe
+                        }
+                      ),
+                      /* @__PURE__ */ o(
+                        "span",
+                        {
+                          class: "IncodeDropdownComposedTriggerIcon",
+                          "aria-hidden": "true",
+                          "data-open": r,
+                          children: /* @__PURE__ */ o(ie, {})
+                        }
+                      )
+                    ]
+                  }
+                ),
+                T && /* @__PURE__ */ o("div", { class: "IncodeDropdownComposedSibling", children: T })
+              ]
+            }
+          ),
+          r && /* @__PURE__ */ o(
+            "div",
+            {
+              ref: q,
+              class: "IncodeDropdownComposedList",
+              "data-error": l ? "true" : void 0,
+              children: [
+                h && /* @__PURE__ */ o("div", { class: "IncodeDropdownComposedSearchWrapper", children: /* @__PURE__ */ o("div", { class: "IncodeDropdownComposedSearchInner", children: [
+                  /* @__PURE__ */ o(
+                    "input",
+                    {
+                      ref: R,
+                      type: "text",
+                      class: "IncodeDropdownComposedSearchInput",
+                      value: w,
+                      onInput: (e) => {
+                        z(e.target.value), t(0);
+                      },
+                      onKeyDown: ce,
+                      placeholder: H,
+                      role: "combobox",
+                      "aria-autocomplete": "list",
+                      "aria-expanded": "true",
+                      "aria-controls": F,
+                      "aria-activedescendant": a >= 0 ? `${c}-option-${a}` : void 0,
+                      "aria-label": H,
+                      autocomplete: "off"
+                    }
+                  ),
+                  /* @__PURE__ */ o(
+                    "span",
+                    {
+                      class: "IncodeDropdownComposedSearchIcon",
+                      "aria-hidden": "true",
+                      children: /* @__PURE__ */ o(ue, { size: 20 })
+                    }
+                  )
+                ] }) }),
+                /* @__PURE__ */ o(
+                  "div",
+                  {
+                    id: F,
+                    role: "listbox",
+                    "aria-labelledby": u ? E : void 0,
+                    "aria-label": u ? void 0 : B ?? W,
+                    class: "IncodeDropdownComposedOptionsScroll",
+                    children: s.length === 0 ? /* @__PURE__ */ o("div", { class: "IncodeDropdownComposedNoResults", children: K }) : s.map((e, i) => /* @__PURE__ */ o(
+                      "div",
+                      {
+                        id: `${c}-option-${i}`,
+                        role: "option",
+                        "aria-selected": b === e.value ? "true" : "false",
+                        class: "IncodeDropdownComposedOption",
+                        "data-highlighted": a === i,
+                        ref: (n) => {
+                          x.current[i] = n;
+                        },
+                        onClick: () => D(e.value),
+                        onMouseDown: (n) => n.preventDefault(),
+                        onMouseEnter: () => t(i),
+                        children: e.label
+                      },
+                      e.value
+                    ))
+                  }
+                )
+              ]
+            }
+          )
+        ] }),
+        h && /* @__PURE__ */ o(
+          "div",
+          {
+            class: "IncodeDropdownComposedLiveRegion",
+            role: "status",
+            "aria-live": "polite",
+            "aria-atomic": "true",
+            children: r && w ? s.length === 0 ? K : `${s.length} result${s.length !== 1 ? "s" : ""} available` : ""
+          }
+        ),
+        !S && l && /* @__PURE__ */ o(
+          "div",
+          {
+            class: "IncodeDropdownComposedErrorWrapper",
+            "data-testid": `${c}-error-wrapper`,
+            children: [
+              Z && /* @__PURE__ */ o("div", { class: "IncodeDropdownComposedIconWrapper", children: /* @__PURE__ */ o(le, { size: 17 }) }),
+              /* @__PURE__ */ o("p", { id: Q, class: "IncodeDropdownComposedError", children: l })
+            ]
+          }
+        ),
+        !S && y && !l && /* @__PURE__ */ o(
+          "div",
+          {
+            class: "IncodeDropdownComposedHelperWrapper",
+            "data-testid": `${c}-helper-wrapper`,
+            children: [
+              _ && /* @__PURE__ */ o("div", { class: "IncodeDropdownComposedIconWrapper", children: /* @__PURE__ */ o(pe, { size: 17 }) }),
+              /* @__PURE__ */ o("p", { id: M, class: "IncodeDropdownComposedHelper", children: y })
+            ]
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  De as D,
+  ue as S
+};

package/dist/ekyb/styles.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */
 @layer properties {
   @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
     *, :before, :after, ::backdrop {