@c-rex/components 0.0.6 → 0.0.9

package/dist/autocomplete.cjs.js

@@ -0,0 +1,215 @@
+"use strict";
+function _array_like_to_array(arr, len) {
+    if (len == null || len > arr.length) len = arr.length;
+    for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
+    return arr2;
+}
+function _array_with_holes(arr) {
+    if (Array.isArray(arr)) return arr;
+}
+function _instanceof(left, right) {
+    if (right != null && typeof Symbol !== "undefined" && right[Symbol.hasInstance]) {
+        return !!right[Symbol.hasInstance](left);
+    } else {
+        return left instanceof right;
+    }
+}
+function _iterable_to_array_limit(arr, i) {
+    var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
+    if (_i == null) return;
+    var _arr = [];
+    var _n = true;
+    var _d = false;
+    var _s, _e;
+    try {
+        for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
+            _arr.push(_s.value);
+            if (i && _arr.length === i) break;
+        }
+    } catch (err) {
+        _d = true;
+        _e = err;
+    } finally{
+        try {
+            if (!_n && _i["return"] != null) _i["return"]();
+        } finally{
+            if (_d) throw _e;
+        }
+    }
+    return _arr;
+}
+function _non_iterable_rest() {
+    throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+function _sliced_to_array(arr, i) {
+    return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
+}
+function _type_of(obj) {
+    "@swc/helpers - typeof";
+    return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
+}
+function _unsupported_iterable_to_array(o, minLen) {
+    if (!o) return;
+    if (typeof o === "string") return _array_like_to_array(o, minLen);
+    var n = Object.prototype.toString.call(o).slice(8, -1);
+    if (n === "Object" && o.constructor) n = o.constructor.name;
+    if (n === "Map" || n === "Set") return Array.from(n);
+    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
+}
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = function(target, all) {
+    for(var name in all)__defProp(target, name, {
+        get: all[name],
+        enumerable: true
+    });
+};
+var __copyProps = function(to, from, except, desc) {
+    if (from && (typeof from === "undefined" ? "undefined" : _type_of(from)) === "object" || typeof from === "function") {
+        var _iteratorNormalCompletion = true, _didIteratorError = false, _iteratorError = undefined;
+        try {
+            var _loop = function() {
+                var key = _step.value;
+                if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+                    get: function() {
+                        return from[key];
+                    },
+                    enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+                });
+            };
+            for(var _iterator = __getOwnPropNames(from)[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true)_loop();
+        } catch (err) {
+            _didIteratorError = true;
+            _iteratorError = err;
+        } finally{
+            try {
+                if (!_iteratorNormalCompletion && _iterator.return != null) {
+                    _iterator.return();
+                }
+            } finally{
+                if (_didIteratorError) {
+                    throw _iteratorError;
+                }
+            }
+        }
+    }
+    return to;
+};
+var __toCommonJS = function(mod) {
+    return __copyProps(__defProp({}, "__esModule", {
+        value: true
+    }), mod);
+};
+// src/autocomplete.tsx
+var autocomplete_exports = {};
+__export(autocomplete_exports, {
+    AutoComplete: function() {
+        return AutoComplete;
+    }
+});
+module.exports = __toCommonJS(autocomplete_exports);
+var import_cmdk = require("cmdk");
+var import_lucide_react = require("lucide-react");
+var import_react = require("react");
+var import_input = require("@c-rex/ui/input");
+var import_command = require("@c-rex/ui/command");
+var import_popover = require("@c-rex/ui/popover");
+var import_jsx_runtime = require("react/jsx-runtime");
+var AutoComplete = function(param) {
+    var initialValue = param.initialValue, onSearch = param.onSearch, onSelect = param.onSelect;
+    var _ref = _sliced_to_array((0, import_react.useState)(initialValue), 2), query = _ref[0], setQuery = _ref[1];
+    var _ref1 = _sliced_to_array((0, import_react.useState)([]), 2), suggestions = _ref1[0], setSuggestions = _ref1[1];
+    var _ref2 = _sliced_to_array((0, import_react.useState)(false), 2), open = _ref2[0], setOpen = _ref2[1];
+    (0, import_react.useEffect)(function() {
+        var debounceFetch = setTimeout(function() {
+            if (query) {
+                onSearch(query).then(setSuggestions);
+            } else {
+                setSuggestions([]);
+            }
+        }, 300);
+        return function() {
+            return clearTimeout(debounceFetch);
+        };
+    }, [
+        onSearch,
+        query
+    ]);
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+        className: "flex items-center",
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_popover.Popover, {
+            open: open,
+            onOpenChange: setOpen,
+            children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_command.Command, {
+                shouldFilter: false,
+                children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_popover.PopoverAnchor, {
+                        asChild: true,
+                        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_cmdk.Command.Input, {
+                            asChild: true,
+                            value: query,
+                            onValueChange: setQuery,
+                            onKeyDown: function(e) {
+                                return setOpen(e.key !== "Escape");
+                            },
+                            onMouseDown: function() {
+                                return setOpen(false);
+                            },
+                            onFocus: function() {
+                                return setOpen(true);
+                            },
+                            children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_input.Input, {})
+                        })
+                    }),
+                    !open && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_command.CommandList, {
+                        "aria-hidden": "true",
+                        className: "hidden"
+                    }),
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_popover.PopoverContent, {
+                        asChild: true,
+                        onOpenAutoFocus: function(e) {
+                            return e.preventDefault();
+                        },
+                        onInteractOutside: function(e) {
+                            if (_instanceof(e.target, Element) && e.target.hasAttribute("cmdk-input")) {
+                                e.preventDefault();
+                            }
+                        },
+                        className: "w-[--radix-popover-trigger-width] p-0",
+                        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_command.CommandList, {
+                            children: suggestions.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_command.CommandGroup, {
+                                children: suggestions.map(function(option) {
+                                    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_command.CommandItem, {
+                                        value: option,
+                                        onMouseDown: function(e) {
+                                            return e.preventDefault();
+                                        },
+                                        onSelect: function(inputValue) {
+                                            setOpen(false);
+                                            onSelect(inputValue !== null && inputValue !== void 0 ? inputValue : "");
+                                        },
+                                        children: [
+                                            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Check, {
+                                                className: "mr-2 h-4 w-4 opacity-0"
+                                            }),
+                                            option
+                                        ]
+                                    }, option);
+                                })
+                            }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_command.CommandEmpty, {
+                                children: "No suggestions."
+                            })
+                        })
+                    })
+                ]
+            })
+        })
+    });
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+    AutoComplete: AutoComplete
+});
+//# sourceMappingURL=autocomplete.cjs.js.map

package/dist/autocomplete.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/Users/periotto/Desktop/workspace/c-rex.net-web-client-foundation/packages/components/dist/autocomplete.cjs.js","../src/autocomplete.tsx"],"names":["__defProp","Object","defineProperty","__getOwnPropDesc","getOwnPropertyDescriptor","__getOwnPropNames","getOwnPropertyNames","__hasOwnProp","prototype","hasOwnProperty","__export","target","all","name","get","enumerable","__copyProps","to","from","except","desc","key","call","__toCommonJS","mod","value","autocomplete_exports","AutoComplete","module","exports","import_cmdk","require","import_lucide_react","import_react","import_input","import_command","import_popover","import_jsx_runtime","initialValue","onSearch","onSelect","useState","query","setQuery","suggestions","setSuggestions","open","setOpen","useEffect","debounceFetch","setTimeout","then","clearTimeout","jsx","className","children","Popover","onOpenChange","jsxs","Command","shouldFilter","PopoverAnchor","asChild","CommandPrimitive","Input","onValueChange","onKeyDown","e","onMouseDown","onFocus","CommandList","PopoverContent","onOpenAutoFocus","preventDefault","onInteractOutside","Element","hasAttribute","length","CommandGroup","map","option","CommandItem","inputValue","Check","CommandEmpty"],"mappings":"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","sourcesContent":["\"use strict\";\nvar __defProp = Object.defineProperty;\nvar __getOwnPropDesc = Object.getOwnPropertyDescriptor;\nvar __getOwnPropNames = Object.getOwnPropertyNames;\nvar __hasOwnProp = Object.prototype.hasOwnProperty;\nvar __export = (target, all) => {\n  for (var name in all)\n    __defProp(target, name, { get: all[name], enumerable: true });\n};\nvar __copyProps = (to, from, except, desc) => {\n  if (from && typeof from === \"object\" || typeof from === \"function\") {\n    for (let key of __getOwnPropNames(from))\n      if (!__hasOwnProp.call(to, key) && key !== except)\n        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });\n  }\n  return to;\n};\nvar __toCommonJS = (mod) => __copyProps(__defProp({}, \"__esModule\", { value: true }), mod);\n\n// src/autocomplete.tsx\nvar autocomplete_exports = {};\n__export(autocomplete_exports, {\n  AutoComplete: () => AutoComplete\n});\nmodule.exports = __toCommonJS(autocomplete_exports);\nvar import_cmdk = require(\"cmdk\");\nvar import_lucide_react = require(\"lucide-react\");\nvar import_react = require(\"react\");\nvar import_input = require(\"@c-rex/ui/input\");\nvar import_command = require(\"@c-rex/ui/command\");\nvar import_popover = require(\"@c-rex/ui/popover\");\nvar import_jsx_runtime = require(\"react/jsx-runtime\");\nvar AutoComplete = ({\n  initialValue,\n  onSearch,\n  onSelect\n}) => {\n  const [query, setQuery] = (0, import_react.useState)(initialValue);\n  const [suggestions, setSuggestions] = (0, import_react.useState)([]);\n  const [open, setOpen] = (0, import_react.useState)(false);\n  (0, import_react.useEffect)(() => {\n    const debounceFetch = setTimeout(() => {\n      if (query) {\n        onSearch(query).then(setSuggestions);\n      } else {\n        setSuggestions([]);\n      }\n    }, 300);\n    return () => clearTimeout(debounceFetch);\n  }, [onSearch, query]);\n  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(\"div\", { className: \"flex items-center\", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_popover.Popover, { open, onOpenChange: setOpen, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_command.Command, { shouldFilter: false, children: [\n    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_popover.PopoverAnchor, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(\n      import_cmdk.Command.Input,\n      {\n        asChild: true,\n        value: query,\n        onValueChange: setQuery,\n        onKeyDown: (e) => setOpen(e.key !== \"Escape\"),\n        onMouseDown: () => setOpen(false),\n        onFocus: () => setOpen(true),\n        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_input.Input, {})\n      }\n    ) }),\n    !open && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_command.CommandList, { \"aria-hidden\": \"true\", className: \"hidden\" }),\n    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(\n      import_popover.PopoverContent,\n      {\n        asChild: true,\n        onOpenAutoFocus: (e) => e.preventDefault(),\n        onInteractOutside: (e) => {\n          if (e.target instanceof Element && e.target.hasAttribute(\"cmdk-input\")) {\n            e.preventDefault();\n          }\n        },\n        className: \"w-[--radix-popover-trigger-width] p-0\",\n        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_command.CommandList, { children: suggestions.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_command.CommandGroup, { children: suggestions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(\n          import_command.CommandItem,\n          {\n            value: option,\n            onMouseDown: (e) => e.preventDefault(),\n            onSelect: (inputValue) => {\n              setOpen(false);\n              onSelect(inputValue ?? \"\");\n            },\n            children: [\n              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Check, { className: \"mr-2 h-4 w-4 opacity-0\" }),\n              option\n            ]\n          },\n          option\n        )) }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_command.CommandEmpty, { children: \"No suggestions.\" }) })\n      }\n    )\n  ] }) }) });\n};\n// Annotate the CommonJS export names for ESM import in node:\n0 && (module.exports = {\n  AutoComplete\n});\n","import { Command as CommandPrimitive } from \"cmdk\";\nimport { Check } from \"lucide-react\";\nimport { useEffect, useState } from \"react\";\nimport { Input } from \"@c-rex/ui/input\";\nimport {\n    Command,\n    CommandEmpty,\n    CommandGroup,\n    CommandItem,\n    CommandList\n} from \"@c-rex/ui/command\";\nimport {\n    Popover,\n    PopoverAnchor,\n    PopoverContent\n} from \"@c-rex/ui/popover\";\n\ntype Props = {\n    initialValue: string;\n    onSelect: (value: string) => void;\n    onSearch: (value: string) => Promise<string[]>;\n};\n\nexport const AutoComplete = ({\n    initialValue,\n    onSearch,\n    onSelect,\n}: Props) => {\n    const [query, setQuery] = useState(initialValue);\n    const [suggestions, setSuggestions] = useState<string[]>([]);\n\n    const [open, setOpen] = useState(false);\n\n    useEffect(() => {\n        const debounceFetch = setTimeout(() => {\n            if (query) {\n                onSearch(query).then(setSuggestions);\n            } else {\n                setSuggestions([]);\n            }\n        }, 300);\n\n        return () => clearTimeout(debounceFetch);\n    }, [onSearch, query]);\n\n    return (\n        <div className=\"flex items-center\">\n            <Popover open={open} onOpenChange={setOpen}>\n                <Command shouldFilter={false}>\n                    <PopoverAnchor asChild>\n                        <CommandPrimitive.Input\n                            asChild\n                            value={query}\n                            onValueChange={setQuery}\n                            onKeyDown={(e) => setOpen(e.key !== \"Escape\")}\n                            onMouseDown={() => setOpen(false)}\n                            onFocus={() => setOpen(true)}\n                        >\n                            <Input />\n                        </CommandPrimitive.Input>\n                    </PopoverAnchor>\n\n                    {!open && <CommandList aria-hidden=\"true\" className=\"hidden\" />}\n\n                    <PopoverContent\n                        asChild\n                        onOpenAutoFocus={(e) => e.preventDefault()}\n                        onInteractOutside={(e) => {\n                            if (\n                                e.target instanceof Element &&\n                                e.target.hasAttribute(\"cmdk-input\")\n                            ) {\n                                e.preventDefault();\n                            }\n                        }}\n                        className=\"w-[--radix-popover-trigger-width] p-0\"\n                    >\n                        <CommandList>\n                            {/*isLoading && (\n                                <CommandPrimitive.Loading>\n                                    <div className=\"p-1\">\n                                        <Skeleton className=\"h-6 w-full\" />\n                                    </div>\n                                </CommandPrimitive.Loading>\n                            )*/}\n\n                            {suggestions.length > 0 ? (\n                                <CommandGroup>\n                                    {suggestions.map((option) => (\n                                        <CommandItem\n                                            key={option}\n                                            value={option}\n                                            onMouseDown={(e) => e.preventDefault()}\n                                            onSelect={(inputValue) => {\n                                                setOpen(false);\n                                                onSelect(inputValue ?? \"\");\n                                            }}\n                                        >\n                                            <Check className=\"mr-2 h-4 w-4 opacity-0\" />\n                                            {option}\n                                        </CommandItem>\n                                    ))}\n                                </CommandGroup>\n                            ) : (\n                                <CommandEmpty>No suggestions.</CommandEmpty>\n                            )}\n                        </CommandList>\n                    </PopoverContent>\n                </Command>\n            </Popover>\n        </div>\n    );\n}\n"]}

package/dist/autocomplete.d.cts

@@ -0,0 +1,10 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+type Props = {
+    initialValue: string;
+    onSelect: (value: string) => void;
+    onSearch: (value: string) => Promise<string[]>;
+};
+declare const AutoComplete: ({ initialValue, onSearch, onSelect, }: Props) => react_jsx_runtime.JSX.Element;
+
+export { AutoComplete };

package/dist/autocomplete.d.ts

@@ -0,0 +1,10 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+type Props = {
+    initialValue: string;
+    onSelect: (value: string) => void;
+    onSearch: (value: string) => Promise<string[]>;
+};
+declare const AutoComplete: ({ initialValue, onSearch, onSelect, }: Props) => react_jsx_runtime.JSX.Element;
+
+export { AutoComplete };

package/dist/autocomplete.esm.js

@@ -0,0 +1,154 @@
+// src/autocomplete.tsx
+function _array_like_to_array(arr, len) {
+    if (len == null || len > arr.length) len = arr.length;
+    for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
+    return arr2;
+}
+function _array_with_holes(arr) {
+    if (Array.isArray(arr)) return arr;
+}
+function _instanceof(left, right) {
+    if (right != null && typeof Symbol !== "undefined" && right[Symbol.hasInstance]) {
+        return !!right[Symbol.hasInstance](left);
+    } else {
+        return left instanceof right;
+    }
+}
+function _iterable_to_array_limit(arr, i) {
+    var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
+    if (_i == null) return;
+    var _arr = [];
+    var _n = true;
+    var _d = false;
+    var _s, _e;
+    try {
+        for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
+            _arr.push(_s.value);
+            if (i && _arr.length === i) break;
+        }
+    } catch (err) {
+        _d = true;
+        _e = err;
+    } finally{
+        try {
+            if (!_n && _i["return"] != null) _i["return"]();
+        } finally{
+            if (_d) throw _e;
+        }
+    }
+    return _arr;
+}
+function _non_iterable_rest() {
+    throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+function _sliced_to_array(arr, i) {
+    return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
+}
+function _unsupported_iterable_to_array(o, minLen) {
+    if (!o) return;
+    if (typeof o === "string") return _array_like_to_array(o, minLen);
+    var n = Object.prototype.toString.call(o).slice(8, -1);
+    if (n === "Object" && o.constructor) n = o.constructor.name;
+    if (n === "Map" || n === "Set") return Array.from(n);
+    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
+}
+import { Command as CommandPrimitive } from "cmdk";
+import { Check } from "lucide-react";
+import { useEffect, useState } from "react";
+import { Input } from "@c-rex/ui/input";
+import { Command, CommandEmpty, CommandGroup, CommandItem, CommandList } from "@c-rex/ui/command";
+import { Popover, PopoverAnchor, PopoverContent } from "@c-rex/ui/popover";
+import { jsx, jsxs } from "react/jsx-runtime";
+var AutoComplete = function(param) {
+    var initialValue = param.initialValue, onSearch = param.onSearch, onSelect = param.onSelect;
+    var _useState = _sliced_to_array(useState(initialValue), 2), query = _useState[0], setQuery = _useState[1];
+    var _useState1 = _sliced_to_array(useState([]), 2), suggestions = _useState1[0], setSuggestions = _useState1[1];
+    var _useState2 = _sliced_to_array(useState(false), 2), open = _useState2[0], setOpen = _useState2[1];
+    useEffect(function() {
+        var debounceFetch = setTimeout(function() {
+            if (query) {
+                onSearch(query).then(setSuggestions);
+            } else {
+                setSuggestions([]);
+            }
+        }, 300);
+        return function() {
+            return clearTimeout(debounceFetch);
+        };
+    }, [
+        onSearch,
+        query
+    ]);
+    return /* @__PURE__ */ jsx("div", {
+        className: "flex items-center",
+        children: /* @__PURE__ */ jsx(Popover, {
+            open: open,
+            onOpenChange: setOpen,
+            children: /* @__PURE__ */ jsxs(Command, {
+                shouldFilter: false,
+                children: [
+                    /* @__PURE__ */ jsx(PopoverAnchor, {
+                        asChild: true,
+                        children: /* @__PURE__ */ jsx(CommandPrimitive.Input, {
+                            asChild: true,
+                            value: query,
+                            onValueChange: setQuery,
+                            onKeyDown: function(e) {
+                                return setOpen(e.key !== "Escape");
+                            },
+                            onMouseDown: function() {
+                                return setOpen(false);
+                            },
+                            onFocus: function() {
+                                return setOpen(true);
+                            },
+                            children: /* @__PURE__ */ jsx(Input, {})
+                        })
+                    }),
+                    !open && /* @__PURE__ */ jsx(CommandList, {
+                        "aria-hidden": "true",
+                        className: "hidden"
+                    }),
+                    /* @__PURE__ */ jsx(PopoverContent, {
+                        asChild: true,
+                        onOpenAutoFocus: function(e) {
+                            return e.preventDefault();
+                        },
+                        onInteractOutside: function(e) {
+                            if (_instanceof(e.target, Element) && e.target.hasAttribute("cmdk-input")) {
+                                e.preventDefault();
+                            }
+                        },
+                        className: "w-[--radix-popover-trigger-width] p-0",
+                        children: /* @__PURE__ */ jsx(CommandList, {
+                            children: suggestions.length > 0 ? /* @__PURE__ */ jsx(CommandGroup, {
+                                children: suggestions.map(function(option) {
+                                    return /* @__PURE__ */ jsxs(CommandItem, {
+                                        value: option,
+                                        onMouseDown: function(e) {
+                                            return e.preventDefault();
+                                        },
+                                        onSelect: function(inputValue) {
+                                            setOpen(false);
+                                            onSelect(inputValue !== null && inputValue !== void 0 ? inputValue : "");
+                                        },
+                                        children: [
+                                            /* @__PURE__ */ jsx(Check, {
+                                                className: "mr-2 h-4 w-4 opacity-0"
+                                            }),
+                                            option
+                                        ]
+                                    }, option);
+                                })
+                            }) : /* @__PURE__ */ jsx(CommandEmpty, {
+                                children: "No suggestions."
+                            })
+                        })
+                    })
+                ]
+            })
+        })
+    });
+};
+export { AutoComplete };
+//# sourceMappingURL=autocomplete.esm.js.map

package/dist/autocomplete.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/Users/periotto/Desktop/workspace/c-rex.net-web-client-foundation/packages/components/dist/autocomplete.esm.js","../src/autocomplete.tsx"],"names":["Command","CommandPrimitive","Check","useEffect","useState","Input","CommandEmpty","CommandGroup","CommandItem","CommandList","Popover","PopoverAnchor","PopoverContent","jsx","jsxs","AutoComplete","initialValue","onSearch","onSelect","query","setQuery","suggestions","setSuggestions","open","setOpen","debounceFetch","setTimeout","then","clearTimeout","className","children","onOpenChange","shouldFilter","asChild","value","onValueChange","onKeyDown","e","key","onMouseDown","onFocus","onOpenAutoFocus","preventDefault","onInteractOutside","target","Element","hasAttribute","length","map","option","inputValue"],"mappings":"AAAA,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACAvB,SAASA,WAAWC,gBAAA,QAAwB,OAAA;AAC5C,SAASC,KAAA,QAAa,eAAA;AACtB,SAASC,SAAA,EAAWC,QAAA,QAAgB,QAAA;AACpC,SAASC,KAAA,QAAa,kBAAA;AACtB,SACIL,OAAA,EACAM,YAAA,EACAC,YAAA,EACAC,WAAA,EACAC,WAAA,QACG,oBAAA;AACP,SACIC,OAAA,EACAC,aAAA,EACAC,cAAA,QACG,oBAAA;AA2CqB,SAAAC,GAAA,EA+BYC,IAAA,QA/BZ,oBAAA;AAnCrB,IAAMC,eAAe;QACxBC,qBAAAA,cACAC,iBAAAA,UACAC,iBAAAA;IAEA,IAA0Bd,6BAAAA,SAASY,mBAA5BG,QAAmBf,cAAZgB,WAAYhB;IAC1B,IAAsCA,8BAAAA,SAAmB,EAAE,OAApDiB,cAA+BjB,eAAlBkB,iBAAkBlB;IAEtC,IAAwBA,8BAAAA,SAAS,YAA1BmB,OAAiBnB,eAAXoB,UAAWpB;IAExBD,UAAU;QACN,IAAMsB,gBAAgBC,WAAW;YAC7B,IAAIP,OAAO;gBACPF,SAASE,OAAOQ,IAAA,CAAKL;YACzB,OAAO;gBACHA,eAAe,EAAE;YACrB;QACJ,GAAG;QAEH,OAAO;mBAAMM,aAAaH;;IAC9B,GAAG;QAACR;QAAUE;KAAM;IAEpB,OACI,aAAA,GAAAN,IAAC,OAAA;QAAIgB,WAAU;QACXC,UAAA,aAAA,GAAAjB,IAACH,SAAA;YAAQa,MAAAA;YAAYQ,cAAcP;YAC/BM,UAAA,aAAA,GAAAhB,KAACd,SAAA;gBAAQgC,cAAc;gBACnBF,UAAA;oBAAA,aAAA,GAAAjB,IAACF,eAAA;wBAAcsB,SAAO;wBAClBH,UAAA,aAAA,GAAAjB,IAACZ,iBAAiBI,KAAA,EAAjB;4BACG4B,SAAO;4BACPC,OAAOf;4BACPgB,eAAef;4BACfgB,WAAW,SAACC;uCAAMb,QAAQa,EAAEC,GAAA,KAAQ;;4BACpCC,aAAa;uCAAMf,QAAQ;;4BAC3BgB,SAAS;uCAAMhB,QAAQ;;4BAEvBM,UAAA,aAAA,GAAAjB,IAACR,OAAA,CAAA;wBAAM;oBACX;oBAGH,CAACkB,QAAQ,aAAA,GAAAV,IAACJ,aAAA;wBAAY,eAAY;wBAAOoB,WAAU;oBAAA;oBAEpD,aAAA,GAAAhB,IAACD,gBAAA;wBACGqB,SAAO;wBACPQ,iBAAiB,SAACJ;mCAAMA,EAAEK,cAAA;;wBAC1BC,mBAAmB,SAACN;4BAChB,IACIA,AAAE,YAAFA,EAAEO,MAAA,EAAkBC,YACpBR,EAAEO,MAAA,CAAOE,YAAA,CAAa,eACxB;gCACET,EAAEK,cAAA;4BACN;wBACJ;wBACAb,WAAU;wBAEVC,UAAA,aAAA,GAAAjB,IAACJ,aAAA;4BASIqB,UAAAT,YAAY0B,MAAA,GAAS,IAClB,aAAA,GAAAlC,IAACN,cAAA;gCACIuB,UAAAT,YAAY2B,GAAA,CAAI,SAACC;2CACd,aAAA,GAAAnC,KAACN,aAAA;wCAEG0B,OAAOe;wCACPV,aAAa,SAACF;mDAAMA,EAAEK,cAAA;;wCACtBxB,UAAU,SAACgC;4CACP1B,QAAQ;4CACRN,SAASgC,uBAAAA,wBAAAA,aAAc;wCAC3B;wCAEApB,UAAA;4CAAA,aAAA,GAAAjB,IAACX,OAAA;gDAAM2B,WAAU;4CAAA;4CAChBoB;yCAAA;oCAAA,GATIA;;4BAWZ,KAGL,aAAA,GAAApC,IAACP,cAAA;gCAAawB,UAAA;4BAAA;wBAAe;oBAErC;iBACJ;YAAA;QACJ;IACJ;AAGZ;AD/BA,SACEf,YAAY,GACZ","sourcesContent":["// src/autocomplete.tsx\nimport { Command as CommandPrimitive } from \"cmdk\";\nimport { Check } from \"lucide-react\";\nimport { useEffect, useState } from \"react\";\nimport { Input } from \"@c-rex/ui/input\";\nimport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandItem,\n  CommandList\n} from \"@c-rex/ui/command\";\nimport {\n  Popover,\n  PopoverAnchor,\n  PopoverContent\n} from \"@c-rex/ui/popover\";\nimport { jsx, jsxs } from \"react/jsx-runtime\";\nvar AutoComplete = ({\n  initialValue,\n  onSearch,\n  onSelect\n}) => {\n  const [query, setQuery] = useState(initialValue);\n  const [suggestions, setSuggestions] = useState([]);\n  const [open, setOpen] = useState(false);\n  useEffect(() => {\n    const debounceFetch = setTimeout(() => {\n      if (query) {\n        onSearch(query).then(setSuggestions);\n      } else {\n        setSuggestions([]);\n      }\n    }, 300);\n    return () => clearTimeout(debounceFetch);\n  }, [onSearch, query]);\n  return /* @__PURE__ */ jsx(\"div\", { className: \"flex items-center\", children: /* @__PURE__ */ jsx(Popover, { open, onOpenChange: setOpen, children: /* @__PURE__ */ jsxs(Command, { shouldFilter: false, children: [\n    /* @__PURE__ */ jsx(PopoverAnchor, { asChild: true, children: /* @__PURE__ */ jsx(\n      CommandPrimitive.Input,\n      {\n        asChild: true,\n        value: query,\n        onValueChange: setQuery,\n        onKeyDown: (e) => setOpen(e.key !== \"Escape\"),\n        onMouseDown: () => setOpen(false),\n        onFocus: () => setOpen(true),\n        children: /* @__PURE__ */ jsx(Input, {})\n      }\n    ) }),\n    !open && /* @__PURE__ */ jsx(CommandList, { \"aria-hidden\": \"true\", className: \"hidden\" }),\n    /* @__PURE__ */ jsx(\n      PopoverContent,\n      {\n        asChild: true,\n        onOpenAutoFocus: (e) => e.preventDefault(),\n        onInteractOutside: (e) => {\n          if (e.target instanceof Element && e.target.hasAttribute(\"cmdk-input\")) {\n            e.preventDefault();\n          }\n        },\n        className: \"w-[--radix-popover-trigger-width] p-0\",\n        children: /* @__PURE__ */ jsx(CommandList, { children: suggestions.length > 0 ? /* @__PURE__ */ jsx(CommandGroup, { children: suggestions.map((option) => /* @__PURE__ */ jsxs(\n          CommandItem,\n          {\n            value: option,\n            onMouseDown: (e) => e.preventDefault(),\n            onSelect: (inputValue) => {\n              setOpen(false);\n              onSelect(inputValue ?? \"\");\n            },\n            children: [\n              /* @__PURE__ */ jsx(Check, { className: \"mr-2 h-4 w-4 opacity-0\" }),\n              option\n            ]\n          },\n          option\n        )) }) : /* @__PURE__ */ jsx(CommandEmpty, { children: \"No suggestions.\" }) })\n      }\n    )\n  ] }) }) });\n};\nexport {\n  AutoComplete\n};\n","import { Command as CommandPrimitive } from \"cmdk\";\nimport { Check } from \"lucide-react\";\nimport { useEffect, useState } from \"react\";\nimport { Input } from \"@c-rex/ui/input\";\nimport {\n    Command,\n    CommandEmpty,\n    CommandGroup,\n    CommandItem,\n    CommandList\n} from \"@c-rex/ui/command\";\nimport {\n    Popover,\n    PopoverAnchor,\n    PopoverContent\n} from \"@c-rex/ui/popover\";\n\ntype Props = {\n    initialValue: string;\n    onSelect: (value: string) => void;\n    onSearch: (value: string) => Promise<string[]>;\n};\n\nexport const AutoComplete = ({\n    initialValue,\n    onSearch,\n    onSelect,\n}: Props) => {\n    const [query, setQuery] = useState(initialValue);\n    const [suggestions, setSuggestions] = useState<string[]>([]);\n\n    const [open, setOpen] = useState(false);\n\n    useEffect(() => {\n        const debounceFetch = setTimeout(() => {\n            if (query) {\n                onSearch(query).then(setSuggestions);\n            } else {\n                setSuggestions([]);\n            }\n        }, 300);\n\n        return () => clearTimeout(debounceFetch);\n    }, [onSearch, query]);\n\n    return (\n        <div className=\"flex items-center\">\n            <Popover open={open} onOpenChange={setOpen}>\n                <Command shouldFilter={false}>\n                    <PopoverAnchor asChild>\n                        <CommandPrimitive.Input\n                            asChild\n                            value={query}\n                            onValueChange={setQuery}\n                            onKeyDown={(e) => setOpen(e.key !== \"Escape\")}\n                            onMouseDown={() => setOpen(false)}\n                            onFocus={() => setOpen(true)}\n                        >\n                            <Input />\n                        </CommandPrimitive.Input>\n                    </PopoverAnchor>\n\n                    {!open && <CommandList aria-hidden=\"true\" className=\"hidden\" />}\n\n                    <PopoverContent\n                        asChild\n                        onOpenAutoFocus={(e) => e.preventDefault()}\n                        onInteractOutside={(e) => {\n                            if (\n                                e.target instanceof Element &&\n                                e.target.hasAttribute(\"cmdk-input\")\n                            ) {\n                                e.preventDefault();\n                            }\n                        }}\n                        className=\"w-[--radix-popover-trigger-width] p-0\"\n                    >\n                        <CommandList>\n                            {/*isLoading && (\n                                <CommandPrimitive.Loading>\n                                    <div className=\"p-1\">\n                                        <Skeleton className=\"h-6 w-full\" />\n                                    </div>\n                                </CommandPrimitive.Loading>\n                            )*/}\n\n                            {suggestions.length > 0 ? (\n                                <CommandGroup>\n                                    {suggestions.map((option) => (\n                                        <CommandItem\n                                            key={option}\n                                            value={option}\n                                            onMouseDown={(e) => e.preventDefault()}\n                                            onSelect={(inputValue) => {\n                                                setOpen(false);\n                                                onSelect(inputValue ?? \"\");\n                                            }}\n                                        >\n                                            <Check className=\"mr-2 h-4 w-4 opacity-0\" />\n                                            {option}\n                                        </CommandItem>\n                                    ))}\n                                </CommandGroup>\n                            ) : (\n                                <CommandEmpty>No suggestions.</CommandEmpty>\n                            )}\n                        </CommandList>\n                    </PopoverContent>\n                </Command>\n            </Popover>\n        </div>\n    );\n}\n"]}