@panneau/lists 5.0.0-alpha.1 → 5.0.0-alpha.11

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 (114) hide show
  1. package/README.md +3 -3
  2. package/dist/ItemDetails.css +34 -0
  3. package/dist/ItemDetails.d.ts +18 -0
  4. package/dist/ItemDetails.d.ts.map +1 -0
  5. package/dist/ItemDetails.js +104 -0
  6. package/dist/ItemDetails.js.map +1 -0
  7. package/dist/ItemDetails.module.js +16 -0
  8. package/dist/ItemDetails.module.js.map +1 -0
  9. package/dist/List.d.ts +2 -2
  10. package/dist/List.js +54 -12
  11. package/dist/List.js.map +1 -1
  12. package/dist/ListSkeleton.d.ts +17 -0
  13. package/dist/ListSkeleton.d.ts.map +1 -0
  14. package/dist/ListSkeleton.js +111 -0
  15. package/dist/ListSkeleton.js.map +1 -0
  16. package/dist/ListView.css +16 -16
  17. package/dist/ListView.d.ts +35 -6
  18. package/dist/ListView.d.ts.map +1 -1
  19. package/dist/ListView.js +544 -211
  20. package/dist/ListView.js.map +1 -1
  21. package/dist/ListView.module.js +10 -10
  22. package/dist/actions/ActionButton.d.ts +1 -1
  23. package/dist/actions/ActionButton.d.ts.map +1 -1
  24. package/dist/actions/ActionButton.js +96 -26
  25. package/dist/actions/ActionButton.js.map +1 -1
  26. package/dist/actions/Actions.css +8 -42
  27. package/dist/actions/Actions.module.js +5 -9
  28. package/dist/actions/Actions.module.js.map +1 -1
  29. package/dist/actions/ConfirmDialog.d.ts +15 -3
  30. package/dist/actions/ConfirmDialog.d.ts.map +1 -1
  31. package/dist/actions/ConfirmDialog.js +103 -89
  32. package/dist/actions/ConfirmDialog.js.map +1 -1
  33. package/dist/actions/RowActions.d.ts +6 -7
  34. package/dist/actions/RowActions.d.ts.map +1 -1
  35. package/dist/actions/RowActions.js +59 -53
  36. package/dist/actions/RowActions.js.map +1 -1
  37. package/dist/actions/actions.d.ts +5 -4
  38. package/dist/actions/actions.d.ts.map +1 -1
  39. package/dist/actions/actions.js +7 -14
  40. package/dist/actions/actions.js.map +1 -1
  41. package/dist/actions/icons.js.map +1 -1
  42. package/dist/cx.js.map +1 -1
  43. package/dist/displays/Displays.css +25 -13
  44. package/dist/displays/Displays.module.js +18 -14
  45. package/dist/displays/Displays.module.js.map +1 -1
  46. package/dist/displays/displays.d.ts +18 -3
  47. package/dist/displays/displays.d.ts.map +1 -1
  48. package/dist/displays/displays.js +355 -12
  49. package/dist/displays/displays.js.map +1 -1
  50. package/dist/filters/Filters.css +34 -20
  51. package/dist/filters/Filters.d.ts +1 -1
  52. package/dist/filters/Filters.js.map +1 -1
  53. package/dist/filters/Filters.module.js +13 -9
  54. package/dist/filters/Filters.module.js.map +1 -1
  55. package/dist/filters/controls.d.ts +1 -1
  56. package/dist/filters/controls.d.ts.map +1 -1
  57. package/dist/filters/controls.js +57 -35
  58. package/dist/filters/controls.js.map +1 -1
  59. package/dist/filters/format.d.ts +1 -1
  60. package/dist/filters/format.js.map +1 -1
  61. package/dist/index.d.ts +19 -18
  62. package/dist/index.d.ts.map +1 -1
  63. package/dist/index.js +4 -3
  64. package/dist/layouts/CardsLayout.css +22 -11
  65. package/dist/layouts/CardsLayout.d.ts +2 -2
  66. package/dist/layouts/CardsLayout.d.ts.map +1 -1
  67. package/dist/layouts/CardsLayout.js +39 -35
  68. package/dist/layouts/CardsLayout.js.map +1 -1
  69. package/dist/layouts/CardsLayout.module.js +8 -8
  70. package/dist/layouts/CardsLayout.module.js.map +1 -1
  71. package/dist/layouts/ItemTitle.d.ts +3 -1
  72. package/dist/layouts/ItemTitle.d.ts.map +1 -1
  73. package/dist/layouts/ItemTitle.js +12 -8
  74. package/dist/layouts/ItemTitle.js.map +1 -1
  75. package/dist/layouts/TableLayout.css +60 -35
  76. package/dist/layouts/TableLayout.d.ts +2 -2
  77. package/dist/layouts/TableLayout.d.ts.map +1 -1
  78. package/dist/layouts/TableLayout.js +38 -33
  79. package/dist/layouts/TableLayout.js.map +1 -1
  80. package/dist/layouts/TableLayout.module.js +14 -14
  81. package/dist/layouts/TableLayout.module.js.map +1 -1
  82. package/dist/layouts/builtIn.d.ts +1 -1
  83. package/dist/layouts/builtIn.js.map +1 -1
  84. package/dist/layouts/link.css +3 -3
  85. package/dist/layouts/link.module.js +1 -1
  86. package/dist/plugin.d.ts +1 -1
  87. package/dist/plugin.js.map +1 -1
  88. package/dist/query.d.ts +1 -1
  89. package/dist/query.js.map +1 -1
  90. package/dist/selection.d.ts +1 -1
  91. package/dist/selection.js.map +1 -1
  92. package/dist/toolbar/LayoutSwitch.js.map +1 -1
  93. package/dist/toolbar/Pagination.d.ts +33 -0
  94. package/dist/toolbar/Pagination.d.ts.map +1 -1
  95. package/dist/toolbar/Pagination.js +282 -42
  96. package/dist/toolbar/Pagination.js.map +1 -1
  97. package/dist/toolbar/SearchField.js.map +1 -1
  98. package/dist/toolbar/SortSelect.d.ts +1 -1
  99. package/dist/toolbar/SortSelect.js.map +1 -1
  100. package/dist/toolbar/Toolbar.css +12 -12
  101. package/dist/toolbar/Toolbar.module.js +7 -7
  102. package/dist/types.d.ts +16 -1
  103. package/dist/types.d.ts.map +1 -1
  104. package/dist/useDraft.js.map +1 -1
  105. package/dist/useListState.js.map +1 -1
  106. package/dist/useRenderValue.d.ts +8 -0
  107. package/dist/useRenderValue.d.ts.map +1 -0
  108. package/dist/useRenderValue.js +64 -0
  109. package/dist/useRenderValue.js.map +1 -0
  110. package/dist/values.d.ts +3 -1
  111. package/dist/values.d.ts.map +1 -1
  112. package/dist/values.js +6 -2
  113. package/dist/values.js.map +1 -1
  114. package/package.json +9 -9
@@ -1 +1 @@
1
- {"version":3,"file":"selection.js","names":[],"sources":["../src/selection.ts"],"sourcesContent":["import type { ListSelection } from '@panneau/core';\n\nimport type { ListItem } from './types';\n\n// The selection is read from the subscribed state, not through the methods of the list\n// (`list.isSelected()`): under the React Compiler, a component that calls a method of an object\n// that doesn't change would keep its first result.\n\n/** Whether an item is selected. */\nexport function isItemSelected(selection: ListSelection, id: string): boolean {\n return selection.mode === 'all' ? !selection.except.includes(id) : selection.ids.includes(id);\n}\n\n/** How many items are selected, given the total of the list (or the count of items without it). */\nexport function countSelected(selection: ListSelection, total: number): number {\n return selection.mode === 'all'\n ? Math.max(0, total - selection.except.length)\n : selection.ids.length;\n}\n\n/** Whether every, some or none of the items of a page are selected. */\nexport function getPageSelection(\n selection: ListSelection,\n items: readonly ListItem[],\n): 'all' | 'some' | 'none' {\n const selected = items.filter((item) => isItemSelected(selection, item.id)).length;\n if (selected === 0 || items.length === 0) {\n return 'none';\n }\n return selected === items.length ? 'all' : 'some';\n}\n"],"mappings":";;AASA,SAAgB,eAAe,WAA0B,IAAqB;CAC1E,OAAO,UAAU,SAAS,QAAQ,CAAC,UAAU,OAAO,SAAS,EAAE,IAAI,UAAU,IAAI,SAAS,EAAE;AAChG;;AAGA,SAAgB,cAAc,WAA0B,OAAuB;CAC3E,OAAO,UAAU,SAAS,QACpB,KAAK,IAAI,GAAG,QAAQ,UAAU,OAAO,MAAM,IAC3C,UAAU,IAAI;AACxB;;AAGA,SAAgB,iBACZ,WACA,OACuB;CACvB,MAAM,WAAW,MAAM,QAAQ,SAAS,eAAe,WAAW,KAAK,EAAE,CAAC,CAAC,CAAC;CAC5E,IAAI,aAAa,KAAK,MAAM,WAAW,GACnC,OAAO;CAEX,OAAO,aAAa,MAAM,SAAS,QAAQ;AAC/C"}
1
+ {"version":3,"file":"selection.js","names":["ListSelection","ListItem","isItemSelected","selection","id","mode","except","includes","ids","countSelected","total","Math","max","length","getPageSelection","items","selected","filter","item"],"sources":["../src/selection.ts"],"sourcesContent":["import type { ListSelection } from '@panneau/core';\n\nimport type { ListItem } from './types';\n\n// The selection is read from the subscribed state, not through the methods of the list\n// (`list.isSelected()`): under the React Compiler, a component that calls a method of an object\n// that doesn't change would keep its first result.\n\n/** Whether an item is selected. */\nexport function isItemSelected(selection: ListSelection, id: string): boolean {\n return selection.mode === 'all' ? !selection.except.includes(id) : selection.ids.includes(id);\n}\n\n/** How many items are selected, given the total of the list (or the count of items without it). */\nexport function countSelected(selection: ListSelection, total: number): number {\n return selection.mode === 'all'\n ? Math.max(0, total - selection.except.length)\n : selection.ids.length;\n}\n\n/** Whether every, some or none of the items of a page are selected. */\nexport function getPageSelection(\n selection: ListSelection,\n items: readonly ListItem[],\n): 'all' | 'some' | 'none' {\n const selected = items.filter((item) => isItemSelected(selection, item.id)).length;\n if (selected === 0 || items.length === 0) {\n return 'none';\n }\n return selected === items.length ? 'all' : 'some';\n}\n"],"mappings":";;AASA,SAAgBE,eAAeC,WAA0BC,IAAqB;CAC1E,OAAOD,UAAUE,SAAS,QAAQ,CAACF,UAAUG,OAAOC,SAASH,EAAE,IAAID,UAAUK,IAAID,SAASH,EAAE;AAChG;;AAGA,SAAgBK,cAAcN,WAA0BO,OAAuB;CAC3E,OAAOP,UAAUE,SAAS,QACpBM,KAAKC,IAAI,GAAGF,QAAQP,UAAUG,OAAOO,MAAM,IAC3CV,UAAUK,IAAIK;AACxB;;AAGA,SAAgBC,iBACZX,WACAY,OACuB;CACvB,MAAMC,WAAWD,MAAME,QAAQC,SAAShB,eAAeC,WAAWe,KAAKd,EAAE,CAAC,CAAC,CAACS;CAC5E,IAAIG,aAAa,KAAKD,MAAMF,WAAW,GACnC,OAAO;CAEX,OAAOG,aAAaD,MAAMF,SAAS,QAAQ;AAC/C"}
@@ -1 +1 @@
1
- {"version":3,"file":"LayoutSwitch.js","names":["layout","label","_c","styles"],"sources":["../../src/toolbar/LayoutSwitch.tsx"],"sourcesContent":["import { LayoutGrid, type LucideIcon, Rows3, Square } from 'lucide-react';\nimport { ToggleButton, ToggleButtonGroup } from 'react-aria-components';\n\nimport { Icon, Tooltip, usePanneauIntl } from '@panneau/ui';\n\nimport { messages } from '../messages';\nimport styles from './Toolbar.module.css';\n\nconst ICONS: Record<string, LucideIcon> = { table: Rows3, cards: LayoutGrid };\n\nexport interface LayoutSwitchProps {\n layouts: readonly string[];\n value: string;\n onChange: (layout: string) => void;\n}\n\n/** Buttons to show the items as a table, as cards, or in a plugin's layout. */\nexport function LayoutSwitch({ layouts, value, onChange }: LayoutSwitchProps) {\n const intl = usePanneauIntl();\n const labels: Record<string, string> = {\n table: intl.formatMessage(messages.layoutTable),\n cards: intl.formatMessage(messages.layoutCards),\n };\n return (\n <ToggleButtonGroup\n aria-label={intl.formatMessage(messages.layout)}\n selectionMode=\"single\"\n disallowEmptySelection\n selectedKeys={[value]}\n onSelectionChange={(keys) => {\n const [next] = [...keys];\n if (next !== undefined) {\n onChange(String(next));\n }\n }}\n className={styles.layouts}\n >\n {layouts.map((layout) => {\n const label = labels[layout] ?? layout;\n return (\n <Tooltip key={layout} content={label}>\n <ToggleButton\n id={layout}\n aria-label={label}\n className={styles.layoutButton}\n >\n <Icon icon={ICONS[layout] ?? Square} />\n </ToggleButton>\n </Tooltip>\n );\n })}\n </ToggleButtonGroup>\n );\n}\n"],"mappings":";;;;;;;;AAQA,IAAM,QAAoC;CAAE,OAAO;CAAO,OAAO;AAAW;;AAS5E,SAAO,aAAA,IAAA;CAAA,MAAA,IAAAE,EAAA,EAAA;CAAsB,MAAA,EAAA,SAAA,OAAA,aAAA;CACzB,MAAA,OAAa,eAAe;CAAE,IAAA;CAAA,IAAA,EAAA,OAAA,MAAA;EAEnB,KAAA,KAAI,cAAe,SAAQ,WAAY;EAAC,EAAA,KAAA;EAAA,EAAA,KAAA;CAAA,OAAA,KAAA,EAAA;CAAA,IAAA;CAAA,IAAA,EAAA,OAAA,MAAA;EACxC,KAAA,KAAI,cAAe,SAAQ,WAAY;EAAC,EAAA,KAAA;EAAA,EAAA,KAAA;CAAA,OAAA,KAAA,EAAA;CAAA,IAAA;CAAA,IAAA,EAAA,OAAA,MAAA,EAAA,OAAA,IAAA;EAFZ,KAAA;GAAA,OAC5B;GAAwC,OACxC;EACX;EAAC,EAAA,KAAA;EAAA,EAAA,KAAA;EAAA,EAAA,KAAA;CAAA,OAAA,KAAA,EAAA;CAHD,MAAA,SAAuC;CAGrC,IAAA;CAAA,IAAA,EAAA,OAAA,MAAA;EAGkB,KAAA,KAAI,cAAe,SAAQ,MAAO;EAAC,EAAA,KAAA;EAAA,EAAA,KAAA;CAAA,OAAA,KAAA,EAAA;CAAA,IAAA;CAAA,IAAA,EAAA,OAAA,OAAA;EAGjC,KAAA,CAAC,KAAK;EAAC,EAAA,KAAA;EAAA,EAAA,MAAA;CAAA,OAAA,KAAA,EAAA;CAAA,IAAA;CAAA,IAAA,EAAA,QAAA,UAAA;EACF,MAAA,SAAA;GACf,MAAA,CAAA,QAAe,CAAA,GAAI,IAAI;GACvB,IAAI,SAAS,KAAA,GACT,SAAS,OAAO,IAAI,CAAC;EACxB;EACJ,EAAA,MAAA;EAAA,EAAA,MAAA;CAAA,OAAA,KAAA,EAAA;CAAA,IAAA;CAAA,IAAA,EAAA,QAAA,UAAA,EAAA,QAAA,SAAA;EAAA,IAAA;EAAA,IAAA,EAAA,QAAA,QAAA;GAGY,MAAA,WAAA;IACT,MAAA,QAAc,OAAO,WAAP;IAAyB,OAEnC,oBAAC,SAAD;KAA+BD,SAAA;KAC3B,UAAA,oBAAC,cAAD;MACQD,IAAA;MACQC,cAAA;MACD,WAAAE,uBAAM;MAEjB,UAAA,oBAAC,MAAD,EAAY,MAAA,MAAM,WAAN,OAAuB,CAAA;KAL1B,CAAA;IADT,GAAM,MAAN;GAQE;GAEjB,EAAA,MAAA;GAAA,EAAA,MAAA;EAAA,OAAA,KAAA,EAAA;EAbA,KAAA,QAAO,IAAK,EAaZ;EAAC,EAAA,MAAA;EAAA,EAAA,MAAA;EAAA,EAAA,MAAA;CAAA,OAAA,KAAA,EAAA;CAAA,IAAA;CAAA,IAAA,EAAA,QAAA,MAAA,EAAA,QAAA,MAAA,EAAA,QAAA,MAAA,EAAA,QAAA,IAAA;EA1BN,KAAA,oBAAC,mBAAD;GACgB,cAAA;GACE,eAAA;GACd,wBAAA;GACc,cAAA;GACK,mBAAA;GAMR,WAAAA,uBAAM;GAEhB,UAAA;EAba,CAAA;EA2BE,EAAA,MAAA;EAAA,EAAA,MAAA;EAAA,EAAA,MAAA;EAAA,EAAA,MAAA;EAAA,EAAA,MAAA;CAAA,OAAA,KAAA,EAAA;CAAA,OA3BpB;AA2BoB"}
1
+ {"version":3,"file":"LayoutSwitch.js","names":["LayoutGrid","LucideIcon","Rows3","Square","ToggleButton","ToggleButtonGroup","Icon","Tooltip","usePanneauIntl","messages","styles","ICONS","Record","table","cards","LayoutSwitchProps","layouts","value","onChange","layout","LayoutSwitch","t0","$","_c","intl","t1","formatMessage","layoutTable","t2","layoutCards","t3","labels","t4","t5","t6","keys","next","undefined","String","t7","t8","label","layoutButton","map","_c","styles"],"sources":["../../src/toolbar/LayoutSwitch.tsx"],"sourcesContent":["import { LayoutGrid, type LucideIcon, Rows3, Square } from 'lucide-react';\nimport { ToggleButton, ToggleButtonGroup } from 'react-aria-components';\n\nimport { Icon, Tooltip, usePanneauIntl } from '@panneau/ui';\n\nimport { messages } from '../messages';\nimport styles from './Toolbar.module.css';\n\nconst ICONS: Record<string, LucideIcon> = { table: Rows3, cards: LayoutGrid };\n\nexport interface LayoutSwitchProps {\n layouts: readonly string[];\n value: string;\n onChange: (layout: string) => void;\n}\n\n/** Buttons to show the items as a table, as cards, or in a plugin's layout. */\nexport function LayoutSwitch({ layouts, value, onChange }: LayoutSwitchProps) {\n const intl = usePanneauIntl();\n const labels: Record<string, string> = {\n table: intl.formatMessage(messages.layoutTable),\n cards: intl.formatMessage(messages.layoutCards),\n };\n return (\n <ToggleButtonGroup\n aria-label={intl.formatMessage(messages.layout)}\n selectionMode=\"single\"\n disallowEmptySelection\n selectedKeys={[value]}\n onSelectionChange={(keys) => {\n const [next] = [...keys];\n if (next !== undefined) {\n onChange(String(next));\n }\n }}\n className={styles.layouts}\n >\n {layouts.map((layout) => {\n const label = labels[layout] ?? layout;\n return (\n <Tooltip key={layout} content={label}>\n <ToggleButton\n id={layout}\n aria-label={label}\n className={styles.layoutButton}\n >\n <Icon icon={ICONS[layout] ?? Square} />\n </ToggleButton>\n </Tooltip>\n );\n })}\n </ToggleButtonGroup>\n );\n}\n"],"mappings":";;;;;;;;AAQA,IAAMW,QAAoC;CAAEE,OAAOX;CAAOY,OAAOd;AAAW;;AAS5E,SAAOoB,aAAAC,IAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAAsB,MAAA,EAAAP,SAAAC,OAAAC,aAAAG;CACzB,MAAAG,OAAahB,eAAe;CAAE,IAAAiB;CAAA,IAAAH,EAAA,OAAAE,MAAA;EAEnBC,KAAAD,KAAIE,cAAejB,SAAQkB,WAAY;EAACL,EAAA,KAAAE;EAAAF,EAAA,KAAAG;CAAA,OAAAA,KAAAH,EAAA;CAAA,IAAAM;CAAA,IAAAN,EAAA,OAAAE,MAAA;EACxCI,KAAAJ,KAAIE,cAAejB,SAAQoB,WAAY;EAACP,EAAA,KAAAE;EAAAF,EAAA,KAAAM;CAAA,OAAAA,KAAAN,EAAA;CAAA,IAAAQ;CAAA,IAAAR,EAAA,OAAAG,MAAAH,EAAA,OAAAM,IAAA;EAFZE,KAAA;GAAAjB,OAC5BY;GAAwCX,OACxCc;EACX;EAACN,EAAA,KAAAG;EAAAH,EAAA,KAAAM;EAAAN,EAAA,KAAAQ;CAAA,OAAAA,KAAAR,EAAA;CAHD,MAAAS,SAAuCD;CAGrC,IAAAE;CAAA,IAAAV,EAAA,OAAAE,MAAA;EAGkBQ,KAAAR,KAAIE,cAAejB,SAAQU,MAAO;EAACG,EAAA,KAAAE;EAAAF,EAAA,KAAAU;CAAA,OAAAA,KAAAV,EAAA;CAAA,IAAAW;CAAA,IAAAX,EAAA,OAAAL,OAAA;EAGjCgB,KAAA,CAAChB,KAAK;EAACK,EAAA,KAAAL;EAAAK,EAAA,MAAAW;CAAA,OAAAA,KAAAX,EAAA;CAAA,IAAAY;CAAA,IAAAZ,EAAA,QAAAJ,UAAA;EACFgB,MAAAC,SAAA;GACf,MAAA,CAAAC,QAAe,CAAA,GAAID,IAAI;GACvB,IAAIC,SAASC,KAAAA,GACTnB,SAASoB,OAAOF,IAAI,CAAC;EACxB;EACJd,EAAA,MAAAJ;EAAAI,EAAA,MAAAY;CAAA,OAAAA,KAAAZ,EAAA;CAAA,IAAAiB;CAAA,IAAAjB,EAAA,QAAAS,UAAAT,EAAA,QAAAN,SAAA;EAAA,IAAAwB;EAAA,IAAAlB,EAAA,QAAAS,QAAA;GAGYS,MAAArB,WAAA;IACT,MAAAsB,QAAcV,OAAOZ,WAAPA;IAAyB,OAEnC,oBAAC,SAAD;KAA+BsB,SAAAA;KAC3B,UAAA,oBAAC,cAAD;MACQtB,IAAAA;MACQsB,cAAAA;MACD,WAAA/B,uBAAMgC;MAEjB,UAAA,oBAAC,MAAD,EAAY,MAAA/B,MAAMQ,WAANhB,OAAuB,CAAA;KAL1B,CAAA;IADT,GAAMgB,MAAN;GAQE;GAEjBG,EAAA,MAAAS;GAAAT,EAAA,MAAAkB;EAAA,OAAAA,KAAAlB,EAAA;EAbAiB,KAAAvB,QAAO2B,IAAKH,EAaZ;EAAClB,EAAA,MAAAS;EAAAT,EAAA,MAAAN;EAAAM,EAAA,MAAAiB;CAAA,OAAAA,KAAAjB,EAAA;CAAA,IAAAkB;CAAA,IAAAlB,EAAA,QAAAU,MAAAV,EAAA,QAAAW,MAAAX,EAAA,QAAAY,MAAAZ,EAAA,QAAAiB,IAAA;EA1BNC,KAAA,oBAAC,mBAAD;GACgB,cAAAR;GACE,eAAA;GACd,wBAAA;GACc,cAAAC;GACK,mBAAAC;GAMR,WAAAxB,uBAAMM;GAEhBuB,UAAAA;EAba,CAAA;EA2BEjB,EAAA,MAAAU;EAAAV,EAAA,MAAAW;EAAAX,EAAA,MAAAY;EAAAZ,EAAA,MAAAiB;EAAAjB,EAAA,MAAAkB;CAAA,OAAAA,KAAAlB,EAAA;CAAA,OA3BpBkB;AA2BoB"}
@@ -1,3 +1,4 @@
1
+ import type { ListResponse } from '@panneau/protocol';
1
2
  export interface PaginationProps {
2
3
  page: number;
3
4
  perPage: number;
@@ -10,4 +11,36 @@ export interface PaginationProps {
10
11
  }
11
12
  /** The range of items shown, the page, and buttons to the previous and next pages. */
12
13
  export declare function Pagination({ page, perPage, total, onPageChange, perPageOptions, onPerPageChange, }: PaginationProps): import("react").JSX.Element;
14
+ export interface CursorPaginationProps {
15
+ perPage: number;
16
+ /** Whether there is a page before: the list isn't on its first page. */
17
+ hasPrevious: boolean;
18
+ /** Whether there is a page after: the page has a `nextCursor`. */
19
+ hasNext: boolean;
20
+ onPrevious: () => void;
21
+ onNext: () => void;
22
+ /** Page sizes to choose from. Without them, the page size can't be changed. */
23
+ perPageOptions?: readonly number[] | undefined;
24
+ onPerPageChange?: (perPage: number) => void;
25
+ }
26
+ /**
27
+ * Buttons to the previous and next pages of a list paged with cursors, which has no page numbers
28
+ * and no total (decision 0039).
29
+ */
30
+ export declare function CursorPagination({ perPage, hasPrevious, hasNext, onPrevious, onNext, perPageOptions, onPerPageChange, }: CursorPaginationProps): import("react").JSX.Element;
31
+ /**
32
+ * The props of a `ListView` that page it, from the `meta` of a page of the list: `total` for
33
+ * numbered pages, `cursors` for a list paged with cursors.
34
+ *
35
+ * ```tsx
36
+ * <ListView {...getPagingProps(data?.meta)} items={data?.data} … />
37
+ * ```
38
+ */
39
+ export declare function getPagingProps(meta: ListResponse['meta'] | undefined): {
40
+ total?: number;
41
+ cursors?: {
42
+ next: string | null;
43
+ previous?: string | null;
44
+ };
45
+ };
13
46
  //# sourceMappingURL=Pagination.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../src/toolbar/Pagination.tsx"],"names":[],"mappings":"AAOA,MAAM,WAAW,eAAe;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,qDAAqD;IACrD,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,+EAA+E;IAC/E,cAAc,CAAC,EAAE,SAAS,MAAM,EAAE,GAAG,SAAS,CAAC;IAC/C,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CAC/C;AAED,sFAAsF;AACtF,wBAAgB,UAAU,CAAC,EACvB,IAAI,EACJ,OAAO,EACP,KAAK,EACL,YAAY,EACZ,cAAmB,EACnB,eAAe,GAClB,EAAE,eAAe,+BAyCjB"}
1
+ {"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../src/toolbar/Pagination.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAOtD,MAAM,WAAW,eAAe;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,qDAAqD;IACrD,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,+EAA+E;IAC/E,cAAc,CAAC,EAAE,SAAS,MAAM,EAAE,GAAG,SAAS,CAAC;IAC/C,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CAC/C;AAED,sFAAsF;AACtF,wBAAgB,UAAU,CAAC,EACvB,IAAI,EACJ,OAAO,EACP,KAAK,EACL,YAAY,EACZ,cAAmB,EACnB,eAAe,GAClB,EAAE,eAAe,+BAyCjB;AAED,MAAM,WAAW,qBAAqB;IAClC,OAAO,EAAE,MAAM,CAAC;IAChB,wEAAwE;IACxE,WAAW,EAAE,OAAO,CAAC;IACrB,kEAAkE;IAClE,OAAO,EAAE,OAAO,CAAC;IACjB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,+EAA+E;IAC/E,cAAc,CAAC,EAAE,SAAS,MAAM,EAAE,GAAG,SAAS,CAAC;IAC/C,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CAC/C;AAED;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,EAC7B,OAAO,EACP,WAAW,EACX,OAAO,EACP,UAAU,EACV,MAAM,EACN,cAAmB,EACnB,eAAe,GAClB,EAAE,qBAAqB,+BAmCvB;AAED;;;;;;;GAOG;AACH,wBAAgB,cAAc,CAAC,IAAI,EAAE,YAAY,CAAC,MAAM,CAAC,GAAG,SAAS,GAAG;IACpE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,GAAG,IAAI,CAAC;QAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;KAAE,CAAC;CAC/D,CAaA"}
@@ -1,62 +1,302 @@
1
1
  import { messages } from "../messages.js";
2
2
  import Toolbar_module_default from "./Toolbar.module.js";
3
+ import { c } from "react/compiler-runtime";
3
4
  import { IconButton, Select, usePanneauIntl } from "@panneau/ui";
4
5
  import { jsx, jsxs } from "react/jsx-runtime";
5
6
  import { ChevronLeft, ChevronRight } from "lucide-react";
7
+ import { isCursorPage } from "@panneau/protocol/runtime";
6
8
  //#region src/toolbar/Pagination.tsx
7
9
  /** The range of items shown, the page, and buttons to the previous and next pages. */
8
- function Pagination({ page, perPage, total, onPageChange, perPageOptions = [], onPerPageChange }) {
10
+ function Pagination(t0) {
11
+ const $ = c(44);
12
+ const { page, perPage, total, onPageChange, perPageOptions: t1, onPerPageChange } = t0;
13
+ const perPageOptions = t1 === void 0 ? [] : t1;
9
14
  const intl = usePanneauIntl();
10
15
  const lastPage = Math.max(1, Math.ceil(total / perPage));
11
16
  const start = total === 0 ? 0 : (page - 1) * perPage + 1;
12
17
  const end = Math.min(total, page * perPage);
13
- const sizes = [.../* @__PURE__ */ new Set([...perPageOptions, perPage])].sort((a, b) => a - b);
14
- return /* @__PURE__ */ jsxs("nav", {
15
- "aria-label": intl.formatMessage(messages.pagination),
16
- className: Toolbar_module_default.pagination,
17
- children: [/* @__PURE__ */ jsx("span", { children: intl.formatMessage(messages.range, {
18
+ const sizes = [.../* @__PURE__ */ new Set([...perPageOptions, perPage])].sort(_temp);
19
+ let t2;
20
+ if ($[0] !== intl) {
21
+ t2 = intl.formatMessage(messages.pagination);
22
+ $[0] = intl;
23
+ $[1] = t2;
24
+ } else t2 = $[1];
25
+ const t3 = Toolbar_module_default;
26
+ let t4;
27
+ if ($[2] !== end || $[3] !== intl || $[4] !== start || $[5] !== total) {
28
+ t4 = intl.formatMessage(messages.range, {
18
29
  start,
19
30
  end,
20
31
  total
21
- }) }), /* @__PURE__ */ jsxs("div", {
22
- className: Toolbar_module_default.pages,
32
+ });
33
+ $[2] = end;
34
+ $[3] = intl;
35
+ $[4] = start;
36
+ $[5] = total;
37
+ $[6] = t4;
38
+ } else t4 = $[6];
39
+ let t5;
40
+ if ($[7] !== t4) {
41
+ t5 = /* @__PURE__ */ jsx("span", { children: t4 });
42
+ $[7] = t4;
43
+ $[8] = t5;
44
+ } else t5 = $[8];
45
+ const t6 = Toolbar_module_default;
46
+ const t7 = perPageOptions.length > 0 && onPerPageChange !== void 0 ? /* @__PURE__ */ jsx(Select, {
47
+ "aria-label": intl.formatMessage(messages.perPage),
48
+ options: sizes.map(_temp2),
49
+ value: perPage,
50
+ onChange: (value) => {
51
+ if (typeof value === "number") onPerPageChange(value);
52
+ },
53
+ className: Toolbar_module_default.perPage
54
+ }) : null;
55
+ let t8;
56
+ if ($[9] !== intl) {
57
+ t8 = intl.formatMessage(messages.previousPage);
58
+ $[9] = intl;
59
+ $[10] = t8;
60
+ } else t8 = $[10];
61
+ const t9 = page <= 1;
62
+ let t10;
63
+ if ($[11] !== onPageChange || $[12] !== page) {
64
+ t10 = () => onPageChange(page - 1);
65
+ $[11] = onPageChange;
66
+ $[12] = page;
67
+ $[13] = t10;
68
+ } else t10 = $[13];
69
+ let t11;
70
+ if ($[14] !== t10 || $[15] !== t8 || $[16] !== t9) {
71
+ t11 = /* @__PURE__ */ jsx(IconButton, {
72
+ icon: ChevronLeft,
73
+ label: t8,
74
+ isDisabled: t9,
75
+ onPress: t10
76
+ });
77
+ $[14] = t10;
78
+ $[15] = t8;
79
+ $[16] = t9;
80
+ $[17] = t11;
81
+ } else t11 = $[17];
82
+ let t12;
83
+ if ($[18] !== intl || $[19] !== lastPage || $[20] !== page) {
84
+ t12 = intl.formatMessage(messages.pageOf, {
85
+ page,
86
+ lastPage
87
+ });
88
+ $[18] = intl;
89
+ $[19] = lastPage;
90
+ $[20] = page;
91
+ $[21] = t12;
92
+ } else t12 = $[21];
93
+ let t13;
94
+ if ($[22] !== t12) {
95
+ t13 = /* @__PURE__ */ jsx("span", {
96
+ "aria-current": "page",
97
+ children: t12
98
+ });
99
+ $[22] = t12;
100
+ $[23] = t13;
101
+ } else t13 = $[23];
102
+ let t14;
103
+ if ($[24] !== intl) {
104
+ t14 = intl.formatMessage(messages.nextPage);
105
+ $[24] = intl;
106
+ $[25] = t14;
107
+ } else t14 = $[25];
108
+ const t15 = page >= lastPage;
109
+ let t16;
110
+ if ($[26] !== onPageChange || $[27] !== page) {
111
+ t16 = () => onPageChange(page + 1);
112
+ $[26] = onPageChange;
113
+ $[27] = page;
114
+ $[28] = t16;
115
+ } else t16 = $[28];
116
+ let t17;
117
+ if ($[29] !== t14 || $[30] !== t15 || $[31] !== t16) {
118
+ t17 = /* @__PURE__ */ jsx(IconButton, {
119
+ icon: ChevronRight,
120
+ label: t14,
121
+ isDisabled: t15,
122
+ onPress: t16
123
+ });
124
+ $[29] = t14;
125
+ $[30] = t15;
126
+ $[31] = t16;
127
+ $[32] = t17;
128
+ } else t17 = $[32];
129
+ let t18;
130
+ if ($[33] !== t11 || $[34] !== t13 || $[35] !== t17 || $[36] !== t6.pages || $[37] !== t7) {
131
+ t18 = /* @__PURE__ */ jsxs("div", {
132
+ className: t6.pages,
23
133
  children: [
24
- perPageOptions.length > 0 && onPerPageChange !== void 0 ? /* @__PURE__ */ jsx(Select, {
25
- "aria-label": intl.formatMessage(messages.perPage),
26
- options: sizes.map((size) => ({
27
- value: size,
28
- label: String(size)
29
- })),
30
- value: perPage,
31
- onChange: (value) => {
32
- if (typeof value === "number") onPerPageChange(value);
33
- },
34
- className: Toolbar_module_default.perPage
35
- }) : null,
36
- /* @__PURE__ */ jsx(IconButton, {
37
- icon: ChevronLeft,
38
- label: intl.formatMessage(messages.previousPage),
39
- isDisabled: page <= 1,
40
- onPress: () => onPageChange(page - 1)
41
- }),
42
- /* @__PURE__ */ jsx("span", {
43
- "aria-current": "page",
44
- children: intl.formatMessage(messages.pageOf, {
45
- page,
46
- lastPage
47
- })
48
- }),
49
- /* @__PURE__ */ jsx(IconButton, {
50
- icon: ChevronRight,
51
- label: intl.formatMessage(messages.nextPage),
52
- isDisabled: page >= lastPage,
53
- onPress: () => onPageChange(page + 1)
54
- })
134
+ t7,
135
+ t11,
136
+ t13,
137
+ t17
55
138
  ]
56
- })]
57
- });
139
+ });
140
+ $[33] = t11;
141
+ $[34] = t13;
142
+ $[35] = t17;
143
+ $[36] = t6.pages;
144
+ $[37] = t7;
145
+ $[38] = t18;
146
+ } else t18 = $[38];
147
+ let t19;
148
+ if ($[39] !== t18 || $[40] !== t2 || $[41] !== t3.pagination || $[42] !== t5) {
149
+ t19 = /* @__PURE__ */ jsxs("nav", {
150
+ "aria-label": t2,
151
+ className: t3.pagination,
152
+ children: [t5, t18]
153
+ });
154
+ $[39] = t18;
155
+ $[40] = t2;
156
+ $[41] = t3.pagination;
157
+ $[42] = t5;
158
+ $[43] = t19;
159
+ } else t19 = $[43];
160
+ return t19;
161
+ }
162
+ function _temp2(size) {
163
+ return {
164
+ value: size,
165
+ label: String(size)
166
+ };
167
+ }
168
+ function _temp(a, b) {
169
+ return a - b;
170
+ }
171
+ /**
172
+ * Buttons to the previous and next pages of a list paged with cursors, which has no page numbers
173
+ * and no total (decision 0039).
174
+ */
175
+ function CursorPagination(t0) {
176
+ const $ = c(25);
177
+ const { perPage, hasPrevious, hasNext, onPrevious, onNext, perPageOptions: t1, onPerPageChange } = t0;
178
+ const perPageOptions = t1 === void 0 ? [] : t1;
179
+ const intl = usePanneauIntl();
180
+ const sizes = [.../* @__PURE__ */ new Set([...perPageOptions, perPage])].sort(_temp3);
181
+ let t2;
182
+ if ($[0] !== intl) {
183
+ t2 = intl.formatMessage(messages.pagination);
184
+ $[0] = intl;
185
+ $[1] = t2;
186
+ } else t2 = $[1];
187
+ const t3 = Toolbar_module_default;
188
+ let t4;
189
+ if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
190
+ t4 = /* @__PURE__ */ jsx("span", {});
191
+ $[2] = t4;
192
+ } else t4 = $[2];
193
+ const t5 = Toolbar_module_default;
194
+ const t6 = perPageOptions.length > 0 && onPerPageChange !== void 0 ? /* @__PURE__ */ jsx(Select, {
195
+ "aria-label": intl.formatMessage(messages.perPage),
196
+ options: sizes.map(_temp4),
197
+ value: perPage,
198
+ onChange: (value) => {
199
+ if (typeof value === "number") onPerPageChange(value);
200
+ },
201
+ className: Toolbar_module_default.perPage
202
+ }) : null;
203
+ let t7;
204
+ if ($[3] !== intl) {
205
+ t7 = intl.formatMessage(messages.previousPage);
206
+ $[3] = intl;
207
+ $[4] = t7;
208
+ } else t7 = $[4];
209
+ const t8 = !hasPrevious;
210
+ let t9;
211
+ if ($[5] !== onPrevious || $[6] !== t7 || $[7] !== t8) {
212
+ t9 = /* @__PURE__ */ jsx(IconButton, {
213
+ icon: ChevronLeft,
214
+ label: t7,
215
+ isDisabled: t8,
216
+ onPress: onPrevious
217
+ });
218
+ $[5] = onPrevious;
219
+ $[6] = t7;
220
+ $[7] = t8;
221
+ $[8] = t9;
222
+ } else t9 = $[8];
223
+ let t10;
224
+ if ($[9] !== intl) {
225
+ t10 = intl.formatMessage(messages.nextPage);
226
+ $[9] = intl;
227
+ $[10] = t10;
228
+ } else t10 = $[10];
229
+ const t11 = !hasNext;
230
+ let t12;
231
+ if ($[11] !== onNext || $[12] !== t10 || $[13] !== t11) {
232
+ t12 = /* @__PURE__ */ jsx(IconButton, {
233
+ icon: ChevronRight,
234
+ label: t10,
235
+ isDisabled: t11,
236
+ onPress: onNext
237
+ });
238
+ $[11] = onNext;
239
+ $[12] = t10;
240
+ $[13] = t11;
241
+ $[14] = t12;
242
+ } else t12 = $[14];
243
+ let t13;
244
+ if ($[15] !== t12 || $[16] !== t5.pages || $[17] !== t6 || $[18] !== t9) {
245
+ t13 = /* @__PURE__ */ jsxs("div", {
246
+ className: t5.pages,
247
+ children: [
248
+ t6,
249
+ t9,
250
+ t12
251
+ ]
252
+ });
253
+ $[15] = t12;
254
+ $[16] = t5.pages;
255
+ $[17] = t6;
256
+ $[18] = t9;
257
+ $[19] = t13;
258
+ } else t13 = $[19];
259
+ let t14;
260
+ if ($[20] !== t13 || $[21] !== t2 || $[22] !== t3.pagination || $[23] !== t4) {
261
+ t14 = /* @__PURE__ */ jsxs("nav", {
262
+ "aria-label": t2,
263
+ className: t3.pagination,
264
+ children: [t4, t13]
265
+ });
266
+ $[20] = t13;
267
+ $[21] = t2;
268
+ $[22] = t3.pagination;
269
+ $[23] = t4;
270
+ $[24] = t14;
271
+ } else t14 = $[24];
272
+ return t14;
273
+ }
274
+ /**
275
+ * The props of a `ListView` that page it, from the `meta` of a page of the list: `total` for
276
+ * numbered pages, `cursors` for a list paged with cursors.
277
+ *
278
+ * ```tsx
279
+ * <ListView {...getPagingProps(data?.meta)} items={data?.data} … />
280
+ * ```
281
+ */
282
+ function _temp4(size) {
283
+ return {
284
+ value: size,
285
+ label: String(size)
286
+ };
287
+ }
288
+ function _temp3(a, b) {
289
+ return a - b;
290
+ }
291
+ function getPagingProps(meta) {
292
+ if (meta === void 0) return {};
293
+ if (isCursorPage(meta)) return { cursors: {
294
+ next: meta.nextCursor,
295
+ ...meta.previousCursor !== void 0 ? { previous: meta.previousCursor } : {}
296
+ } };
297
+ return { total: meta.total };
58
298
  }
59
299
  //#endregion
60
- export { Pagination };
300
+ export { CursorPagination, Pagination, getPagingProps };
61
301
 
62
302
  //# sourceMappingURL=Pagination.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Pagination.js","names":["styles"],"sources":["../../src/toolbar/Pagination.tsx"],"sourcesContent":["import { ChevronLeft, ChevronRight } from 'lucide-react';\n\nimport { IconButton, Select, usePanneauIntl } from '@panneau/ui';\n\nimport { messages } from '../messages';\nimport styles from './Toolbar.module.css';\n\nexport interface PaginationProps {\n page: number;\n perPage: number;\n /** How many items match the query, on every page. */\n total: number;\n onPageChange: (page: number) => void;\n /** Page sizes to choose from. Without them, the page size can't be changed. */\n perPageOptions?: readonly number[] | undefined;\n onPerPageChange?: (perPage: number) => void;\n}\n\n/** The range of items shown, the page, and buttons to the previous and next pages. */\nexport function Pagination({\n page,\n perPage,\n total,\n onPageChange,\n perPageOptions = [],\n onPerPageChange,\n}: PaginationProps) {\n const intl = usePanneauIntl();\n const lastPage = Math.max(1, Math.ceil(total / perPage));\n const start = total === 0 ? 0 : (page - 1) * perPage + 1;\n const end = Math.min(total, page * perPage);\n const sizes = [...new Set([...perPageOptions, perPage])].sort((a, b) => a - b);\n return (\n <nav aria-label={intl.formatMessage(messages.pagination)} className={styles.pagination}>\n <span>{intl.formatMessage(messages.range, { start, end, total })}</span>\n <div className={styles.pages}>\n {perPageOptions.length > 0 && onPerPageChange !== undefined ? (\n <Select\n aria-label={intl.formatMessage(messages.perPage)}\n options={sizes.map((size) => ({ value: size, label: String(size) }))}\n value={perPage}\n onChange={(value) => {\n if (typeof value === 'number') {\n onPerPageChange(value);\n }\n }}\n className={styles.perPage}\n />\n ) : null}\n <IconButton\n icon={ChevronLeft}\n label={intl.formatMessage(messages.previousPage)}\n isDisabled={page <= 1}\n onPress={() => onPageChange(page - 1)}\n />\n <span aria-current=\"page\">\n {intl.formatMessage(messages.pageOf, { page, lastPage })}\n </span>\n <IconButton\n icon={ChevronRight}\n label={intl.formatMessage(messages.nextPage)}\n isDisabled={page >= lastPage}\n onPress={() => onPageChange(page + 1)}\n />\n </div>\n </nav>\n );\n}\n"],"mappings":";;;;;;;AAmBA,SAAgB,WAAW,EACvB,MACA,SACA,OACA,cACA,iBAAiB,CAAA,GACjB,mBACgB;CAChB,MAAM,OAAO,eAAe;CAC5B,MAAM,WAAW,KAAK,IAAI,GAAG,KAAK,KAAK,QAAQ,OAAO,CAAC;CACvD,MAAM,QAAQ,UAAU,IAAI,KAAK,OAAO,KAAK,UAAU;CACvD,MAAM,MAAM,KAAK,IAAI,OAAO,OAAO,OAAO;CAC1C,MAAM,QAAQ,CAAC,mBAAG,IAAI,IAAI,CAAC,GAAG,gBAAgB,OAAO,CAAC,CAAC,CAAC,CAAC,MAAM,GAAG,MAAM,IAAI,CAAC;CAC7E,OACI,qBAAC,OAAD;EAAK,cAAY,KAAK,cAAc,SAAS,UAAU;EAAG,WAAWA,uBAAO;EAA5E,UAAA,CACI,oBAAC,QAAD,EAAA,UAAO,KAAK,cAAc,SAAS,OAAO;GAAE;GAAO;GAAK;EAAM,CAAC,EAAQ,CAAA,GACvE,qBAAC,OAAD;GAAK,WAAWA,uBAAO;GAAvB,UAAA;IACK,eAAe,SAAS,KAAK,oBAAoB,KAAA,IAC9C,oBAAC,QAAD;KACI,cAAY,KAAK,cAAc,SAAS,OAAO;KAC/C,SAAS,MAAM,KAAK,UAAU;MAAE,OAAO;MAAM,OAAO,OAAO,IAAI;KAAE,EAAE;KACnE,OAAO;KACP,WAAW,UAAU;MACjB,IAAI,OAAO,UAAU,UACjB,gBAAgB,KAAK;KAE7B;KACA,WAAWA,uBAAO;IAAQ,CAAA,IAE9B;IACJ,oBAAC,YAAD;KACI,MAAM;KACN,OAAO,KAAK,cAAc,SAAS,YAAY;KAC/C,YAAY,QAAQ;KACpB,eAAe,aAAa,OAAO,CAAC;IAAE,CAAA;IAE1C,oBAAC,QAAD;KAAM,gBAAa;KACd,UAAA,KAAK,cAAc,SAAS,QAAQ;MAAE;MAAM;KAAS,CAAC;IACrD,CAAA;IACN,oBAAC,YAAD;KACI,MAAM;KACN,OAAO,KAAK,cAAc,SAAS,QAAQ;KAC3C,YAAY,QAAQ;KACpB,eAAe,aAAa,OAAO,CAAC;IAAE,CAAA;GAEzC;EACJ,CAAA,CAAA;;AAEb"}
1
+ {"version":3,"file":"Pagination.js","names":["ChevronLeft","ChevronRight","ListResponse","isCursorPage","IconButton","Select","usePanneauIntl","messages","styles","PaginationProps","page","perPage","total","onPageChange","perPageOptions","onPerPageChange","Pagination","t0","$","_c","t1","undefined","intl","lastPage","Math","max","ceil","start","end","min","sizes","Set","sort","_temp","t2","formatMessage","pagination","t4","range","t5","t7","length","map","_temp2","value","t8","previousPage","t9","t10","t11","t12","pageOf","t13","t14","nextPage","t15","t16","t17","t18","t6","pages","t19","t3","size","label","String","a","b","CursorPaginationProps","hasPrevious","hasNext","onPrevious","onNext","CursorPagination","_temp3","Symbol","for","_temp4","getPagingProps","meta","cursors","next","previous","nextCursor","previousCursor","_c","styles"],"sources":["../../src/toolbar/Pagination.tsx"],"sourcesContent":["import { ChevronLeft, ChevronRight } from 'lucide-react';\n\nimport type { ListResponse } from '@panneau/protocol';\nimport { isCursorPage } from '@panneau/protocol/runtime';\nimport { IconButton, Select, usePanneauIntl } from '@panneau/ui';\n\nimport { messages } from '../messages';\nimport styles from './Toolbar.module.css';\n\nexport interface PaginationProps {\n page: number;\n perPage: number;\n /** How many items match the query, on every page. */\n total: number;\n onPageChange: (page: number) => void;\n /** Page sizes to choose from. Without them, the page size can't be changed. */\n perPageOptions?: readonly number[] | undefined;\n onPerPageChange?: (perPage: number) => void;\n}\n\n/** The range of items shown, the page, and buttons to the previous and next pages. */\nexport function Pagination({\n page,\n perPage,\n total,\n onPageChange,\n perPageOptions = [],\n onPerPageChange,\n}: PaginationProps) {\n const intl = usePanneauIntl();\n const lastPage = Math.max(1, Math.ceil(total / perPage));\n const start = total === 0 ? 0 : (page - 1) * perPage + 1;\n const end = Math.min(total, page * perPage);\n const sizes = [...new Set([...perPageOptions, perPage])].sort((a, b) => a - b);\n return (\n <nav aria-label={intl.formatMessage(messages.pagination)} className={styles.pagination}>\n <span>{intl.formatMessage(messages.range, { start, end, total })}</span>\n <div className={styles.pages}>\n {perPageOptions.length > 0 && onPerPageChange !== undefined ? (\n <Select\n aria-label={intl.formatMessage(messages.perPage)}\n options={sizes.map((size) => ({ value: size, label: String(size) }))}\n value={perPage}\n onChange={(value) => {\n if (typeof value === 'number') {\n onPerPageChange(value);\n }\n }}\n className={styles.perPage}\n />\n ) : null}\n <IconButton\n icon={ChevronLeft}\n label={intl.formatMessage(messages.previousPage)}\n isDisabled={page <= 1}\n onPress={() => onPageChange(page - 1)}\n />\n <span aria-current=\"page\">\n {intl.formatMessage(messages.pageOf, { page, lastPage })}\n </span>\n <IconButton\n icon={ChevronRight}\n label={intl.formatMessage(messages.nextPage)}\n isDisabled={page >= lastPage}\n onPress={() => onPageChange(page + 1)}\n />\n </div>\n </nav>\n );\n}\n\nexport interface CursorPaginationProps {\n perPage: number;\n /** Whether there is a page before: the list isn't on its first page. */\n hasPrevious: boolean;\n /** Whether there is a page after: the page has a `nextCursor`. */\n hasNext: boolean;\n onPrevious: () => void;\n onNext: () => void;\n /** Page sizes to choose from. Without them, the page size can't be changed. */\n perPageOptions?: readonly number[] | undefined;\n onPerPageChange?: (perPage: number) => void;\n}\n\n/**\n * Buttons to the previous and next pages of a list paged with cursors, which has no page numbers\n * and no total (decision 0039).\n */\nexport function CursorPagination({\n perPage,\n hasPrevious,\n hasNext,\n onPrevious,\n onNext,\n perPageOptions = [],\n onPerPageChange,\n}: CursorPaginationProps) {\n const intl = usePanneauIntl();\n const sizes = [...new Set([...perPageOptions, perPage])].sort((a, b) => a - b);\n return (\n <nav aria-label={intl.formatMessage(messages.pagination)} className={styles.pagination}>\n <span />\n <div className={styles.pages}>\n {perPageOptions.length > 0 && onPerPageChange !== undefined ? (\n <Select\n aria-label={intl.formatMessage(messages.perPage)}\n options={sizes.map((size) => ({ value: size, label: String(size) }))}\n value={perPage}\n onChange={(value) => {\n if (typeof value === 'number') {\n onPerPageChange(value);\n }\n }}\n className={styles.perPage}\n />\n ) : null}\n <IconButton\n icon={ChevronLeft}\n label={intl.formatMessage(messages.previousPage)}\n isDisabled={!hasPrevious}\n onPress={onPrevious}\n />\n <IconButton\n icon={ChevronRight}\n label={intl.formatMessage(messages.nextPage)}\n isDisabled={!hasNext}\n onPress={onNext}\n />\n </div>\n </nav>\n );\n}\n\n/**\n * The props of a `ListView` that page it, from the `meta` of a page of the list: `total` for\n * numbered pages, `cursors` for a list paged with cursors.\n *\n * ```tsx\n * <ListView {...getPagingProps(data?.meta)} items={data?.data} … />\n * ```\n */\nexport function getPagingProps(meta: ListResponse['meta'] | undefined): {\n total?: number;\n cursors?: { next: string | null; previous?: string | null };\n} {\n if (meta === undefined) {\n return {};\n }\n if (isCursorPage(meta)) {\n return {\n cursors: {\n next: meta.nextCursor,\n ...(meta.previousCursor !== undefined ? { previous: meta.previousCursor } : {}),\n },\n };\n }\n return { total: meta.total };\n}\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"SearchField.js","names":["Search","draft","setDraft","_c","styles"],"sources":["../../src/toolbar/SearchField.tsx"],"sourcesContent":["import { Search } from 'lucide-react';\n\nimport { Icon, TextInput, usePanneauIntl } from '@panneau/ui';\n\nimport { messages } from '../messages';\nimport { useDraft } from '../useDraft';\nimport styles from './Toolbar.module.css';\n\nexport interface SearchFieldProps {\n /** The search of the query. */\n value: string;\n /** Called once the user stops typing, or presses Enter. */\n onChange: (q: string) => void;\n}\n\n/** The search of a list (`q`). */\nexport function SearchField({ value, onChange }: SearchFieldProps) {\n const intl = usePanneauIntl();\n const { draft, setDraft, flush } = useDraft(value, onChange);\n return (\n <TextInput\n type=\"search\"\n aria-label={intl.formatMessage(messages.search)}\n placeholder={intl.formatMessage(messages.searchPlaceholder)}\n prefix={<Icon icon={Search} />}\n value={draft}\n onChange={setDraft}\n onKeyDown={(event) => {\n if (event.key === 'Enter') {\n flush();\n }\n }}\n className={styles.search}\n />\n );\n}\n"],"mappings":";;;;;;;;;AAgBA,SAAO,YAAA,IAAA;CAAA,MAAA,IAAAG,EAAA,EAAA;CAAqB,MAAA,EAAA,OAAA,aAAA;CACxB,MAAA,OAAa,eAAe;CAC5B,MAAA,EAAA,OAAA,UAAA,UAAmC,SAAS,OAAO,QAAQ;CAAE,IAAA;CAAA,IAAA,EAAA,OAAA,MAAA;EAIzC,KAAA,KAAI,cAAe,SAAQ,MAAO;EAAC,EAAA,KAAA;EAAA,EAAA,KAAA;CAAA,OAAA,KAAA,EAAA;CAAA,IAAA;CAAA,IAAA,EAAA,OAAA,MAAA;EAClC,KAAA,KAAI,cAAe,SAAQ,iBAAkB;EAAC,EAAA,KAAA;EAAA,EAAA,KAAA;CAAA,OAAA,KAAA,EAAA;CAAA,IAAA;CAAA,IAAA,EAAA,OAAA,OAAA,IAAA,2BAAA,GAAA;EACnD,KAAA,oBAAC,MAAD,EAAYH,MAAA,OAAM,CAAA;EAAI,EAAA,KAAA;CAAA,OAAA,KAAA,EAAA;CAAA,IAAA;CAAA,IAAA,EAAA,OAAA,OAAA;EAGnB,MAAA,UAAA;GACP,IAAI,MAAK,QAAS,SACd,MAAM;EACT;EACJ,EAAA,KAAA;EAAA,EAAA,KAAA;CAAA,OAAA,KAAA,EAAA;CAAA,IAAA;CAAA,IAAA,EAAA,OAAA,SAAA,EAAA,OAAA,YAAA,EAAA,OAAA,MAAA,EAAA,QAAA,MAAA,EAAA,QAAA,IAAA;EAXL,KAAA,oBAAC,WAAD;GACS,MAAA;GACO,cAAA;GACC,aAAA;GACL,QAAA;GACDC,OAAA;GACGC,UAAA;GACC,WAAA;GAKA,WAAAE,uBAAM;EAAO,CAAA;EAC1B,EAAA,KAAA;EAAA,EAAA,KAAA;EAAA,EAAA,KAAA;EAAA,EAAA,MAAA;EAAA,EAAA,MAAA;EAAA,EAAA,MAAA;CAAA,OAAA,KAAA,EAAA;CAAA,OAbF;AAaE"}
1
+ {"version":3,"file":"SearchField.js","names":["Search","Icon","TextInput","usePanneauIntl","messages","useDraft","styles","SearchFieldProps","value","onChange","q","SearchField","t0","$","_c","intl","draft","setDraft","flush","t1","formatMessage","search","t2","searchPlaceholder","t3","Symbol","for","t4","event","key","t5","_c","styles"],"sources":["../../src/toolbar/SearchField.tsx"],"sourcesContent":["import { Search } from 'lucide-react';\n\nimport { Icon, TextInput, usePanneauIntl } from '@panneau/ui';\n\nimport { messages } from '../messages';\nimport { useDraft } from '../useDraft';\nimport styles from './Toolbar.module.css';\n\nexport interface SearchFieldProps {\n /** The search of the query. */\n value: string;\n /** Called once the user stops typing, or presses Enter. */\n onChange: (q: string) => void;\n}\n\n/** The search of a list (`q`). */\nexport function SearchField({ value, onChange }: SearchFieldProps) {\n const intl = usePanneauIntl();\n const { draft, setDraft, flush } = useDraft(value, onChange);\n return (\n <TextInput\n type=\"search\"\n aria-label={intl.formatMessage(messages.search)}\n placeholder={intl.formatMessage(messages.searchPlaceholder)}\n prefix={<Icon icon={Search} />}\n value={draft}\n onChange={setDraft}\n onKeyDown={(event) => {\n if (event.key === 'Enter') {\n flush();\n }\n }}\n className={styles.search}\n />\n );\n}\n"],"mappings":";;;;;;;;;AAgBA,SAAOW,YAAAC,IAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAAqB,MAAA,EAAAN,OAAAC,aAAAG;CACxB,MAAAG,OAAaZ,eAAe;CAC5B,MAAA,EAAAa,OAAAC,UAAAC,UAAmCb,SAASG,OAAOC,QAAQ;CAAE,IAAAU;CAAA,IAAAN,EAAA,OAAAE,MAAA;EAIzCI,KAAAJ,KAAIK,cAAehB,SAAQiB,MAAO;EAACR,EAAA,KAAAE;EAAAF,EAAA,KAAAM;CAAA,OAAAA,KAAAN,EAAA;CAAA,IAAAS;CAAA,IAAAT,EAAA,OAAAE,MAAA;EAClCO,KAAAP,KAAIK,cAAehB,SAAQmB,iBAAkB;EAACV,EAAA,KAAAE;EAAAF,EAAA,KAAAS;CAAA,OAAAA,KAAAT,EAAA;CAAA,IAAAW;CAAA,IAAAX,EAAA,OAAAY,OAAAC,IAAA,2BAAA,GAAA;EACnDF,KAAA,oBAAC,MAAD,EAAYxB,MAAAA,OAAM,CAAA;EAAIa,EAAA,KAAAW;CAAA,OAAAA,KAAAX,EAAA;CAAA,IAAAc;CAAA,IAAAd,EAAA,OAAAK,OAAA;EAGnBS,MAAAC,UAAA;GACP,IAAIA,MAAKC,QAAS,SACdX,MAAM;EACT;EACJL,EAAA,KAAAK;EAAAL,EAAA,KAAAc;CAAA,OAAAA,KAAAd,EAAA;CAAA,IAAAiB;CAAA,IAAAjB,EAAA,OAAAG,SAAAH,EAAA,OAAAI,YAAAJ,EAAA,OAAAM,MAAAN,EAAA,QAAAS,MAAAT,EAAA,QAAAc,IAAA;EAXLG,KAAA,oBAAC,WAAD;GACS,MAAA;GACO,cAAAX;GACC,aAAAG;GACL,QAAAE;GACDR,OAAAA;GACGC,UAAAA;GACC,WAAAU;GAKA,WAAArB,uBAAMe;EAAO,CAAA;EAC1BR,EAAA,KAAAG;EAAAH,EAAA,KAAAI;EAAAJ,EAAA,KAAAM;EAAAN,EAAA,MAAAS;EAAAT,EAAA,MAAAc;EAAAd,EAAA,MAAAiB;CAAA,OAAAA,KAAAjB,EAAA;CAAA,OAbFiB;AAaE"}
@@ -1,4 +1,4 @@
1
- import type { ListColumn } from '../types';
1
+ import type { ListColumn } from '../types.js';
2
2
  export interface SortSelectProps {
3
3
  columns: readonly ListColumn[];
4
4
  sort: readonly string[];
@@ -1 +1 @@
1
- {"version":3,"file":"SortSelect.js","names":["column","options","_c","styles"],"sources":["../../src/toolbar/SortSelect.tsx"],"sourcesContent":["import { Select, usePanneauIntl } from '@panneau/ui';\n\nimport { messages } from '../messages';\nimport type { ListColumn } from '../types';\nimport styles from './Toolbar.module.css';\n\nexport interface SortSelectProps {\n columns: readonly ListColumn[];\n sort: readonly string[];\n onChange: (sort: string[]) => void;\n}\n\nconst DEFAULT = '';\n\n/** The sort of a list without column headers (cards), by sortable column and direction. */\nexport function SortSelect({ columns, sort, onChange }: SortSelectProps) {\n const intl = usePanneauIntl();\n const sortable = columns.filter((column) => column.sortable === true);\n const label = (column: ListColumn) =>\n typeof column.label === 'string' ? column.label : column.id;\n const options = [\n { value: DEFAULT, label: intl.formatMessage(messages.defaultSort) },\n ...sortable.flatMap((column) => [\n {\n value: column.id,\n label: intl.formatMessage(messages.sortAscending, { column: label(column) }),\n },\n {\n value: `-${column.id}`,\n label: intl.formatMessage(messages.sortDescending, { column: label(column) }),\n },\n ]),\n ];\n const current = sort[0] ?? DEFAULT;\n return (\n <Select\n label={intl.formatMessage(messages.sortBy)}\n options={options}\n value={options.some((option) => option.value === current) ? current : DEFAULT}\n onChange={(value) =>\n onChange(value === null || value === DEFAULT ? [] : [String(value)])\n }\n className={styles.sort}\n />\n );\n}\n"],"mappings":";;;;;;AAYA,IAAM,UAAU;;AAGhB,SAAO,WAAA,IAAA;CAAA,MAAA,IAAAE,EAAA,EAAA;CAAoB,MAAA,EAAA,SAAA,MAAA,aAAA;CACvB,MAAA,OAAa,eAAe;CAAE,IAAA;CAAA,IAAA,EAAA,OAAA,WAAA,EAAA,OAAA,MAAA;EAC9B,MAAA,WAAiB,QAAO,OAAQ,KAAoC;EACpE,MAAA,QAAc;EACkD,IAAA;EAAA,IAAA,EAAA,OAAA,MAAA;GAEnC,KAAA,KAAI,cAAe,SAAQ,WAAY;GAAC,EAAA,KAAA;GAAA,EAAA,KAAA;EAAA,OAAA,KAAA,EAAA;EAAA,IAAA;EAAA,IAAA,EAAA,OAAA,IAAA;GAAjE,KAAA;IAAA,OAAS;IAAO,OAAS;GAAyC;GAAC,EAAA,KAAA;GAAA,EAAA,KAAA;EAAA,OAAA,KAAA,EAAA;EAAA,IAAA;EAAA,IAAA,EAAA,OAAA,MAAA;GAC/C,MAAA,aAAY,CAC5B;IAAA,OACWF,SAAM;IAAG,OACT,KAAI,cAAe,SAAQ,eAAgB,EAAA,QAAU,MAAMA,QAAM,EAAE,CAAC;GAC/E,GACA;IAAA,OACW,IAAIA,SAAM;IAAK,OACf,KAAI,cAAe,SAAQ,gBAAiB,EAAA,QAAU,MAAMA,QAAM,EAAE,CAAC;GAChF,CAAC;GACJ,EAAA,KAAA;GAAA,EAAA,KAAA;EAAA,OAAA,KAAA,EAAA;EAXW,KAAA,CACZ,IAAmE,GAChE,SAAQ,QAAS,EASnB,CAAC;EACL,EAAA,KAAA;EAAA,EAAA,KAAA;EAAA,EAAA,KAAA;CAAA,OAAA,KAAA,EAAA;CAZD,MAAA,UAAgB;CAahB,MAAA,UAAgB,KAAI,MAAJ;CAAmB,IAAA;CAAA,IAAA,EAAA,OAAA,MAAA;EAGpB,KAAA,KAAI,cAAe,SAAQ,MAAO;EAAC,EAAA,KAAA;EAAA,EAAA,MAAA;CAAA,OAAA,KAAA,EAAA;CAEnC,MAAA,KAAA,QAAO,MAAM,WAAY,OAAM,UAAW,OAA2B,IAArE,UAAA;CAAsE,IAAA;CAAA,IAAA,EAAA,QAAA,UAAA;EACnE,MAAA,UACN,SAAS,UAAU,QAAQ,UAAU,UAA5B,CAAA,IAAA,CAA4C,OAAO,KAAK,CAAC,CAAC;EAAC,EAAA,MAAA;EAAA,EAAA,MAAA;CAAA,OAAA,KAAA,EAAA;CAAA,IAAA;CAAA,IAAA,EAAA,QAAA,WAAA,EAAA,QAAA,MAAA,EAAA,QAAA,MAAA,EAAA,QAAA,IAAA;EAL5E,KAAA,oBAAC,QAAD;GACW,OAAA;GACE;GACF,OAAA;GACG,UAAA;GAGC,WAAAG,uBAAM;EAAK,CAAA;EACxB,EAAA,MAAA;EAAA,EAAA,MAAA;EAAA,EAAA,MAAA;EAAA,EAAA,MAAA;EAAA,EAAA,MAAA;CAAA,OAAA,KAAA,EAAA;CAAA,OARF;AAQE;AA5BH,SAAA,OAAA,UAAA;CAAA,OAIC,OAAOH,SAAM,UAAW,WAAWA,SAAM,QAASA,SAAM;AAAG;AAJ5D,SAAA,MAAA,QAAA;CAAA,OAEyC,OAAM,aAAc;AAAI"}
1
+ {"version":3,"file":"SortSelect.js","names":["Select","usePanneauIntl","messages","ListColumn","styles","SortSelectProps","columns","sort","onChange","DEFAULT","SortSelect","t0","$","_c","intl","t1","sortable","filter","_temp","label","_temp2","t2","formatMessage","defaultSort","t3","value","t4","column_1","column","id","sortAscending","sortDescending","flatMap","options","current","sortBy","some","option","String","t5","column_0","_c","styles"],"sources":["../../src/toolbar/SortSelect.tsx"],"sourcesContent":["import { Select, usePanneauIntl } from '@panneau/ui';\n\nimport { messages } from '../messages';\nimport type { ListColumn } from '../types';\nimport styles from './Toolbar.module.css';\n\nexport interface SortSelectProps {\n columns: readonly ListColumn[];\n sort: readonly string[];\n onChange: (sort: string[]) => void;\n}\n\nconst DEFAULT = '';\n\n/** The sort of a list without column headers (cards), by sortable column and direction. */\nexport function SortSelect({ columns, sort, onChange }: SortSelectProps) {\n const intl = usePanneauIntl();\n const sortable = columns.filter((column) => column.sortable === true);\n const label = (column: ListColumn) =>\n typeof column.label === 'string' ? column.label : column.id;\n const options = [\n { value: DEFAULT, label: intl.formatMessage(messages.defaultSort) },\n ...sortable.flatMap((column) => [\n {\n value: column.id,\n label: intl.formatMessage(messages.sortAscending, { column: label(column) }),\n },\n {\n value: `-${column.id}`,\n label: intl.formatMessage(messages.sortDescending, { column: label(column) }),\n },\n ]),\n ];\n const current = sort[0] ?? DEFAULT;\n return (\n <Select\n label={intl.formatMessage(messages.sortBy)}\n options={options}\n value={options.some((option) => option.value === current) ? current : DEFAULT}\n onChange={(value) =>\n onChange(value === null || value === DEFAULT ? [] : [String(value)])\n }\n className={styles.sort}\n />\n );\n}\n"],"mappings":";;;;;;AAYA,IAAMS,UAAU;;AAGhB,SAAOC,WAAAC,IAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAAoB,MAAA,EAAAP,SAAAC,MAAAC,aAAAG;CACvB,MAAAG,OAAab,eAAe;CAAE,IAAAc;CAAA,IAAAH,EAAA,OAAAN,WAAAM,EAAA,OAAAE,MAAA;EAC9B,MAAAE,WAAiBV,QAAOW,OAAQC,KAAoC;EACpE,MAAAC,QAAcC;EACkD,IAAAC;EAAA,IAAAT,EAAA,OAAAE,MAAA;GAEnCO,KAAAP,KAAIQ,cAAepB,SAAQqB,WAAY;GAACX,EAAA,KAAAE;GAAAF,EAAA,KAAAS;EAAA,OAAAA,KAAAT,EAAA;EAAA,IAAAY;EAAA,IAAAZ,EAAA,OAAAS,IAAA;GAAjEG,KAAA;IAAAC,OAAShB;IAAOU,OAASE;GAAyC;GAACT,EAAA,KAAAS;GAAAT,EAAA,KAAAY;EAAA,OAAAA,KAAAZ,EAAA;EAAA,IAAAc;EAAA,IAAAd,EAAA,OAAAE,MAAA;GAC/CY,MAAAC,aAAY,CAC5B;IAAAF,OACWG,SAAMC;IAAGV,OACTL,KAAIQ,cAAepB,SAAQ4B,eAAgB,EAAAF,QAAUT,MAAMS,QAAM,EAAE,CAAC;GAC/E,GACA;IAAAH,OACW,IAAIG,SAAMC;IAAKV,OACfL,KAAIQ,cAAepB,SAAQ6B,gBAAiB,EAAAH,QAAUT,MAAMS,QAAM,EAAE,CAAC;GAChF,CAAC;GACJhB,EAAA,KAAAE;GAAAF,EAAA,KAAAc;EAAA,OAAAA,KAAAd,EAAA;EAXWG,KAAA,CACZS,IAAmE,GAChER,SAAQgB,QAASN,EASnB,CAAC;EACLd,EAAA,KAAAN;EAAAM,EAAA,KAAAE;EAAAF,EAAA,KAAAG;CAAA,OAAAA,KAAAH,EAAA;CAZD,MAAAqB,UAAgBlB;CAahB,MAAAmB,UAAgB3B,KAAI,MAAJE;CAAmB,IAAAY;CAAA,IAAAT,EAAA,OAAAE,MAAA;EAGpBO,KAAAP,KAAIQ,cAAepB,SAAQiC,MAAO;EAACvB,EAAA,KAAAE;EAAAF,EAAA,MAAAS;CAAA,OAAAA,KAAAT,EAAA;CAEnC,MAAAY,KAAAS,QAAOG,MAAMC,WAAYA,OAAMZ,UAAWS,OAA2B,IAArEA,UAAAzB;CAAsE,IAAAiB;CAAA,IAAAd,EAAA,QAAAJ,UAAA;EACnEkB,MAAAD,UACNjB,SAASiB,UAAU,QAAQA,UAAUhB,UAA5B,CAAA,IAAA,CAA4C6B,OAAOb,KAAK,CAAC,CAAC;EAACb,EAAA,MAAAJ;EAAAI,EAAA,MAAAc;CAAA,OAAAA,KAAAd,EAAA;CAAA,IAAA2B;CAAA,IAAA3B,EAAA,QAAAqB,WAAArB,EAAA,QAAAS,MAAAT,EAAA,QAAAY,MAAAZ,EAAA,QAAAc,IAAA;EAL5Ea,KAAA,oBAAC,QAAD;GACW,OAAAlB;GACEY;GACF,OAAAT;GACG,UAAAE;GAGC,WAAAtB,uBAAMG;EAAK,CAAA;EACxBK,EAAA,MAAAqB;EAAArB,EAAA,MAAAS;EAAAT,EAAA,MAAAY;EAAAZ,EAAA,MAAAc;EAAAd,EAAA,MAAA2B;CAAA,OAAAA,KAAA3B,EAAA;CAAA,OARF2B;AAQE;AA5BH,SAAAnB,OAAAoB,UAAA;CAAA,OAIC,OAAOZ,SAAMT,UAAW,WAAWS,SAAMT,QAASS,SAAMC;AAAG;AAJ5D,SAAAX,MAAAU,QAAA;CAAA,OAEyCA,OAAMZ,aAAc;AAAI"}
@@ -1,9 +1,9 @@
1
- .panneau-search-xZg66e {
1
+ .panneau-toolbar-search {
2
2
  width: 16rem;
3
3
  max-width: 100%;
4
4
  }
5
5
 
6
- .panneau-pagination-dNpeRL {
6
+ .panneau-toolbar-pagination {
7
7
  display: flex;
8
8
  flex-wrap: wrap;
9
9
  align-items: center;
@@ -13,17 +13,17 @@
13
13
  color: var(--panneau-color-text-muted);
14
14
  }
15
15
 
16
- .panneau-pages-e6sKuy {
16
+ .panneau-toolbar-pages {
17
17
  display: flex;
18
18
  align-items: center;
19
19
  gap: var(--panneau-space-2);
20
20
  }
21
21
 
22
- .panneau-perPage-U3R-no {
22
+ .panneau-toolbar-per-page {
23
23
  width: 6rem;
24
24
  }
25
25
 
26
- .panneau-layouts-VUhEzd {
26
+ .panneau-toolbar-layouts {
27
27
  display: inline-flex;
28
28
  padding: 2px;
29
29
  background-color: var(--panneau-color-surface-sunken);
@@ -31,7 +31,7 @@
31
31
  border-radius: var(--panneau-radius-md);
32
32
  }
33
33
 
34
- .panneau-layoutButton-B28Z38 {
34
+ .panneau-toolbar-layout-button {
35
35
  display: inline-flex;
36
36
  align-items: center;
37
37
  justify-content: center;
@@ -44,29 +44,29 @@
44
44
  cursor: pointer;
45
45
  }
46
46
 
47
- .panneau-layoutButton-B28Z38[data-hovered] {
47
+ .panneau-toolbar-layout-button[data-hovered] {
48
48
  color: var(--panneau-color-text);
49
49
  }
50
50
 
51
- .panneau-layoutButton-B28Z38[data-selected] {
51
+ .panneau-toolbar-layout-button[data-selected] {
52
52
  color: var(--panneau-color-text);
53
53
  background-color: var(--panneau-color-surface);
54
54
  box-shadow: var(--panneau-shadow-sm);
55
55
  }
56
56
 
57
- .panneau-layoutButton-B28Z38[data-focus-visible] {
57
+ .panneau-toolbar-layout-button[data-focus-visible] {
58
58
  outline: var(--panneau-focus-width) solid var(--panneau-color-focus);
59
59
  outline-offset: 1px;
60
60
  }
61
61
 
62
- .panneau-sort-5bHxuN {
62
+ .panneau-toolbar-sort {
63
63
  width: 14rem;
64
64
  max-width: 100%;
65
65
  }
66
66
 
67
67
  @container panneau-list (max-width: 40rem) {
68
- .panneau-search-xZg66e,
69
- .panneau-sort-5bHxuN {
68
+ .panneau-toolbar-search,
69
+ .panneau-toolbar-sort {
70
70
  width: 100%;
71
71
  }
72
72
  }
@@ -1,12 +1,12 @@
1
1
  import "./Toolbar.css";
2
2
  //#region src/toolbar/Toolbar.module.css
3
- var search = "panneau-search-xZg66e";
4
- var pagination = "panneau-pagination-dNpeRL";
5
- var pages = "panneau-pages-e6sKuy";
6
- var perPage = "panneau-perPage-U3R-no";
7
- var layouts = "panneau-layouts-VUhEzd";
8
- var layoutButton = "panneau-layoutButton-B28Z38";
9
- var sort = "panneau-sort-5bHxuN";
3
+ var search = "panneau-toolbar-search";
4
+ var pagination = "panneau-toolbar-pagination";
5
+ var pages = "panneau-toolbar-pages";
6
+ var perPage = "panneau-toolbar-per-page";
7
+ var layouts = "panneau-toolbar-layouts";
8
+ var layoutButton = "panneau-toolbar-layout-button";
9
+ var sort = "panneau-toolbar-sort";
10
10
  var Toolbar_module_default = {
11
11
  search,
12
12
  pagination,