@pibit.ai/cure-design-system 0.3.20 → 0.3.23

package/dist/primitives/select/SearchInput.js

@@ -1,76 +1,77 @@
-import { jsx as e, jsxs as u, Fragment as y } from "react/jsx-runtime";
-import { useCallback as h, useMemo as N } from "react";
-import { SearchMd as k, XClose as v } from "@untitledui/icons";
-import { ComboBox as w, Group as C, Input as I } from "react-aria-components";
-import { cx as n } from "../../utils/cn.js";
-import { sizes as b } from "./select.js";
-import { ButtonUtility as S } from "../button/button-utility.js";
-const z = {
+import { jsx as n, jsxs as b, Fragment as N } from "react/jsx-runtime";
+import { useRef as C, useCallback as f, useEffect as I, useMemo as E } from "react";
+import { SearchMd as L, XClose as z } from "@untitledui/icons";
+import { ComboBox as P, Group as R, Input as _ } from "react-aria-components";
+import { cx as u } from "../../utils/cn.js";
+import { sizes as x } from "./select.js";
+import { ButtonUtility as j } from "../button/button-utility.js";
+const q = {
   sm: "h-8",
   md: "h-9",
   lg: "h-11"
-}, _ = ({
+}, B = ({
   size: i,
-  shortcut: c,
-  placeholder: s,
-  shortcutClassName: m,
-  onKeyDown: l,
-  onClear: t,
+  shortcut: s,
+  placeholder: p,
+  shortcutClassName: d,
+  onKeyDown: m,
+  onClear: o,
   hasValue: r,
-  className: o
-}) => /* @__PURE__ */ e(
-  C,
+  className: l
+}) => /* @__PURE__ */ n(
+  R,
   {
-    className: ({ isFocusWithin: a, isDisabled: p }) => n(
+    className: ({ isFocusWithin: a, isDisabled: c }) => u(
       "relative flex w-full items-center gap-2 rounded-md bg-primary ring-1 ring-secondary outline-hidden transition-shadow duration-100 ease-linear ring-inset",
-      p && "cursor-not-allowed bg-disabled_subtle",
+      c && "cursor-not-allowed bg-disabled_subtle",
       a && "ring-1 ring-brand",
-      z[i],
-      b[i].root,
-      o
+      q[i],
+      x[i].root,
+      l
     ),
-    children: ({ isDisabled: a }) => /* @__PURE__ */ u(y, { children: [
-      /* @__PURE__ */ e(
-        k,
+    children: ({ isDisabled: a }) => /* @__PURE__ */ b(N, { children: [
+      /* @__PURE__ */ n(
+        L,
         {
           color: "var(--color-utility-gray-300)",
           className: "pointer-events-none size-4 flex-shrink-0"
         }
       ),
-      /* @__PURE__ */ e("div", { className: "relative flex w-full items-center gap-2", children: /* @__PURE__ */ e(
-        I,
+      /* @__PURE__ */ n("div", { className: "relative flex w-full items-center gap-2", children: /* @__PURE__ */ n(
+        _,
         {
-          placeholder: s,
-          onKeyDown: l,
-          className: n(
+          placeholder: p,
+          onKeyDown: m,
+          className: u(
             "z-10 w-full appearance-none bg-transparent text-sm text-primary caret-alpha-black/90 placeholder:text-placeholder_subtle focus:outline-hidden disabled:cursor-not-allowed disabled:text-disabled disabled:placeholder:text-disabled",
-            r && "pr-6"
+            r && "pr-6",
+            s && !r && "pr-12"
           )
         }
       ) }),
-      /* @__PURE__ */ u("div", { className: "flex-shrink-0", children: [
-        r && !a && /* @__PURE__ */ e(
-          S,
+      /* @__PURE__ */ b("div", { className: "flex-shrink-0", children: [
+        r && !a && /* @__PURE__ */ n(
+          j,
           {
-            icon: /* @__PURE__ */ e(v, { size: 14 }),
+            icon: /* @__PURE__ */ n(z, { size: 14 }),
             color: "tertiary",
-            onClick: t,
+            onClick: o,
             "aria-label": "Clear search"
           }
         ),
-        c && !r && /* @__PURE__ */ e(
+        s && !r && /* @__PURE__ */ n(
           "div",
           {
-            className: n(
+            className: u(
               "absolute inset-y-0.5 right-0.5 z-10 flex items-center rounded-r-[inherit] bg-linear-to-r from-transparent to-bg-primary to-40% pl-8",
               a && "to-bg-disabled_subtle",
-              b[i].shortcut,
-              m
+              x[i].shortcut,
+              d
             ),
-            children: /* @__PURE__ */ e(
+            children: /* @__PURE__ */ n(
               "span",
               {
-                className: n(
+                className: u(
                   "pointer-events-none rounded px-1 py-px text-xs font-medium text-quaternary ring-1 ring-secondary select-none ring-inset",
                   a && "bg-transparent text-disabled"
                 ),
@@ -84,53 +85,72 @@ const z = {
     ] })
   }
 );
-function G({
+function H({
   size: i = "sm",
-  shortcut: c = !1,
-  placeholder: s,
+  shortcut: s = !1,
+  registerShortcut: p,
+  placeholder: d,
   shortcutClassName: m,
-  value: l,
-  onChange: t,
-  onKeyDown: r,
-  className: o,
-  "aria-label": a,
-  ...p
+  value: o,
+  onChange: r,
+  onKeyDown: l,
+  className: a,
+  isDisabled: c = !1,
+  "aria-label": w,
+  ...k
 }) {
-  const f = h(
-    (d) => {
-      d.key === "Enter" && (d.preventDefault(), d.stopPropagation()), r == null || r(d);
+  const h = C(null), y = p ?? s, g = f(() => {
+    var e, t;
+    (t = (e = h.current) == null ? void 0 : e.querySelector("input")) == null || t.focus();
+  }, []);
+  I(() => {
+    if (!y || c) return;
+    const e = (t) => {
+      (t.metaKey || t.ctrlKey) && !t.shiftKey && !t.altKey && t.key.toLowerCase() === "k" && (t.preventDefault(), t.stopPropagation(), g());
+    };
+    return window.addEventListener("keydown", e, { capture: !0 }), () => window.removeEventListener("keydown", e, { capture: !0 });
+  }, [y, c, g]);
+  const v = f(
+    (e) => {
+      if ((e.metaKey || e.ctrlKey) && !e.shiftKey && !e.altKey && e.key.toLowerCase() === "k") {
+        e.preventDefault(), e.stopPropagation();
+        return;
+      }
+      e.key === "Enter" && (e.preventDefault(), e.stopPropagation()), l == null || l(e);
     },
-    [r]
-  ), x = h(() => {
-    t == null || t("");
-  }, [t]), g = N(() => !!l && l.length > 0, [l]);
-  return /* @__PURE__ */ e(
-    w,
+    [l]
+  ), K = f(() => {
+    r == null || r("");
+  }, [r]), S = E(() => !!o && o.length > 0, [o]);
+  return /* @__PURE__ */ n(
+    P,
     {
-      ...p,
-      inputValue: l,
-      onInputChange: t,
+      ...k,
+      ref: h,
+      inputValue: o,
+      onInputChange: r,
       menuTrigger: "manual",
       items: [],
       allowsCustomValue: !0,
-      "aria-label": a || s || "Search",
-      className: n("w-xs", o),
-      children: () => /* @__PURE__ */ e(
-        _,
+      isDisabled: c,
+      "aria-label": w || d || "Search",
+      className: u("w-xs", a),
+      children: () => /* @__PURE__ */ n(
+        B,
         {
           size: i,
-          shortcut: c,
-          placeholder: s,
+          shortcut: s,
+          placeholder: d,
           shortcutClassName: m,
-          onKeyDown: f,
-          onClear: x,
-          hasValue: g,
-          className: o
+          onKeyDown: v,
+          onClear: K,
+          hasValue: S,
+          className: a
         }
       )
     }
   );
 }
 export {
-  G as default
+  H as default
 };

package/dist/primitives/select/searchable-select.d.ts

@@ -24,12 +24,14 @@ export interface SearchableSelectProps extends Omit<AriaSelectProps<SelectItemTy
     popoverClassName?: string;
     /** Custom text styles */
     textStyles?: string;
-    /** Callback when selection changes */
-    onSelectionChange?: (key: string) => void;
+    /** Callback when selection changes; `null` when cleared */
+    onSelectionChange?: (key: string | null) => void;
+    /** When true, clicking the already-selected option in the dropdown clears the selection. Default false. */
+    isDeselectable?: boolean;
     /** Placeholder for search input */
     searchPlaceholder?: string;
     /** Display text to show when selected item is not in items array */
     selectedDisplayValue?: string;
 }
-export declare const SearchableSelect: ({ placeholder, placeholderIcon, size, items, label, hint, tooltip, className, textStyles, popoverClassName, onSearchChange, onSelectionChange, isLoading, searchPlaceholder, selectedDisplayValue, ...rest }: SearchableSelectProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SearchableSelect: ({ placeholder, placeholderIcon, size, items, label, hint, tooltip, className, textStyles, popoverClassName, onSearchChange, onSelectionChange, isLoading, isDeselectable, searchPlaceholder, selectedDisplayValue, ...rest }: SearchableSelectProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=searchable-select.d.ts.map

package/dist/primitives/select/searchable-select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"searchable-select.d.ts","sourceRoot":"","sources":["../../../src/primitives/select/searchable-select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,SAAS,EAAO,MAAM,OAAO,CAAC;AAGhD,OAAO,KAAK,EAAE,WAAW,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAY5E,OAAO,EAAmC,KAAK,cAAc,EAAE,MAAM,UAAU,CAAC;AAsBhF,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CACjD,eAAe,CAAC,cAAc,CAAC,EAC/B,UAAU,GAAG,OAAO,GAAG,mBAAmB,CAC3C;IACC,iEAAiE;IACjE,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,oEAAoE;IACpE,cAAc,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,wCAAwC;IACxC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,iCAAiC;IACjC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,6BAA6B;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4BAA4B;IAC5B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,mBAAmB;IACnB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,gDAAgD;IAChD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,wCAAwC;IACxC,eAAe,CAAC,EAAE,EAAE,GAAG,SAAS,CAAC;IACjC,gCAAgC;IAChC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,yBAAyB;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,sCAAsC;IACtC,iBAAiB,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,mCAAmC;IACnC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,oEAAoE;IACpE,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B;AAkHD,eAAO,MAAM,gBAAgB,GAAI,8MAiB9B,qBAAqB,4CAuIvB,CAAC"}
+{"version":3,"file":"searchable-select.d.ts","sourceRoot":"","sources":["../../../src/primitives/select/searchable-select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,SAAS,EAAO,MAAM,OAAO,CAAC;AAGhD,OAAO,KAAK,EAAE,WAAW,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAY5E,OAAO,EAAmC,KAAK,cAAc,EAAE,MAAM,UAAU,CAAC;AAsBhF,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CACjD,eAAe,CAAC,cAAc,CAAC,EAC/B,UAAU,GAAG,OAAO,GAAG,mBAAmB,CAC3C;IACC,iEAAiE;IACjE,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,oEAAoE;IACpE,cAAc,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,wCAAwC;IACxC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,iCAAiC;IACjC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,6BAA6B;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4BAA4B;IAC5B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,mBAAmB;IACnB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,gDAAgD;IAChD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,wCAAwC;IACxC,eAAe,CAAC,EAAE,EAAE,GAAG,SAAS,CAAC;IACjC,gCAAgC;IAChC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,yBAAyB;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,2DAA2D;IAC3D,iBAAiB,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACjD,2GAA2G;IAC3G,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,mCAAmC;IACnC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,oEAAoE;IACpE,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B;AAkHD,eAAO,MAAM,gBAAgB,GAAI,8NAkB9B,qBAAqB,4CAkKvB,CAAC"}