@nqlib/nqui 0.4.0 → 0.4.2

package/INSTALLATION.md

@@ -0,0 +1,215 @@
+# nqui – Installation & CLI reference
+
+Developer guide: what runs on install, available commands, and the recommended setup sequence.
+
+---
+
+## What runs on `npm install`
+
+When you add `@nqlib/nqui` to a project and run `npm install` (or pnpm/yarn/bun):
+
+1. **Postinstall script** runs: `node scripts/post-install.js` (same as `npx @nqlib/nqui setup`).
+2. **Behavior:**
+   - If your project has a `package.json` and no `nqui:init` script, a **`nqui:init`** script is added to run the full setup in one command.
+   - **Cursor rules** are written into your project’s `.cursor/` directory:
+     - `.cursor/rules/nqui-components.mdc`
+     - `.cursor/skills/nqui-install/`
+     - `.cursor/skills/nqui-components/`
+   - A **next-steps message** is printed (run `npx nqui-setup` anytime to see it again).
+3. **Not done on install:** Peer packages are not installed, `.cursor/nqui-skills/` is not created, and CSS is not set up. Run the full setup (see below) for that.
+4. **CI:** Postinstall is skipped when `CI=true` or `CI=1`.
+
+---
+
+## CLI commands
+
+All commands are run from your **project root** (where `package.json` lives).
+
+| Command | Description |
+|--------|-------------|
+| `npx @nqlib/nqui setup` | Re-run postinstall: print next steps and write Cursor rules (no peers/skills/CSS). Same as `npx nqui-setup`. |
+| `npx @nqlib/nqui install-peers` | Install `@nqlib/nqui` and all required + optional peer dependencies (icons, cmdk, dnd-kit, etc.). |
+| `npx @nqlib/nqui init-cursor` | Write `.cursor/rules` and `.cursor/skills`, and **download nqui-skills** (copy `docs/nqui-skills` → `.cursor/nqui-skills`, create `AGENTS.md`). |
+| `npx @nqlib/nqui init-skills` | Only download skills: copy to `.cursor/nqui-skills`, (re)create `AGENTS.md`. Use `--force` to overwrite. |
+| `npx @nqlib/nqui init-css` | Detect framework, create `nqui/index.css` and `nqui/nqui-setup.css`, optionally copy example layouts. Options: `--sidebar`, `--force`, `--wizard`. |
+| `npx @nqlib/nqui` _(no args)_ | Runs **init-css** with default output `nqui/index.css`. |
+| `npx @nqlib/nqui init-debug` / `init-debug-css` | Initialize debug CSS for `DebugPanel`. |
+| `npm run nqui:init` | One-shot full setup (only after install added the script): install-peers → init-cursor → init-skills → init-css --sidebar --force. |
+
+**Monorepos:** Cursor rules and skills are written to the package that has `@nqlib/nqui` in `node_modules` or in its `package.json`. Open that package folder in Cursor for skills to resolve.
+
+---
+
+## Recommended sequence
+
+### Option A: One command (after install)
+
+If postinstall added the script:
+
+```bash
+npm run nqui:init
+```
+
+This runs: **install-peers** → **init-cursor** → **init-skills** → **init-css --sidebar --force**.
+
+Then **manually** add the nqui CSS import to your main CSS file (see [Step 2: Setup CSS](#step-2-setup-css-required) below).
+
+### Option B: Step by step
+
+```bash
+# 1. Install nqui + minimal deps (or use install-peers for full)
+npm install @nqlib/nqui @hugeicons/react @hugeicons/core-free-icons
+# or: npx @nqlib/nqui install-peers
+
+# 2. Cursor rules + nqui-skills
+npx @nqlib/nqui init-cursor
+
+# 3. (Optional) Refresh skills only
+npx @nqlib/nqui init-skills
+
+# 4. CSS setup
+npx @nqlib/nqui init-css --sidebar
+# Then add the import to your main CSS (see Step 2 below)
+```
+
+---
+
+## Requirements
+
+- **React 18 or 19** (peer: `^18.0.0 || ^19.0.0`)
+- **Tailwind CSS v4**
+- **Node.js** per your framework
+
+---
+
+## Step 1: Install nqui + peers
+
+**Minimal (icons required for most components):**
+
+```bash
+npm install @nqlib/nqui @hugeicons/react @hugeicons/core-free-icons
+```
+
+**Full (all optional peers for Sortable, Carousel, DataTable, Calendar, etc.):**
+
+```bash
+npx @nqlib/nqui install-peers
+```
+
+---
+
+## Step 2: Setup CSS (required)
+
+### 2a. Run init-css
+
+```bash
+npx @nqlib/nqui init-css
+```
+
+Creates:
+
+- `nqui/index.css` — imports `@nqlib/nqui/styles`
+- `nqui/nqui-setup.css` — framework-specific Tailwind + nqui snippet
+
+### 2b. Add import to main CSS (manual)
+
+Add the nqui import to your **main CSS file**:
+
+| Framework | Main CSS file |
+|-----------|----------------|
+| Next.js   | `app/globals.css` |
+| Vite      | `src/index.css` |
+| Remix     | `app/root.css` |
+
+**Option A (recommended):** After `@import "tailwindcss"`:
+
+```css
+@import "@nqlib/nqui/styles";
+```
+
+**Option B:** Copy the **entire contents** of `nqui/nqui-setup.css` to the **very top** of your main CSS file.
+
+### 2c. Next.js + Tailwind v4
+
+Include these in your main CSS:
+
+```css
+@source "./**/*.{js,ts,jsx,tsx,mdx}";
+@source "../components/**/*.{js,ts,jsx,tsx,mdx}";
+@source "../node_modules/@nqlib/nqui/dist/**/*.js";
+```
+
+### 2d. Custom path
+
+```bash
+npx @nqlib/nqui init-css app/styles/nqui.css
+```
+
+---
+
+## Step 3: Use components
+
+```tsx
+import { Button, Input, Card } from "@nqlib/nqui";
+```
+
+Next.js App Router pages that use nqui need `"use client"`.
+
+---
+
+## Step 4: Debug tools (optional)
+
+```bash
+npx @nqlib/nqui init-debug-css
+```
+
+Then in your app:
+
+```tsx
+import { DebugPanel } from "@nqlib/nqui";
+import "./nqui-debug.css"; // or path from init-debug-css
+
+// In your root/layout: render when NODE_ENV === 'development'
+<DebugPanel />
+```
+
+---
+
+## Step 5: Cursor / IDE rules
+
+On install, basic rules are written to `.cursor/rules/nqui-components.mdc`. For the full **nqui-skills** set (`.cursor/nqui-skills/` and `AGENTS.md`), run:
+
+```bash
+npx @nqlib/nqui init-cursor
+```
+
+Component docs index: `node_modules/@nqlib/nqui/docs/components/README.md`.
+
+---
+
+## Optional: Local vs published nqui
+
+To switch between a **local** (linked) build and the **published** npm package during development, you can add a `scripts/toggle-nqui.js` script to your app and wire it to your `dev` script. This is optional and not created by nqui. See the nqui skill **nqui-local-published-toggle** for the script and usage (e.g. `USE_LOCAL_NQUI=true node scripts/toggle-nqui.js && next dev`).
+
+---
+
+## Troubleshooting
+
+**"Module not found: '@nqlib/nqui/styles'" or CSS not loading**
+
+1. Run `npx @nqlib/nqui init-css`.
+2. Add `@import "@nqlib/nqui/styles";` near the **top** of your main CSS file.
+3. Ensure it appears **before** other app styles.
+
+**Components render without styles**
+
+Your main CSS is missing the nqui import. Add `@import "@nqlib/nqui/styles";` or paste the contents of `nqui/nqui-setup.css` at the top of your main CSS.
+
+**Debug Panel not showing**
+
+- Ensure `NODE_ENV !== 'production'`.
+- Import the debug CSS and render `<DebugPanel />` in your app tree.
+
+**Package name**
+
+Use `@nqlib/nqui` (the published package name).

package/README.md

@@ -24,7 +24,8 @@ Hugeicons is required for icon display in components (Button, Accordion, Select,
 npx @nqlib/nqui install-peers
 ```
 
-**After install:** A post-install message will show the next steps. Run `npx nqui-setup` anytime to see them again.
+**After install:** A post-install message will show the next steps. Run `npx nqui-setup` anytime to see them again.  
+**Full setup & CLI reference:** See [INSTALLATION.md](./INSTALLATION.md) (what runs on install, all commands, recommended sequence).
 
 **Alternative:** Install from GitHub Packages (requires GitHub account + token):
 

package/dist/command-palette-BuYcxPCc.cjs

@@ -0,0 +1,5 @@
+"use strict";const o=require("react/jsx-runtime"),ge=require("react"),x=require("cmdk"),d=require("./utils-IjLH3w2e.cjs"),I=require("./button-CYFTFDKe.cjs"),N=require("@hugeicons/react"),_=require("@hugeicons/core-free-icons"),i=require("./index-CI756mSv.cjs"),me=require("@radix-ui/react-slot"),O=require("class-variance-authority"),j=require("./keyboard-BapbM2wb.cjs");function fe(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const a=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,a.get?a:{enumerable:!0,get:()=>e[n]})}}return t.default=e,Object.freeze(t)}const l=fe(ge);var D="Dialog",[T,xe]=i.createContextScope(D),[he,p]=T(D),S=e=>{const{__scopeDialog:t,children:n,open:a,defaultOpen:s,onOpenChange:r,modal:u=!0}=e,c=l.useRef(null),m=l.useRef(null),[h,g]=i.useControllableState({prop:a,defaultProp:s??!1,onChange:r,caller:D});return o.jsx(he,{scope:t,triggerRef:c,contentRef:m,contentId:i.useId(),titleId:i.useId(),descriptionId:i.useId(),open:h,onOpenChange:g,onOpenToggle:l.useCallback(()=>g(v=>!v),[g]),modal:u,children:n})};S.displayName=D;var A="DialogTrigger",G=l.forwardRef((e,t)=>{const{__scopeDialog:n,...a}=e,s=p(A,n),r=i.useComposedRefs(t,s.triggerRef);return o.jsx(i.Primitive.button,{type:"button","aria-haspopup":"dialog","aria-expanded":s.open,"aria-controls":s.contentId,"data-state":w(s.open),...a,ref:r,onClick:i.composeEventHandlers(e.onClick,s.onOpenToggle)})});G.displayName=A;var k="DialogPortal",[ve,M]=T(k,{forceMount:void 0}),z=e=>{const{__scopeDialog:t,forceMount:n,children:a,container:s}=e,r=p(k,t);return o.jsx(ve,{scope:t,forceMount:n,children:l.Children.map(a,u=>o.jsx(i.Presence,{present:n||r.open,children:o.jsx(i.Portal,{asChild:!0,container:s,children:u})}))})};z.displayName=k;var C="DialogOverlay",F=l.forwardRef((e,t)=>{const n=M(C,e.__scopeDialog),{forceMount:a=n.forceMount,...s}=e,r=p(C,e.__scopeDialog);return r.modal?o.jsx(i.Presence,{present:a||r.open,children:o.jsx(Ce,{...s,ref:t})}):null});F.displayName=C;var be=me.createSlot("DialogOverlay.RemoveScroll"),Ce=l.forwardRef((e,t)=>{const{__scopeDialog:n,...a}=e,s=p(C,n);return o.jsx(i.ReactRemoveScroll,{as:be,allowPinchZoom:!0,shards:[s.contentRef],children:o.jsx(i.Primitive.div,{"data-state":w(s.open),...a,ref:t,style:{pointerEvents:"auto",...a.style}})})}),f="DialogContent",W=l.forwardRef((e,t)=>{const n=M(f,e.__scopeDialog),{forceMount:a=n.forceMount,...s}=e,r=p(f,e.__scopeDialog);return o.jsx(i.Presence,{present:a||r.open,children:r.modal?o.jsx(De,{...s,ref:t}):o.jsx(ye,{...s,ref:t})})});W.displayName=f;var De=l.forwardRef((e,t)=>{const n=p(f,e.__scopeDialog),a=l.useRef(null),s=i.useComposedRefs(t,n.contentRef,a);return l.useEffect(()=>{const r=a.current;if(r)return i.hideOthers(r)},[]),o.jsx($,{...e,ref:s,trapFocus:n.open,disableOutsidePointerEvents:!0,onCloseAutoFocus:i.composeEventHandlers(e.onCloseAutoFocus,r=>{r.preventDefault(),n.triggerRef.current?.focus()}),onPointerDownOutside:i.composeEventHandlers(e.onPointerDownOutside,r=>{const u=r.detail.originalEvent,c=u.button===0&&u.ctrlKey===!0;(u.button===2||c)&&r.preventDefault()}),onFocusOutside:i.composeEventHandlers(e.onFocusOutside,r=>r.preventDefault())})}),ye=l.forwardRef((e,t)=>{const n=p(f,e.__scopeDialog),a=l.useRef(!1),s=l.useRef(!1);return o.jsx($,{...e,ref:t,trapFocus:!1,disableOutsidePointerEvents:!1,onCloseAutoFocus:r=>{e.onCloseAutoFocus?.(r),r.defaultPrevented||(a.current||n.triggerRef.current?.focus(),r.preventDefault()),a.current=!1,s.current=!1},onInteractOutside:r=>{e.onInteractOutside?.(r),r.defaultPrevented||(a.current=!0,r.detail.originalEvent.type==="pointerdown"&&(s.current=!0));const u=r.target;n.triggerRef.current?.contains(u)&&r.preventDefault(),r.detail.originalEvent.type==="focusin"&&s.current&&r.preventDefault()}})}),$=l.forwardRef((e,t)=>{const{__scopeDialog:n,trapFocus:a,onOpenAutoFocus:s,onCloseAutoFocus:r,...u}=e,c=p(f,n),m=l.useRef(null),h=i.useComposedRefs(t,m);return i.useFocusGuards(),o.jsxs(o.Fragment,{children:[o.jsx(i.FocusScope,{asChild:!0,loop:!0,trapped:a,onMountAutoFocus:s,onUnmountAutoFocus:r,children:o.jsx(i.DismissableLayer,{role:"dialog",id:c.contentId,"aria-describedby":c.descriptionId,"aria-labelledby":c.titleId,"data-state":w(c.open),...u,ref:h,onDismiss:()=>c.onOpenChange(!1)})}),o.jsxs(o.Fragment,{children:[o.jsx(Ie,{titleId:c.titleId}),o.jsx(_e,{contentRef:m,descriptionId:c.descriptionId})]})]})}),R="DialogTitle",q=l.forwardRef((e,t)=>{const{__scopeDialog:n,...a}=e,s=p(R,n);return o.jsx(i.Primitive.h2,{id:s.titleId,...a,ref:t})});q.displayName=R;var L="DialogDescription",H=l.forwardRef((e,t)=>{const{__scopeDialog:n,...a}=e,s=p(L,n);return o.jsx(i.Primitive.p,{id:s.descriptionId,...a,ref:t})});H.displayName=L;var B="DialogClose",V=l.forwardRef((e,t)=>{const{__scopeDialog:n,...a}=e,s=p(B,n);return o.jsx(i.Primitive.button,{type:"button",...a,ref:t,onClick:i.composeEventHandlers(e.onClick,()=>s.onOpenChange(!1))})});V.displayName=B;function w(e){return e?"open":"closed"}var K="DialogTitleWarning",[je,U]=i.createContext2(K,{contentName:f,titleName:R,docsSlug:"dialog"}),Ie=({titleId:e})=>{const t=U(K),n=`\`${t.contentName}\` requires a \`${t.titleName}\` for the component to be accessible for screen reader users.
+
+If you want to hide the \`${t.titleName}\`, you can wrap it with our VisuallyHidden component.
+
+For more information, see https://radix-ui.com/primitives/docs/components/${t.docsSlug}`;return l.useEffect(()=>{e&&(document.getElementById(e)||console.error(n))},[n,e]),null},Ne="DialogDescriptionWarning",_e=({contentRef:e,descriptionId:t})=>{const a=`Warning: Missing \`Description\` or \`aria-describedby={undefined}\` for {${U(Ne).contentName}}.`;return l.useEffect(()=>{const s=e.current?.getAttribute("aria-describedby");t&&s&&(document.getElementById(t)||console.warn(a))},[a,e,t]),null},Y=S,Z=G,J=z,Q=F,X=W,ee=q,te=H,y=V;function oe({...e}){return o.jsx(Y,{"data-slot":"dialog",...e})}function ke({...e}){return o.jsx(Z,{"data-slot":"dialog-trigger",...e})}function ne({...e}){return o.jsx(J,{"data-slot":"dialog-portal",...e})}function Re({...e}){return o.jsx(y,{"data-slot":"dialog-close",...e})}function ae({className:e,...t}){return o.jsx(Q,{"data-slot":"dialog-overlay",className:d.cn("data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 bg-black/80 duration-100 supports-backdrop-filter:backdrop-blur-xs fixed inset-0 isolate z-[var(--z-modal-backdrop)]",e),...t})}function re({className:e,children:t,showCloseButton:n=!0,...a}){return o.jsxs(ne,{children:[o.jsx(ae,{}),o.jsxs(X,{"data-slot":"dialog-content",className:d.cn("bg-background data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 ring-foreground/10 grid max-w-[calc(100%-2rem)] gap-4 rounded-xl p-4 text-xs ring-1 duration-100 sm:max-w-sm fixed top-1/2 left-1/2 z-[var(--z-modal)] w-full -translate-x-1/2 -translate-y-1/2",e),...a,children:[t,n&&o.jsx(y,{"data-slot":"dialog-close",asChild:!0,children:o.jsxs(I.Button,{variant:"ghost",className:"absolute top-2 right-2",size:"icon",children:[o.jsx(N.HugeiconsIcon,{icon:_.Cancel01Icon,strokeWidth:2}),o.jsx("span",{className:"sr-only",children:"Close"})]})})]})]})}function se({className:e,...t}){return o.jsx("div",{"data-slot":"dialog-header",className:d.cn("gap-1 flex flex-col",e),...t})}function we({className:e,showCloseButton:t=!1,children:n,...a}){return o.jsxs("div",{"data-slot":"dialog-footer",className:d.cn("gap-2 flex flex-col-reverse gap-2 sm:flex-row sm:justify-end",e),...a,children:[n,t&&o.jsx(y,{asChild:!0,children:o.jsx(I.Button,{variant:"outline",children:"Close"})})]})}function ie({className:e,...t}){return o.jsx(ee,{"data-slot":"dialog-title",className:d.cn("text-sm font-medium",e),...t})}function le({className:e,...t}){return o.jsx(te,{"data-slot":"dialog-description",className:d.cn("text-muted-foreground *:[a]:hover:text-foreground text-xs *:[a]:underline *:[a]:underline-offset-3",e),...t})}function de({className:e,...t}){return o.jsx("div",{"data-slot":"input-group",role:"group",className:d.cn("border-input dark:bg-input/30 has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50 has-[[data-slot][aria-invalid=true]]:ring-destructive/20 has-[[data-slot][aria-invalid=true]]:border-destructive dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40 has-disabled:bg-input/50 dark:has-disabled:bg-input/80 h-8 rounded-lg border transition-colors in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-disabled:opacity-50 has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot][aria-invalid=true]]:ring-3 has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-end]]:[&>input]:pr-1.5 has-[>[data-align=inline-start]]:[&>input]:pl-1.5 group/input-group relative flex w-full min-w-0 items-center outline-none has-[>textarea]:h-auto",e),...t})}const Pe=O.cva("text-muted-foreground h-auto gap-2 py-1.5 text-sm font-medium group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4 flex cursor-text items-center justify-center select-none",{variants:{align:{"inline-start":"pl-2 has-[>button]:ml-[-0.3rem] has-[>kbd]:ml-[-0.15rem] order-first","inline-end":"pr-2 has-[>button]:mr-[-0.3rem] has-[>kbd]:mr-[-0.15rem] order-last","block-start":"px-2.5 pt-2 group-has-[>input]/input-group:pt-2 [.border-b]:pb-2 order-first w-full justify-start","block-end":"px-2.5 pb-2 group-has-[>input]/input-group:pb-2 [.border-t]:pt-2 order-last w-full justify-start"}},defaultVariants:{align:"inline-start"}});function ce({className:e,align:t="inline-start",...n}){return o.jsx("div",{role:"group","data-slot":"input-group-addon","data-align":t,className:d.cn(Pe({align:t}),e),onClick:a=>{a.target.closest("button")||a.currentTarget.parentElement?.querySelector("input")?.focus()},...n})}const Ee=O.cva("gap-2 text-sm flex items-center shadow-none",{variants:{size:{xs:"h-6 gap-1 rounded-[calc(var(--radius)-3px)] px-1.5 [&>svg:not([class*='size-'])]:size-3.5",sm:"","icon-xs":"size-6 rounded-[calc(var(--radius)-3px)] p-0 has-[>svg]:p-0","icon-sm":"size-8 p-0 has-[>svg]:p-0"}},defaultVariants:{size:"xs"}});function Oe({className:e,type:t="button",variant:n="ghost",size:a="xs",...s}){return o.jsx(I.Button,{type:t,"data-size":a,variant:n,className:d.cn(Ee({size:a}),e),...s})}function Te({className:e,...t}){return o.jsx("span",{className:d.cn("text-muted-foreground gap-2 text-sm [&_svg:not([class*='size-'])]:size-4 flex items-center [&_svg]:pointer-events-none",e),...t})}function Se({className:e,...t}){return o.jsx("input",{"data-slot":"input-group-control",className:d.cn("flex h-7 w-full rounded-none border-0 bg-transparent px-3 py-1.5 text-sm shadow-none ring-0 outline-none file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:ring-0 focus-visible:ring-offset-0 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent dark:placeholder:text-muted-foreground/70 flex-1",e),...t})}function Ae({className:e,...t}){return o.jsx("textarea",{"data-slot":"input-group-control",className:d.cn("flex h-auto w-full min-h-[2.5rem] rounded-none resize-none border-0 bg-transparent px-3 py-1.5 text-sm shadow-none ring-0 outline-none placeholder:text-muted-foreground focus-visible:ring-0 focus-visible:ring-offset-0 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent dark:placeholder:text-muted-foreground/70",e),...t})}function ue({className:e,...t}){return o.jsx(x.Command,{"data-slot":"command",className:d.cn("bg-popover text-popover-foreground rounded-xl p-1 flex size-full flex-col overflow-hidden",e),...t})}function pe({title:e="Command Palette",description:t="Search for a command to run...",children:n,className:a,showCloseButton:s=!1,...r}){return o.jsxs(oe,{...r,children:[o.jsxs(se,{className:"sr-only",children:[o.jsx(ie,{children:e}),o.jsx(le,{children:t})]}),o.jsx(re,{className:d.cn("rounded-xl! p-0 overflow-hidden p-0",a),showCloseButton:s,children:n})]})}function Ge({className:e,...t}){return o.jsx("div",{"data-slot":"command-input-wrapper",className:"p-1 pb-0",children:o.jsxs(de,{className:"bg-input/20 dark:bg-input/30",children:[o.jsx(x.Command.Input,{"data-slot":"command-input",className:d.cn("w-full text-xs outline-hidden disabled:cursor-not-allowed disabled:opacity-50",e),...t}),o.jsx(ce,{children:o.jsx(N.HugeiconsIcon,{icon:_.SearchIcon,strokeWidth:2,className:"size-3.5 shrink-0 opacity-50"})})]})})}function Me({className:e,...t}){return o.jsx(x.Command.List,{"data-slot":"command-list",className:d.cn("no-scrollbar max-h-72 scroll-py-1 outline-none overflow-x-hidden overflow-y-auto",e),...t})}function ze({className:e,...t}){return o.jsx(x.Command.Empty,{"data-slot":"command-empty",className:d.cn("py-6 text-center text-xs",e),...t})}function Fe({className:e,...t}){return o.jsx(x.Command.Group,{"data-slot":"command-group",className:d.cn("text-foreground [&_[cmdk-group-heading]]:text-muted-foreground overflow-hidden p-1 [&_[cmdk-group-heading]]:px-2.5 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium",e),...t})}function We({className:e,...t}){return o.jsx(x.Command.Separator,{"data-slot":"command-separator",className:d.cn("bg-border/50 -mx-1 my-1 h-px",e),...t})}function $e({className:e,children:t,...n}){return o.jsxs(x.Command.Item,{"data-slot":"command-item",className:d.cn("data-selected:bg-muted data-selected:text-foreground data-selected:*:[svg]:text-foreground relative flex min-h-7 cursor-default items-center gap-2 rounded-md px-2.5 py-1.5 text-xs outline-hidden select-none [&_svg:not([class*='size-'])]:size-3.5 [[data-slot=dialog-content]_&]:rounded-md group/command-item data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",e),...n,children:[t,o.jsx(N.HugeiconsIcon,{icon:_.Tick02Icon,strokeWidth:2,className:"ml-auto opacity-0 group-has-[[data-slot=command-shortcut]]/command-item:hidden group-data-[checked=true]/command-item:opacity-100"})]})}function qe({className:e,...t}){return o.jsx("span",{"data-slot":"command-shortcut",className:d.cn("text-muted-foreground group-data-selected/command-item:text-foreground ml-auto text-[0.625rem] tracking-widest",e),...t})}function Le({title:e="Command Palette",description:t="Search for a command to run...",shortcutEnabled:n=!0,open:a,onOpenChange:s,children:r,...u}){const[c,m]=l.useState(!1),h=a!==void 0,g=h?a:c,v=h?s:m,P=l.useRef(g);return l.useEffect(()=>{P.current=g},[g]),l.useEffect(()=>{if(!n)return;const E=b=>{j.shouldIgnoreKeyboardShortcut(b.target)||b.key===j.SHORTCUT_KEYS.commandPalette&&j.isMod(b)&&(b.preventDefault(),v?.(!P.current))};return window.addEventListener("keydown",E),()=>window.removeEventListener("keydown",E)},[n,v]),o.jsx(pe,{...u,title:e,description:t,open:g,onOpenChange:v,children:o.jsx(ue,{children:r})})}exports.Close=y;exports.Command=ue;exports.CommandDialog=pe;exports.CommandEmpty=ze;exports.CommandGroup=Fe;exports.CommandInput=Ge;exports.CommandItem=$e;exports.CommandList=Me;exports.CommandPalette=Le;exports.CommandSeparator=We;exports.CommandShortcut=qe;exports.Content=X;exports.Description=te;exports.Dialog=oe;exports.DialogClose=Re;exports.DialogContent=re;exports.DialogDescription=le;exports.DialogFooter=we;exports.DialogHeader=se;exports.DialogOverlay=ae;exports.DialogPortal=ne;exports.DialogTitle=ie;exports.DialogTrigger=ke;exports.InputGroup=de;exports.InputGroupAddon=ce;exports.InputGroupButton=Oe;exports.InputGroupInput=Se;exports.InputGroupText=Te;exports.InputGroupTextarea=Ae;exports.Overlay=Q;exports.Portal=J;exports.Root=Y;exports.Title=ee;exports.Trigger=Z;exports.WarningProvider=je;exports.createDialogScope=xe;