@ogcio/design-system-react 1.15.2 → 1.15.3

package/dist/autocomplete/autocomplete.js

@@ -1,22 +1,22 @@
 "use client";
-import { jsxs as z, jsx as O } from "react/jsx-runtime";
-import { forwardRef as J, useRef as G, useImperativeHandle as Q, useEffect as W, createElement as Y, Children as Z, isValidElement as ee } from "react";
+import { jsxs as J, jsx as O } from "react/jsx-runtime";
+import { forwardRef as Q, useRef as G, useImperativeHandle as W, useEffect as Y, createElement as Z, Children as ee, isValidElement as te } from "react";
 import { cn as P } from "../cn.js";
 import { translate as D } from "../i18n/utility.js";
-import { InputText as te } from "../input-text/input-text.js";
-import { Popover as oe } from "../popover/popover.js";
-import { SelectMenu as ne, SelectMenuOption as L, SelectMenuGroupItem as le } from "../select/select-menu.js";
-import { AUTOCOMPLETE_ACTIONS as re } from "./types.js";
-import { useAutocompleteController as ae } from "./use-autocomplete-controller.js";
+import { InputText as oe } from "../input-text/input-text.js";
+import { Popover as ne } from "../popover/popover.js";
+import { SelectMenu as le, SelectMenuOption as L, SelectMenuGroupItem as re } from "../select/select-menu.js";
+import { AUTOCOMPLETE_ACTIONS as ae } from "./types.js";
+import { useAutocompleteController as pe } from "./use-autocomplete-controller.js";
 const {
-  ON_RESET: pe,
-  ON_SELECT_ITEM: ie,
+  ON_RESET: ie,
+  ON_SELECT_ITEM: se,
   SET_INPUT_VALUE: R,
   SET_IS_OPEN: d,
   TOGGLE_CLEAR_BUTTON: v,
   SET_HIGHLIGHTED_INDEX: B,
-  SET_VALUE: se
-} = re, ce = (n) => n ? "keyboard_arrow_up" : "keyboard_arrow_down", C = (n, l) => (p) => {
+  SET_VALUE: ce
+} = ae, ue = (n) => n ? "keyboard_arrow_up" : "keyboard_arrow_down", C = (n, l) => (p) => {
   n && n({
     target: {
       name: l,
@@ -38,7 +38,7 @@ const {
     bubbles: !0,
     isTrusted: !0
   });
-}, Se = J(
+}, ve = Q(
   (n, l) => {
     var N;
     const p = G(null), {
@@ -51,49 +51,50 @@ const {
       onChange: b,
       onBlur: A,
       name: c,
-      value: E
+      value: E,
+      id: U
     } = n, _ = G(!1), {
       state: t,
       dispatch: o,
       inputRef: m,
       getOptionLabelByValue: x,
       listRef: w,
-      debouncedFilter: U
-    } = ae({
+      debouncedFilter: V
+    } = pe({
       ...n,
       onChange: C(b, c)
     });
-    Q(l, () => m.current), W(() => {
-      E !== void 0 && (o({ type: se, payload: E }), o({
+    W(l, () => m.current), Y(() => {
+      E !== void 0 && (o({ type: ce, payload: E }), o({
         type: R,
         payload: x(f, E)
       }), o({ type: v }));
     }, [E]);
-    const V = (e) => {
+    const H = (e) => {
       o({ type: d, payload: e }), e || o({ type: v, payload: !1 });
-    }, H = () => {
-      o({ type: pe }), o({ type: d, payload: !1 }), C(b, c)("");
-    }, j = (e) => {
-      o({ type: R, payload: e }), s && C(b, c)(e), e && o({ type: d, payload: !0 }), U(e);
+    }, j = () => {
+      o({ type: ie }), o({ type: d, payload: !1 }), C(b, c)("");
     }, $ = (e) => {
+      o({ type: R, payload: e }), s && C(b, c)(e), e && o({ type: d, payload: !0 }), V(e);
+    }, K = (e) => {
       const {
         target: { value: a }
       } = e;
-      e.__origin === "clear_button" ? H() : j(a), o({ type: v }), setTimeout(() => {
+      e.__origin === "clear_button" ? j() : $(a), o({ type: v }), setTimeout(() => {
         var u;
         return (u = m.current) == null ? void 0 : u.focus();
       });
-    }, K = () => {
+    }, F = () => {
       var e;
       o({ type: d, payload: !t.isOpen }), (e = m.current) == null || e.focus();
-    }, F = () => {
+    }, X = () => {
       t.isOpen || o({
         type: d,
         payload: !0
       });
     }, S = (e) => {
       o({
-        type: ie,
+        type: se,
         payload: {
           inputValue: x(f, e),
           value: e
@@ -102,7 +103,7 @@ const {
         var a;
         M(A, c)(e), (a = m.current) == null || a.blur();
       }, 0), y == null || y(e);
-    }, X = (e) => {
+    }, q = (e) => {
       var i, I;
       const { relatedTarget: a } = e;
       if (a && ((i = w.current) != null && i.contains(a) || (I = p.current) != null && I.contains(a)) || _.current) {
@@ -111,7 +112,7 @@ const {
       }
       const u = t.value ?? t.inputValue ?? "";
       M(A, c)(u);
-    }, q = (e) => {
+    }, z = (e) => {
       const a = t.autocompleteOptions.length, u = (i, I) => {
         let T = i;
         for (let k = 0; k < a; k++)
@@ -134,21 +135,22 @@ const {
         i && i.props.value && !i.props.disabled && S(i.props.value);
       }
     };
-    return /* @__PURE__ */ z(
+    return /* @__PURE__ */ J(
       "div",
       {
         "aria-disabled": r,
         className: P("gi-autocomplete gi-not-prose", n.className),
         children: [
           /* @__PURE__ */ O(
-            te,
+            oe,
             {
+              id: U,
               name: c,
-              onKeyDown: q,
-              onIconEndClick: K,
-              onChange: $,
-              onClick: F,
-              onBlur: X,
+              onKeyDown: z,
+              onIconEndClick: F,
+              onChange: K,
+              onClick: X,
+              onBlur: q,
               clearButtonEnabled: t.isClearButtonEnabled,
               inputActionPosition: "beforeSuffix",
               "aria-label": D("autocomplete.placeholder", {
@@ -156,12 +158,12 @@ const {
               }),
               "aria-disabled": r,
               disabled: r,
-              placeholder: h || D("autocomplete.placeholder", { defaultValue: "Type to Search" }),
+              placeholder: h ?? D("autocomplete.placeholder", { defaultValue: "Type to Search" }),
               iconEndClassName: P({
                 "gi-cursor-pointer": !r && !s,
                 "gi-cursor-not-allowed gi-pointer-events-none": r && !s
               }),
-              iconEnd: s ? void 0 : ce(t.isOpen),
+              iconEnd: s ? void 0 : ue(t.isOpen),
               ref: m,
               iconEndRef: p,
               value: t.inputValue,
@@ -169,9 +171,9 @@ const {
             }
           ),
           /* @__PURE__ */ O(
-            oe,
+            ne,
             {
-              onOpenChange: V,
+              onOpenChange: H,
               triggerRef: m,
               extraRefs: [p],
               open: t.isOpen,
@@ -188,13 +190,13 @@ const {
                 ]
               },
               children: /* @__PURE__ */ O(
-                ne,
+                le,
                 {
                   onChange: S,
                   isLoading: g,
                   showNoData: !((N = t.autocompleteOptions) != null && N.length),
                   ref: w,
-                  children: ue(
+                  children: de(
                     t.autocompleteOptions,
                     t,
                     S
@@ -207,9 +209,9 @@ const {
       }
     );
   }
-), ue = (n, l, p) => n.map((r, f) => {
+), de = (n, l, p) => n.map((r, f) => {
   if (l.optionType === "AutocompleteItem")
-    return /* @__PURE__ */ Y(
+    return /* @__PURE__ */ Z(
       L,
       {
         ...r.props,
@@ -220,7 +222,7 @@ const {
       }
     );
   if (l.optionType === "AutocompleteGroupItem") {
-    const h = r, y = Z.toArray(h.props.children).filter((g) => ee(g)).map((g) => {
+    const h = r, y = ee.toArray(h.props.children).filter((g) => te(g)).map((g) => {
       const s = g.props;
       return /* @__PURE__ */ O(
         L,
@@ -234,7 +236,7 @@ const {
       );
     });
     return /* @__PURE__ */ O(
-      le,
+      re,
       {
         label: h.props.label,
         children: y
@@ -243,21 +245,21 @@ const {
     );
   }
   return null;
-}), de = () => null;
-Object.defineProperty(de, "componentType", {
+}), fe = () => null;
+Object.defineProperty(fe, "componentType", {
   value: "AutocompleteItem",
   writable: !1,
   enumerable: !1
 });
-const fe = () => null;
-Object.defineProperty(fe, "componentType", {
+const me = () => null;
+Object.defineProperty(me, "componentType", {
   value: "AutocompleteGroupItem",
   writable: !1,
   enumerable: !1
 });
 export {
-  Se as Autocomplete,
-  fe as AutocompleteGroupItem,
-  de as AutocompleteItem,
-  ue as renderSelectMenuOptions
+  ve as Autocomplete,
+  me as AutocompleteGroupItem,
+  fe as AutocompleteItem,
+  de as renderSelectMenuOptions
 };