@jameskabz/nextcraft-ui 0.6.6 → 0.6.8

package/dist/components/craft-checkbox.cjs

@@ -0,0 +1,103 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var craft_checkbox_exports = {};
+__export(craft_checkbox_exports, {
+  CraftCheckbox: () => CraftCheckbox
+});
+module.exports = __toCommonJS(craft_checkbox_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var React = __toESM(require("react"), 1);
+var import_cn = require("../utils/cn");
+const CraftCheckbox = React.forwardRef(
+  ({ className, tone, label, description, ...props }, ref) => {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+      "label",
+      {
+        className: (0, import_cn.cn)(
+          "flex items-start gap-3 text-sm text-[rgb(var(--nc-fg))]",
+          props.disabled ? "opacity-60" : "cursor-pointer",
+          className
+        ),
+        "data-nc-theme": tone,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "relative mt-0.5", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              "input",
+              {
+                ref,
+                type: "checkbox",
+                className: "peer sr-only",
+                ...props
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              "span",
+              {
+                className: (0, import_cn.cn)(
+                  "flex h-5 w-5 items-center justify-center rounded-md border-2",
+                  "border-[rgb(var(--nc-border)/0.45)] bg-[rgb(var(--nc-surface)/0.08)]",
+                  "transition-all duration-200",
+                  "peer-checked:border-[rgb(var(--nc-accent-1))] peer-checked:bg-[rgb(var(--nc-accent-1)/0.25)]",
+                  "peer-focus-visible:ring-2 peer-focus-visible:ring-[rgb(var(--nc-accent-1)/0.5)]"
+                ),
+                children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  "svg",
+                  {
+                    className: "h-3 w-3 text-[rgb(var(--nc-fg))] opacity-0 transition-opacity peer-checked:opacity-100",
+                    viewBox: "0 0 20 20",
+                    fill: "currentColor",
+                    "aria-hidden": "true",
+                    children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                      "path",
+                      {
+                        fillRule: "evenodd",
+                        d: "M16.704 5.29a1 1 0 010 1.415l-7.2 7.2a1 1 0 01-1.415 0l-3.2-3.2a1 1 0 111.415-1.415l2.492 2.493 6.493-6.493a1 1 0 011.415 0z",
+                        clipRule: "evenodd"
+                      }
+                    )
+                  }
+                )
+              }
+            )
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "space-y-1", children: [
+            label && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "block font-medium text-[rgb(var(--nc-fg))]", children: label }),
+            description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "block text-xs text-[rgb(var(--nc-fg-muted))]", children: description })
+          ] })
+        ]
+      }
+    );
+  }
+);
+CraftCheckbox.displayName = "CraftCheckbox";
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  CraftCheckbox
+});
+//# sourceMappingURL=craft-checkbox.cjs.map

package/dist/components/craft-checkbox.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/craft-checkbox.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport { cn } from \"@/utils/cn\";\nimport type { ThemeName } from \"@/theme/theme-context\";\n\nexport type CraftCheckboxProps = Omit<\n  React.InputHTMLAttributes<HTMLInputElement>,\n  \"type\"\n> & {\n  tone?: ThemeName;\n  label?: React.ReactNode;\n  description?: React.ReactNode;\n};\n\nexport const CraftCheckbox = React.forwardRef<HTMLInputElement, CraftCheckboxProps>(\n  ({ className, tone, label, description, ...props }, ref) => {\n    return (\n      <label\n        className={cn(\n          \"flex items-start gap-3 text-sm text-[rgb(var(--nc-fg))]\",\n          props.disabled ? \"opacity-60\" : \"cursor-pointer\",\n          className\n        )}\n        data-nc-theme={tone}\n      >\n        <span className=\"relative mt-0.5\">\n          <input\n            ref={ref}\n            type=\"checkbox\"\n            className=\"peer sr-only\"\n            {...props}\n          />\n          <span\n            className={cn(\n              \"flex h-5 w-5 items-center justify-center rounded-md border-2\",\n              \"border-[rgb(var(--nc-border)/0.45)] bg-[rgb(var(--nc-surface)/0.08)]\",\n              \"transition-all duration-200\",\n              \"peer-checked:border-[rgb(var(--nc-accent-1))] peer-checked:bg-[rgb(var(--nc-accent-1)/0.25)]\",\n              \"peer-focus-visible:ring-2 peer-focus-visible:ring-[rgb(var(--nc-accent-1)/0.5)]\"\n            )}\n          >\n            <svg\n              className=\"h-3 w-3 text-[rgb(var(--nc-fg))] opacity-0 transition-opacity peer-checked:opacity-100\"\n              viewBox=\"0 0 20 20\"\n              fill=\"currentColor\"\n              aria-hidden=\"true\"\n            >\n              <path\n                fillRule=\"evenodd\"\n                d=\"M16.704 5.29a1 1 0 010 1.415l-7.2 7.2a1 1 0 01-1.415 0l-3.2-3.2a1 1 0 111.415-1.415l2.492 2.493 6.493-6.493a1 1 0 011.415 0z\"\n                clipRule=\"evenodd\"\n              />\n            </svg>\n          </span>\n        </span>\n        <span className=\"space-y-1\">\n          {label && <span className=\"block font-medium text-[rgb(var(--nc-fg))]\">{label}</span>}\n          {description && (\n            <span className=\"block text-xs text-[rgb(var(--nc-fg-muted))]\">{description}</span>\n          )}\n        </span>\n      </label>\n    );\n  }\n);\n\nCraftCheckbox.displayName = \"CraftCheckbox\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAyBQ;AAzBR,YAAuB;AAEvB,gBAAmB;AAYZ,MAAM,gBAAgB,MAAM;AAAA,EACjC,CAAC,EAAE,WAAW,MAAM,OAAO,aAAa,GAAG,MAAM,GAAG,QAAQ;AAC1D,WACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAW;AAAA,UACT;AAAA,UACA,MAAM,WAAW,eAAe;AAAA,UAChC;AAAA,QACF;AAAA,QACA,iBAAe;AAAA,QAEf;AAAA,uDAAC,UAAK,WAAU,mBACd;AAAA;AAAA,cAAC;AAAA;AAAA,gBACC;AAAA,gBACA,MAAK;AAAA,gBACL,WAAU;AAAA,gBACT,GAAG;AAAA;AAAA,YACN;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACC,eAAW;AAAA,kBACT;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA;AAAA,gBACF;AAAA,gBAEA;AAAA,kBAAC;AAAA;AAAA,oBACC,WAAU;AAAA,oBACV,SAAQ;AAAA,oBACR,MAAK;AAAA,oBACL,eAAY;AAAA,oBAEZ;AAAA,sBAAC;AAAA;AAAA,wBACC,UAAS;AAAA,wBACT,GAAE;AAAA,wBACF,UAAS;AAAA;AAAA,oBACX;AAAA;AAAA,gBACF;AAAA;AAAA,YACF;AAAA,aACF;AAAA,UACA,6CAAC,UAAK,WAAU,aACb;AAAA,qBAAS,4CAAC,UAAK,WAAU,8CAA8C,iBAAM;AAAA,YAC7E,eACC,4CAAC,UAAK,WAAU,gDAAgD,uBAAY;AAAA,aAEhF;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,cAAc,cAAc;","names":[]}

package/dist/components/craft-checkbox.d.cts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import { ThemeName } from '../theme/theme-context.cjs';
+import 'react/jsx-runtime';
+
+type CraftCheckboxProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, "type"> & {
+    tone?: ThemeName;
+    label?: React.ReactNode;
+    description?: React.ReactNode;
+};
+declare const CraftCheckbox: React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "type"> & {
+    tone?: ThemeName;
+    label?: React.ReactNode;
+    description?: React.ReactNode;
+} & React.RefAttributes<HTMLInputElement>>;
+
+export { CraftCheckbox, type CraftCheckboxProps };

package/dist/components/craft-checkbox.d.ts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import { ThemeName } from '../theme/theme-context.js';
+import 'react/jsx-runtime';
+
+type CraftCheckboxProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, "type"> & {
+    tone?: ThemeName;
+    label?: React.ReactNode;
+    description?: React.ReactNode;
+};
+declare const CraftCheckbox: React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "type"> & {
+    tone?: ThemeName;
+    label?: React.ReactNode;
+    description?: React.ReactNode;
+} & React.RefAttributes<HTMLInputElement>>;
+
+export { CraftCheckbox, type CraftCheckboxProps };

package/dist/components/craft-checkbox.js

@@ -0,0 +1,69 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../utils/cn";
+const CraftCheckbox = React.forwardRef(
+  ({ className, tone, label, description, ...props }, ref) => {
+    return /* @__PURE__ */ jsxs(
+      "label",
+      {
+        className: cn(
+          "flex items-start gap-3 text-sm text-[rgb(var(--nc-fg))]",
+          props.disabled ? "opacity-60" : "cursor-pointer",
+          className
+        ),
+        "data-nc-theme": tone,
+        children: [
+          /* @__PURE__ */ jsxs("span", { className: "relative mt-0.5", children: [
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                ref,
+                type: "checkbox",
+                className: "peer sr-only",
+                ...props
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "span",
+              {
+                className: cn(
+                  "flex h-5 w-5 items-center justify-center rounded-md border-2",
+                  "border-[rgb(var(--nc-border)/0.45)] bg-[rgb(var(--nc-surface)/0.08)]",
+                  "transition-all duration-200",
+                  "peer-checked:border-[rgb(var(--nc-accent-1))] peer-checked:bg-[rgb(var(--nc-accent-1)/0.25)]",
+                  "peer-focus-visible:ring-2 peer-focus-visible:ring-[rgb(var(--nc-accent-1)/0.5)]"
+                ),
+                children: /* @__PURE__ */ jsx(
+                  "svg",
+                  {
+                    className: "h-3 w-3 text-[rgb(var(--nc-fg))] opacity-0 transition-opacity peer-checked:opacity-100",
+                    viewBox: "0 0 20 20",
+                    fill: "currentColor",
+                    "aria-hidden": "true",
+                    children: /* @__PURE__ */ jsx(
+                      "path",
+                      {
+                        fillRule: "evenodd",
+                        d: "M16.704 5.29a1 1 0 010 1.415l-7.2 7.2a1 1 0 01-1.415 0l-3.2-3.2a1 1 0 111.415-1.415l2.492 2.493 6.493-6.493a1 1 0 011.415 0z",
+                        clipRule: "evenodd"
+                      }
+                    )
+                  }
+                )
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("span", { className: "space-y-1", children: [
+            label && /* @__PURE__ */ jsx("span", { className: "block font-medium text-[rgb(var(--nc-fg))]", children: label }),
+            description && /* @__PURE__ */ jsx("span", { className: "block text-xs text-[rgb(var(--nc-fg-muted))]", children: description })
+          ] })
+        ]
+      }
+    );
+  }
+);
+CraftCheckbox.displayName = "CraftCheckbox";
+export {
+  CraftCheckbox
+};
+//# sourceMappingURL=craft-checkbox.js.map

package/dist/components/craft-checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/craft-checkbox.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport { cn } from \"@/utils/cn\";\nimport type { ThemeName } from \"@/theme/theme-context\";\n\nexport type CraftCheckboxProps = Omit<\n  React.InputHTMLAttributes<HTMLInputElement>,\n  \"type\"\n> & {\n  tone?: ThemeName;\n  label?: React.ReactNode;\n  description?: React.ReactNode;\n};\n\nexport const CraftCheckbox = React.forwardRef<HTMLInputElement, CraftCheckboxProps>(\n  ({ className, tone, label, description, ...props }, ref) => {\n    return (\n      <label\n        className={cn(\n          \"flex items-start gap-3 text-sm text-[rgb(var(--nc-fg))]\",\n          props.disabled ? \"opacity-60\" : \"cursor-pointer\",\n          className\n        )}\n        data-nc-theme={tone}\n      >\n        <span className=\"relative mt-0.5\">\n          <input\n            ref={ref}\n            type=\"checkbox\"\n            className=\"peer sr-only\"\n            {...props}\n          />\n          <span\n            className={cn(\n              \"flex h-5 w-5 items-center justify-center rounded-md border-2\",\n              \"border-[rgb(var(--nc-border)/0.45)] bg-[rgb(var(--nc-surface)/0.08)]\",\n              \"transition-all duration-200\",\n              \"peer-checked:border-[rgb(var(--nc-accent-1))] peer-checked:bg-[rgb(var(--nc-accent-1)/0.25)]\",\n              \"peer-focus-visible:ring-2 peer-focus-visible:ring-[rgb(var(--nc-accent-1)/0.5)]\"\n            )}\n          >\n            <svg\n              className=\"h-3 w-3 text-[rgb(var(--nc-fg))] opacity-0 transition-opacity peer-checked:opacity-100\"\n              viewBox=\"0 0 20 20\"\n              fill=\"currentColor\"\n              aria-hidden=\"true\"\n            >\n              <path\n                fillRule=\"evenodd\"\n                d=\"M16.704 5.29a1 1 0 010 1.415l-7.2 7.2a1 1 0 01-1.415 0l-3.2-3.2a1 1 0 111.415-1.415l2.492 2.493 6.493-6.493a1 1 0 011.415 0z\"\n                clipRule=\"evenodd\"\n              />\n            </svg>\n          </span>\n        </span>\n        <span className=\"space-y-1\">\n          {label && <span className=\"block font-medium text-[rgb(var(--nc-fg))]\">{label}</span>}\n          {description && (\n            <span className=\"block text-xs text-[rgb(var(--nc-fg-muted))]\">{description}</span>\n          )}\n        </span>\n      </label>\n    );\n  }\n);\n\nCraftCheckbox.displayName = \"CraftCheckbox\";\n"],"mappings":"AAyBQ,SACE,KADF;AAzBR,YAAY,WAAW;AAEvB,SAAS,UAAU;AAYZ,MAAM,gBAAgB,MAAM;AAAA,EACjC,CAAC,EAAE,WAAW,MAAM,OAAO,aAAa,GAAG,MAAM,GAAG,QAAQ;AAC1D,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA,MAAM,WAAW,eAAe;AAAA,UAChC;AAAA,QACF;AAAA,QACA,iBAAe;AAAA,QAEf;AAAA,+BAAC,UAAK,WAAU,mBACd;AAAA;AAAA,cAAC;AAAA;AAAA,gBACC;AAAA,gBACA,MAAK;AAAA,gBACL,WAAU;AAAA,gBACT,GAAG;AAAA;AAAA,YACN;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACC,WAAW;AAAA,kBACT;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA;AAAA,gBACF;AAAA,gBAEA;AAAA,kBAAC;AAAA;AAAA,oBACC,WAAU;AAAA,oBACV,SAAQ;AAAA,oBACR,MAAK;AAAA,oBACL,eAAY;AAAA,oBAEZ;AAAA,sBAAC;AAAA;AAAA,wBACC,UAAS;AAAA,wBACT,GAAE;AAAA,wBACF,UAAS;AAAA;AAAA,oBACX;AAAA;AAAA,gBACF;AAAA;AAAA,YACF;AAAA,aACF;AAAA,UACA,qBAAC,UAAK,WAAU,aACb;AAAA,qBAAS,oBAAC,UAAK,WAAU,8CAA8C,iBAAM;AAAA,YAC7E,eACC,oBAAC,UAAK,WAAU,gDAAgD,uBAAY;AAAA,aAEhF;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,cAAc,cAAc;","names":[]}

package/dist/components/craft-command-palette.cjs

@@ -0,0 +1,134 @@
+"use strict";
+"use client";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var craft_command_palette_exports = {};
+__export(craft_command_palette_exports, {
+  CraftCommandPalette: () => CraftCommandPalette
+});
+module.exports = __toCommonJS(craft_command_palette_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var React = __toESM(require("react"), 1);
+var import_cn = require("../utils/cn");
+var import_craft_input = require("../components/craft-input");
+var import_craft_modal = require("../components/craft-modal");
+function CraftCommandPalette({
+  items,
+  open,
+  defaultOpen = false,
+  onOpenChange,
+  trigger,
+  title = "Command Palette",
+  placeholder = "Search commands...",
+  emptyText = "No results found.",
+  tone,
+  className
+}) {
+  const [uncontrolledOpen, setUncontrolledOpen] = React.useState(defaultOpen);
+  const isControlled = typeof open === "boolean";
+  const isOpen = isControlled ? open : uncontrolledOpen;
+  const [query, setQuery] = React.useState("");
+  const setOpen = React.useCallback(
+    (next) => {
+      if (!isControlled) setUncontrolledOpen(next);
+      onOpenChange == null ? void 0 : onOpenChange(next);
+    },
+    [isControlled, onOpenChange]
+  );
+  const filtered = React.useMemo(() => {
+    const q = query.trim().toLowerCase();
+    if (!q) return items;
+    return items.filter((item) => {
+      var _a, _b;
+      const haystack = [
+        item.label,
+        (_a = item.description) != null ? _a : "",
+        ...(_b = item.keywords) != null ? _b : []
+      ].join(" ").toLowerCase();
+      return haystack.includes(q);
+    });
+  }, [items, query]);
+  React.useEffect(() => {
+    if (!isOpen) setQuery("");
+  }, [isOpen]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_craft_modal.CraftModal,
+    {
+      open: isOpen,
+      onOpenChange: setOpen,
+      trigger,
+      title,
+      tone,
+      className: (0, import_cn.cn)("max-w-xl", className),
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-4", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_craft_input.CraftInput,
+          {
+            type: "search",
+            placeholder,
+            value: query,
+            onChange: (event) => setQuery(event.target.value)
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-2", children: [
+          filtered.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "rounded-2xl border border-[rgb(var(--nc-border)/0.35)] bg-[rgb(var(--nc-surface)/0.12)] p-4 text-sm text-[rgb(var(--nc-fg-muted))]", children: emptyText }),
+          filtered.map((item) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+            "button",
+            {
+              type: "button",
+              disabled: item.disabled,
+              onClick: () => {
+                var _a;
+                if (item.disabled) return;
+                (_a = item.onSelect) == null ? void 0 : _a.call(item);
+                setOpen(false);
+              },
+              className: (0, import_cn.cn)(
+                "flex w-full items-start gap-3 rounded-2xl border border-[rgb(var(--nc-border)/0.35)] bg-[rgb(var(--nc-surface)/0.08)] px-4 py-3 text-left transition",
+                item.disabled ? "cursor-not-allowed opacity-60" : "hover:bg-[rgb(var(--nc-surface)/0.16)]"
+              ),
+              children: [
+                item.icon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "mt-1", children: item.icon }),
+                /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "block text-sm font-semibold", children: item.label }),
+                  item.description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "block text-xs text-[rgb(var(--nc-fg-muted))]", children: item.description })
+                ] })
+              ]
+            },
+            item.id
+          ))
+        ] })
+      ] })
+    }
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  CraftCommandPalette
+});
+//# sourceMappingURL=craft-command-palette.cjs.map

package/dist/components/craft-command-palette.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/craft-command-palette.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\n\nimport { cn } from \"@/utils/cn\";\nimport type { ThemeName } from \"@/theme/theme-context\";\nimport { CraftInput } from \"@/components/craft-input\";\nimport { CraftModal } from \"@/components/craft-modal\";\n\nexport type CraftCommandItem = {\n  id: string;\n  label: string;\n  description?: string;\n  keywords?: string[];\n  icon?: React.ReactNode;\n  onSelect?: () => void;\n  disabled?: boolean;\n};\n\nexport type CraftCommandPaletteProps = {\n  items: CraftCommandItem[];\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  trigger?: React.ReactNode;\n  title?: React.ReactNode;\n  placeholder?: string;\n  emptyText?: React.ReactNode;\n  tone?: ThemeName;\n  className?: string;\n};\n\nexport function CraftCommandPalette({\n  items,\n  open,\n  defaultOpen = false,\n  onOpenChange,\n  trigger,\n  title = \"Command Palette\",\n  placeholder = \"Search commands...\",\n  emptyText = \"No results found.\",\n  tone,\n  className,\n}: CraftCommandPaletteProps) {\n  const [uncontrolledOpen, setUncontrolledOpen] = React.useState(defaultOpen);\n  const isControlled = typeof open === \"boolean\";\n  const isOpen = isControlled ? open : uncontrolledOpen;\n  const [query, setQuery] = React.useState(\"\");\n\n  const setOpen = React.useCallback(\n    (next: boolean) => {\n      if (!isControlled) setUncontrolledOpen(next);\n      onOpenChange?.(next);\n    },\n    [isControlled, onOpenChange]\n  );\n\n  const filtered = React.useMemo(() => {\n    const q = query.trim().toLowerCase();\n    if (!q) return items;\n    return items.filter((item) => {\n      const haystack = [\n        item.label,\n        item.description ?? \"\",\n        ...(item.keywords ?? []),\n      ]\n        .join(\" \")\n        .toLowerCase();\n      return haystack.includes(q);\n    });\n  }, [items, query]);\n\n  React.useEffect(() => {\n    if (!isOpen) setQuery(\"\");\n  }, [isOpen]);\n\n  return (\n    <CraftModal\n      open={isOpen}\n      onOpenChange={setOpen}\n      trigger={trigger}\n      title={title}\n      tone={tone}\n      className={cn(\"max-w-xl\", className)}\n    >\n      <div className=\"space-y-4\">\n        <CraftInput\n          type=\"search\"\n          placeholder={placeholder}\n          value={query}\n          onChange={(event) => setQuery(event.target.value)}\n        />\n        <div className=\"space-y-2\">\n          {filtered.length === 0 && (\n            <div className=\"rounded-2xl border border-[rgb(var(--nc-border)/0.35)] bg-[rgb(var(--nc-surface)/0.12)] p-4 text-sm text-[rgb(var(--nc-fg-muted))]\">\n              {emptyText}\n            </div>\n          )}\n          {filtered.map((item) => (\n            <button\n              key={item.id}\n              type=\"button\"\n              disabled={item.disabled}\n              onClick={() => {\n                if (item.disabled) return;\n                item.onSelect?.();\n                setOpen(false);\n              }}\n              className={cn(\n                \"flex w-full items-start gap-3 rounded-2xl border border-[rgb(var(--nc-border)/0.35)] bg-[rgb(var(--nc-surface)/0.08)] px-4 py-3 text-left transition\",\n                item.disabled\n                  ? \"cursor-not-allowed opacity-60\"\n                  : \"hover:bg-[rgb(var(--nc-surface)/0.16)]\"\n              )}\n            >\n              {item.icon && <span className=\"mt-1\">{item.icon}</span>}\n              <span>\n                <span className=\"block text-sm font-semibold\">{item.label}</span>\n                {item.description && (\n                  <span className=\"block text-xs text-[rgb(var(--nc-fg-muted))]\">\n                    {item.description}\n                  </span>\n                )}\n              </span>\n            </button>\n          ))}\n        </div>\n      </div>\n    </CraftModal>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAsFQ;AApFR,YAAuB;AAEvB,gBAAmB;AAEnB,yBAA2B;AAC3B,yBAA2B;AAyBpB,SAAS,oBAAoB;AAAA,EAClC;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,YAAY;AAAA,EACZ;AAAA,EACA;AACF,GAA6B;AAC3B,QAAM,CAAC,kBAAkB,mBAAmB,IAAI,MAAM,SAAS,WAAW;AAC1E,QAAM,eAAe,OAAO,SAAS;AACrC,QAAM,SAAS,eAAe,OAAO;AACrC,QAAM,CAAC,OAAO,QAAQ,IAAI,MAAM,SAAS,EAAE;AAE3C,QAAM,UAAU,MAAM;AAAA,IACpB,CAAC,SAAkB;AACjB,UAAI,CAAC,aAAc,qBAAoB,IAAI;AAC3C,mDAAe;AAAA,IACjB;AAAA,IACA,CAAC,cAAc,YAAY;AAAA,EAC7B;AAEA,QAAM,WAAW,MAAM,QAAQ,MAAM;AACnC,UAAM,IAAI,MAAM,KAAK,EAAE,YAAY;AACnC,QAAI,CAAC,EAAG,QAAO;AACf,WAAO,MAAM,OAAO,CAAC,SAAS;AA5DlC;AA6DM,YAAM,WAAW;AAAA,QACf,KAAK;AAAA,SACL,UAAK,gBAAL,YAAoB;AAAA,QACpB,IAAI,UAAK,aAAL,YAAiB,CAAC;AAAA,MACxB,EACG,KAAK,GAAG,EACR,YAAY;AACf,aAAO,SAAS,SAAS,CAAC;AAAA,IAC5B,CAAC;AAAA,EACH,GAAG,CAAC,OAAO,KAAK,CAAC;AAEjB,QAAM,UAAU,MAAM;AACpB,QAAI,CAAC,OAAQ,UAAS,EAAE;AAAA,EAC1B,GAAG,CAAC,MAAM,CAAC;AAEX,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM;AAAA,MACN,cAAc;AAAA,MACd;AAAA,MACA;AAAA,MACA;AAAA,MACA,eAAW,cAAG,YAAY,SAAS;AAAA,MAEnC,uDAAC,SAAI,WAAU,aACb;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL;AAAA,YACA,OAAO;AAAA,YACP,UAAU,CAAC,UAAU,SAAS,MAAM,OAAO,KAAK;AAAA;AAAA,QAClD;AAAA,QACA,6CAAC,SAAI,WAAU,aACZ;AAAA,mBAAS,WAAW,KACnB,4CAAC,SAAI,WAAU,sIACZ,qBACH;AAAA,UAED,SAAS,IAAI,CAAC,SACb;AAAA,YAAC;AAAA;AAAA,cAEC,MAAK;AAAA,cACL,UAAU,KAAK;AAAA,cACf,SAAS,MAAM;AAvG7B;AAwGgB,oBAAI,KAAK,SAAU;AACnB,2BAAK,aAAL;AACA,wBAAQ,KAAK;AAAA,cACf;AAAA,cACA,eAAW;AAAA,gBACT;AAAA,gBACA,KAAK,WACD,kCACA;AAAA,cACN;AAAA,cAEC;AAAA,qBAAK,QAAQ,4CAAC,UAAK,WAAU,QAAQ,eAAK,MAAK;AAAA,gBAChD,6CAAC,UACC;AAAA,8DAAC,UAAK,WAAU,+BAA+B,eAAK,OAAM;AAAA,kBACzD,KAAK,eACJ,4CAAC,UAAK,WAAU,gDACb,eAAK,aACR;AAAA,mBAEJ;AAAA;AAAA;AAAA,YAvBK,KAAK;AAAA,UAwBZ,CACD;AAAA,WACH;AAAA,SACF;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/dist/components/craft-command-palette.d.cts

@@ -0,0 +1,28 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+import { ThemeName } from '../theme/theme-context.cjs';
+
+type CraftCommandItem = {
+    id: string;
+    label: string;
+    description?: string;
+    keywords?: string[];
+    icon?: React.ReactNode;
+    onSelect?: () => void;
+    disabled?: boolean;
+};
+type CraftCommandPaletteProps = {
+    items: CraftCommandItem[];
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    trigger?: React.ReactNode;
+    title?: React.ReactNode;
+    placeholder?: string;
+    emptyText?: React.ReactNode;
+    tone?: ThemeName;
+    className?: string;
+};
+declare function CraftCommandPalette({ items, open, defaultOpen, onOpenChange, trigger, title, placeholder, emptyText, tone, className, }: CraftCommandPaletteProps): react_jsx_runtime.JSX.Element;
+
+export { type CraftCommandItem, CraftCommandPalette, type CraftCommandPaletteProps };

package/dist/components/craft-command-palette.d.ts

@@ -0,0 +1,28 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+import { ThemeName } from '../theme/theme-context.js';
+
+type CraftCommandItem = {
+    id: string;
+    label: string;
+    description?: string;
+    keywords?: string[];
+    icon?: React.ReactNode;
+    onSelect?: () => void;
+    disabled?: boolean;
+};
+type CraftCommandPaletteProps = {
+    items: CraftCommandItem[];
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    trigger?: React.ReactNode;
+    title?: React.ReactNode;
+    placeholder?: string;
+    emptyText?: React.ReactNode;
+    tone?: ThemeName;
+    className?: string;
+};
+declare function CraftCommandPalette({ items, open, defaultOpen, onOpenChange, trigger, title, placeholder, emptyText, tone, className, }: CraftCommandPaletteProps): react_jsx_runtime.JSX.Element;
+
+export { type CraftCommandItem, CraftCommandPalette, type CraftCommandPaletteProps };

package/dist/components/craft-command-palette.js

@@ -0,0 +1,100 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../utils/cn";
+import { CraftInput } from "../components/craft-input";
+import { CraftModal } from "../components/craft-modal";
+function CraftCommandPalette({
+  items,
+  open,
+  defaultOpen = false,
+  onOpenChange,
+  trigger,
+  title = "Command Palette",
+  placeholder = "Search commands...",
+  emptyText = "No results found.",
+  tone,
+  className
+}) {
+  const [uncontrolledOpen, setUncontrolledOpen] = React.useState(defaultOpen);
+  const isControlled = typeof open === "boolean";
+  const isOpen = isControlled ? open : uncontrolledOpen;
+  const [query, setQuery] = React.useState("");
+  const setOpen = React.useCallback(
+    (next) => {
+      if (!isControlled) setUncontrolledOpen(next);
+      onOpenChange == null ? void 0 : onOpenChange(next);
+    },
+    [isControlled, onOpenChange]
+  );
+  const filtered = React.useMemo(() => {
+    const q = query.trim().toLowerCase();
+    if (!q) return items;
+    return items.filter((item) => {
+      var _a, _b;
+      const haystack = [
+        item.label,
+        (_a = item.description) != null ? _a : "",
+        ...(_b = item.keywords) != null ? _b : []
+      ].join(" ").toLowerCase();
+      return haystack.includes(q);
+    });
+  }, [items, query]);
+  React.useEffect(() => {
+    if (!isOpen) setQuery("");
+  }, [isOpen]);
+  return /* @__PURE__ */ jsx(
+    CraftModal,
+    {
+      open: isOpen,
+      onOpenChange: setOpen,
+      trigger,
+      title,
+      tone,
+      className: cn("max-w-xl", className),
+      children: /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+        /* @__PURE__ */ jsx(
+          CraftInput,
+          {
+            type: "search",
+            placeholder,
+            value: query,
+            onChange: (event) => setQuery(event.target.value)
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+          filtered.length === 0 && /* @__PURE__ */ jsx("div", { className: "rounded-2xl border border-[rgb(var(--nc-border)/0.35)] bg-[rgb(var(--nc-surface)/0.12)] p-4 text-sm text-[rgb(var(--nc-fg-muted))]", children: emptyText }),
+          filtered.map((item) => /* @__PURE__ */ jsxs(
+            "button",
+            {
+              type: "button",
+              disabled: item.disabled,
+              onClick: () => {
+                var _a;
+                if (item.disabled) return;
+                (_a = item.onSelect) == null ? void 0 : _a.call(item);
+                setOpen(false);
+              },
+              className: cn(
+                "flex w-full items-start gap-3 rounded-2xl border border-[rgb(var(--nc-border)/0.35)] bg-[rgb(var(--nc-surface)/0.08)] px-4 py-3 text-left transition",
+                item.disabled ? "cursor-not-allowed opacity-60" : "hover:bg-[rgb(var(--nc-surface)/0.16)]"
+              ),
+              children: [
+                item.icon && /* @__PURE__ */ jsx("span", { className: "mt-1", children: item.icon }),
+                /* @__PURE__ */ jsxs("span", { children: [
+                  /* @__PURE__ */ jsx("span", { className: "block text-sm font-semibold", children: item.label }),
+                  item.description && /* @__PURE__ */ jsx("span", { className: "block text-xs text-[rgb(var(--nc-fg-muted))]", children: item.description })
+                ] })
+              ]
+            },
+            item.id
+          ))
+        ] })
+      ] })
+    }
+  );
+}
+export {
+  CraftCommandPalette
+};
+//# sourceMappingURL=craft-command-palette.js.map

package/dist/components/craft-command-palette.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/craft-command-palette.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\n\nimport { cn } from \"@/utils/cn\";\nimport type { ThemeName } from \"@/theme/theme-context\";\nimport { CraftInput } from \"@/components/craft-input\";\nimport { CraftModal } from \"@/components/craft-modal\";\n\nexport type CraftCommandItem = {\n  id: string;\n  label: string;\n  description?: string;\n  keywords?: string[];\n  icon?: React.ReactNode;\n  onSelect?: () => void;\n  disabled?: boolean;\n};\n\nexport type CraftCommandPaletteProps = {\n  items: CraftCommandItem[];\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  trigger?: React.ReactNode;\n  title?: React.ReactNode;\n  placeholder?: string;\n  emptyText?: React.ReactNode;\n  tone?: ThemeName;\n  className?: string;\n};\n\nexport function CraftCommandPalette({\n  items,\n  open,\n  defaultOpen = false,\n  onOpenChange,\n  trigger,\n  title = \"Command Palette\",\n  placeholder = \"Search commands...\",\n  emptyText = \"No results found.\",\n  tone,\n  className,\n}: CraftCommandPaletteProps) {\n  const [uncontrolledOpen, setUncontrolledOpen] = React.useState(defaultOpen);\n  const isControlled = typeof open === \"boolean\";\n  const isOpen = isControlled ? open : uncontrolledOpen;\n  const [query, setQuery] = React.useState(\"\");\n\n  const setOpen = React.useCallback(\n    (next: boolean) => {\n      if (!isControlled) setUncontrolledOpen(next);\n      onOpenChange?.(next);\n    },\n    [isControlled, onOpenChange]\n  );\n\n  const filtered = React.useMemo(() => {\n    const q = query.trim().toLowerCase();\n    if (!q) return items;\n    return items.filter((item) => {\n      const haystack = [\n        item.label,\n        item.description ?? \"\",\n        ...(item.keywords ?? []),\n      ]\n        .join(\" \")\n        .toLowerCase();\n      return haystack.includes(q);\n    });\n  }, [items, query]);\n\n  React.useEffect(() => {\n    if (!isOpen) setQuery(\"\");\n  }, [isOpen]);\n\n  return (\n    <CraftModal\n      open={isOpen}\n      onOpenChange={setOpen}\n      trigger={trigger}\n      title={title}\n      tone={tone}\n      className={cn(\"max-w-xl\", className)}\n    >\n      <div className=\"space-y-4\">\n        <CraftInput\n          type=\"search\"\n          placeholder={placeholder}\n          value={query}\n          onChange={(event) => setQuery(event.target.value)}\n        />\n        <div className=\"space-y-2\">\n          {filtered.length === 0 && (\n            <div className=\"rounded-2xl border border-[rgb(var(--nc-border)/0.35)] bg-[rgb(var(--nc-surface)/0.12)] p-4 text-sm text-[rgb(var(--nc-fg-muted))]\">\n              {emptyText}\n            </div>\n          )}\n          {filtered.map((item) => (\n            <button\n              key={item.id}\n              type=\"button\"\n              disabled={item.disabled}\n              onClick={() => {\n                if (item.disabled) return;\n                item.onSelect?.();\n                setOpen(false);\n              }}\n              className={cn(\n                \"flex w-full items-start gap-3 rounded-2xl border border-[rgb(var(--nc-border)/0.35)] bg-[rgb(var(--nc-surface)/0.08)] px-4 py-3 text-left transition\",\n                item.disabled\n                  ? \"cursor-not-allowed opacity-60\"\n                  : \"hover:bg-[rgb(var(--nc-surface)/0.16)]\"\n              )}\n            >\n              {item.icon && <span className=\"mt-1\">{item.icon}</span>}\n              <span>\n                <span className=\"block text-sm font-semibold\">{item.label}</span>\n                {item.description && (\n                  <span className=\"block text-xs text-[rgb(var(--nc-fg-muted))]\">\n                    {item.description}\n                  </span>\n                )}\n              </span>\n            </button>\n          ))}\n        </div>\n      </div>\n    </CraftModal>\n  );\n}\n"],"mappings":";AAsFQ,cA8BM,YA9BN;AApFR,YAAY,WAAW;AAEvB,SAAS,UAAU;AAEnB,SAAS,kBAAkB;AAC3B,SAAS,kBAAkB;AAyBpB,SAAS,oBAAoB;AAAA,EAClC;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,YAAY;AAAA,EACZ;AAAA,EACA;AACF,GAA6B;AAC3B,QAAM,CAAC,kBAAkB,mBAAmB,IAAI,MAAM,SAAS,WAAW;AAC1E,QAAM,eAAe,OAAO,SAAS;AACrC,QAAM,SAAS,eAAe,OAAO;AACrC,QAAM,CAAC,OAAO,QAAQ,IAAI,MAAM,SAAS,EAAE;AAE3C,QAAM,UAAU,MAAM;AAAA,IACpB,CAAC,SAAkB;AACjB,UAAI,CAAC,aAAc,qBAAoB,IAAI;AAC3C,mDAAe;AAAA,IACjB;AAAA,IACA,CAAC,cAAc,YAAY;AAAA,EAC7B;AAEA,QAAM,WAAW,MAAM,QAAQ,MAAM;AACnC,UAAM,IAAI,MAAM,KAAK,EAAE,YAAY;AACnC,QAAI,CAAC,EAAG,QAAO;AACf,WAAO,MAAM,OAAO,CAAC,SAAS;AA5DlC;AA6DM,YAAM,WAAW;AAAA,QACf,KAAK;AAAA,SACL,UAAK,gBAAL,YAAoB;AAAA,QACpB,IAAI,UAAK,aAAL,YAAiB,CAAC;AAAA,MACxB,EACG,KAAK,GAAG,EACR,YAAY;AACf,aAAO,SAAS,SAAS,CAAC;AAAA,IAC5B,CAAC;AAAA,EACH,GAAG,CAAC,OAAO,KAAK,CAAC;AAEjB,QAAM,UAAU,MAAM;AACpB,QAAI,CAAC,OAAQ,UAAS,EAAE;AAAA,EAC1B,GAAG,CAAC,MAAM,CAAC;AAEX,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM;AAAA,MACN,cAAc;AAAA,MACd;AAAA,MACA;AAAA,MACA;AAAA,MACA,WAAW,GAAG,YAAY,SAAS;AAAA,MAEnC,+BAAC,SAAI,WAAU,aACb;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL;AAAA,YACA,OAAO;AAAA,YACP,UAAU,CAAC,UAAU,SAAS,MAAM,OAAO,KAAK;AAAA;AAAA,QAClD;AAAA,QACA,qBAAC,SAAI,WAAU,aACZ;AAAA,mBAAS,WAAW,KACnB,oBAAC,SAAI,WAAU,sIACZ,qBACH;AAAA,UAED,SAAS,IAAI,CAAC,SACb;AAAA,YAAC;AAAA;AAAA,cAEC,MAAK;AAAA,cACL,UAAU,KAAK;AAAA,cACf,SAAS,MAAM;AAvG7B;AAwGgB,oBAAI,KAAK,SAAU;AACnB,2BAAK,aAAL;AACA,wBAAQ,KAAK;AAAA,cACf;AAAA,cACA,WAAW;AAAA,gBACT;AAAA,gBACA,KAAK,WACD,kCACA;AAAA,cACN;AAAA,cAEC;AAAA,qBAAK,QAAQ,oBAAC,UAAK,WAAU,QAAQ,eAAK,MAAK;AAAA,gBAChD,qBAAC,UACC;AAAA,sCAAC,UAAK,WAAU,+BAA+B,eAAK,OAAM;AAAA,kBACzD,KAAK,eACJ,oBAAC,UAAK,WAAU,gDACb,eAAK,aACR;AAAA,mBAEJ;AAAA;AAAA;AAAA,YAvBK,KAAK;AAAA,UAwBZ,CACD;AAAA,WACH;AAAA,SACF;AAAA;AAAA,EACF;AAEJ;","names":[]}