@ogcio/design-system-react 1.13.0 → 1.14.0

package/dist/popover/types.d.ts

@@ -7,4 +7,5 @@ export type PopoverProps = {
     onOpenChange: (open: boolean) => void;
     options?: PopperOptions;
     extraRefs?: React.RefObject<any>[];
+    maxHeight?: number;
 };

package/dist/popover/utilities.d.ts

@@ -0,0 +1,2 @@
+import { Modifier } from '@popperjs/core/index.js';
+export declare const createDynamicHeightModifier: (maxHeight?: number) => Modifier<"dynamicHeight", any>;

package/dist/popover/utilities.js

@@ -0,0 +1,16 @@
+const r = (o) => ({
+  name: "dynamicHeight",
+  enabled: !0,
+  phase: "main",
+  fn({ state: e }) {
+    const t = e.elements.popper.getBoundingClientRect(), i = e.placement, n = 32, p = i.startsWith("top") ? t.bottom - n : window.innerHeight - t.top - n, s = typeof o == "number" && p > o ? o : p;
+    e.styles.popper = {
+      ...e.styles.popper,
+      overflowY: "auto",
+      maxHeight: `${s}px`
+    };
+  }
+});
+export {
+  r as createDynamicHeightModifier
+};

package/dist/primitives/button.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+export type ButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement>;
+export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/primitives/button.js

@@ -0,0 +1,9 @@
+import { jsx as r } from "react/jsx-runtime";
+import { forwardRef as m } from "react";
+const f = m(
+  (o, t) => /* @__PURE__ */ r("button", { ref: t, ...o })
+);
+f.displayName = "Button";
+export {
+  f as Button
+};

package/dist/select/select-menu.d.ts

@@ -1,6 +1,6 @@
 import { SelectMenuOptionProps, SelectMenuProps } from './types.js';
-export declare const SelectMenu: ({ children, className, onChange, enableSearch, isLoading, showNoData, }: SelectMenuProps) => import("react/jsx-runtime").JSX.Element;
-export declare const SelectMenuOption: ({ children, value, selected, onChange, disabled, dataTestid, className, hidden, enableSearch, isHighlighted, ...props }: SelectMenuOptionProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const SelectMenu: import('react').ForwardRefExoticComponent<SelectMenuProps & import('react').RefAttributes<HTMLDivElement>>;
+export declare const SelectMenuOption: ({ children, value, selected, onChange, disabled, dataTestid, className, hidden, enableSearch, isHighlighted, index, ...props }: SelectMenuOptionProps) => import("react/jsx-runtime").JSX.Element | null;
 export declare const SelectMenuGroupItem: ({ children, label, ...props }: {
     children?: any;
     label: string;

package/dist/select/select-menu.js

@@ -1,148 +1,145 @@
 "use client";
-import { jsxs as N, jsx as n } from "react/jsx-runtime";
-import { useState as h, useEffect as A, Children as K, isValidElement as P, cloneElement as v } from "react";
-import { cn as V } from "../cn.js";
-import { translate as q } from "../i18n/utility.js";
-import { Icon as H } from "../icon/icon.js";
-import { InputText as J } from "../input-text/input-text.js";
-import { Label as Q } from "../label/label.js";
-import { Spinner as R } from "../spinner/spinner.js";
-const re = ({
-  children: o,
-  className: i,
-  onChange: s,
-  enableSearch: r,
-  isLoading: c,
-  showNoData: m
-}) => {
-  const [l, g] = h(""), [S, f] = h(!1), [y, O] = h([]);
-  A(() => {
-    f(!1), m && setTimeout(() => f(!0), 0);
-  }, [m]), A(() => {
-    const B = K.toArray(o).filter(
-      (a) => P(a)
-    ).map((a) => {
-      var D, L, M, T, I, k;
-      const F = (D = a == null ? void 0 : a.type) == null ? void 0 : D.componentType, x = l.toLowerCase();
-      switch (F) {
-        case "SelectMenuOption": {
-          const e = a;
-          if (typeof e.props.value == "string") {
-            const E = ((T = (M = (L = e == null ? void 0 : e.props) == null ? void 0 : L.children) == null ? void 0 : M.toString()) == null ? void 0 : T.toLowerCase()) || "", G = (k = (I = e == null ? void 0 : e.props) == null ? void 0 : I.value) == null ? void 0 : k.toLowerCase();
-            if (E.includes(x) || G.includes(x))
-              return v(e, {
-                onChange: s,
-                enableSearch: r
-              });
+import { jsxs as b, jsx as n } from "react/jsx-runtime";
+import { forwardRef as H, useState as v, useEffect as K, Children as P, isValidElement as V, cloneElement as N } from "react";
+import { cn as F } from "../cn.js";
+import { translate as B } from "../i18n/utility.js";
+import { Icon as J } from "../icon/icon.js";
+import { InputText as Q } from "../input-text/input-text.js";
+import { Label as U } from "../label/label.js";
+import { Spinner as W } from "../spinner/spinner.js";
+const se = H(
+  ({ children: o, className: i, onChange: s, enableSearch: r, isLoading: c, showNoData: m }, g) => {
+    const [l, y] = v(""), [O, f] = v(!1), [S, w] = v([]);
+    K(() => {
+      f(!1), m && setTimeout(() => f(!0), 0);
+    }, [m]), K(() => {
+      const R = P.toArray(o).filter(
+        (a) => V(a)
+      ).map((a) => {
+        var L, M, T, I, k, E;
+        const q = (L = a == null ? void 0 : a.type) == null ? void 0 : L.componentType, D = l.toLowerCase();
+        switch (q) {
+          case "SelectMenuOption": {
+            const e = a;
+            if (typeof e.props.value == "string") {
+              const G = ((I = (T = (M = e == null ? void 0 : e.props) == null ? void 0 : M.children) == null ? void 0 : T.toString()) == null ? void 0 : I.toLowerCase()) || "", j = (E = (k = e == null ? void 0 : e.props) == null ? void 0 : k.value) == null ? void 0 : E.toLowerCase();
+              if (G.includes(D) || j.includes(D))
+                return N(e, {
+                  onChange: s,
+                  enableSearch: r
+                });
+            }
+            break;
           }
-          break;
+          case "SelectMenuGroupItem": {
+            const e = a, C = P.toArray(
+              e.props.children
+            ).filter((t) => V(t)).map((t) => {
+              var p;
+              return ((p = t == null ? void 0 : t.type) == null ? void 0 : p.componentType) === "SelectMenuOption" ? N(t, { onChange: s }) : null;
+            }).filter(
+              (t) => t !== null
+            ).filter((t) => {
+              var $, z, A;
+              const p = ((z = ($ = t.props.children) == null ? void 0 : $.toString()) == null ? void 0 : z.toLowerCase()) || "", d = ((A = t.props.value) == null ? void 0 : A.toLowerCase()) || "";
+              return (p == null ? void 0 : p.includes(l.toLowerCase())) || (d == null ? void 0 : d.includes(l.toLowerCase()));
+            });
+            return C.length > 0 || l === "" ? N(e, {
+              children: C
+            }) : null;
+          }
+          default:
+            return null;
         }
-        case "SelectMenuGroupItem": {
-          const e = a, j = K.toArray(e.props.children).filter(
-            (t) => P(t)
-          ).map((t) => {
-            var p;
-            return ((p = t == null ? void 0 : t.type) == null ? void 0 : p.componentType) === "SelectMenuOption" ? v(t, { onChange: s }) : null;
-          }).filter(
-            (t) => t !== null
-          ).filter((t) => {
-            var C, $, z;
-            const p = (($ = (C = t.props.children) == null ? void 0 : C.toString()) == null ? void 0 : $.toLowerCase()) || "", d = ((z = t.props.value) == null ? void 0 : z.toLowerCase()) || "";
-            return (p == null ? void 0 : p.includes(l.toLowerCase())) || (d == null ? void 0 : d.includes(l.toLowerCase()));
-          });
-          return j.length > 0 || l === "" ? v(e, {
-            children: j
-          }) : null;
+      }).filter(Boolean);
+      w(R);
+    }, [o, l, s]);
+    const h = (x) => {
+      y(x.target.value);
+    }, u = () => c ? /* @__PURE__ */ n("div", { className: "gi-select-menu-loading", children: /* @__PURE__ */ n(W, { size: "md" }) }) : O ? /* @__PURE__ */ n("div", { className: "gi-select-menu-option-not-found", children: B("autocomplete.noData") }) : /* @__PURE__ */ n("ul", { children: S });
+    return /* @__PURE__ */ b("div", { ref: g, className: F("gi-select-menu-container", i), children: [
+      r && /* @__PURE__ */ n("div", { className: "gi-select-menu-input-container", children: /* @__PURE__ */ n(
+        Q,
+        {
+          tabIndex: 0,
+          placeholder: B("input.search"),
+          iconEnd: "search",
+          onChange: h,
+          value: l
         }
-        default:
-          return null;
-      }
-    }).filter(Boolean);
-    O(B);
-  }, [o, l, s]);
-  const w = (b) => {
-    g(b.target.value);
-  }, u = () => c ? /* @__PURE__ */ n("div", { className: "gi-select-menu-loading", children: /* @__PURE__ */ n(R, { size: "md" }) }) : S ? /* @__PURE__ */ n("div", { className: "gi-select-menu-option-not-found", children: q("autocomplete.noData") }) : /* @__PURE__ */ n("ul", { children: y });
-  return /* @__PURE__ */ N("div", { className: V("gi-select-menu-container", i), children: [
-    r && /* @__PURE__ */ n("div", { className: "gi-select-menu-input-container", children: /* @__PURE__ */ n(
-      J,
-      {
-        tabIndex: 0,
-        placeholder: "Search",
-        iconEnd: "search",
-        onChange: w,
-        value: l
-      }
-    ) }),
-    /* @__PURE__ */ n("div", { className: "gi-select-menu-option-container", children: u() })
-  ] });
-}, U = ({
+      ) }),
+      /* @__PURE__ */ n("div", { className: "gi-select-menu-option-container", children: u() })
+    ] });
+  }
+), X = ({
   children: o,
   value: i,
   selected: s,
   onChange: r,
   disabled: c,
   dataTestid: m,
-  className: l,
-  hidden: g,
-  enableSearch: S,
-  isHighlighted: f,
-  ...y
+  className: g,
+  hidden: l,
+  enableSearch: y,
+  isHighlighted: O,
+  index: f,
+  ...S
 }) => {
-  const O = (u) => {
+  const w = (u) => {
     (u.key === "Enter" || u.key === " ") && (u.preventDefault(), r == null || r(i));
-  }, w = () => {
+  }, h = () => {
     c || r == null || r(i);
   };
-  return g ? null : /* @__PURE__ */ N(
+  return l ? null : /* @__PURE__ */ b(
     "li",
     {
       role: "option",
       tabIndex: c ? -1 : 0,
+      "data-index": f,
       "aria-selected": s,
       "aria-label": o == null ? void 0 : o.toString(),
       "aria-disabled": c,
-      onKeyDown: O,
-      onClick: w,
-      className: V(
+      onKeyDown: w,
+      onClick: h,
+      className: F(
         "gi-select-option-item",
         {
           "gi-select-option-item-disabled": c,
-          "gi-select-option-item-highlighted": f
+          "gi-select-option-item-highlighted": O
         },
-        l
+        g
       ),
-      "data-search-enabled": S,
+      "data-search-enabled": y,
       "data-testid": m || `option-${i}`,
-      ...y,
+      ...S,
       children: [
         /* @__PURE__ */ n("span", { className: "gi-text-sm", children: o }),
-        s && /* @__PURE__ */ n(H, { icon: "check" })
+        s && /* @__PURE__ */ n(J, { icon: "check" })
       ]
     },
     `${o}-${i}`
   );
 };
-Object.defineProperty(U, "componentType", {
+Object.defineProperty(X, "componentType", {
   value: "SelectMenuOption",
   writable: !1,
   enumerable: !1
 });
-const W = ({
+const Y = ({
   children: o,
   label: i,
   ...s
-}) => /* @__PURE__ */ N("div", { ...s, role: "group", className: "gi-px-3", children: [
-  /* @__PURE__ */ n(Q, { text: i, size: "sm", className: "gi-font-bold gi-pb-1" }),
+}) => /* @__PURE__ */ b("div", { ...s, role: "group", className: "gi-px-3", children: [
+  /* @__PURE__ */ n(U, { text: i, size: "sm", className: "gi-font-bold gi-pb-1" }),
   o
 ] });
-Object.defineProperty(W, "componentType", {
+Object.defineProperty(Y, "componentType", {
   value: "SelectMenuGroupItem",
   writable: !1,
   enumerable: !1
 });
 export {
-  re as SelectMenu,
-  W as SelectMenuGroupItem,
-  U as SelectMenuOption
+  se as SelectMenu,
+  Y as SelectMenuGroupItem,
+  X as SelectMenuOption
 };

package/dist/select/select-next.d.ts

@@ -1,6 +1,17 @@
 import { FC } from 'react';
-import { SelectNextGroupProps, SelectNextProps, SelectNextOptionProps, SelectNextTableCellProps } from './types.js';
-export declare const SelectNext: ({ children, value: controlledValue, defaultValue, onChange: onSelectNextChange, onMenuClose, enableSearch, disabled, ...props }: SelectNextProps) => import("react/jsx-runtime").JSX.Element;
+import { SelectNextGroupProps, SelectNextOptionProps, SelectNextTableCellProps } from './types.js';
+export declare const SelectNext: import('react').ForwardRefExoticComponent<{
+    name?: string;
+    onChange?: (event: import('react').ChangeEvent<HTMLSelectElement>) => void;
+    onMenuClose?: () => void;
+    defaultValue?: string;
+    value?: string;
+    enableSearch?: boolean;
+    disabled?: boolean;
+    placeholder?: string;
+} & Omit<import('react').HTMLAttributes<HTMLDivElement>, "onChange"> & {
+    children?: import('react').ReactNode | undefined;
+} & import('react').RefAttributes<HTMLInputElement>>;
 export declare const SelectItemNext: FC<SelectNextOptionProps>;
 export declare const SelectGroupItemNext: FC<SelectNextGroupProps>;
 export declare const SelectNextTableCell: (props: SelectNextTableCellProps) => import("react/jsx-runtime").JSX.Element;