@arbidocs/blocks 0.5.22 → 0.5.24

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (104) hide show
  1. package/dist/{WorkspaceTableView-6JVHGDUB.cjs → WorkspaceTableView-GIDGNGBW.cjs} +6 -6
  2. package/dist/{WorkspaceTableView-6JVHGDUB.cjs.map → WorkspaceTableView-GIDGNGBW.cjs.map} +1 -1
  3. package/dist/{WorkspaceTableView-ECPHGWHF.js → WorkspaceTableView-S2PTTVHL.js} +4 -4
  4. package/dist/{WorkspaceTableView-ECPHGWHF.js.map → WorkspaceTableView-S2PTTVHL.js.map} +1 -1
  5. package/dist/auth/index.cjs +47 -47
  6. package/dist/auth/index.js +2 -2
  7. package/dist/{chunk-7DDMF3DZ.cjs → chunk-53T2FY4Z.cjs} +5 -31
  8. package/dist/chunk-53T2FY4Z.cjs.map +1 -0
  9. package/dist/chunk-5ZBXFHZW.js +434 -0
  10. package/dist/chunk-5ZBXFHZW.js.map +1 -0
  11. package/dist/{chunk-K237IYOD.cjs → chunk-BYJUI4AT.cjs} +54 -2
  12. package/dist/chunk-BYJUI4AT.cjs.map +1 -0
  13. package/dist/{chunk-O4EQYPLO.cjs → chunk-C2SZQKX2.cjs} +169 -27
  14. package/dist/chunk-C2SZQKX2.cjs.map +1 -0
  15. package/dist/{chunk-MSPNYW6Z.cjs → chunk-DTLVC6MN.cjs} +2 -53
  16. package/dist/chunk-DTLVC6MN.cjs.map +1 -0
  17. package/dist/{chunk-RVKVGS72.js → chunk-FDUQQNDT.js} +2 -2
  18. package/dist/{chunk-RVKVGS72.js.map → chunk-FDUQQNDT.js.map} +1 -1
  19. package/dist/{chunk-TTJGCJWX.cjs → chunk-H3XAHVDT.cjs} +42 -2
  20. package/dist/chunk-H3XAHVDT.cjs.map +1 -0
  21. package/dist/{chunk-XL55UDLO.js → chunk-IJJKUTKM.js} +5 -30
  22. package/dist/chunk-IJJKUTKM.js.map +1 -0
  23. package/dist/{chunk-ZX663X3X.cjs → chunk-KNRAKOCO.cjs} +6 -428
  24. package/dist/chunk-KNRAKOCO.cjs.map +1 -0
  25. package/dist/chunk-KUQOHPKP.cjs +443 -0
  26. package/dist/chunk-KUQOHPKP.cjs.map +1 -0
  27. package/dist/{chunk-F2BYURQZ.cjs → chunk-LYF47OXX.cjs} +5 -5
  28. package/dist/{chunk-F2BYURQZ.cjs.map → chunk-LYF47OXX.cjs.map} +1 -1
  29. package/dist/{chunk-PZRTRYPD.js → chunk-MKTEVOC3.js} +44 -5
  30. package/dist/chunk-MKTEVOC3.js.map +1 -0
  31. package/dist/{chunk-6XW3CMU4.js → chunk-N3KNAQ55.js} +144 -4
  32. package/dist/chunk-N3KNAQ55.js.map +1 -0
  33. package/dist/{chunk-KL6XOSEN.js → chunk-PLAGIVFF.js} +4 -52
  34. package/dist/chunk-PLAGIVFF.js.map +1 -0
  35. package/dist/{chunk-FZVAJFRH.cjs → chunk-RHKFCSFC.cjs} +2 -2
  36. package/dist/{chunk-FZVAJFRH.cjs.map → chunk-RHKFCSFC.cjs.map} +1 -1
  37. package/dist/{chunk-NVRJ6WTR.js → chunk-RTAYJUQM.js} +3 -3
  38. package/dist/{chunk-NVRJ6WTR.js.map → chunk-RTAYJUQM.js.map} +1 -1
  39. package/dist/{chunk-IXBJEQH5.js → chunk-VN4FSGBR.js} +53 -4
  40. package/dist/chunk-VN4FSGBR.js.map +1 -0
  41. package/dist/{chunk-SLRVI2YU.js → chunk-X6U6L6BG.js} +29 -4
  42. package/dist/chunk-X6U6L6BG.js.map +1 -0
  43. package/dist/{chunk-SQ5F5BFW.cjs → chunk-XDU3HHUU.cjs} +32 -6
  44. package/dist/chunk-XDU3HHUU.cjs.map +1 -0
  45. package/dist/{chunk-SKVVOEMX.js → chunk-XXUPUXBF.js} +8 -423
  46. package/dist/chunk-XXUPUXBF.js.map +1 -0
  47. package/dist/connect/index.cjs +1203 -624
  48. package/dist/connect/index.cjs.map +1 -1
  49. package/dist/connect/index.js +770 -197
  50. package/dist/connect/index.js.map +1 -1
  51. package/dist/connection/auth/CompactLogin.d.ts +26 -0
  52. package/dist/connection/auth/ConnectedLoginPage.d.ts +9 -1
  53. package/dist/connection/auth/index.d.ts +3 -1
  54. package/dist/connection/auth/sso-popup.d.ts +13 -0
  55. package/dist/connection/auth/sso-sign-in.d.ts +38 -0
  56. package/dist/connection/auth/support.d.ts +17 -0
  57. package/dist/connection/auth/useLoginActions.d.ts +9 -2
  58. package/dist/connection/billing/ConnectedQuotaDialog.d.ts +5 -13
  59. package/dist/connection/billing/index.d.ts +1 -1
  60. package/dist/connection/connectors/ConnectedSharePointAdminConsentPage.d.ts +26 -0
  61. package/dist/connection/connectors/index.d.ts +1 -0
  62. package/dist/connection/projects/ConnectedProjectsPanel.d.ts +9 -1
  63. package/dist/connection/projects/ProjectsListPage.d.ts +40 -0
  64. package/dist/connection/projects/index.d.ts +1 -0
  65. package/dist/connection/settings-page/ConnectedAccountSettings.d.ts +2 -1
  66. package/dist/connection/settings-page/ConnectedBoxPortalSection.d.ts +6 -0
  67. package/dist/connection/settings-page/appearanceSection.d.ts +30 -0
  68. package/dist/connection/settings-page/index.d.ts +1 -0
  69. package/dist/index.cjs +209 -237
  70. package/dist/index.cjs.map +1 -1
  71. package/dist/index.d.ts +2 -0
  72. package/dist/index.js +11 -50
  73. package/dist/index.js.map +1 -1
  74. package/dist/settings/AppearanceSettings.d.ts +1 -2
  75. package/dist/settings/index.cjs +153 -153
  76. package/dist/settings/index.d.ts +2 -1
  77. package/dist/settings/index.js +1 -1
  78. package/dist/site/index.cjs +82 -74
  79. package/dist/site/index.d.ts +2 -0
  80. package/dist/site/index.js +3 -3
  81. package/dist/studio/index.cjs +73 -73
  82. package/dist/studio/index.js +5 -5
  83. package/dist/theme/appearance.d.ts +47 -0
  84. package/dist/theme/fromCss.d.ts +33 -0
  85. package/node_modules/@arbidocs/coedit/package.json +1 -1
  86. package/package.json +5 -5
  87. package/dist/chunk-6XW3CMU4.js.map +0 -1
  88. package/dist/chunk-7DDMF3DZ.cjs.map +0 -1
  89. package/dist/chunk-AMTWY22T.js +0 -11
  90. package/dist/chunk-AMTWY22T.js.map +0 -1
  91. package/dist/chunk-IXBJEQH5.js.map +0 -1
  92. package/dist/chunk-K237IYOD.cjs.map +0 -1
  93. package/dist/chunk-KL6XOSEN.js.map +0 -1
  94. package/dist/chunk-MSPNYW6Z.cjs.map +0 -1
  95. package/dist/chunk-O4EQYPLO.cjs.map +0 -1
  96. package/dist/chunk-PZRTRYPD.js.map +0 -1
  97. package/dist/chunk-SKVVOEMX.js.map +0 -1
  98. package/dist/chunk-SLRVI2YU.js.map +0 -1
  99. package/dist/chunk-SQ5F5BFW.cjs.map +0 -1
  100. package/dist/chunk-TTJGCJWX.cjs.map +0 -1
  101. package/dist/chunk-XL55UDLO.js.map +0 -1
  102. package/dist/chunk-ZU2B2RZK.cjs +0 -13
  103. package/dist/chunk-ZU2B2RZK.cjs.map +0 -1
  104. package/dist/chunk-ZX663X3X.cjs.map +0 -1
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/DataTable.tsx","../src/components/PageHeader.tsx"],"names":["jsxs","cn","jsx"],"mappings":";;;;;;AAoDA,IAAM,aAAa,EAAE,IAAA,EAAM,aAAa,KAAA,EAAO,YAAA,EAAc,QAAQ,aAAA,EAAc;AAEnF,IAAM,wBAAA,GAA2B,EAAE,SAAA,EAAW,iBAAA,EAAmB,WAAW,YAAA,EAAa;AAGlF,SAAS,SAAA,CAAa;AAAA,EAC3B,OAAA;AAAA,EACA,IAAA;AAAA,EACA,QAAA;AAAA,EACA,UAAA;AAAA,EACA,IAAA,GAAO,MAAA;AAAA,EACP,OAAA;AAAA,EACA,UAAA,GAAa,iBAAA;AAAA,EACb,gBAAA;AAAA,EACA,IAAA;AAAA,EACA,YAAA;AAAA,EACA,WAAA;AAAA,EACA,mBAAA;AAAA,EACA,eAAA;AAAA,EACA;AACF,CAAA,EAAsB;AACpB,EAAA,MAAM,GAAA,GAAM;AAAA,IACV,KAAA,EAAO,OAAA,EAAS,KAAA,IAAS,GAAA,CAAI,MAAM,OAAO,CAAA;AAAA,IAC1C,KAAA,EAAO,OAAA,EAAS,KAAA,IAAS,GAAA,CAAI,MAAM,OAAO,CAAA;AAAA,IAC1C,GAAA,EAAK,SAAS,GAAA,KAAQ,CAAC,OAAe,GAAA,CAAI,IAAA,EAAM,OAAO,EAAE,CAAA;AAAA,GAC3D;AACA,EAAA,MAAM,MAAA,GAAS,EAAE,GAAG,wBAAA,EAA0B,GAAG,eAAA,EAAgB;AACjE,EAAA,IAAI,IAAA,CAAK,WAAW,CAAA,EAAG;AACrB,IAAA,uBAAO,GAAA,CAAC,cAAW,KAAA,EAAO,UAAA,EAAY,aAAa,gBAAA,EAAkB,MAAA,EAAQ,IAAI,KAAA,EAAO,CAAA;AAAA,EAC1F;AAEA,EAAA,MAAM,YAAA,GAAe,QAAQ,mBAAmB,CAAA;AAChD,EAAA,MAAM,QAAA,GAAW,IAAI,GAAA,CAAI,WAAA,IAAe,EAAE,CAAA;AAC1C,EAAA,MAAM,MAAA,GAAS,IAAA,CAAK,GAAA,CAAI,QAAQ,CAAA;AAChC,EAAA,MAAM,WAAA,GAAc,MAAA,CAAO,MAAA,GAAS,CAAA,IAAK,MAAA,CAAO,KAAA,CAAM,CAAC,EAAA,KAAO,QAAA,CAAS,GAAA,CAAI,EAAE,CAAC,CAAA;AAC9E,EAAA,MAAM,SAAA,GAAY,CAAC,EAAA,KAAe;AAChC,IAAA,MAAM,IAAA,GAAO,IAAI,GAAA,CAAI,QAAQ,CAAA;AAC7B,IAAA,IAAI,KAAK,GAAA,CAAI,EAAE,CAAA,EAAG,IAAA,CAAK,OAAO,EAAE,CAAA;AAAA,SAC3B,IAAA,CAAK,IAAI,EAAE,CAAA;AAChB,IAAA,mBAAA,GAAsB,CAAC,GAAG,IAAI,CAAC,CAAA;AAAA,EACjC,CAAA;AAEA,EAAA,uBACE,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,EAAA,CAAG,yCAAA,EAA2C,SAAS,CAAA,EACrE,QAAA,kBAAA,IAAA,CAAC,KAAA,EAAA,EAAM,aAAA,EAAa,GAAA,CAAI,KAAA,EACtB,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,WAAA,EAAA,EACC,QAAA,kBAAA,IAAA,CAAC,QAAA,EAAA,EAAS,SAAA,EAAU,sBAAA,EACjB,QAAA,EAAA;AAAA,MAAA,YAAA,oBACC,GAAA,CAAC,SAAA,EAAA,EAAU,SAAA,EAAU,MAAA,EACnB,QAAA,kBAAA,GAAA;AAAA,QAAC,OAAA;AAAA,QAAA;AAAA,UACC,IAAA,EAAK,UAAA;AAAA,UACL,cAAY,MAAA,CAAO,SAAA;AAAA,UACnB,OAAA,EAAS,WAAA;AAAA,UACT,UAAU,MAAM,mBAAA,GAAsB,WAAA,GAAc,KAAK,MAAM;AAAA;AAAA,OACjE,EACF,CAAA;AAAA,MAED,OAAA,CAAQ,GAAA,CAAI,CAAC,CAAA,KAAM;AAClB,QAAA,MAAM,MAAA,GAAS,IAAA,EAAM,GAAA,KAAQ,CAAA,CAAE,MAAM,IAAA,GAAO,IAAA;AAC5C,QAAA,MAAM,UAAA,GAAa,EAAE,UAAA,IAAc,YAAA;AACnC,QAAA,uBACE,GAAA;AAAA,UAAC,SAAA;AAAA,UAAA;AAAA,YAEC,aACE,MAAA,GAAU,MAAA,CAAO,SAAA,KAAc,KAAA,GAAQ,cAAc,YAAA,GAAgB,MAAA;AAAA,YAEvE,SAAA,EAAW,GAAG,CAAA,CAAE,KAAA,IAAS,WAAW,CAAA,CAAE,KAAK,CAAA,EAAG,CAAA,CAAE,aAAa,CAAA;AAAA,YAE5D,QAAA,EAAA,UAAA,mBACC,IAAA;AAAA,cAAC,QAAA;AAAA,cAAA;AAAA,gBACC,IAAA,EAAK,QAAA;AAAA,gBACL,SAAA,EAAU,sDAAA;AAAA,gBACV,OAAA,EAAS,MACP,YAAA,CAAa;AAAA,kBACX,KAAK,CAAA,CAAE,GAAA;AAAA,kBACP,SAAA,EAAW,MAAA,EAAQ,SAAA,KAAc,KAAA,GAAQ,MAAA,GAAS;AAAA,iBACnD,CAAA;AAAA,gBAGF,QAAA,EAAA;AAAA,kBAAA,CAAA,CAAE,MAAA;AAAA,kBACF,SACC,MAAA,CAAO,SAAA,KAAc,KAAA,mBACnB,GAAA,CAAC,WAAQ,SAAA,EAAU,QAAA,EAAS,CAAA,mBAE5B,GAAA,CAAC,aAAU,SAAA,EAAU,QAAA,EAAS,oBAGhC,GAAA,CAAC,cAAA,EAAA,EAAe,WAAU,mBAAA,EAAoB;AAAA;AAAA;AAAA,gBAIlD,CAAA,CAAE;AAAA,WAAA;AAAA,UA7BC,CAAA,CAAE;AAAA,SA+BT;AAAA,MAEJ,CAAC;AAAA,KAAA,EACH,CAAA,EACF,CAAA;AAAA,oBACA,GAAA,CAAC,SAAA,EAAA,EACE,QAAA,EAAA,IAAA,CAAK,GAAA,CAAI,CAAC,GAAA,KAAQ;AACjB,MAAA,MAAM,EAAA,GAAK,SAAS,GAAG,CAAA;AACvB,MAAA,uBACE,IAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UAEC,aAAA,EAAa,GAAA,CAAI,GAAA,CAAI,EAAE,CAAA;AAAA,UACvB,YAAA,EAAY,QAAA,CAAS,GAAA,CAAI,EAAE,IAAI,UAAA,GAAa,MAAA;AAAA,UAC5C,OAAA,EAAS,UAAA,GAAa,MAAM,UAAA,CAAW,GAAG,CAAA,GAAI,MAAA;AAAA,UAC9C,SAAA,EAAW,EAAA,CAAG,UAAA,IAAc,gBAAgB,CAAA;AAAA,UAE3C,QAAA,EAAA;AAAA,YAAA,YAAA,oBACC,GAAA,CAAC,aAAU,SAAA,EAAU,MAAA,EAAO,SAAS,CAAC,CAAA,KAAM,CAAA,CAAE,eAAA,EAAgB,EAC5D,QAAA,kBAAA,GAAA;AAAA,cAAC,OAAA;AAAA,cAAA;AAAA,gBACC,IAAA,EAAK,UAAA;AAAA,gBACL,cAAY,MAAA,CAAO,SAAA;AAAA,gBACnB,OAAA,EAAS,QAAA,CAAS,GAAA,CAAI,EAAE,CAAA;AAAA,gBACxB,QAAA,EAAU,MAAM,SAAA,CAAU,EAAE;AAAA;AAAA,aAC9B,EACF,CAAA;AAAA,YAED,OAAA,CAAQ,GAAA,CAAI,CAAC,CAAA,qBACZ,GAAA;AAAA,cAAC,SAAA;AAAA,cAAA;AAAA,gBAEC,SAAA,EAAW,GAAG,CAAA,CAAE,KAAA,IAAS,WAAW,CAAA,CAAE,KAAK,CAAA,EAAG,CAAA,CAAE,SAAS,CAAA;AAAA,gBAExD,QAAA,EAAA,CAAA,CAAE,OAAO,GAAG;AAAA,eAAA;AAAA,cAHR,CAAA,CAAE;AAAA,aAKV;AAAA;AAAA,SAAA;AAAA,QAvBI;AAAA,OAwBP;AAAA,IAEJ,CAAC,CAAA,EACH;AAAA,GAAA,EACF,CAAA,EACF,CAAA;AAEJ;ACzKO,SAAS,UAAA,CAAW;AAAA,EACzB,KAAA;AAAA,EACA,OAAA;AAAA,EACA,WAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAA;AAAA,EACA,IAAA;AAAA,EACA,SAAA;AAAA,EACA;AACF,CAAA,EAAoB;AAClB,EAAA,uBACEA,KAAC,KAAA,EAAA,EAAI,SAAA,EAAWC,GAAG,qBAAA,EAAuB,SAAS,CAAA,EAAG,aAAA,EAAa,MAAA,EACjE,QAAA,EAAA;AAAA,oBAAAD,IAAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,iEAAA,EACb,QAAA,EAAA;AAAA,sBAAAA,IAAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,iCAAA,EACZ,QAAA,EAAA;AAAA,QAAA,OAAA,oBACCE,GAAAA,CAAC,KAAA,EAAA,EAAI,WAAU,UAAA,EAAW,WAAA,EAAU,uBACjC,QAAA,EAAA,OAAA,EACH,CAAA;AAAA,wBAEFF,IAAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,SAAA,EACZ,QAAA,EAAA;AAAA,UAAA,OAAA,oBACCE,GAAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,6EACV,QAAA,EAAA,OAAA,EACH,CAAA;AAAA,0BAEFA,GAAAA,CAAC,IAAA,EAAA,EAAG,SAAA,EAAU,sEACX,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,UACC,+BACCA,GAAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,gDAAgD,QAAA,EAAA,WAAA,EAAY;AAAA,SAAA,EAE7E;AAAA,OAAA,EACF,CAAA;AAAA,MACC,2BAAWA,GAAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,oCAAoC,QAAA,EAAA,OAAA,EAAQ;AAAA,KAAA,EACzE,CAAA;AAAA,IACC,wBAAQA,GAAAA,CAAC,KAAA,EAAA,EAAI,WAAA,EAAU,oBAAoB,QAAA,EAAA,IAAA,EAAK;AAAA,GAAA,EACnD,CAAA;AAEJ","file":"chunk-X6U6L6BG.js","sourcesContent":["import type { ReactNode } from 'react'\nimport { ArrowDown, ArrowUp, ChevronsUpDown } from 'lucide-react'\nimport { cn } from '@arbidocs/react/ui'\nimport { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@arbidocs/react/ui'\nimport { tid } from '../lib/testid'\nimport { EmptyState } from './EmptyState'\n\nexport interface Column<T> {\n key: string\n header: ReactNode\n render: (row: T) => ReactNode\n align?: 'left' | 'right' | 'center'\n /** Header becomes a sort button (needs `sort` and `onSortChange` on the table). */\n isSortable?: boolean\n className?: string\n headClassName?: string\n}\n\nexport interface DataTableSort {\n key: string\n direction: 'asc' | 'desc'\n}\n\nexport interface DataTableTestIds {\n table: string\n empty: string\n /** Test id of a row. */\n row: (id: string) => string\n}\n\nexport interface DataTableProps<T> {\n columns: Column<T>[]\n rows: T[]\n getRowId: (row: T) => string\n onRowClick?: (row: T) => void\n /** Test id area prefix, e.g. \"orders\" gives rows \"orders-row-{id}\". Default \"data\". */\n area?: string\n /** Replaces the ids derived from `area`. */\n testIds?: Partial<DataTableTestIds>\n emptyTitle?: string\n emptyDescription?: string\n /** Controlled sort state. The host sorts `rows`; the table only renders headers. */\n sort?: DataTableSort | null\n onSortChange?: (sort: DataTableSort) => void\n /** Controlled row selection: adds a leading checkbox column when `onSelectedIdsChange` is set. */\n selectedIds?: string[]\n onSelectedIdsChange?: (ids: string[]) => void\n /** Accessible names of the selection checkboxes. */\n selectionLabels?: { selectAll: string; selectRow: string }\n className?: string\n}\n\nconst alignClass = { left: 'text-left', right: 'text-right', center: 'text-center' } as const\n\nconst DEFAULT_SELECTION_LABELS = { selectAll: 'Select all rows', selectRow: 'Select row' }\n\n/** The one true table. Column-config driven, fully test-id'd, optional navigation, sort, selection. */\nexport function DataTable<T>({\n columns,\n rows,\n getRowId,\n onRowClick,\n area = 'data',\n testIds,\n emptyTitle = 'Nothing to show',\n emptyDescription,\n sort,\n onSortChange,\n selectedIds,\n onSelectedIdsChange,\n selectionLabels,\n className,\n}: DataTableProps<T>) {\n const ids = {\n table: testIds?.table ?? tid(area, 'table'),\n empty: testIds?.empty ?? tid(area, 'empty'),\n row: testIds?.row ?? ((id: string) => tid(area, 'row', id)),\n }\n const labels = { ...DEFAULT_SELECTION_LABELS, ...selectionLabels }\n if (rows.length === 0) {\n return <EmptyState title={emptyTitle} description={emptyDescription} testId={ids.empty} />\n }\n\n const isSelectable = Boolean(onSelectedIdsChange)\n const selected = new Set(selectedIds ?? [])\n const rowIds = rows.map(getRowId)\n const allSelected = rowIds.length > 0 && rowIds.every((id) => selected.has(id))\n const toggleRow = (id: string) => {\n const next = new Set(selected)\n if (next.has(id)) next.delete(id)\n else next.add(id)\n onSelectedIdsChange?.([...next])\n }\n\n return (\n <div className={cn('rounded-lg border border-border bg-card', className)}>\n <Table data-testid={ids.table}>\n <TableHeader>\n <TableRow className=\"hover:bg-transparent\">\n {isSelectable && (\n <TableHead className=\"w-10\">\n <input\n type=\"checkbox\"\n aria-label={labels.selectAll}\n checked={allSelected}\n onChange={() => onSelectedIdsChange?.(allSelected ? [] : rowIds)}\n />\n </TableHead>\n )}\n {columns.map((c) => {\n const active = sort?.key === c.key ? sort : null\n const isSortable = c.isSortable && onSortChange\n return (\n <TableHead\n key={c.key}\n aria-sort={\n active ? (active.direction === 'asc' ? 'ascending' : 'descending') : undefined\n }\n className={cn(c.align && alignClass[c.align], c.headClassName)}\n >\n {isSortable ? (\n <button\n type=\"button\"\n className=\"inline-flex items-center gap-1 hover:text-foreground\"\n onClick={() =>\n onSortChange({\n key: c.key,\n direction: active?.direction === 'asc' ? 'desc' : 'asc',\n })\n }\n >\n {c.header}\n {active ? (\n active.direction === 'asc' ? (\n <ArrowUp className=\"size-3\" />\n ) : (\n <ArrowDown className=\"size-3\" />\n )\n ) : (\n <ChevronsUpDown className=\"size-3 opacity-50\" />\n )}\n </button>\n ) : (\n c.header\n )}\n </TableHead>\n )\n })}\n </TableRow>\n </TableHeader>\n <TableBody>\n {rows.map((row) => {\n const id = getRowId(row)\n return (\n <TableRow\n key={id}\n data-testid={ids.row(id)}\n data-state={selected.has(id) ? 'selected' : undefined}\n onClick={onRowClick ? () => onRowClick(row) : undefined}\n className={cn(onRowClick && 'cursor-pointer')}\n >\n {isSelectable && (\n <TableCell className=\"w-10\" onClick={(e) => e.stopPropagation()}>\n <input\n type=\"checkbox\"\n aria-label={labels.selectRow}\n checked={selected.has(id)}\n onChange={() => toggleRow(id)}\n />\n </TableCell>\n )}\n {columns.map((c) => (\n <TableCell\n key={c.key}\n className={cn(c.align && alignClass[c.align], c.className)}\n >\n {c.render(row)}\n </TableCell>\n ))}\n </TableRow>\n )\n })}\n </TableBody>\n </Table>\n </div>\n )\n}\n","import type { ReactNode } from 'react'\nimport { cn } from '@arbidocs/react/ui'\n\nexport interface PageHeaderProps {\n title: ReactNode\n eyebrow?: ReactNode\n description?: ReactNode\n /** Before the title block: a back button, an avatar or an icon. */\n leading?: ReactNode\n actions?: ReactNode\n /** Under the whole header: a tab strip or segmented control. */\n tabs?: ReactNode\n className?: string\n testId?: string\n}\n\n/** Standard page title block: leading + eyebrow + title + description + actions, then tabs. */\nexport function PageHeader({\n title,\n eyebrow,\n description,\n leading,\n actions,\n tabs,\n className,\n testId,\n}: PageHeaderProps) {\n return (\n <div className={cn('flex flex-col gap-3', className)} data-testid={testId}>\n <div className=\"flex flex-col gap-3 sm:flex-row sm:items-end sm:justify-between\">\n <div className=\"flex min-w-0 items-center gap-3\">\n {leading && (\n <div className=\"shrink-0\" data-slot=\"page-header-leading\">\n {leading}\n </div>\n )}\n <div className=\"min-w-0\">\n {eyebrow && (\n <p className=\"mb-1 text-xs font-semibold uppercase tracking-wider text-muted-foreground\">\n {eyebrow}\n </p>\n )}\n <h1 className=\"font-display text-2xl font-semibold tracking-tight text-foreground\">\n {title}\n </h1>\n {description && (\n <p className=\"mt-1 max-w-2xl text-sm text-muted-foreground\">{description}</p>\n )}\n </div>\n </div>\n {actions && <div className=\"flex shrink-0 items-center gap-2\">{actions}</div>}\n </div>\n {tabs && <div data-slot=\"page-header-tabs\">{tabs}</div>}\n </div>\n )\n}\n"]}
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  'use strict';
3
3
 
4
- var chunkZU2B2RZK_cjs = require('./chunk-ZU2B2RZK.cjs');
4
+ var chunkKUQOHPKP_cjs = require('./chunk-KUQOHPKP.cjs');
5
5
  var chunkZW6FPIFC_cjs = require('./chunk-ZW6FPIFC.cjs');
6
6
  var lucideReact = require('lucide-react');
7
7
  var ui = require('@arbidocs/react/ui');
@@ -26,9 +26,9 @@ function DataTable({
26
26
  className
27
27
  }) {
28
28
  const ids = {
29
- table: testIds?.table ?? chunkZU2B2RZK_cjs.tid(area, "table"),
30
- empty: testIds?.empty ?? chunkZU2B2RZK_cjs.tid(area, "empty"),
31
- row: testIds?.row ?? ((id) => chunkZU2B2RZK_cjs.tid(area, "row", id))
29
+ table: testIds?.table ?? chunkKUQOHPKP_cjs.tid(area, "table"),
30
+ empty: testIds?.empty ?? chunkKUQOHPKP_cjs.tid(area, "empty"),
31
+ row: testIds?.row ?? ((id) => chunkKUQOHPKP_cjs.tid(area, "row", id))
32
32
  };
33
33
  const labels = { ...DEFAULT_SELECTION_LABELS, ...selectionLabels };
34
34
  if (rows.length === 0) {
@@ -117,7 +117,33 @@ function DataTable({
117
117
  }) })
118
118
  ] }) });
119
119
  }
120
+ function PageHeader({
121
+ title,
122
+ eyebrow,
123
+ description,
124
+ leading,
125
+ actions,
126
+ tabs,
127
+ className,
128
+ testId
129
+ }) {
130
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ui.cn("flex flex-col gap-3", className), "data-testid": testId, children: [
131
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3 sm:flex-row sm:items-end sm:justify-between", children: [
132
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 items-center gap-3", children: [
133
+ leading && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shrink-0", "data-slot": "page-header-leading", children: leading }),
134
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0", children: [
135
+ eyebrow && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-1 text-xs font-semibold uppercase tracking-wider text-muted-foreground", children: eyebrow }),
136
+ /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "font-display text-2xl font-semibold tracking-tight text-foreground", children: title }),
137
+ description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 max-w-2xl text-sm text-muted-foreground", children: description })
138
+ ] })
139
+ ] }),
140
+ actions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex shrink-0 items-center gap-2", children: actions })
141
+ ] }),
142
+ tabs && /* @__PURE__ */ jsxRuntime.jsx("div", { "data-slot": "page-header-tabs", children: tabs })
143
+ ] });
144
+ }
120
145
 
121
146
  exports.DataTable = DataTable;
122
- //# sourceMappingURL=chunk-SQ5F5BFW.cjs.map
123
- //# sourceMappingURL=chunk-SQ5F5BFW.cjs.map
147
+ exports.PageHeader = PageHeader;
148
+ //# sourceMappingURL=chunk-XDU3HHUU.cjs.map
149
+ //# sourceMappingURL=chunk-XDU3HHUU.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/DataTable.tsx","../src/components/PageHeader.tsx"],"names":["tid","jsx","EmptyState","cn","jsxs","Table","TableHeader","TableRow","TableHead","ArrowUp","ArrowDown","ChevronsUpDown","TableBody","TableCell"],"mappings":"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","file":"chunk-XDU3HHUU.cjs","sourcesContent":["import type { ReactNode } from 'react'\nimport { ArrowDown, ArrowUp, ChevronsUpDown } from 'lucide-react'\nimport { cn } from '@arbidocs/react/ui'\nimport { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@arbidocs/react/ui'\nimport { tid } from '../lib/testid'\nimport { EmptyState } from './EmptyState'\n\nexport interface Column<T> {\n key: string\n header: ReactNode\n render: (row: T) => ReactNode\n align?: 'left' | 'right' | 'center'\n /** Header becomes a sort button (needs `sort` and `onSortChange` on the table). */\n isSortable?: boolean\n className?: string\n headClassName?: string\n}\n\nexport interface DataTableSort {\n key: string\n direction: 'asc' | 'desc'\n}\n\nexport interface DataTableTestIds {\n table: string\n empty: string\n /** Test id of a row. */\n row: (id: string) => string\n}\n\nexport interface DataTableProps<T> {\n columns: Column<T>[]\n rows: T[]\n getRowId: (row: T) => string\n onRowClick?: (row: T) => void\n /** Test id area prefix, e.g. \"orders\" gives rows \"orders-row-{id}\". Default \"data\". */\n area?: string\n /** Replaces the ids derived from `area`. */\n testIds?: Partial<DataTableTestIds>\n emptyTitle?: string\n emptyDescription?: string\n /** Controlled sort state. The host sorts `rows`; the table only renders headers. */\n sort?: DataTableSort | null\n onSortChange?: (sort: DataTableSort) => void\n /** Controlled row selection: adds a leading checkbox column when `onSelectedIdsChange` is set. */\n selectedIds?: string[]\n onSelectedIdsChange?: (ids: string[]) => void\n /** Accessible names of the selection checkboxes. */\n selectionLabels?: { selectAll: string; selectRow: string }\n className?: string\n}\n\nconst alignClass = { left: 'text-left', right: 'text-right', center: 'text-center' } as const\n\nconst DEFAULT_SELECTION_LABELS = { selectAll: 'Select all rows', selectRow: 'Select row' }\n\n/** The one true table. Column-config driven, fully test-id'd, optional navigation, sort, selection. */\nexport function DataTable<T>({\n columns,\n rows,\n getRowId,\n onRowClick,\n area = 'data',\n testIds,\n emptyTitle = 'Nothing to show',\n emptyDescription,\n sort,\n onSortChange,\n selectedIds,\n onSelectedIdsChange,\n selectionLabels,\n className,\n}: DataTableProps<T>) {\n const ids = {\n table: testIds?.table ?? tid(area, 'table'),\n empty: testIds?.empty ?? tid(area, 'empty'),\n row: testIds?.row ?? ((id: string) => tid(area, 'row', id)),\n }\n const labels = { ...DEFAULT_SELECTION_LABELS, ...selectionLabels }\n if (rows.length === 0) {\n return <EmptyState title={emptyTitle} description={emptyDescription} testId={ids.empty} />\n }\n\n const isSelectable = Boolean(onSelectedIdsChange)\n const selected = new Set(selectedIds ?? [])\n const rowIds = rows.map(getRowId)\n const allSelected = rowIds.length > 0 && rowIds.every((id) => selected.has(id))\n const toggleRow = (id: string) => {\n const next = new Set(selected)\n if (next.has(id)) next.delete(id)\n else next.add(id)\n onSelectedIdsChange?.([...next])\n }\n\n return (\n <div className={cn('rounded-lg border border-border bg-card', className)}>\n <Table data-testid={ids.table}>\n <TableHeader>\n <TableRow className=\"hover:bg-transparent\">\n {isSelectable && (\n <TableHead className=\"w-10\">\n <input\n type=\"checkbox\"\n aria-label={labels.selectAll}\n checked={allSelected}\n onChange={() => onSelectedIdsChange?.(allSelected ? [] : rowIds)}\n />\n </TableHead>\n )}\n {columns.map((c) => {\n const active = sort?.key === c.key ? sort : null\n const isSortable = c.isSortable && onSortChange\n return (\n <TableHead\n key={c.key}\n aria-sort={\n active ? (active.direction === 'asc' ? 'ascending' : 'descending') : undefined\n }\n className={cn(c.align && alignClass[c.align], c.headClassName)}\n >\n {isSortable ? (\n <button\n type=\"button\"\n className=\"inline-flex items-center gap-1 hover:text-foreground\"\n onClick={() =>\n onSortChange({\n key: c.key,\n direction: active?.direction === 'asc' ? 'desc' : 'asc',\n })\n }\n >\n {c.header}\n {active ? (\n active.direction === 'asc' ? (\n <ArrowUp className=\"size-3\" />\n ) : (\n <ArrowDown className=\"size-3\" />\n )\n ) : (\n <ChevronsUpDown className=\"size-3 opacity-50\" />\n )}\n </button>\n ) : (\n c.header\n )}\n </TableHead>\n )\n })}\n </TableRow>\n </TableHeader>\n <TableBody>\n {rows.map((row) => {\n const id = getRowId(row)\n return (\n <TableRow\n key={id}\n data-testid={ids.row(id)}\n data-state={selected.has(id) ? 'selected' : undefined}\n onClick={onRowClick ? () => onRowClick(row) : undefined}\n className={cn(onRowClick && 'cursor-pointer')}\n >\n {isSelectable && (\n <TableCell className=\"w-10\" onClick={(e) => e.stopPropagation()}>\n <input\n type=\"checkbox\"\n aria-label={labels.selectRow}\n checked={selected.has(id)}\n onChange={() => toggleRow(id)}\n />\n </TableCell>\n )}\n {columns.map((c) => (\n <TableCell\n key={c.key}\n className={cn(c.align && alignClass[c.align], c.className)}\n >\n {c.render(row)}\n </TableCell>\n ))}\n </TableRow>\n )\n })}\n </TableBody>\n </Table>\n </div>\n )\n}\n","import type { ReactNode } from 'react'\nimport { cn } from '@arbidocs/react/ui'\n\nexport interface PageHeaderProps {\n title: ReactNode\n eyebrow?: ReactNode\n description?: ReactNode\n /** Before the title block: a back button, an avatar or an icon. */\n leading?: ReactNode\n actions?: ReactNode\n /** Under the whole header: a tab strip or segmented control. */\n tabs?: ReactNode\n className?: string\n testId?: string\n}\n\n/** Standard page title block: leading + eyebrow + title + description + actions, then tabs. */\nexport function PageHeader({\n title,\n eyebrow,\n description,\n leading,\n actions,\n tabs,\n className,\n testId,\n}: PageHeaderProps) {\n return (\n <div className={cn('flex flex-col gap-3', className)} data-testid={testId}>\n <div className=\"flex flex-col gap-3 sm:flex-row sm:items-end sm:justify-between\">\n <div className=\"flex min-w-0 items-center gap-3\">\n {leading && (\n <div className=\"shrink-0\" data-slot=\"page-header-leading\">\n {leading}\n </div>\n )}\n <div className=\"min-w-0\">\n {eyebrow && (\n <p className=\"mb-1 text-xs font-semibold uppercase tracking-wider text-muted-foreground\">\n {eyebrow}\n </p>\n )}\n <h1 className=\"font-display text-2xl font-semibold tracking-tight text-foreground\">\n {title}\n </h1>\n {description && (\n <p className=\"mt-1 max-w-2xl text-sm text-muted-foreground\">{description}</p>\n )}\n </div>\n </div>\n {actions && <div className=\"flex shrink-0 items-center gap-2\">{actions}</div>}\n </div>\n {tabs && <div data-slot=\"page-header-tabs\">{tabs}</div>}\n </div>\n )\n}\n"]}
@@ -1,142 +1,15 @@
1
1
  "use client";
2
- import { getFontPairing, matchFontPairing, FONT_PAIRINGS } from './chunk-NHZK64TQ.js';
2
+ import { applyThemeVars } from './chunk-5ZBXFHZW.js';
3
+ import { getFontPairing } from './chunk-NHZK64TQ.js';
3
4
  import { initials } from './chunk-5VYJP6XD.js';
4
5
  import { create } from 'zustand';
5
6
  import { persist } from 'zustand/middleware';
6
- import { createContext, useState, useEffect, useContext } from 'react';
7
- import { RotateCcw, ChevronDown, Palette, ImageIcon, ArrowRight, Quote, X, Menu, Check, ArrowUpRight, Save } from 'lucide-react';
8
- import { Input, Card, CardHeader, CardTitle, CardContent, cn, Button, Avatar, AvatarImage, AvatarFallback, AiMarkdown } from '@arbidocs/react/ui';
7
+ import { cn, Button, Card, Avatar, AvatarImage, AvatarFallback, AiMarkdown } from '@arbidocs/react/ui';
9
8
  import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
9
+ import { createContext, useContext, useState } from 'react';
10
+ import { ImageIcon, ArrowRight, Quote, ChevronDown, X, Menu, Check, ArrowUpRight } from 'lucide-react';
10
11
  import * as TabsPrimitive from '@radix-ui/react-tabs';
11
12
 
12
- // src/theme/tokens.ts
13
- var THEME_STYLE_ID = "arbi-theme-vars";
14
- var TRIPLET_RE = /^-?\d+(?:\.\d+)?\s+-?\d+(?:\.\d+)?%\s+-?\d+(?:\.\d+)?%$/;
15
- function parseRgb(color) {
16
- if (color.startsWith("#")) {
17
- let hex = color.slice(1);
18
- if (hex.length === 3) {
19
- hex = hex.split("").map((ch) => ch + ch).join("");
20
- }
21
- if (hex.length === 6 && /^[0-9a-fA-F]{6}$/.test(hex)) {
22
- return {
23
- r: parseInt(hex.slice(0, 2), 16),
24
- g: parseInt(hex.slice(2, 4), 16),
25
- b: parseInt(hex.slice(4, 6), 16)
26
- };
27
- }
28
- return null;
29
- }
30
- const m = color.match(/^rgba?\(\s*([\d.]+)[\s,]+([\d.]+)[\s,]+([\d.]+)/i);
31
- if (m) return { r: Number(m[1]), g: Number(m[2]), b: Number(m[3]) };
32
- return null;
33
- }
34
- function rgbToHslTriplet(r, g, b) {
35
- const rn = r / 255;
36
- const gn = g / 255;
37
- const bn = b / 255;
38
- const max = Math.max(rn, gn, bn);
39
- const min = Math.min(rn, gn, bn);
40
- const l = (max + min) / 2;
41
- const d = max - min;
42
- let h = 0;
43
- let s = 0;
44
- if (d !== 0) {
45
- s = d / (1 - Math.abs(2 * l - 1));
46
- switch (max) {
47
- case rn:
48
- h = 60 * ((gn - bn) / d % 6);
49
- break;
50
- case gn:
51
- h = 60 * ((bn - rn) / d + 2);
52
- break;
53
- default:
54
- h = 60 * ((rn - gn) / d + 4);
55
- break;
56
- }
57
- }
58
- if (h < 0) h += 360;
59
- return `${Math.round(h)} ${Math.round(s * 100)}% ${Math.round(l * 100)}%`;
60
- }
61
- function toHslTriplet(color) {
62
- const c = color.trim();
63
- if (TRIPLET_RE.test(c)) return c;
64
- const rgb = parseRgb(c);
65
- if (!rgb) return c;
66
- return rgbToHslTriplet(rgb.r, rgb.g, rgb.b);
67
- }
68
- function renderTripletBlock(colors) {
69
- return Object.entries(colors).map(([key, value]) => ` --${key}: ${toHslTriplet(value)};`).join("\n");
70
- }
71
- function emitCssVars(theme, dark) {
72
- if (typeof document === "undefined") return;
73
- const meta = [
74
- ` --font-display: ${theme.fonts.display};`,
75
- ` --font-sans: ${theme.fonts.sans};`,
76
- ` --radius: ${theme.radius}rem;`
77
- ].join("\n");
78
- let css = `:root {
79
- ${renderTripletBlock(theme.colors)}
80
- ${meta}
81
- }`;
82
- if (dark) {
83
- css += `
84
- :root.dark {
85
- ${renderTripletBlock(dark)}
86
- }`;
87
- }
88
- let style = document.getElementById(THEME_STYLE_ID);
89
- if (!style) {
90
- style = document.createElement("style");
91
- style.id = THEME_STYLE_ID;
92
- document.head.appendChild(style);
93
- }
94
- style.textContent = css;
95
- }
96
- function removeCssVars() {
97
- if (typeof document === "undefined") return;
98
- document.getElementById(THEME_STYLE_ID)?.remove();
99
- }
100
- function normalizeOptions(optionsOrRoot) {
101
- if (typeof HTMLElement !== "undefined" && optionsOrRoot instanceof HTMLElement) {
102
- return { root: optionsOrRoot };
103
- }
104
- return optionsOrRoot;
105
- }
106
- function applyThemeVars(theme, optionsOrRoot = {}) {
107
- const { mode = "flat", dark, root = document.documentElement } = normalizeOptions(optionsOrRoot);
108
- if (mode === "cssVars") {
109
- emitCssVars(theme, dark);
110
- return;
111
- }
112
- for (const [key, value] of Object.entries(theme.colors)) {
113
- root.style.setProperty(`--color-${key}`, value);
114
- }
115
- root.style.setProperty("--font-display", theme.fonts.display);
116
- root.style.setProperty("--font-sans", theme.fonts.sans);
117
- root.style.setProperty("--radius", `${theme.radius}rem`);
118
- }
119
- function applyFontVars(fonts, root = document.documentElement) {
120
- root.style.setProperty("--font-display", fonts.display);
121
- root.style.setProperty("--font-sans", fonts.sans);
122
- }
123
- function clearFontVars(root = document.documentElement) {
124
- root.style.removeProperty("--font-display");
125
- root.style.removeProperty("--font-sans");
126
- }
127
- function clearThemeVars(theme, optionsOrRoot = {}) {
128
- const { mode = "flat", root = document.documentElement } = normalizeOptions(optionsOrRoot);
129
- if (mode === "cssVars") {
130
- removeCssVars();
131
- return;
132
- }
133
- for (const key of Object.keys(theme.colors)) {
134
- root.style.removeProperty(`--color-${key}`);
135
- }
136
- root.style.removeProperty("--font-display");
137
- root.style.removeProperty("--font-sans");
138
- root.style.removeProperty("--radius");
139
- }
140
13
  function createThemeStore(config) {
141
14
  const { defaultTheme, presets, storageKey } = config;
142
15
  const useStore = create()(
@@ -184,294 +57,6 @@ function applyStoredTheme(bundle) {
184
57
  const { colors, fonts, radius } = bundle.useStore.getState();
185
58
  applyThemeVars({ colors, fonts, radius }, { mode: bundle.mode, dark: bundle.darkColors });
186
59
  }
187
- function ThemeEditor({
188
- bundle,
189
- variant = "panel",
190
- preview,
191
- onSave,
192
- testIdPrefix = "theme",
193
- defaultOpen = false
194
- }) {
195
- const { useStore, tokens, presets, groupLabels, mode, darkColors } = bundle;
196
- const colors = useStore((s) => s.colors);
197
- const fonts = useStore((s) => s.fonts);
198
- const radius = useStore((s) => s.radius);
199
- const activePresetId = useStore((s) => s.activePresetId);
200
- const setColor = useStore((s) => s.setColor);
201
- const setFont = useStore((s) => s.setFont);
202
- const setFontPairing = useStore((s) => s.setFontPairing);
203
- const setRadius = useStore((s) => s.setRadius);
204
- const applyPreset = useStore((s) => s.applyPreset);
205
- const reset = useStore((s) => s.reset);
206
- const [open, setOpen] = useState(defaultOpen);
207
- const [saving, setSaving] = useState(false);
208
- const [savedVia, setSavedVia] = useState(null);
209
- useEffect(() => {
210
- applyThemeVars({ colors, fonts, radius }, { mode, dark: darkColors });
211
- }, [colors, fonts, radius, mode, darkColors]);
212
- const tid = (suffix) => `${testIdPrefix}-${suffix}`;
213
- const groups = [...new Set(tokens.map((t) => t.group))];
214
- const save = async () => {
215
- if (!onSave) return;
216
- setSaving(true);
217
- try {
218
- const via = await onSave();
219
- setSavedVia(typeof via === "string" ? via : "saved");
220
- } catch {
221
- setSavedVia(null);
222
- } finally {
223
- setSaving(false);
224
- }
225
- };
226
- const Presets = /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
227
- presets.map((p) => /* @__PURE__ */ jsx(
228
- "button",
229
- {
230
- type: "button",
231
- onClick: () => applyPreset(p.id),
232
- className: `rounded-full border px-3 py-1 text-xs font-medium transition-colors ${activePresetId === p.id ? "border-primary bg-primary text-primary-foreground" : "border-border text-foreground hover:border-primary"}`,
233
- "data-testid": tid(`preset-${p.id}`),
234
- children: p.label
235
- },
236
- p.id
237
- )),
238
- /* @__PURE__ */ jsxs(
239
- "button",
240
- {
241
- type: "button",
242
- onClick: reset,
243
- className: "ml-auto inline-flex items-center gap-1.5 text-xs font-medium text-muted-foreground hover:text-foreground",
244
- "data-testid": tid("reset"),
245
- children: [
246
- /* @__PURE__ */ jsx(RotateCcw, { className: "size-3" }),
247
- " Reset"
248
- ]
249
- }
250
- )
251
- ] });
252
- const colorRow = (k, label) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
253
- /* @__PURE__ */ jsx(
254
- "input",
255
- {
256
- type: "color",
257
- value: colors[k] ?? "#000000",
258
- onChange: (e) => setColor(k, e.target.value),
259
- className: "size-9 shrink-0 cursor-pointer rounded-md border border-border bg-transparent",
260
- "aria-label": label,
261
- "data-testid": tid(`color-${k}`)
262
- }
263
- ),
264
- /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
265
- /* @__PURE__ */ jsx("span", { className: "block text-xs text-muted-foreground", children: label }),
266
- /* @__PURE__ */ jsx(
267
- Input,
268
- {
269
- value: colors[k] ?? "",
270
- onChange: (e) => setColor(k, e.target.value),
271
- "aria-label": `${label} hex value`,
272
- className: "bg-card placeholder:text-muted-foreground focus-visible:border-ring/60 focus-visible:ring-2 focus-visible:ring-ring h-7 font-mono text-xs",
273
- "data-testid": tid(`hex-${k}`)
274
- }
275
- )
276
- ] })
277
- ] }, k);
278
- const activePairing = matchFontPairing(fonts);
279
- const Typography = /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
280
- /* @__PURE__ */ jsxs("div", { children: [
281
- /* @__PURE__ */ jsx("span", { className: "block text-xs text-muted-foreground", children: "Typeface" }),
282
- /* @__PURE__ */ jsxs(
283
- "select",
284
- {
285
- value: activePairing?.id ?? "",
286
- onChange: (e) => setFontPairing(e.target.value),
287
- "aria-label": "Typeface",
288
- className: "mt-1 h-8 w-full rounded-md border border-border bg-card px-2 text-xs text-foreground focus-visible:border-ring/60 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
289
- "data-testid": tid("font-pairing"),
290
- children: [
291
- !activePairing && /* @__PURE__ */ jsx("option", { value: "", children: "Custom" }),
292
- FONT_PAIRINGS.map((pairing) => /* @__PURE__ */ jsx("option", { value: pairing.id, children: pairing.label }, pairing.id))
293
- ]
294
- }
295
- ),
296
- /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-muted-foreground", children: activePairing?.description ?? "Hand-edited font stacks." })
297
- ] }),
298
- /* @__PURE__ */ jsxs("div", { children: [
299
- /* @__PURE__ */ jsx("span", { className: "block text-xs text-muted-foreground", children: "Display font stack" }),
300
- /* @__PURE__ */ jsx(
301
- Input,
302
- {
303
- value: fonts.display,
304
- onChange: (e) => setFont("display", e.target.value),
305
- "aria-label": "Display font stack",
306
- className: "bg-card placeholder:text-muted-foreground focus-visible:border-ring/60 focus-visible:ring-2 focus-visible:ring-ring mt-1 font-mono text-xs",
307
- "data-testid": tid("font-display")
308
- }
309
- )
310
- ] }),
311
- /* @__PURE__ */ jsxs("div", { children: [
312
- /* @__PURE__ */ jsx("span", { className: "block text-xs text-muted-foreground", children: "Body font stack" }),
313
- /* @__PURE__ */ jsx(
314
- Input,
315
- {
316
- value: fonts.sans,
317
- onChange: (e) => setFont("sans", e.target.value),
318
- "aria-label": "Body font stack",
319
- className: "bg-card placeholder:text-muted-foreground focus-visible:border-ring/60 focus-visible:ring-2 focus-visible:ring-ring mt-1 font-mono text-xs",
320
- "data-testid": tid("font-sans")
321
- }
322
- )
323
- ] }),
324
- /* @__PURE__ */ jsxs("div", { children: [
325
- /* @__PURE__ */ jsxs("span", { className: "block text-xs text-muted-foreground", children: [
326
- "Base radius \u2014 ",
327
- radius,
328
- "rem"
329
- ] }),
330
- /* @__PURE__ */ jsx(
331
- "input",
332
- {
333
- type: "range",
334
- min: 0,
335
- max: 1.5,
336
- step: 0.125,
337
- value: radius,
338
- onChange: (e) => setRadius(Number(e.target.value)),
339
- "aria-label": "Base radius",
340
- className: "mt-2 w-full accent-[color:var(--color-primary)]",
341
- "data-testid": tid("radius")
342
- }
343
- )
344
- ] })
345
- ] });
346
- const Preview = /* @__PURE__ */ jsxs(Card, { variant: "elevated", className: "rounded-lg", "data-testid": tid("preview"), children: [
347
- /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { className: "text-base", children: "Live preview" }) }),
348
- /* @__PURE__ */ jsxs(CardContent, { className: "space-y-3", children: [
349
- /* @__PURE__ */ jsxs("div", { className: "rounded-[var(--radius)] bg-primary p-4 text-primary-foreground", children: [
350
- /* @__PURE__ */ jsx("p", { className: "font-display text-lg font-semibold", children: preview?.title ?? "Preview" }),
351
- preview?.subtitle && /* @__PURE__ */ jsx("p", { className: "text-xs opacity-80", children: preview.subtitle })
352
- ] }),
353
- /* @__PURE__ */ jsx("div", { className: "grid grid-cols-6 gap-1.5", children: tokens.map((t) => /* @__PURE__ */ jsx(
354
- "div",
355
- {
356
- title: t.label,
357
- className: "aspect-square rounded-md border border-border",
358
- style: { background: `var(--color-${t.key})` }
359
- },
360
- t.key
361
- )) }),
362
- /* @__PURE__ */ jsxs("div", { className: "rounded-[var(--radius)] border border-border bg-[color:var(--color-ai-accent-soft,var(--color-accent))] p-3", children: [
363
- /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-[color:var(--color-ai-accent,var(--color-primary))]", children: "AI action surface" }),
364
- /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Themed by the AI-kit accent tokens." })
365
- ] })
366
- ] })
367
- ] });
368
- const SaveBar = onSave && /* @__PURE__ */ jsxs("div", { className: "mt-6 flex items-center gap-3", children: [
369
- /* @__PURE__ */ jsxs(
370
- "button",
371
- {
372
- type: "button",
373
- onClick: () => void save(),
374
- disabled: saving,
375
- className: "inline-flex items-center gap-1.5 rounded-md bg-primary px-3 py-2 text-sm font-medium text-primary-foreground hover:opacity-90 disabled:opacity-60",
376
- "data-testid": tid("save"),
377
- children: [
378
- savedVia ? /* @__PURE__ */ jsx(Check, { className: "size-4" }) : /* @__PURE__ */ jsx(Save, { className: "size-4" }),
379
- saving ? "Saving\u2026" : savedVia ? "Saved" : "Save theme"
380
- ]
381
- }
382
- ),
383
- savedVia && /* @__PURE__ */ jsxs("span", { className: "text-xs text-muted-foreground", "data-testid": tid("via"), children: [
384
- "stored via ",
385
- savedVia
386
- ] })
387
- ] });
388
- if (variant === "collapsed") {
389
- const controlsId = `${testIdPrefix}-controls`;
390
- return /* @__PURE__ */ jsxs("div", { className: "space-y-3", "data-testid": testIdPrefix, children: [
391
- Presets,
392
- /* @__PURE__ */ jsx("div", { className: "grid grid-cols-8 gap-1.5 @xl:grid-cols-12", "aria-hidden": "true", children: tokens.slice(0, 12).map((t) => /* @__PURE__ */ jsx(
393
- "div",
394
- {
395
- title: t.label,
396
- className: "aspect-square rounded-md border border-border",
397
- style: { background: `var(--color-${t.key})` }
398
- },
399
- t.key
400
- )) }),
401
- /* @__PURE__ */ jsxs(
402
- "button",
403
- {
404
- type: "button",
405
- onClick: () => setOpen((o) => !o),
406
- "aria-expanded": open,
407
- "aria-controls": controlsId,
408
- className: "inline-flex items-center gap-1.5 text-sm font-medium text-foreground hover:text-primary",
409
- "data-testid": tid("customize"),
410
- children: [
411
- /* @__PURE__ */ jsx(ChevronDown, { className: `size-4 transition-transform ${open ? "rotate-180" : ""}` }),
412
- "Customize colours and type"
413
- ]
414
- }
415
- ),
416
- open && /* @__PURE__ */ jsxs(
417
- "div",
418
- {
419
- id: controlsId,
420
- className: "max-h-[28rem] overflow-y-auto rounded-md border border-border bg-card p-4",
421
- "data-testid": tid("controls"),
422
- children: [
423
- /* @__PURE__ */ jsx("p", { className: "mb-2 text-xs font-semibold uppercase tracking-[0.14em] text-muted-foreground", children: "Colours" }),
424
- /* @__PURE__ */ jsx("div", { className: "grid gap-3 @xl:grid-cols-2", children: tokens.map((t) => colorRow(t.key, t.label)) }),
425
- /* @__PURE__ */ jsx("p", { className: "mt-6 mb-2 text-xs font-semibold uppercase tracking-[0.14em] text-muted-foreground", children: "Typography & shape" }),
426
- Typography
427
- ]
428
- }
429
- ),
430
- SaveBar
431
- ] });
432
- }
433
- if (variant === "drawer") {
434
- return /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col overflow-y-auto bg-card p-5", "data-testid": testIdPrefix, children: [
435
- /* @__PURE__ */ jsx("div", { className: "mb-4 flex items-center justify-between", children: /* @__PURE__ */ jsx("h2", { className: "font-display text-lg font-semibold text-foreground", children: "Theme" }) }),
436
- Presets,
437
- /* @__PURE__ */ jsx("p", { className: "mt-5 mb-2 text-xs font-semibold uppercase tracking-[0.14em] text-muted-foreground", children: "Colours" }),
438
- /* @__PURE__ */ jsx("div", { className: "space-y-3", children: tokens.map((t) => colorRow(t.key, t.label)) }),
439
- /* @__PURE__ */ jsx("p", { className: "mt-6 mb-2 text-xs font-semibold uppercase tracking-[0.14em] text-muted-foreground", children: "Typography & shape" }),
440
- Typography,
441
- SaveBar
442
- ] });
443
- }
444
- return /* @__PURE__ */ jsxs("div", { className: "grid gap-6 lg:grid-cols-[1fr_320px]", "data-testid": testIdPrefix, children: [
445
- /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
446
- /* @__PURE__ */ jsxs(Card, { variant: "elevated", className: "rounded-lg", children: [
447
- /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsxs(CardTitle, { className: "flex items-center gap-2 text-base", children: [
448
- /* @__PURE__ */ jsx(Palette, { className: "size-4 text-[color:var(--color-primary)]" }),
449
- " Presets"
450
- ] }) }),
451
- /* @__PURE__ */ jsx(CardContent, { children: Presets })
452
- ] }),
453
- groups.map((group) => /* @__PURE__ */ jsxs(
454
- Card,
455
- {
456
- variant: "elevated",
457
- className: "rounded-lg",
458
- "data-testid": tid(`group-${group}`),
459
- children: [
460
- /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { className: "text-base", children: groupLabels[group] ?? group }) }),
461
- /* @__PURE__ */ jsx(CardContent, { className: "grid gap-3 @xl:grid-cols-2", children: tokens.filter((t) => t.group === group).map((t) => colorRow(t.key, t.label)) })
462
- ]
463
- },
464
- group
465
- )),
466
- /* @__PURE__ */ jsxs(Card, { variant: "elevated", className: "rounded-lg", children: [
467
- /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { className: "text-base", children: "Typography & shape" }) }),
468
- /* @__PURE__ */ jsx(CardContent, { children: Typography })
469
- ] }),
470
- SaveBar
471
- ] }),
472
- /* @__PURE__ */ jsx("div", { className: "lg:sticky lg:top-4 lg:self-start", children: Preview })
473
- ] });
474
- }
475
60
  function SectionHeading({
476
61
  eyebrow,
477
62
  title,
@@ -1605,6 +1190,6 @@ function TestimonialGrid({ items, columns = "3", testId }) {
1605
1190
  )) });
1606
1191
  }
1607
1192
 
1608
- export { ASSET_REF_PREFIX, Accordion, AssetResolverProvider, AvatarBlock, Banner, BlockImage, BlockLink, CTABanner, Columns, ContactForm, Container, EditorialProfileCard, EditorialToneContext, FAQ, FeatureGrid, Footer, Gallery, Hero, ListBlock, LogoCloud, MediaText, Navbar, PricingTable, RichTextBlock, SectionHeading, Spacer, Steps, THEME_STYLE_ID, Tabs, TeamGrid, Testimonial, TestimonialGrid, ThemeEditor, VideoEmbed, applyFontVars, applyStoredTheme, applyThemeVars, asAssetRef, assetRefId, clearFontVars, clearThemeVars, createThemeStore, formatIndex, isAssetRef, toEmbedUrl, toHslTriplet, useAssetRenderer, useAssetResolverActive, useEditorialTone };
1609
- //# sourceMappingURL=chunk-SKVVOEMX.js.map
1610
- //# sourceMappingURL=chunk-SKVVOEMX.js.map
1193
+ export { ASSET_REF_PREFIX, Accordion, AssetResolverProvider, AvatarBlock, Banner, BlockImage, BlockLink, CTABanner, Columns, ContactForm, Container, EditorialProfileCard, EditorialToneContext, FAQ, FeatureGrid, Footer, Gallery, Hero, ListBlock, LogoCloud, MediaText, Navbar, PricingTable, RichTextBlock, SectionHeading, Spacer, Steps, Tabs, TeamGrid, Testimonial, TestimonialGrid, VideoEmbed, applyStoredTheme, asAssetRef, assetRefId, createThemeStore, formatIndex, isAssetRef, toEmbedUrl, useAssetRenderer, useAssetResolverActive, useEditorialTone };
1194
+ //# sourceMappingURL=chunk-XXUPUXBF.js.map
1195
+ //# sourceMappingURL=chunk-XXUPUXBF.js.map