@particle-academy/react-fancy 5.51.1 → 5.52.0

package/dist/chunk-5DG4CAWS.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Table/Table.context.ts","../src/components/Table/TableHead.tsx","../src/components/Table/TableBody.tsx","../src/components/Table/TableRow.tsx","../src/components/Table/TableCell.tsx","../src/components/Table/TableColumn.tsx","../src/components/Table/TablePagination.tsx","../src/components/Table/TableSearch.tsx","../src/components/Table/TableTray.tsx","../src/components/Table/TableRowTray.tsx","../src/components/Table/Table.tsx"],"names":["jsx","jsxs","Fragment"],"mappings":";;;;;AAGO,IAAM,YAAA,GAAe,cAAwC,IAAI,CAAA;AAEjE,SAAS,QAAA,GAA8B;AAC5C,EAAA,MAAM,GAAA,GAAM,WAAW,YAAY,CAAA;AACnC,EAAA,IAAI,CAAC,GAAA,EAAK;AACR,IAAA,MAAM,IAAI,MAAM,uDAAuD,CAAA;AAAA,EACzE;AACA,EAAA,OAAO,GAAA;AACT;ACRO,SAAS,UAAU,EAAE,QAAA,EAAU,SAAA,EAAW,GAAG,MAAK,EAAmB;AAC1E,EAAA,uBACE,GAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,6BAAA,EAA4B,EAAA;AAAA,MAC5B,SAAA,EAAW,EAAA,CAAG,sIAAA,EAAwI,SAAS,CAAA;AAAA,MAE9J;AAAA;AAAA,GACH;AAEJ;ACVO,SAAS,UAAU,EAAE,QAAA,EAAU,SAAA,EAAW,GAAG,MAAK,EAAmB;AAC1E,EAAA,uBACEA,GAAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,6BAAA,EAA4B,EAAA;AAAA,MAC5B,SAAA,EAAW,EAAA,CAAG,+CAAA,EAAiD,SAAS,CAAA;AAAA,MAEvE;AAAA;AAAA,GACH;AAEJ;ACTO,SAAS,QAAA,CAAS;AAAA,EACvB,QAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA,IAAA;AAAA,EACA,mBAAA,GAAsB,KAAA;AAAA,EACtB,QAAA,EAAU,kBAAA;AAAA,EACV,eAAA,GAAkB,KAAA;AAAA,EAClB,gBAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAkB;AAChB,EAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAI,oBAAA;AAAA,IAC9B,kBAAA;AAAA,IACA,eAAA;AAAA,IACA;AAAA,GACF;AAEA,EAAA,MAAM,UAAU,IAAA,IAAQ,IAAA;AACxB,EAAA,MAAM,WAAA,GAAc,WAAW,mBAAA,KAAwB,QAAA;AAEvD,EAAA,MAAM,cAAc,WAAA,mBAClBA,IAAC,IAAA,EAAA,EAAG,SAAA,EAAU,YACZ,QAAA,kBAAAA,GAAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAK,QAAA;AAAA,MACL,OAAA,EAAS,CAAC,CAAA,KAAM;AACd,QAAA,CAAA,CAAE,eAAA,EAAgB;AAClB,QAAA,WAAA,CAAY,CAAC,QAAQ,CAAA;AAAA,MACvB,CAAA;AAAA,MACA,SAAA,EAAU,iVAAA;AAAA,MACV,YAAA,EAAY,WAAW,cAAA,GAAiB,YAAA;AAAA,MAExC,QAAA,kBAAAA,GAAAA;AAAA,QAAC,KAAA;AAAA,QAAA;AAAA,UACC,SAAA,EAAW,EAAA;AAAA,YACT,2CAAA;AAAA,YACA,QAAA,IAAY;AAAA,WACd;AAAA,UACA,IAAA,EAAK,MAAA;AAAA,UACL,OAAA,EAAQ,WAAA;AAAA,UACR,MAAA,EAAO,cAAA;AAAA,UACP,WAAA,EAAa,CAAA;AAAA,UAEb,QAAA,kBAAAA,IAAC,MAAA,EAAA,EAAK,aAAA,EAAc,SAAQ,cAAA,EAAe,OAAA,EAAQ,GAAE,cAAA,EAAe;AAAA;AAAA;AACtE;AAAA,KAEJ,CAAA,GACE,IAAA;AAEJ,EAAA,uBACE,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAA,IAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACE,GAAG,IAAA;AAAA,QACJ,4BAAA,EAA2B,EAAA;AAAA,QAC3B,SAAA,EAAW,EAAA;AAAA,UACT,8DAAA;AAAA,UACA,OAAA,IAAW,gBAAA;AAAA,UACX;AAAA,SACF;AAAA,QACA,OAAA;AAAA,QAEC,QAAA,EAAA;AAAA,UAAA,mBAAA,KAAwB,OAAA,IAAW,WAAA;AAAA,UACnC,QAAA;AAAA,UACA,wBAAwB,KAAA,IAAS;AAAA;AAAA;AAAA,KACpC;AAAA,IACC,OAAA,IAAW,QAAA,oBACVA,GAAAA,CAAC,IAAA,EAAA,EAAG,SAAA,EAAU,mCAAA,EACZ,QAAA,kBAAAA,GAAAA,CAAC,IAAA,EAAA,EAAG,OAAA,EAAS,GAAA,EACV,gBACH,CAAA,EACF;AAAA,GAAA,EAEJ,CAAA;AAEJ;ACzEO,SAAS,UAAU,EAAE,QAAA,EAAU,WAAW,MAAA,EAAQ,GAAG,MAAK,EAAmB;AAClF,EAAA,MAAM,GAAA,GAAM,SAAS,IAAA,GAAO,IAAA;AAC5B,EAAA,uBACEA,GAAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACC,6BAAA,EAA4B,EAAA;AAAA,MAC5B,SAAA,EAAW,EAAA;AAAA,QACT,mBAAA;AAAA,QACA,MAAA,IAAU,uJAAA;AAAA,QACV;AAAA,OACF;AAAA,MACC,GAAG,IAAA;AAAA,MAEH;AAAA;AAAA,GACH;AAEJ;ACdO,SAAS,WAAA,CAAY;AAAA,EAC1B,KAAA;AAAA,EACA,OAAA;AAAA,EACA,SAAA;AAAA,EACA,WAAA,EAAa,YAAA;AAAA,EACb,OAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAqB;AACnB,EAAA,MAAM,EAAE,OAAA,EAAS,WAAA,EAAa,OAAA,EAAS,UAAA,KAAe,QAAA,EAAS;AAC/D,EAAA,MAAM,QAAA,GAAW,OAAA,IAAW,IAAA,IAAQ,WAAA,KAAgB,OAAA;AAiBpD,EAAA,MAAM,QAAA,GACJ,iBAAiB,OAAA,IAAW,IAAA,GAAO,SAAY,QAAA,GAAY,OAAA,KAAY,KAAA,GAAQ,WAAA,GAAc,YAAA,GAAgB,MAAA,CAAA;AAE/G,EAAA,uBACEA,GAAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,+BAAA,EAA8B,EAAA;AAAA,MAC9B,WAAA,EAAW,QAAA;AAAA,MACX,SAAA,EAAW,EAAA;AAAA,QACT,yKAAA;AAAA,QACA,OAAA,IAAW,4BAAA;AAAA,QACX;AAAA,OACF;AAAA,MACA,OAAA,EACE,OAAA,IAAW,OAAA,GACP,CAAC,KAAA,KAAU;AAIT,QAAA,OAAA,GAAU,KAAK,CAAA;AACf,QAAA,IAAI,OAAA,EAAS;AACX,UAAA,UAAA,CAAW,OAAO,CAAA;AAAA,QACpB;AAAA,MACF,CAAA,GACA,MAAA;AAAA,MAGN,QAAA,kBAAAC,IAAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,gCAAA,EACb,QAAA,EAAA;AAAA,QAAA,KAAA;AAAA,QACA,QAAA,oBACCD,GAAAA,CAAC,MAAA,EAAA,EAAK,aAAA,EAAY,MAAA,EAAO,SAAA,EAAU,SAAA,EAChC,QAAA,EAAA,OAAA,KAAY,KAAA,GAAQ,QAAA,GAAM,QAAA,EAC7B;AAAA,OAAA,EAEJ;AAAA;AAAA,GACF;AAEJ;AC/DO,SAAS,eAAA,CAAgB;AAAA,EAC9B,SAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA,GAAW;AACb,CAAA,EAAyB;AACvB,EAAA,MAAM,EAAE,IAAA,EAAM,OAAA,EAAQ,GAAI,QAAA,EAAS;AACnC,EAAA,MAAM,UAAA,GAAa,IAAA,CAAK,IAAA,CAAK,KAAA,GAAQ,QAAQ,CAAA;AAE7C,EAAA,IAAI,UAAA,IAAc,GAAG,OAAO,IAAA;AAE5B,EAAA,uBACEC,KAAC,KAAA,EAAA,EAAI,mCAAA,EAAkC,IAAG,SAAA,EAAW,EAAA,CAAG,qDAAA,EAAuD,SAAS,CAAA,EACtH,QAAA,EAAA;AAAA,oBAAAA,IAAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,eAAA,EAAgB,QAAA,EAAA;AAAA,MAAA,OAAA;AAAA,MACxB,IAAA,GAAO,CAAA;AAAA,MAAE,MAAA;AAAA,MAAK;AAAA,KAAA,EACtB,CAAA;AAAA,oBACAA,IAAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,YAAA,EACb,QAAA,EAAA;AAAA,sBAAAD,GAAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UACC,IAAA,EAAK,QAAA;AAAA,UACL,UAAU,IAAA,KAAS,CAAA;AAAA,UACnB,OAAA,EAAS,MAAM,OAAA,CAAQ,IAAA,GAAO,CAAC,CAAA;AAAA,UAC/B,SAAA,EAAU,mEAAA;AAAA,UACX,QAAA,EAAA;AAAA;AAAA,OAED;AAAA,sBACAA,GAAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UACC,IAAA,EAAK,QAAA;AAAA,UACL,QAAA,EAAU,QAAQ,UAAA,GAAa,CAAA;AAAA,UAC/B,OAAA,EAAS,MAAM,OAAA,CAAQ,IAAA,GAAO,CAAC,CAAA;AAAA,UAC/B,SAAA,EAAU,mEAAA;AAAA,UACX,QAAA,EAAA;AAAA;AAAA;AAED,KAAA,EACF;AAAA,GAAA,EACF,CAAA;AAEJ;ACnCO,SAAS,WAAA,CAAY;AAAA,EAC1B,SAAA;AAAA,EACA,WAAA,GAAc;AAChB,CAAA,EAAqB;AACnB,EAAA,MAAM,EAAE,WAAA,EAAa,cAAA,EAAe,GAAI,QAAA,EAAS;AAEjD,EAAA,uBACEA,GAAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACC,+BAAA,EAA8B,EAAA;AAAA,MAC9B,IAAA,EAAK,MAAA;AAAA,MACL,KAAA,EAAO,WAAA;AAAA,MACP,UAAU,CAAC,CAAA,KAAM,cAAA,CAAe,CAAA,CAAE,OAAO,KAAK,CAAA;AAAA,MAC9C,WAAA;AAAA,MACA,SAAA,EAAW,EAAA;AAAA,QACT,2FAAA;AAAA,QACA;AAAA;AACF;AAAA,GACF;AAEJ;ACpBO,SAAS,SAAA,CAAU,EAAE,QAAA,EAAU,SAAA,EAAU,EAAmB;AACjE,EAAA,uBACEA,GAAAA,CAAC,KAAA,EAAA,EAAI,6BAAA,EAA4B,EAAA,EAAG,WAAW,EAAA,CAAG,6CAAA,EAA+C,SAAS,CAAA,EACvG,QAAA,EACH,CAAA;AAEJ;ACNO,SAAS,YAAA,CAAa,EAAE,QAAA,EAAU,SAAA,EAAU,EAAsB;AACvE,EAAA,uBACEA,GAAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,iCAAA,EAAgC,EAAA;AAAA,MAChC,SAAA,EAAW,EAAA;AAAA,QACT,gJAAA;AAAA,QACA;AAAA,OACF;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ;ACAA,SAAS,UAAU,EAAE,QAAA,EAAU,SAAA,EAAW,GAAG,MAAK,EAAe;AAC/D,EAAA,MAAM,CAAC,OAAA,EAAS,UAAU,CAAA,GAAI,SAAwB,IAAI,CAAA;AAC1D,EAAA,MAAM,CAAC,OAAA,EAAS,UAAU,CAAA,GAAI,SAAyB,KAAK,CAAA;AAC5D,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,SAAS,CAAC,CAAA;AAClC,EAAA,MAAM,CAAC,WAAA,EAAa,cAAc,CAAA,GAAI,SAAS,EAAE,CAAA;AAEjD,EAAA,MAAM,UAAA,GAAa,WAAA;AAAA,IACjB,CAAC,GAAA,KAAgB;AACf,MAAA,IAAI,YAAY,GAAA,EAAK;AACnB,QAAA,UAAA,CAAW,CAAC,CAAA,KAAO,CAAA,KAAM,KAAA,GAAQ,SAAS,KAAM,CAAA;AAAA,MAClD,CAAA,MAAO;AACL,QAAA,UAAA,CAAW,GAAG,CAAA;AACd,QAAA,UAAA,CAAW,KAAK,CAAA;AAAA,MAClB;AAAA,IACF,CAAA;AAAA,IACA,CAAC,OAAO;AAAA,GACV;AAEA,EAAA,MAAM,GAAA,GAAM,OAAA;AAAA,IACV,OAAO;AAAA,MACL,OAAA;AAAA,MACA,OAAA;AAAA,MACA,UAAA;AAAA,MACA,IAAA;AAAA,MACA,OAAA;AAAA,MACA,QAAA,EAAU,EAAA;AAAA,MACV,SAAA,EAAW,CAAA;AAAA,MACX,WAAA;AAAA,MACA;AAAA,KACF,CAAA;AAAA,IACA,CAAC,OAAA,EAAS,OAAA,EAAS,UAAA,EAAY,MAAM,WAAW;AAAA,GAClD;AAEA,EAAA,uBACEA,GAAAA,CAAC,YAAA,CAAa,UAAb,EAAsB,KAAA,EAAO,KAC5B,QAAA,kBAAAA,GAAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,wBAAA,EAAuB,EAAA;AAAA,MACvB,SAAA,EAAW,EAAA,CAAG,+JAAA,EAAiK,SAAS,CAAA;AAAA,MAEvL,6BAAmB,QAAQ;AAAA;AAAA,GAC9B,EACF,CAAA;AAEJ;AAEA,SAAS,mBAAmB,QAAA,EAAgC;AAC1D,EAAA,MAAM,SAAsB,EAAC;AAC7B,EAAA,MAAM,SAAsB,EAAC;AAC7B,EAAA,MAAM,QAAqB,EAAC;AAC5B,EAAA,IAAI,gBAAA,GAAmB,KAAA;AAEvB,EAAA,QAAA,CAAS,OAAA,CAAQ,QAAA,EAAU,CAAC,KAAA,KAAU;AACpC,IAAA,IAAI,cAAA,CAAe,KAAK,CAAA,KAAM,KAAA,CAAM,SAAS,SAAA,IAAa,KAAA,CAAM,SAAS,SAAA,CAAA,EAAY;AACnF,MAAA,MAAA,CAAO,KAAK,KAAK,CAAA;AACjB,MAAA,gBAAA,GAAmB,IAAA;AACnB,MAAA;AAAA,IACF;AACA,IAAA,CAAC,gBAAA,GAAmB,KAAA,GAAQ,MAAA,EAAQ,IAAA,CAAK,KAAK,CAAA;AAAA,EAChD,CAAC,CAAA;AAED,EAAA,uBACEC,IAAAA,CAAAC,QAAAA,EAAA,EACG,QAAA,EAAA;AAAA,IAAA,MAAA;AAAA,IACA,MAAA,CAAO,SAAS,CAAA,oBAAKF,IAAC,OAAA,EAAA,EAAM,SAAA,EAAU,0BAA0B,QAAA,EAAA,MAAA,EAAO,CAAA;AAAA,IACvE;AAAA,GAAA,EACH,CAAA;AAEJ;AAEO,IAAM,KAAA,GAAQ,MAAA,CAAO,MAAA,CAAO,SAAA,EAAW;AAAA,EAC5C,IAAA,EAAM,SAAA;AAAA,EACN,IAAA,EAAM,SAAA;AAAA,EACN,GAAA,EAAK,QAAA;AAAA,EACL,IAAA,EAAM,SAAA;AAAA,EACN,MAAA,EAAQ,WAAA;AAAA,EACR,UAAA,EAAY,eAAA;AAAA,EACZ,MAAA,EAAQ,WAAA;AAAA,EACR,IAAA,EAAM,SAAA;AAAA,EACN,OAAA,EAAS;AACX,CAAC","file":"chunk-5DG4CAWS.js","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { TableContextValue } from \"./Table.types\";\n\nexport const TableContext = createContext<TableContextValue | null>(null);\n\nexport function useTable(): TableContextValue {\n  const ctx = useContext(TableContext);\n  if (!ctx) {\n    throw new Error(\"Table compound components must be used within <Table>\");\n  }\n  return ctx;\n}\n","import { cn } from \"../../utils/cn\";\nimport type { TableHeadProps } from \"./Table.types\";\n\nexport function TableHead({ children, className, ...rest }: TableHeadProps) {\n  return (\n    <thead\n      {...rest}\n      data-react-fancy-table-head=\"\"\n      className={cn(\"border-b border-[color:var(--fancy-border,var(--color-zinc-200))] dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))]\", className)}\n    >\n      {children}\n    </thead>\n  );\n}\n","import { cn } from \"../../utils/cn\";\nimport type { TableBodyProps } from \"./Table.types\";\n\nexport function TableBody({ children, className, ...rest }: TableBodyProps) {\n  return (\n    <tbody\n      {...rest}\n      data-react-fancy-table-body=\"\"\n      className={cn(\"divide-y divide-zinc-100 dark:divide-zinc-800\", className)}\n    >\n      {children}\n    </tbody>\n  );\n}\n","import { cn } from \"../../utils/cn\";\nimport { useControllableState } from \"../../hooks/use-controllable-state\";\nimport type { TableRowProps } from \"./Table.types\";\n\nexport function TableRow({\n  children,\n  className,\n  onClick,\n  tray,\n  trayTriggerPosition = \"end\",\n  expanded: controlledExpanded,\n  defaultExpanded = false,\n  onExpandedChange,\n  ...rest\n}: TableRowProps) {\n  const [expanded, setExpanded] = useControllableState(\n    controlledExpanded,\n    defaultExpanded,\n    onExpandedChange,\n  );\n\n  const hasTray = tray != null;\n  const showTrigger = hasTray && trayTriggerPosition !== \"hidden\";\n\n  const triggerCell = showTrigger ? (\n    <td className=\"w-8 px-2\">\n      <button\n        type=\"button\"\n        onClick={(e) => {\n          e.stopPropagation();\n          setExpanded(!expanded);\n        }}\n        className=\"inline-flex items-center justify-center rounded p-1 text-[color:var(--fancy-text-faint,var(--color-zinc-400))] transition-colors hover:text-[color:var(--fancy-text-soft,var(--color-zinc-700))] dark:text-[color:var(--fancy-text-faint-dark,var(--color-zinc-500))] dark:hover:text-[color:var(--fancy-text-soft-dark,var(--color-zinc-300))]\"\n        aria-label={expanded ? \"Collapse row\" : \"Expand row\"}\n      >\n        <svg\n          className={cn(\n            \"h-4 w-4 transition-transform duration-200\",\n            expanded && \"rotate-90\",\n          )}\n          fill=\"none\"\n          viewBox=\"0 0 24 24\"\n          stroke=\"currentColor\"\n          strokeWidth={2}\n        >\n          <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M9 5l7 7-7 7\" />\n        </svg>\n      </button>\n    </td>\n  ) : null;\n\n  return (\n    <>\n      <tr\n        {...rest}\n        data-react-fancy-table-row=\"\"\n        className={cn(\n          \"transition-colors hover:bg-zinc-50 dark:hover:bg-zinc-800/50\",\n          onClick && \"cursor-pointer\",\n          className,\n        )}\n        onClick={onClick}\n      >\n        {trayTriggerPosition === \"start\" && triggerCell}\n        {children}\n        {trayTriggerPosition === \"end\" && triggerCell}\n      </tr>\n      {hasTray && expanded && (\n        <tr className=\"bg-zinc-50/50 dark:bg-zinc-800/30\">\n          <td colSpan={999}>\n            {tray}\n          </td>\n        </tr>\n      )}\n    </>\n  );\n}\n","import { cn } from \"../../utils/cn\";\nimport type { TableCellProps } from \"./Table.types\";\n\nexport function TableCell({ children, className, header, ...rest }: TableCellProps) {\n  const Tag = header ? \"th\" : \"td\";\n  return (\n    <Tag\n      data-react-fancy-table-cell=\"\"\n      className={cn(\n        \"px-4 py-3 text-sm\",\n        header && \"text-left font-medium text-[color:var(--fancy-text-muted,var(--color-zinc-500))] dark:text-[color:var(--fancy-text-muted-dark,var(--color-zinc-400))]\",\n        className,\n      )}\n      {...rest}\n    >\n      {children}\n    </Tag>\n  );\n}\n","import { cn } from \"../../utils/cn\";\nimport { useTable } from \"./Table.context\";\nimport type { TableColumnProps } from \"./Table.types\";\n\nexport function TableColumn({\n  label,\n  sortKey,\n  className,\n  \"aria-sort\": ariaSortProp,\n  onClick,\n  ...rest\n}: TableColumnProps) {\n  const { sortKey: currentSort, sortDir, toggleSort } = useTable();\n  const isSorted = sortKey != null && currentSort === sortKey;\n\n  /**\n   * Announce the sort state to anyone who cannot see the arrow.\n   *\n   * The component already computed `isSorted` and `sortDir` and spent both on a\n   * ▲/▼ glyph, so a sortable table sounded exactly like a static one and\n   * activating a header produced no feedback at all.\n   *\n   * `\"none\"` is deliberate and is not the same as omitting the attribute: it\n   * says \"this column sorts, but is not the current key\". A non-sortable header\n   * gets nothing, because claiming otherwise invites someone to activate an\n   * inert control.\n   *\n   * An explicit `aria-sort` from the caller wins — a server-sorted table knows\n   * its own state and this component does not.\n   */\n  const ariaSort =\n    ariaSortProp ?? (sortKey == null ? undefined : isSorted ? (sortDir === \"asc\" ? \"ascending\" : \"descending\") : \"none\");\n\n  return (\n    <th\n      {...rest}\n      data-react-fancy-table-column=\"\"\n      aria-sort={ariaSort}\n      className={cn(\n        \"px-4 py-3 text-left text-sm font-medium text-[color:var(--fancy-text-muted,var(--color-zinc-500))] dark:text-[color:var(--fancy-text-muted-dark,var(--color-zinc-400))]\",\n        sortKey && \"cursor-pointer select-none\",\n        className,\n      )}\n      onClick={\n        sortKey || onClick\n          ? (event) => {\n              // Both, in this order. Dropping the caller's handler because the\n              // column happens to sort would be the same silent-prop-loss bug\n              // this file just fixed one attribute over.\n              onClick?.(event);\n              if (sortKey) {\n                toggleSort(sortKey);\n              }\n            }\n          : undefined\n      }\n    >\n      <span className=\"inline-flex items-center gap-1\">\n        {label}\n        {isSorted && (\n          <span aria-hidden=\"true\" className=\"text-xs\">\n            {sortDir === \"asc\" ? \"▲\" : \"▼\"}\n          </span>\n        )}\n      </span>\n    </th>\n  );\n}\n","import { cn } from \"../../utils/cn\";\nimport { useTable } from \"./Table.context\";\nimport type { TablePaginationProps } from \"./Table.types\";\n\nexport function TablePagination({\n  className,\n  total,\n  pageSize = 10,\n}: TablePaginationProps) {\n  const { page, setPage } = useTable();\n  const totalPages = Math.ceil(total / pageSize);\n\n  if (totalPages <= 1) return null;\n\n  return (\n    <div data-react-fancy-table-pagination=\"\" className={cn(\"flex items-center justify-between px-4 py-3 text-sm\", className)}>\n      <span className=\"text-zinc-500\">\n        Page {page + 1} of {totalPages}\n      </span>\n      <div className=\"flex gap-1\">\n        <button\n          type=\"button\"\n          disabled={page === 0}\n          onClick={() => setPage(page - 1)}\n          className=\"rounded border px-2 py-1 disabled:opacity-50 dark:border-zinc-600\"\n        >\n          Prev\n        </button>\n        <button\n          type=\"button\"\n          disabled={page >= totalPages - 1}\n          onClick={() => setPage(page + 1)}\n          className=\"rounded border px-2 py-1 disabled:opacity-50 dark:border-zinc-600\"\n        >\n          Next\n        </button>\n      </div>\n    </div>\n  );\n}\n","import { cn } from \"../../utils/cn\";\nimport { useTable } from \"./Table.context\";\nimport type { TableSearchProps } from \"./Table.types\";\n\nexport function TableSearch({\n  className,\n  placeholder = \"Search...\",\n}: TableSearchProps) {\n  const { searchQuery, setSearchQuery } = useTable();\n\n  return (\n    <input\n      data-react-fancy-table-search=\"\"\n      type=\"text\"\n      value={searchQuery}\n      onChange={(e) => setSearchQuery(e.target.value)}\n      placeholder={placeholder}\n      className={cn(\n        \"rounded-lg border border-zinc-200 px-3 py-2 text-sm dark:border-zinc-600 dark:bg-zinc-800\",\n        className,\n      )}\n    />\n  );\n}\n","import { cn } from \"../../utils/cn\";\nimport type { TableTrayProps } from \"./Table.types\";\n\nexport function TableTray({ children, className }: TableTrayProps) {\n  return (\n    <div data-react-fancy-table-tray=\"\" className={cn(\"flex items-center justify-between px-4 py-3\", className)}>\n      {children}\n    </div>\n  );\n}\n","import { cn } from \"../../utils/cn\";\nimport type { TableRowTrayProps } from \"./Table.types\";\n\nexport function TableRowTray({ children, className }: TableRowTrayProps) {\n  return (\n    <div\n      data-react-fancy-table-row-tray=\"\"\n      className={cn(\n        \"border-t border-[color:var(--fancy-border,var(--color-zinc-200))] px-4 py-3 dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))]\",\n        className,\n      )}\n    >\n      {children}\n    </div>\n  );\n}\n","import { Children, isValidElement, useCallback, useMemo, useState } from \"react\";\nimport type { ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { TableContext } from \"./Table.context\";\nimport { TableHead } from \"./TableHead\";\nimport { TableBody } from \"./TableBody\";\nimport { TableRow } from \"./TableRow\";\nimport { TableCell } from \"./TableCell\";\nimport { TableColumn } from \"./TableColumn\";\nimport { TablePagination } from \"./TablePagination\";\nimport { TableSearch } from \"./TableSearch\";\nimport { TableTray } from \"./TableTray\";\nimport { TableRowTray } from \"./TableRowTray\";\nimport type { TableProps, TableContextValue } from \"./Table.types\";\n\nfunction TableRoot({ children, className, ...rest }: TableProps) {\n  const [sortKey, setSortKey] = useState<string | null>(null);\n  const [sortDir, setSortDir] = useState<\"asc\" | \"desc\">(\"asc\");\n  const [page, setPage] = useState(0);\n  const [searchQuery, setSearchQuery] = useState(\"\");\n\n  const toggleSort = useCallback(\n    (key: string) => {\n      if (sortKey === key) {\n        setSortDir((d) => (d === \"asc\" ? \"desc\" : \"asc\"));\n      } else {\n        setSortKey(key);\n        setSortDir(\"asc\");\n      }\n    },\n    [sortKey],\n  );\n\n  const ctx = useMemo<TableContextValue>(\n    () => ({\n      sortKey,\n      sortDir,\n      toggleSort,\n      page,\n      setPage,\n      pageSize: 10,\n      totalRows: 0,\n      searchQuery,\n      setSearchQuery,\n    }),\n    [sortKey, sortDir, toggleSort, page, searchQuery],\n  );\n\n  return (\n    <TableContext.Provider value={ctx}>\n      <div\n        {...rest}\n        data-react-fancy-table=\"\"\n        className={cn(\"overflow-hidden rounded-lg border border-[color:var(--fancy-border,var(--color-zinc-200))] dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))]\", className)}\n      >\n        {splitTableChildren(children)}\n      </div>\n    </TableContext.Provider>\n  );\n}\n\nfunction splitTableChildren(children: ReactNode): ReactNode {\n  const before: ReactNode[] = [];\n  const inside: ReactNode[] = [];\n  const after: ReactNode[] = [];\n  let seenTableContent = false;\n\n  Children.forEach(children, (child) => {\n    if (isValidElement(child) && (child.type === TableHead || child.type === TableBody)) {\n      inside.push(child);\n      seenTableContent = true;\n      return;\n    }\n    (seenTableContent ? after : before).push(child);\n  });\n\n  return (\n    <>\n      {before}\n      {inside.length > 0 && <table className=\"w-full border-collapse\">{inside}</table>}\n      {after}\n    </>\n  );\n}\n\nexport const Table = Object.assign(TableRoot, {\n  Head: TableHead,\n  Body: TableBody,\n  Row: TableRow,\n  Cell: TableCell,\n  Column: TableColumn,\n  Pagination: TablePagination,\n  Search: TableSearch,\n  Tray: TableTray,\n  RowTray: TableRowTray,\n});\n"]}

package/dist/{chunk-GU5BYZTR.cjs → chunk-5H6IUCOD.cjs}

@@ -24,17 +24,17 @@ function DrawerHeader({ children, closable = true, className }) {
     {
       "data-react-fancy-drawer-header": "",
       className: chunkZU5Q77OT_cjs.cn(
-        "flex shrink-0 items-center justify-between border-b border-zinc-200 px-4 py-3 dark:border-zinc-700",
+        "flex shrink-0 items-center justify-between border-b border-[color:var(--fancy-border,var(--color-zinc-200))] px-4 py-3 dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))]",
         className
       ),
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm font-semibold text-zinc-900 dark:text-zinc-100", children }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm font-semibold text-[color:var(--fancy-text,var(--color-zinc-900))] dark:text-[color:var(--fancy-text-dark,var(--color-zinc-100))]", children }),
         closable ? /* @__PURE__ */ jsxRuntime.jsx(
           "button",
           {
             type: "button",
             onClick: close,
-            className: "rounded-lg p-1 text-zinc-400 transition-colors hover:bg-zinc-100 hover:text-zinc-600 dark:hover:bg-zinc-800 dark:hover:text-zinc-300",
+            className: "rounded-lg p-1 text-zinc-400 transition-colors hover:bg-[color:var(--fancy-surface-muted,var(--color-zinc-100))] hover:text-zinc-600 dark:hover:bg-[color:var(--fancy-surface-muted-dark,var(--color-zinc-800))] dark:hover:text-zinc-300",
             "aria-label": "Close",
             children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { size: 18 })
           }
@@ -49,7 +49,7 @@ function DrawerBody({ children, className }) {
     "div",
     {
       "data-react-fancy-drawer-body": "",
-      className: chunkZU5Q77OT_cjs.cn("min-h-0 flex-1 overflow-auto px-4 py-3 text-zinc-700 dark:text-zinc-300", className),
+      className: chunkZU5Q77OT_cjs.cn("min-h-0 flex-1 overflow-auto px-4 py-3 text-[color:var(--fancy-text-soft,var(--color-zinc-700))] dark:text-[color:var(--fancy-text-soft-dark,var(--color-zinc-300))]", className),
       children
     }
   );
@@ -61,7 +61,7 @@ function DrawerFooter({ children, className }) {
     {
       "data-react-fancy-drawer-footer": "",
       className: chunkZU5Q77OT_cjs.cn(
-        "flex shrink-0 items-center justify-end gap-2 border-t border-zinc-200 px-4 py-3 dark:border-zinc-700",
+        "flex shrink-0 items-center justify-end gap-2 border-t border-[color:var(--fancy-border,var(--color-zinc-200))] px-4 py-3 dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))]",
         className
       ),
       children
@@ -185,7 +185,7 @@ function DrawerRoot({
             "aria-modal": isViewport || void 0,
             ...rest,
             className: chunkZU5Q77OT_cjs.cn(
-              "pointer-events-auto absolute flex flex-col border-zinc-200 bg-white shadow-xl dark:border-zinc-700 dark:bg-zinc-900",
+              "pointer-events-auto absolute flex flex-col border-[color:var(--fancy-border,var(--color-zinc-200))] bg-[color:var(--fancy-surface,var(--color-white))] shadow-xl dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))] dark:bg-[color:var(--fancy-surface-dark,var(--color-zinc-900))]",
               ANCHOR[side],
               EDGE[side],
               horizontal ? WIDTH[size] : HEIGHT[size],
@@ -214,5 +214,5 @@ var Drawer = Object.assign(DrawerRoot, {
 
 exports.Drawer = Drawer;
 exports.useDrawer = useDrawer;
-//# sourceMappingURL=chunk-GU5BYZTR.cjs.map
-//# sourceMappingURL=chunk-GU5BYZTR.cjs.map
+//# sourceMappingURL=chunk-5H6IUCOD.cjs.map
+//# sourceMappingURL=chunk-5H6IUCOD.cjs.map

package/dist/chunk-5H6IUCOD.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Drawer/Drawer.context.ts","../src/components/Drawer/DrawerHeader.tsx","../src/components/Drawer/DrawerBody.tsx","../src/components/Drawer/DrawerFooter.tsx","../src/components/Drawer/DrawerContainer.tsx","../src/components/Drawer/Drawer.tsx"],"names":["createContext","useContext","jsxs","cn","jsx","X","useRef","useCallback","useEscapeKey","useFocusTrap","useEffect","useAnimation","useMemo","Portal"],"mappings":"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","file":"chunk-5H6IUCOD.cjs","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { DrawerContextValue } from \"./Drawer.types\";\n\nexport const DrawerContext = createContext<DrawerContextValue | null>(null);\n\nexport function useDrawer(): DrawerContextValue {\n  const ctx = useContext(DrawerContext);\n  if (!ctx) {\n    throw new Error(\"Drawer compound components must be used within <Drawer>\");\n  }\n  return ctx;\n}\n","import { X } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport { useDrawer } from \"./Drawer.context\";\nimport type { DrawerHeaderProps } from \"./Drawer.types\";\n\nexport function DrawerHeader({ children, closable = true, className }: DrawerHeaderProps) {\n  const { close } = useDrawer();\n\n  return (\n    <div\n      data-react-fancy-drawer-header=\"\"\n      className={cn(\n        \"flex shrink-0 items-center justify-between border-b border-[color:var(--fancy-border,var(--color-zinc-200))] px-4 py-3 dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))]\",\n        className,\n      )}\n    >\n      <div className=\"text-sm font-semibold text-[color:var(--fancy-text,var(--color-zinc-900))] dark:text-[color:var(--fancy-text-dark,var(--color-zinc-100))]\">{children}</div>\n      {closable ? (\n        <button\n          type=\"button\"\n          onClick={close}\n          className=\"rounded-lg p-1 text-zinc-400 transition-colors hover:bg-[color:var(--fancy-surface-muted,var(--color-zinc-100))] hover:text-zinc-600 dark:hover:bg-[color:var(--fancy-surface-muted-dark,var(--color-zinc-800))] dark:hover:text-zinc-300\"\n          aria-label=\"Close\"\n        >\n          <X size={18} />\n        </button>\n      ) : null}\n    </div>\n  );\n}\n\nDrawerHeader.displayName = \"DrawerHeader\";\n","import { cn } from \"../../utils/cn\";\nimport type { DrawerBodyProps } from \"./Drawer.types\";\n\nexport function DrawerBody({ children, className }: DrawerBodyProps) {\n  return (\n    <div\n      data-react-fancy-drawer-body=\"\"\n      className={cn(\"min-h-0 flex-1 overflow-auto px-4 py-3 text-[color:var(--fancy-text-soft,var(--color-zinc-700))] dark:text-[color:var(--fancy-text-soft-dark,var(--color-zinc-300))]\", className)}\n    >\n      {children}\n    </div>\n  );\n}\n\nDrawerBody.displayName = \"DrawerBody\";\n","import { cn } from \"../../utils/cn\";\nimport type { DrawerFooterProps } from \"./Drawer.types\";\n\nexport function DrawerFooter({ children, className }: DrawerFooterProps) {\n  return (\n    <div\n      data-react-fancy-drawer-footer=\"\"\n      className={cn(\n        \"flex shrink-0 items-center justify-end gap-2 border-t border-[color:var(--fancy-border,var(--color-zinc-200))] px-4 py-3 dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))]\",\n        className,\n      )}\n    >\n      {children}\n    </div>\n  );\n}\n\nDrawerFooter.displayName = \"DrawerFooter\";\n","import { cn } from \"../../utils/cn\";\nimport type { DrawerContainerProps } from \"./Drawer.types\";\n\n/**\n * The anchor for `<Drawer attach=\"container\">`.\n *\n * A container-attached drawer positions itself `absolute`, which resolves\n * against the nearest *positioned* ancestor — so without `relative` somewhere\n * above it, the drawer silently escapes to the viewport and looks like it\n * ignored `attach` entirely. This wrapper supplies `relative` + `overflow-hidden`\n * so the panel slides within the box rather than out of it.\n *\n *   <Drawer.Container className=\"h-80 rounded-xl border\">\n *     <YourContent />\n *     <Drawer attach=\"container\" side=\"bottom\" open={open} onClose={close}>\n *       <Drawer.Body>Filters</Drawer.Body>\n *     </Drawer>\n *   </Drawer.Container>\n *\n * Any element works as long as it is positioned — this is the shortcut, not a\n * requirement. Wrapping a Card, a layout pane, or a prompt-input shell in\n * `relative overflow-hidden` does the same job.\n */\nexport function DrawerContainer({ children, className, ...rest }: DrawerContainerProps) {\n  return (\n    <div\n      data-react-fancy-drawer-container=\"\"\n      {...rest}\n      className={cn(\"relative overflow-hidden\", className)}\n    >\n      {children}\n    </div>\n  );\n}\n\nDrawerContainer.displayName = \"DrawerContainer\";\n","import { useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Portal } from \"../Portal\";\nimport { DrawerContext } from \"./Drawer.context\";\nimport { DrawerHeader } from \"./DrawerHeader\";\nimport { DrawerBody } from \"./DrawerBody\";\nimport { DrawerFooter } from \"./DrawerFooter\";\nimport { DrawerContainer } from \"./DrawerContainer\";\nimport { useFocusTrap } from \"../../hooks/use-focus-trap\";\nimport { useEscapeKey } from \"../../hooks/use-escape-key\";\nimport { useAnimation } from \"../../hooks/use-animation\";\nimport type { DrawerProps, DrawerSide } from \"./Drawer.types\";\n\n/**\n * `size` addresses the drawer's own axis: width on the horizontal edges,\n * height on the vertical ones. Keeping one scale across both means `size=\"lg\"`\n * does not have to be re-learned when a drawer moves from the side to the\n * bottom.\n */\nconst WIDTH = {\n  sm: \"w-64\",\n  md: \"w-80\",\n  lg: \"w-96\",\n  xl: \"w-[32rem]\",\n  full: \"w-full\",\n} as const;\n\nconst HEIGHT = {\n  sm: \"h-32\",\n  md: \"h-64\",\n  lg: \"h-96\",\n  xl: \"h-[32rem]\",\n  full: \"h-full\",\n} as const;\n\nconst ANCHOR: Record<DrawerSide, string> = {\n  left: \"inset-y-0 left-0\",\n  right: \"inset-y-0 right-0\",\n  top: \"inset-x-0 top-0\",\n  bottom: \"inset-x-0 bottom-0\",\n};\n\nconst ENTER: Record<DrawerSide, string> = {\n  left: \"fancy-slide-in-left\",\n  right: \"fancy-slide-in-right\",\n  top: \"fancy-slide-in-top\",\n  bottom: \"fancy-slide-in-bottom\",\n};\n\nconst EXIT: Record<DrawerSide, string> = {\n  left: \"fancy-slide-out-left\",\n  right: \"fancy-slide-out-right\",\n  top: \"fancy-slide-out-top\",\n  bottom: \"fancy-slide-out-bottom\",\n};\n\n/** The panel's edge shadow reads as depth away from the anchored edge. */\nconst EDGE: Record<DrawerSide, string> = {\n  left: \"border-r\",\n  right: \"border-l\",\n  top: \"border-b\",\n  bottom: \"border-t\",\n};\n\nfunction DrawerRoot({\n  children,\n  open,\n  onClose,\n  side = \"right\",\n  size = \"md\",\n  attach = \"viewport\",\n  backdrop = true,\n  dismissOnBackdrop = true,\n  dismissOnEscape = true,\n  className,\n  ...rest\n}: DrawerProps) {\n  const panelRef = useRef<HTMLDivElement>(null);\n  const horizontal = side === \"left\" || side === \"right\";\n  const isViewport = attach === \"viewport\";\n\n  const close = useCallback(() => onClose(), [onClose]);\n  useEscapeKey(close, open && dismissOnEscape);\n\n  // A container-attached drawer is a panel, not a dialog — trapping focus in it\n  // would strand keyboard users inside a Card. Only the viewport form is modal.\n  useFocusTrap(panelRef, open && isViewport);\n\n  useEffect(() => {\n    if (!open || !isViewport) return;\n    const original = document.body.style.overflow;\n    document.body.style.overflow = \"hidden\";\n    return () => {\n      document.body.style.overflow = original;\n    };\n  }, [open, isViewport]);\n\n  const { mounted, className: animClass, ref: animRef } = useAnimation({\n    open,\n    enterClass: ENTER[side],\n    exitClass: EXIT[side],\n  });\n\n  const ctx = useMemo(() => ({ open, close, side }), [open, close, side]);\n\n  if (!mounted) return null;\n\n  const frame = (\n    <div\n      data-react-fancy-drawer-frame=\"\"\n      className={cn(isViewport ? \"fixed inset-0 z-50\" : \"absolute inset-0 z-20\", !backdrop && \"pointer-events-none\")}\n    >\n      {backdrop ? (\n        <div\n          data-react-fancy-drawer-backdrop=\"\"\n          className={cn(\n            \"absolute inset-0 bg-black/40 transition-opacity\",\n            isViewport && \"backdrop-blur-sm\",\n            open ? \"opacity-100\" : \"opacity-0\",\n          )}\n          onClick={dismissOnBackdrop ? close : undefined}\n          aria-hidden=\"true\"\n        />\n      ) : null}\n\n      <div\n        ref={(node) => {\n          panelRef.current = node;\n          (animRef as React.MutableRefObject<HTMLElement | null>).current = node;\n        }}\n        data-react-fancy-drawer=\"\"\n        data-side={side}\n        role=\"dialog\"\n        aria-modal={isViewport || undefined}\n        {...rest}\n        className={cn(\n          \"pointer-events-auto absolute flex flex-col border-[color:var(--fancy-border,var(--color-zinc-200))] bg-[color:var(--fancy-surface,var(--color-white))] shadow-xl dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))] dark:bg-[color:var(--fancy-surface-dark,var(--color-zinc-900))]\",\n          ANCHOR[side],\n          EDGE[side],\n          horizontal ? WIDTH[size] : HEIGHT[size],\n          // Cross-axis fills the anchor; the main axis is capped so a viewport\n          // drawer can never grow past the screen on a small device.\n          horizontal ? \"h-full\" : \"w-full\",\n          isViewport && (horizontal ? \"max-w-[90vw]\" : \"max-h-[90vh]\"),\n          !isViewport && (horizontal ? \"max-w-full\" : \"max-h-full\"),\n          animClass,\n          className,\n        )}\n      >\n        {children}\n      </div>\n    </div>\n  );\n\n  return (\n    <DrawerContext.Provider value={ctx}>\n      {isViewport ? <Portal>{frame}</Portal> : frame}\n    </DrawerContext.Provider>\n  );\n}\n\nexport const Drawer = Object.assign(DrawerRoot, {\n  Header: DrawerHeader,\n  Body: DrawerBody,\n  Footer: DrawerFooter,\n  Container: DrawerContainer,\n});\n"]}

package/dist/{chunk-ZY4CVNNZ.js → chunk-5JA4ENMF.js}

@@ -23,7 +23,7 @@ function CommandInput({
   className
 }) {
   const { query, setQuery, listId } = useCommand();
-  return /* @__PURE__ */ jsxs("div", { "data-react-fancy-command-input": "", className: "flex items-center border-b border-zinc-200 px-4 dark:border-zinc-700", children: [
+  return /* @__PURE__ */ jsxs("div", { "data-react-fancy-command-input": "", className: "flex items-center border-b border-[color:var(--fancy-border,var(--color-zinc-200))] px-4 dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))]", children: [
     /* @__PURE__ */ jsx(Search, { size: 16, className: "shrink-0 text-zinc-400" }),
     /* @__PURE__ */ jsx(
       "input",
@@ -87,7 +87,7 @@ function CommandItem({
       },
       className: cn(
         "flex w-full items-center rounded-lg px-3 py-2 text-left text-sm transition-colors",
-        "text-zinc-700 hover:bg-zinc-100 data-[active]:bg-zinc-100 dark:text-zinc-300 dark:hover:bg-zinc-800 dark:data-[active]:bg-zinc-800",
+        "text-[color:var(--fancy-text-soft,var(--color-zinc-700))] hover:bg-[color:var(--fancy-surface-muted,var(--color-zinc-100))] data-[active]:bg-[color:var(--fancy-surface-muted,var(--color-zinc-100))] dark:text-[color:var(--fancy-text-soft-dark,var(--color-zinc-300))] dark:hover:bg-[color:var(--fancy-surface-muted-dark,var(--color-zinc-800))] dark:data-[active]:bg-[color:var(--fancy-surface-muted-dark,var(--color-zinc-800))]",
         className
       ),
       onClick: () => {
@@ -119,7 +119,7 @@ function CommandEmpty({
     {
       "data-react-fancy-command-empty": "",
       className: cn(
-        "py-6 text-center text-sm text-zinc-500 dark:text-zinc-400",
+        "py-6 text-center text-sm text-[color:var(--fancy-text-muted,var(--color-zinc-500))] dark:text-[color:var(--fancy-text-muted-dark,var(--color-zinc-400))]",
         className
       ),
       children
@@ -239,7 +239,7 @@ function CommandRoot({
         },
         "data-react-fancy-command": "",
         className: cn(
-          "relative w-full max-w-lg overflow-hidden rounded-2xl border border-zinc-200 bg-white shadow-2xl dark:border-zinc-700 dark:bg-zinc-900",
+          "relative w-full max-w-lg overflow-hidden rounded-2xl border border-[color:var(--fancy-border,var(--color-zinc-200))] bg-[color:var(--fancy-surface,var(--color-white))] shadow-2xl dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))] dark:bg-[color:var(--fancy-surface-dark,var(--color-zinc-900))]",
           animClass,
           className
         ),
@@ -257,5 +257,5 @@ var Command = Object.assign(CommandRoot, {
 });
 
 export { Command, useCommand };
-//# sourceMappingURL=chunk-ZY4CVNNZ.js.map
-//# sourceMappingURL=chunk-ZY4CVNNZ.js.map
+//# sourceMappingURL=chunk-5JA4ENMF.js.map
+//# sourceMappingURL=chunk-5JA4ENMF.js.map

package/dist/chunk-5JA4ENMF.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Command/Command.context.ts","../src/components/Command/CommandInput.tsx","../src/components/Command/CommandList.tsx","../src/components/Command/CommandItem.tsx","../src/components/Command/CommandGroup.tsx","../src/components/Command/CommandEmpty.tsx","../src/components/Command/Command.tsx"],"names":["jsx","jsxs","useId"],"mappings":"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","file":"chunk-5JA4ENMF.js","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { CommandContextValue } from \"./Command.types\";\n\nexport const CommandContext = createContext<CommandContextValue | null>(null);\n\nexport function useCommand(): CommandContextValue {\n  const ctx = useContext(CommandContext);\n  if (!ctx) {\n    throw new Error(\n      \"Command compound components must be used within <Command>\",\n    );\n  }\n  return ctx;\n}\n","import { Search } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport { useCommand } from \"./Command.context\";\nimport type { CommandInputProps } from \"./Command.types\";\n\nexport function CommandInput({\n  placeholder = \"Type a command or search...\",\n  className,\n}: CommandInputProps) {\n  const { query, setQuery, listId } = useCommand();\n\n  return (\n    <div data-react-fancy-command-input=\"\" className=\"flex items-center border-b border-[color:var(--fancy-border,var(--color-zinc-200))] px-4 dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))]\">\n      <Search size={16} className=\"shrink-0 text-zinc-400\" />\n      <input\n        type=\"text\"\n        // A combobox: focus stays here while the arrows move the active option,\n        // which Command announces through aria-activedescendant.\n        role=\"combobox\"\n        aria-expanded=\"true\"\n        aria-controls={listId}\n        aria-autocomplete=\"list\"\n        value={query}\n        onChange={(e) => setQuery(e.target.value)}\n        placeholder={placeholder}\n        className={cn(\n          \"flex-1 bg-transparent px-3 py-3 text-sm outline-none placeholder:text-zinc-400\",\n          className,\n        )}\n        autoFocus\n      />\n    </div>\n  );\n}\n\nCommandInput.displayName = \"CommandInput\";\n","import { cn } from \"../../utils/cn\";\nimport { useCommand } from \"./Command.context\";\nimport type { CommandListProps } from \"./Command.types\";\n\nexport function CommandList({ children, className }: CommandListProps) {\n  const { listId } = useCommand();\n\n  return (\n    <div\n      id={listId}\n      data-react-fancy-command-list=\"\"\n      role=\"listbox\"\n      className={cn(\"max-h-72 overflow-y-auto p-2\", className)}\n    >\n      {children}\n    </div>\n  );\n}\n\nCommandList.displayName = \"CommandList\";\n","import { useId } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { useCommand } from \"./Command.context\";\nimport type { CommandItemProps } from \"./Command.types\";\n\nexport function CommandItem({\n  children,\n  value,\n  onSelect,\n  className,\n}: CommandItemProps) {\n  const { query, close, shouldFilter, setActiveIndex } = useCommand();\n  // Called before the filter's early return, so the hook order never changes.\n  const id = useId();\n\n  // Filter by query — unless the caller filters for itself (`shouldFilter={false}`).\n  const text = value ?? (typeof children === \"string\" ? children : \"\");\n  if (shouldFilter && query && !text.toLowerCase().includes(query.toLowerCase())) {\n    return null;\n  }\n\n  return (\n    <button\n      id={id}\n      data-react-fancy-command-item=\"\"\n      type=\"button\"\n      role=\"option\"\n      // Marked active by Command itself (aria-selected + data-active), since an\n      // item cannot know its own position among the rendered options.\n      aria-selected={false}\n      // Keyboard focus stays in the input; the items are reached with the arrows.\n      tabIndex={-1}\n      onMouseEnter={(e) => {\n        const options = e.currentTarget\n          .closest(\"[data-react-fancy-command]\")\n          ?.querySelectorAll('[role=\"option\"]');\n        if (options) setActiveIndex(Array.from(options).indexOf(e.currentTarget));\n      }}\n      className={cn(\n        \"flex w-full items-center rounded-lg px-3 py-2 text-left text-sm transition-colors\",\n        \"text-[color:var(--fancy-text-soft,var(--color-zinc-700))] hover:bg-[color:var(--fancy-surface-muted,var(--color-zinc-100))] data-[active]:bg-[color:var(--fancy-surface-muted,var(--color-zinc-100))] dark:text-[color:var(--fancy-text-soft-dark,var(--color-zinc-300))] dark:hover:bg-[color:var(--fancy-surface-muted-dark,var(--color-zinc-800))] dark:data-[active]:bg-[color:var(--fancy-surface-muted-dark,var(--color-zinc-800))]\",\n        className,\n      )}\n      onClick={() => {\n        onSelect?.();\n        close();\n      }}\n    >\n      {children}\n    </button>\n  );\n}\n\nCommandItem.displayName = \"CommandItem\";\n","import { cn } from \"../../utils/cn\";\nimport type { CommandGroupProps } from \"./Command.types\";\n\nexport function CommandGroup({\n  children,\n  heading,\n  className,\n}: CommandGroupProps) {\n  return (\n    <div data-react-fancy-command-group=\"\" role=\"group\" className={cn(\"py-1\", className)}>\n      {heading && (\n        <div className=\"px-3 py-1.5 text-xs font-medium text-zinc-400\">\n          {heading}\n        </div>\n      )}\n      {children}\n    </div>\n  );\n}\n\nCommandGroup.displayName = \"CommandGroup\";\n","import { cn } from \"../../utils/cn\";\nimport type { CommandEmptyProps } from \"./Command.types\";\n\nexport function CommandEmpty({\n  children = \"No results found.\",\n  className,\n}: CommandEmptyProps) {\n  return (\n    <div\n      data-react-fancy-command-empty=\"\"\n      className={cn(\n        \"py-6 text-center text-sm text-[color:var(--fancy-text-muted,var(--color-zinc-500))] dark:text-[color:var(--fancy-text-muted-dark,var(--color-zinc-400))]\",\n        className,\n      )}\n    >\n      {children}\n    </div>\n  );\n}\n\nCommandEmpty.displayName = \"CommandEmpty\";\n","import {\n  useCallback,\n  useEffect,\n  useId,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Portal } from \"../Portal\";\nimport { CommandContext } from \"./Command.context\";\nimport { CommandInput } from \"./CommandInput\";\nimport { CommandList } from \"./CommandList\";\nimport { CommandItem } from \"./CommandItem\";\nimport { CommandGroup } from \"./CommandGroup\";\nimport { CommandEmpty } from \"./CommandEmpty\";\nimport { useFocusTrap } from \"../../hooks/use-focus-trap\";\nimport { useEscapeKey } from \"../../hooks/use-escape-key\";\nimport { useAnimation } from \"../../hooks/use-animation\";\nimport { useControllableState } from \"../../hooks/use-controllable-state\";\nimport type { CommandProps } from \"./Command.types\";\n\nfunction CommandRoot({\n  children,\n  open,\n  onClose,\n  className,\n  shouldFilter = true,\n  query: controlledQuery,\n  onQueryChange,\n}: CommandProps) {\n  const [query, setQuery] = useControllableState(controlledQuery, \"\", onQueryChange);\n  const [activeIndex, setActiveIndex] = useState(-1);\n  const panelRef = useRef<HTMLDivElement>(null);\n  const listId = useId();\n\n  const close = useCallback(() => {\n    onClose();\n    setQuery(\"\");\n    setActiveIndex(-1);\n  }, [onClose]);\n\n  useEscapeKey(close, open);\n  useFocusTrap(panelRef, open);\n\n  // Cmd+K global shortcut is handled by the consumer\n  useEffect(() => {\n    if (open) {\n      const original = document.body.style.overflow;\n      document.body.style.overflow = \"hidden\";\n      return () => {\n        document.body.style.overflow = original;\n      };\n    }\n  }, [open]);\n\n  /*\n   * Keyboard navigation, as a combobox: the arrows move the ACTIVE item while\n   * focus stays in the input (announced through aria-activedescendant), and\n   * Enter picks the active item — or the first visible one when none is active.\n   *\n   * Focus used to move onto the items, and Enter was handled nowhere, so typing\n   * a query and pressing Enter did nothing: only a focused item took Enter, as a\n   * native click. Found by Genie 2's real-window test.\n   */\n  useEffect(() => {\n    if (!open) return;\n\n    const handleKeyDown = (e: KeyboardEvent) => {\n      const items = panelRef.current?.querySelectorAll<HTMLElement>(\n        '[role=\"option\"]',\n      );\n      if (!items?.length) return;\n\n      if (e.key === \"ArrowDown\") {\n        e.preventDefault();\n        setActiveIndex(activeIndex < items.length - 1 ? activeIndex + 1 : 0);\n      } else if (e.key === \"ArrowUp\") {\n        e.preventDefault();\n        setActiveIndex(activeIndex > 0 ? activeIndex - 1 : items.length - 1);\n      } else if (e.key === \"Enter\") {\n        // A focused item takes Enter natively, as a click; picking here as well\n        // would select it twice.\n        if ((e.target as HTMLElement | null)?.getAttribute(\"role\") === \"option\") return;\n        const pick = items[activeIndex] ?? items[0];\n        e.preventDefault();\n        pick.click();\n      }\n    };\n\n    document.addEventListener(\"keydown\", handleKeyDown);\n    return () => document.removeEventListener(\"keydown\", handleKeyDown);\n  }, [open, activeIndex]);\n\n  /*\n   * Mark the active item and point the input at it. Done on the DOM after each\n   * render because an item cannot know its own index — that is its position\n   * among the options currently rendered, which filtering changes.\n   */\n  useLayoutEffect(() => {\n    const panel = panelRef.current;\n    if (!panel) return;\n\n    const items = Array.from(panel.querySelectorAll<HTMLElement>('[role=\"option\"]'));\n    const active = items[activeIndex];\n    items.forEach((item) => {\n      const on = item === active;\n      item.setAttribute(\"aria-selected\", on ? \"true\" : \"false\");\n      if (on) item.setAttribute(\"data-active\", \"\");\n      else item.removeAttribute(\"data-active\");\n    });\n\n    const input = panel.querySelector<HTMLInputElement>(\"[data-react-fancy-command-input] input\");\n    if (active?.id) input?.setAttribute(\"aria-activedescendant\", active.id);\n    else input?.removeAttribute(\"aria-activedescendant\");\n    active?.scrollIntoView?.({ block: \"nearest\" });\n  });\n\n  // A new query is a new list: nothing in it is active yet, so Enter picks the first match.\n  const changeQuery = useCallback(\n    (next: string) => {\n      setQuery(next);\n      setActiveIndex(-1);\n    },\n    [setQuery],\n  );\n\n  const { mounted, className: animClass, ref: animRef } = useAnimation({\n    open,\n    enterClass: \"fancy-slide-up\",\n    exitClass: \"fancy-fade-out\",\n  });\n\n  const ctx = useMemo(\n    () => ({\n      open,\n      close,\n      query,\n      setQuery: changeQuery,\n      activeIndex,\n      setActiveIndex,\n      shouldFilter,\n      listId,\n    }),\n    [open, close, query, changeQuery, activeIndex, shouldFilter, listId],\n  );\n\n  if (!mounted) return null;\n\n  return (\n    <CommandContext.Provider value={ctx}>\n      <Portal>\n        <div className=\"fixed inset-0 z-50 flex items-start justify-center pt-[20vh]\">\n          <div\n            className=\"absolute inset-0 bg-black/50 backdrop-blur-sm\"\n            onClick={close}\n            aria-hidden=\"true\"\n          />\n          <div\n            ref={(node) => {\n              panelRef.current = node;\n              (animRef as React.MutableRefObject<HTMLElement | null>).current =\n                node;\n            }}\n            data-react-fancy-command=\"\"\n            className={cn(\n              \"relative w-full max-w-lg overflow-hidden rounded-2xl border border-[color:var(--fancy-border,var(--color-zinc-200))] bg-[color:var(--fancy-surface,var(--color-white))] shadow-2xl dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))] dark:bg-[color:var(--fancy-surface-dark,var(--color-zinc-900))]\",\n              animClass,\n              className,\n            )}\n          >\n            {children}\n          </div>\n        </div>\n      </Portal>\n    </CommandContext.Provider>\n  );\n}\n\nexport const Command = Object.assign(CommandRoot, {\n  Input: CommandInput,\n  List: CommandList,\n  Item: CommandItem,\n  Group: CommandGroup,\n  Empty: CommandEmpty,\n});\n"]}

package/dist/{chunk-R3UG6PVX.cjs → chunk-5JK2VDWY.cjs}

@@ -1,6 +1,6 @@
 'use strict';
 
-var chunkWKNVZUWZ_cjs = require('./chunk-WKNVZUWZ.cjs');
+var chunkUZG6LO4Z_cjs = require('./chunk-UZG6LO4Z.cjs');
 var chunkSNHU2AI4_cjs = require('./chunk-SNHU2AI4.cjs');
 var chunkZU5Q77OT_cjs = require('./chunk-ZU5Q77OT.cjs');
 var react = require('react');
@@ -65,7 +65,7 @@ function endsOf(text, chars) {
   return `${text.slice(0, chars)} \u2026 ${text.slice(-chars)}`;
 }
 var PILL_BASE = "inline-flex select-none items-center rounded-md px-2 py-0.5 text-xs leading-5 transition-colors";
-var TEXT_PILL = "cursor-pointer bg-zinc-100 text-zinc-700 hover:bg-zinc-200 dark:bg-zinc-800 dark:text-zinc-200 dark:hover:bg-zinc-700";
+var TEXT_PILL = "cursor-pointer bg-[color:var(--fancy-surface-muted,var(--color-zinc-100))] text-zinc-700 hover:bg-zinc-200 dark:bg-[color:var(--fancy-surface-muted-dark,var(--color-zinc-800))] dark:text-zinc-200 dark:hover:bg-zinc-700";
 var IMAGE_PILL = "bg-rose-100 font-medium text-rose-600 dark:bg-rose-500/20 dark:text-rose-300";
 var PREVIEW_BASE = "max-w-xs whitespace-pre-wrap break-all p-2 text-xs";
 function ImageThumb({ file, label }) {
@@ -131,9 +131,9 @@ function InlinePill({
       ]
     }
   );
-  return /* @__PURE__ */ jsxRuntime.jsxs(chunkWKNVZUWZ_cjs.Popover, { hover: true, open, onOpenChange: setOpen, placement: "top", children: [
-    /* @__PURE__ */ jsxRuntime.jsx(chunkWKNVZUWZ_cjs.Popover.Trigger, { children: pill }),
-    /* @__PURE__ */ jsxRuntime.jsx(chunkWKNVZUWZ_cjs.Popover.Content, { className: chunkZU5Q77OT_cjs.cn(PREVIEW_BASE, classNames?.preview), children: content })
+  return /* @__PURE__ */ jsxRuntime.jsxs(chunkUZG6LO4Z_cjs.Popover, { hover: true, open, onOpenChange: setOpen, placement: "top", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(chunkUZG6LO4Z_cjs.Popover.Trigger, { children: pill }),
+    /* @__PURE__ */ jsxRuntime.jsx(chunkUZG6LO4Z_cjs.Popover.Content, { className: chunkZU5Q77OT_cjs.cn(PREVIEW_BASE, classNames?.preview), children: content })
   ] });
 }
 
@@ -670,5 +670,5 @@ exports.segmentValue = segmentValue;
 exports.useInlinePaste = useInlinePaste;
 exports.usePastePills = usePastePills;
 exports.withSeparators = withSeparators;
-//# sourceMappingURL=chunk-R3UG6PVX.cjs.map
-//# sourceMappingURL=chunk-R3UG6PVX.cjs.map
+//# sourceMappingURL=chunk-5JK2VDWY.cjs.map
+//# sourceMappingURL=chunk-5JK2VDWY.cjs.map