@k2b/ui 0.29.0 → 0.30.0

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 (173) hide show
  1. package/README.md +1 -1
  2. package/dist/base.css +2 -2
  3. package/dist/browser/actions/Dropdown.js +6 -3
  4. package/dist/browser/actions/Dropdown.js.map +1 -1
  5. package/dist/browser/actions/FilterChip.js +137 -7
  6. package/dist/browser/actions/FilterChip.js.map +1 -1
  7. package/dist/browser/actions/SegmentedControl.js +5 -9
  8. package/dist/browser/actions/SegmentedControl.js.map +1 -1
  9. package/dist/browser/actions/SpotlightSearch.js +6 -3
  10. package/dist/browser/actions/SpotlightSearch.js.map +1 -1
  11. package/dist/browser/actions/Tabs.js +5 -2
  12. package/dist/browser/actions/Tabs.js.map +1 -1
  13. package/dist/browser/actions/ViewTabs.js +294 -0
  14. package/dist/browser/actions/ViewTabs.js.map +1 -0
  15. package/dist/browser/actions/filter-messages.js +6 -2
  16. package/dist/browser/actions/filter-messages.js.map +1 -1
  17. package/dist/browser/actions/index.js +2 -1
  18. package/dist/browser/actions/index.js.map +1 -1
  19. package/dist/browser/chat/ChatComposer.js +1108 -604
  20. package/dist/browser/chat/ChatComposer.js.map +1 -1
  21. package/dist/browser/chat/ChatDecision.js +120 -84
  22. package/dist/browser/chat/ChatDecision.js.map +1 -1
  23. package/dist/browser/chat/ChatPrimitives.js +292 -159
  24. package/dist/browser/chat/ChatPrimitives.js.map +1 -1
  25. package/dist/browser/chat/chat-messages.js +8 -0
  26. package/dist/browser/chat/chat-messages.js.map +1 -1
  27. package/dist/browser/chat/command-search.js +26 -15
  28. package/dist/browser/chat/command-search.js.map +1 -1
  29. package/dist/browser/chat/index.js +4 -2
  30. package/dist/browser/chat/index.js.map +1 -1
  31. package/dist/browser/content/Calendar.js +143 -116
  32. package/dist/browser/content/Calendar.js.map +1 -1
  33. package/dist/browser/content/CalendarWeekView.js +291 -266
  34. package/dist/browser/content/CalendarWeekView.js.map +1 -1
  35. package/dist/browser/content/DataTable.js +224 -155
  36. package/dist/browser/content/DataTable.js.map +1 -1
  37. package/dist/browser/content/data-table-messages.js +4 -2
  38. package/dist/browser/content/data-table-messages.js.map +1 -1
  39. package/dist/browser/feedback/MovedHint.js +197 -0
  40. package/dist/browser/feedback/MovedHint.js.map +1 -0
  41. package/dist/browser/feedback/dialog-core.js +66 -9
  42. package/dist/browser/feedback/dialog-core.js.map +1 -1
  43. package/dist/browser/feedback/index.js +1 -0
  44. package/dist/browser/feedback/index.js.map +1 -1
  45. package/dist/browser/feedback/prompts.js +6 -1
  46. package/dist/browser/feedback/prompts.js.map +1 -1
  47. package/dist/browser/inputs/DatePicker.js +337 -212
  48. package/dist/browser/inputs/DatePicker.js.map +1 -1
  49. package/dist/browser/inputs/date-picker.js +59 -5
  50. package/dist/browser/inputs/date-picker.js.map +1 -1
  51. package/dist/browser/intl/messages.js +12 -0
  52. package/dist/browser/intl/messages.js.map +1 -1
  53. package/dist/browser/intl/weekend.js +39 -0
  54. package/dist/browser/intl/weekend.js.map +1 -0
  55. package/dist/browser/layout/AppOverview.js +0 -1
  56. package/dist/browser/layout/AppOverview.js.map +1 -1
  57. package/dist/browser/layout/AppWorkspace.js +688 -471
  58. package/dist/browser/layout/AppWorkspace.js.map +1 -1
  59. package/dist/browser/layout/PageTitle.js +3 -2
  60. package/dist/browser/layout/PageTitle.js.map +1 -1
  61. package/dist/browser/layout/SettingsModal.js +2 -2
  62. package/dist/browser/layout/SettingsModal.js.map +1 -1
  63. package/dist/browser/layout/SidebarSwitcher.js +13 -12
  64. package/dist/browser/layout/SidebarSwitcher.js.map +1 -1
  65. package/dist/browser/layout/TabBar.js +1 -1
  66. package/dist/browser/layout/TabBar.js.map +1 -1
  67. package/dist/browser/layout/app-host-width.js +44 -0
  68. package/dist/browser/layout/app-host-width.js.map +1 -0
  69. package/dist/browser/layout/app-workspace-controller.js +219 -39
  70. package/dist/browser/layout/app-workspace-controller.js.map +1 -1
  71. package/dist/browser/layout/index.js +1 -0
  72. package/dist/browser/layout/index.js.map +1 -1
  73. package/dist/browser/surfaces/Placeholder.js +36 -13
  74. package/dist/browser/surfaces/Placeholder.js.map +1 -1
  75. package/dist/ssr/actions/Dropdown.js +5 -2
  76. package/dist/ssr/actions/Dropdown.js.map +1 -1
  77. package/dist/ssr/actions/FilterChip.js +59 -7
  78. package/dist/ssr/actions/FilterChip.js.map +1 -1
  79. package/dist/ssr/actions/SegmentedControl.js +1 -2
  80. package/dist/ssr/actions/SegmentedControl.js.map +1 -1
  81. package/dist/ssr/actions/SpotlightSearch.js +2 -2
  82. package/dist/ssr/actions/SpotlightSearch.js.map +1 -1
  83. package/dist/ssr/actions/Tabs.js +2 -2
  84. package/dist/ssr/actions/Tabs.js.map +1 -1
  85. package/dist/ssr/actions/ViewTabs.js +211 -0
  86. package/dist/ssr/actions/ViewTabs.js.map +1 -0
  87. package/dist/ssr/actions/filter-messages.js +6 -2
  88. package/dist/ssr/actions/filter-messages.js.map +1 -1
  89. package/dist/ssr/actions/index.js +2 -1
  90. package/dist/ssr/actions/index.js.map +1 -1
  91. package/dist/ssr/chat/ChatComposer.js +546 -131
  92. package/dist/ssr/chat/ChatComposer.js.map +1 -1
  93. package/dist/ssr/chat/ChatDecision.js +33 -19
  94. package/dist/ssr/chat/ChatDecision.js.map +1 -1
  95. package/dist/ssr/chat/ChatPrimitives.js +95 -24
  96. package/dist/ssr/chat/ChatPrimitives.js.map +1 -1
  97. package/dist/ssr/chat/chat-messages.js +8 -0
  98. package/dist/ssr/chat/chat-messages.js.map +1 -1
  99. package/dist/ssr/chat/command-search.js +26 -15
  100. package/dist/ssr/chat/command-search.js.map +1 -1
  101. package/dist/ssr/chat/index.js +4 -2
  102. package/dist/ssr/chat/index.js.map +1 -1
  103. package/dist/ssr/content/Calendar.js +109 -100
  104. package/dist/ssr/content/Calendar.js.map +1 -1
  105. package/dist/ssr/content/CalendarWeekView.js +42 -28
  106. package/dist/ssr/content/CalendarWeekView.js.map +1 -1
  107. package/dist/ssr/content/DataTable.js +78 -31
  108. package/dist/ssr/content/DataTable.js.map +1 -1
  109. package/dist/ssr/content/data-table-messages.js +4 -2
  110. package/dist/ssr/content/data-table-messages.js.map +1 -1
  111. package/dist/ssr/feedback/MovedHint.js +166 -0
  112. package/dist/ssr/feedback/MovedHint.js.map +1 -0
  113. package/dist/ssr/feedback/dialog-core.js +66 -9
  114. package/dist/ssr/feedback/dialog-core.js.map +1 -1
  115. package/dist/ssr/feedback/index.js +1 -0
  116. package/dist/ssr/feedback/index.js.map +1 -1
  117. package/dist/ssr/feedback/prompts.js +6 -1
  118. package/dist/ssr/feedback/prompts.js.map +1 -1
  119. package/dist/ssr/inputs/DatePicker.js +138 -69
  120. package/dist/ssr/inputs/DatePicker.js.map +1 -1
  121. package/dist/ssr/inputs/date-picker.js +59 -5
  122. package/dist/ssr/inputs/date-picker.js.map +1 -1
  123. package/dist/ssr/intl/messages.js +12 -0
  124. package/dist/ssr/intl/messages.js.map +1 -1
  125. package/dist/ssr/intl/weekend.js +39 -0
  126. package/dist/ssr/intl/weekend.js.map +1 -0
  127. package/dist/ssr/layout/AppOverview.js +0 -1
  128. package/dist/ssr/layout/AppOverview.js.map +1 -1
  129. package/dist/ssr/layout/AppWorkspace.js +203 -39
  130. package/dist/ssr/layout/AppWorkspace.js.map +1 -1
  131. package/dist/ssr/layout/PageTitle.js +3 -2
  132. package/dist/ssr/layout/PageTitle.js.map +1 -1
  133. package/dist/ssr/layout/SettingsModal.js +2 -2
  134. package/dist/ssr/layout/SettingsModal.js.map +1 -1
  135. package/dist/ssr/layout/SidebarSwitcher.js +13 -12
  136. package/dist/ssr/layout/SidebarSwitcher.js.map +1 -1
  137. package/dist/ssr/layout/TabBar.js +1 -1
  138. package/dist/ssr/layout/TabBar.js.map +1 -1
  139. package/dist/ssr/layout/app-host-width.js +44 -0
  140. package/dist/ssr/layout/app-host-width.js.map +1 -0
  141. package/dist/ssr/layout/app-workspace-controller.js +219 -39
  142. package/dist/ssr/layout/app-workspace-controller.js.map +1 -1
  143. package/dist/ssr/layout/index.js +1 -0
  144. package/dist/ssr/layout/index.js.map +1 -1
  145. package/dist/ssr/surfaces/Placeholder.js +24 -7
  146. package/dist/ssr/surfaces/Placeholder.js.map +1 -1
  147. package/dist/styles.css +1 -1
  148. package/dist/types/actions/Dropdown.d.ts +4 -0
  149. package/dist/types/actions/FilterChip.d.ts +22 -0
  150. package/dist/types/actions/ViewTabs.d.ts +30 -0
  151. package/dist/types/actions/filter-messages.d.ts +2 -0
  152. package/dist/types/actions/index.d.ts +4 -2
  153. package/dist/types/chat/ChatComposer.d.ts +52 -0
  154. package/dist/types/chat/ChatDecision.d.ts +18 -2
  155. package/dist/types/chat/ChatPrimitives.d.ts +10 -0
  156. package/dist/types/chat/chat-messages.d.ts +4 -0
  157. package/dist/types/chat/command-search.d.ts +2 -0
  158. package/dist/types/chat/index.d.ts +9 -8
  159. package/dist/types/content/DataTable.d.ts +3 -0
  160. package/dist/types/content/data-table-messages.d.ts +1 -0
  161. package/dist/types/feedback/MovedHint.d.ts +25 -0
  162. package/dist/types/feedback/dialog-core.d.ts +5 -2
  163. package/dist/types/feedback/index.d.ts +2 -0
  164. package/dist/types/feedback/prompts.d.ts +2 -0
  165. package/dist/types/inputs/DatePicker.d.ts +7 -0
  166. package/dist/types/inputs/date-picker.d.ts +25 -1
  167. package/dist/types/intl/messages.d.ts +6 -0
  168. package/dist/types/intl/weekend.d.ts +12 -0
  169. package/dist/types/layout/AppWorkspace.d.ts +43 -7
  170. package/dist/types/layout/app-host-width.d.ts +6 -0
  171. package/dist/types/layout/index.d.ts +2 -1
  172. package/dist/types/surfaces/Placeholder.d.ts +2 -1
  173. package/package.json +4 -4
@@ -0,0 +1 @@
1
+ {"version":3,"names":[],"sources":["intl/weekend.ts"],"sourcesContent":["/** Intl week data: weekend days as ISO numbers, 1 for Monday to 7 for Sunday. */\ntype WeekInfo = { weekend?: readonly number[] };\ntype LocaleWeekInfo = { getWeekInfo?: () => WeekInfo; weekInfo?: WeekInfo };\n\n/** Saturday and Sunday as JavaScript day numbers, for engines without week data and for an unknown locale. */\nconst fallbackWeekend: ReadonlySet<number> = new Set([6, 0]);\nconst cache = new Map<string, ReadonlySet<number>>();\n\n/**\n * The weekend days of `locale` as JavaScript day numbers (0 for Sunday): Saturday and Sunday in Germany, Friday and\n * Saturday in Israel. The days come from the engine's Intl week data where it has them, otherwise Saturday and Sunday.\n * Without a locale the answer is Saturday and Sunday too, so a server render and the browser agree.\n */\nexport const weekendDays = (locale: string | undefined): ReadonlySet<number> => {\n if (!locale) return fallbackWeekend;\n const cached = cache.get(locale);\n if (cached) return cached;\n let days = fallbackWeekend;\n try {\n const intlLocale = new Intl.Locale(locale) as Intl.Locale & LocaleWeekInfo;\n const weekend = (intlLocale.getWeekInfo?.() ?? intlLocale.weekInfo)?.weekend;\n if (weekend?.length) days = new Set(weekend.map((day) => day % 7));\n } catch {\n // An invalid locale tag keeps Saturday and Sunday.\n }\n cache.set(locale, days);\n return days;\n};\n\n/** The day of the week of a date key such as `2026-10-24`, as a JavaScript day number (0 for Sunday). */\nexport const dayOfWeekOfKey = (key: string): number => {\n const [year = 1970, month = 1, day = 1] = key.slice(0, 10).split(\"-\").map(Number);\n return new Date(Date.UTC(year, month - 1, day)).getUTCDay();\n};\n\n/** Whether the day of `key` is a weekend day of `locale`. */\nexport const isWeekendKey = (key: string, locale: string | undefined): boolean => weekendDays(locale).has(dayOfWeekOfKey(key));\n\n/** Whether column `index` of a week that starts on `firstDayOfWeek` (0 for Sunday, 1 for Monday) is a weekend day. */\nexport const isWeekendColumn = (index: number, firstDayOfWeek: number, locale: string | undefined): boolean =>\n weekendDays(locale).has((firstDayOfWeek + index) % 7);\n"],"mappings":"AAAA;;AAIA;AACA,MAAM,eAAoC,GAAG,IAAI,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;AAC5D,MAAM,KAAK,GAAG,IAAI,GAAG,CAA8B,CAAC;;AAEpD;AACA;AACA;AACA;AACA;AACA,OAAO,MAAM,WAAW,GAAI,MAA0B,IAA0B;EAC9E,IAAI,CAAC,MAAM,EAAE,OAAO,eAAe;EACnC,MAAM,MAAM,GAAG,KAAK,CAAC,GAAG,CAAC,MAAM,CAAC;EAChC,IAAI,MAAM,EAAE,OAAO,MAAM;EACzB,IAAI,IAAI,GAAG,eAAe;EAC1B,IAAI;IACF,MAAM,UAAU,GAAG,IAAI,IAAI,CAAC,MAAM,CAAC,MAAM,CAAiC;IAC1E,MAAM,OAAO,GAAG,CAAC,UAAU,CAAC,WAAW,GAAG,CAAC,IAAI,UAAU,CAAC,QAAQ,GAAG,OAAO;IAC5E,IAAI,OAAO,EAAE,MAAM,EAAE,IAAI,GAAG,IAAI,GAAG,CAAC,OAAO,CAAC,GAAG,CAAE,GAAG,IAAK,GAAG,GAAG,CAAC,CAAC,CAAC;EACpE,CAAC,CAAC,MAAM;IACN;EAAA;EAEF,KAAK,CAAC,GAAG,CAAC,MAAM,EAAE,IAAI,CAAC;EACvB,OAAO,IAAI;AACb,CAAC;;AAED;AACA,OAAO,MAAM,cAAc,GAAI,GAAW,IAAa;EACrD,MAAM,CAAC,IAAI,GAAG,IAAI,EAAE,KAAK,GAAG,CAAC,EAAE,GAAG,GAAG,CAAC,CAAC,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,MAAM,CAAC;EACjF,OAAO,IAAI,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,KAAK,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;AAC7D,CAAC;;AAED;AACA,OAAO,MAAM,YAAY,GAAG,CAAC,GAAW,EAAE,MAA0B,KAAc,WAAW,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC;;AAE9H;AACA,OAAO,MAAM,eAAe,GAAG,CAAC,KAAa,EAAE,cAAsB,EAAE,MAA0B,KAC/F,WAAW,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,CAAC,cAAc,GAAG,KAAK,IAAI,CAAC,CAAC","ignoreList":[]}
@@ -56,7 +56,6 @@ const AppOverviewAside = props => _$ssr(_tmpl$5, `k2b-app-overview__aside ${_$es
56
56
  })), _$escape(props.children));
57
57
  const AppOverviewCards = props => _$ssr(_tmpl$6, `k2b-app-overview__cards ${_$escape(props.class ?? "", true)}`, _$escape(props.children));
58
58
  const AppOverviewEmptyState = props => _$createComponent(Placeholder, {
59
- surface: "paper",
60
59
  variant: "panel",
61
60
  get title() {
62
61
  return props.title;
@@ -1 +1 @@
1
- {"version":3,"names":[],"sources":["layout/AppOverview.tsx"],"sourcesContent":["import { type JSX, Show } from \"solid-js\";\nimport Placeholder from \"../surfaces/Placeholder\";\nimport { PanelHeader } from \"./PanelHeader\";\n\nexport type AppOverviewProps = {\n title: string;\n subtitle?: string;\n icon: string;\n /** The page's single primary action, such as a create button or menu. */\n actions?: JSX.Element;\n class?: string;\n children: JSX.Element;\n};\n\nexport type AppOverviewPanelProps = {\n title: string;\n description?: JSX.Element;\n toolbar?: JSX.Element;\n class?: string;\n children: JSX.Element;\n};\n\nexport type AppOverviewEmptyStateProps = {\n title: string;\n description?: JSX.Element;\n icon?: string;\n class?: string;\n children?: JSX.Element;\n};\n\nexport type AppOverviewCardsProps = {\n class?: string;\n children: JSX.Element;\n};\n\ntype AppOverviewComponent = ((props: AppOverviewProps) => JSX.Element) & {\n Main: (props: AppOverviewPanelProps) => JSX.Element;\n Aside: (props: AppOverviewPanelProps) => JSX.Element;\n Cards: (props: AppOverviewCardsProps) => JSX.Element;\n EmptyState: (props: AppOverviewEmptyStateProps) => JSX.Element;\n};\n\nconst tablerIconClass = (icon: string | null | undefined, fallback: string): string => {\n const value = icon?.trim() || fallback;\n return value.startsWith(\"ti \") ? value : `ti ${value}`;\n};\n\nconst AppOverviewPanelHeader = (props: Pick<AppOverviewPanelProps, \"title\" | \"description\" | \"toolbar\">): JSX.Element => (\n <div class=\"k2b-app-overview__panel-header\">\n <div>\n <h2>{props.title}</h2>\n <Show when={props.description}>\n <p class=\"k2b-app-overview__panel-description\">{props.description}</p>\n </Show>\n </div>\n <Show when={props.toolbar}>\n <div class=\"k2b-app-overview__toolbar\">{props.toolbar}</div>\n </Show>\n </div>\n);\n\nconst AppOverviewMain = (props: AppOverviewPanelProps): JSX.Element => (\n <section class={`k2b-app-overview__main ${props.class ?? \"\"}`}>\n <AppOverviewPanelHeader title={props.title} description={props.description} toolbar={props.toolbar} />\n {props.children}\n </section>\n);\n\nconst AppOverviewAside = (props: AppOverviewPanelProps): JSX.Element => (\n <aside class={`k2b-app-overview__aside ${props.class ?? \"\"}`}>\n <AppOverviewPanelHeader title={props.title} description={props.description} toolbar={props.toolbar} />\n {props.children}\n </aside>\n);\n\nconst AppOverviewCards = (props: AppOverviewCardsProps): JSX.Element => (\n <div class={`k2b-app-overview__cards ${props.class ?? \"\"}`}>{props.children}</div>\n);\n\nconst AppOverviewEmptyState = (props: AppOverviewEmptyStateProps): JSX.Element => (\n <Placeholder\n surface=\"paper\"\n variant=\"panel\"\n title={props.title}\n description={props.description}\n icon={props.icon ? tablerIconClass(props.icon, \"ti-inbox\") : undefined}\n action={props.children}\n class={props.class}\n />\n);\n\nconst AppOverview = ((props: AppOverviewProps): JSX.Element => (\n <div class={`k2b-app-overview ${props.class ?? \"\"}`}>\n <header class=\"k2b-app-overview__header\">\n <span class=\"k2b-app-overview__icon k2b-icon-tile\" aria-hidden=\"true\">\n <i class={tablerIconClass(props.icon, \"ti-apps\")} />\n </span>\n <PanelHeader as=\"h1\" size=\"lg\" title={props.title} subtitle={props.subtitle} actions={props.actions} />\n </header>\n <div class=\"k2b-app-overview__columns\">{props.children}</div>\n </div>\n)) as AppOverviewComponent;\n\nAppOverview.Main = AppOverviewMain;\nAppOverview.Aside = AppOverviewAside;\nAppOverview.Cards = AppOverviewCards;\nAppOverview.EmptyState = AppOverviewEmptyState;\n\nexport default AppOverview;\n"],"mappings":";;;;;;;;;;;;AAAA,SAAmB,IAAI,QAAQ,UAAU;AACzC,OAAO,WAAW,MAAM,yBAAyB;AACjD,SAAS,WAAW,QAAQ,eAAe;AAwC3C,MAAM,eAAe,GAAG,CAAC,IAA+B,EAAE,QAAgB,KAAa;EACrF,MAAM,KAAK,GAAG,IAAI,EAAE,IAAI,CAAC,CAAC,IAAI,QAAQ;EACtC,OAAO,KAAK,CAAC,UAAU,CAAC,KAAK,CAAC,GAAG,KAAK,GAAG,MAAM,KAAK,EAAE;AACxD,CAAC;AAED,MAAM,sBAAsB,GAAI,KAAuE,4BAG5F,KAAK,CAAC,KAAK,8BACf,IAAI;EAAA,IAAC,IAAI;IAAA,OAAE,KAAK,CAAC,WAAW;EAAA;EAAA;IAAA,8BACqB,KAAK,CAAC,WAAW;EAAA;AAAA,gCAGpE,IAAI;EAAA,IAAC,IAAI;IAAA,OAAE,KAAK,CAAC,OAAO;EAAA;EAAA;IAAA,+BACiB,KAAK,CAAC,OAAO;EAAA;AAAA,IAG1D;AAED,MAAM,eAAe,GAAI,KAA4B,mBACnC,mCAA0B,KAAK,CAAC,KAAK,IAAI,EAAE,SAAE,6BAC1D,sBAAsB;EAAA,IAAC,KAAK;IAAA,OAAE,KAAK,CAAC,KAAK;EAAA;EAAA,IAAE,WAAW;IAAA,OAAE,KAAK,CAAC,WAAW;EAAA;EAAA,IAAE,OAAO;IAAA,OAAE,KAAK,CAAC,OAAO;EAAA;AAAA,cACjG,KAAK,CAAC,QAAQ,EAElB;AAED,MAAM,gBAAgB,GAAI,KAA4B,mBACtC,oCAA2B,KAAK,CAAC,KAAK,IAAI,EAAE,SAAE,6BACzD,sBAAsB;EAAA,IAAC,KAAK;IAAA,OAAE,KAAK,CAAC,KAAK;EAAA;EAAA,IAAE,WAAW;IAAA,OAAE,KAAK,CAAC,WAAW;EAAA;EAAA,IAAE,OAAO;IAAA,OAAE,KAAK,CAAC,OAAO;EAAA;AAAA,cACjG,KAAK,CAAC,QAAQ,EAElB;AAED,MAAM,gBAAgB,GAAI,KAA4B,mBACxC,oCAA2B,KAAK,CAAC,KAAK,IAAI,EAAE,SAAE,WAAG,KAAK,CAAC,QAAQ,EAC5E;AAED,MAAM,qBAAqB,GAAI,KAAiC,sBAC7D,WAAW;EACV,OAAO;EACP,OAAO;EAAA,IACP,KAAK;IAAA,OAAE,KAAK,CAAC,KAAK;EAAA;EAAA,IAClB,WAAW;IAAA,OAAE,KAAK,CAAC,WAAW;EAAA;EAAA,IAC9B,IAAI;IAAA,OAAE,oBAAK,CAAC,IAAI,MAAG,eAAe,CAAC,KAAK,CAAC,IAAI,EAAE,UAAU,CAAC,GAAG,SAAS;EAAA;EAAA,IACtE,MAAM;IAAA,OAAE,KAAK,CAAC,QAAQ;EAAA;EAAA;IAAA,OACf,KAAK,CAAC,KAAK;EAAA;AAAA,EAErB;AAED,MAAM,WAAW,GAAK,KAAuB,mBAC/B,6BAAoB,KAAK,CAAC,KAAK,IAAI,EAAE,SAAE,mCAGnC,eAAe,CAAC,KAAK,CAAC,IAAI,EAAE,SAAS,CAAC,4CAEjD,WAAW;EAAC,EAAE;EAAM,IAAI;EAAA,IAAM,KAAK;IAAA,OAAE,KAAK,CAAC,KAAK;EAAA;EAAA,IAAE,QAAQ;IAAA,OAAE,KAAK,CAAC,QAAQ;EAAA;EAAA,IAAE,OAAO;IAAA,OAAE,KAAK,CAAC,OAAO;EAAA;AAAA,cAE7D,KAAK,CAAC,QAAQ,EAEhC;AAE1B,WAAW,CAAC,IAAI,GAAG,eAAe;AAClC,WAAW,CAAC,KAAK,GAAG,gBAAgB;AACpC,WAAW,CAAC,KAAK,GAAG,gBAAgB;AACpC,WAAW,CAAC,UAAU,GAAG,qBAAqB;AAE9C,eAAe,WAAW","ignoreList":[]}
1
+ {"version":3,"names":[],"sources":["layout/AppOverview.tsx"],"sourcesContent":["import { type JSX, Show } from \"solid-js\";\nimport Placeholder from \"../surfaces/Placeholder\";\nimport { PanelHeader } from \"./PanelHeader\";\n\nexport type AppOverviewProps = {\n title: string;\n subtitle?: string;\n icon: string;\n /** The page's single primary action, such as a create button or menu. */\n actions?: JSX.Element;\n class?: string;\n children: JSX.Element;\n};\n\nexport type AppOverviewPanelProps = {\n title: string;\n description?: JSX.Element;\n toolbar?: JSX.Element;\n class?: string;\n children: JSX.Element;\n};\n\nexport type AppOverviewEmptyStateProps = {\n title: string;\n description?: JSX.Element;\n icon?: string;\n class?: string;\n children?: JSX.Element;\n};\n\nexport type AppOverviewCardsProps = {\n class?: string;\n children: JSX.Element;\n};\n\ntype AppOverviewComponent = ((props: AppOverviewProps) => JSX.Element) & {\n Main: (props: AppOverviewPanelProps) => JSX.Element;\n Aside: (props: AppOverviewPanelProps) => JSX.Element;\n Cards: (props: AppOverviewCardsProps) => JSX.Element;\n EmptyState: (props: AppOverviewEmptyStateProps) => JSX.Element;\n};\n\nconst tablerIconClass = (icon: string | null | undefined, fallback: string): string => {\n const value = icon?.trim() || fallback;\n return value.startsWith(\"ti \") ? value : `ti ${value}`;\n};\n\nconst AppOverviewPanelHeader = (props: Pick<AppOverviewPanelProps, \"title\" | \"description\" | \"toolbar\">): JSX.Element => (\n <div class=\"k2b-app-overview__panel-header\">\n <div>\n <h2>{props.title}</h2>\n <Show when={props.description}>\n <p class=\"k2b-app-overview__panel-description\">{props.description}</p>\n </Show>\n </div>\n <Show when={props.toolbar}>\n <div class=\"k2b-app-overview__toolbar\">{props.toolbar}</div>\n </Show>\n </div>\n);\n\nconst AppOverviewMain = (props: AppOverviewPanelProps): JSX.Element => (\n <section class={`k2b-app-overview__main ${props.class ?? \"\"}`}>\n <AppOverviewPanelHeader title={props.title} description={props.description} toolbar={props.toolbar} />\n {props.children}\n </section>\n);\n\nconst AppOverviewAside = (props: AppOverviewPanelProps): JSX.Element => (\n <aside class={`k2b-app-overview__aside ${props.class ?? \"\"}`}>\n <AppOverviewPanelHeader title={props.title} description={props.description} toolbar={props.toolbar} />\n {props.children}\n </aside>\n);\n\nconst AppOverviewCards = (props: AppOverviewCardsProps): JSX.Element => (\n <div class={`k2b-app-overview__cards ${props.class ?? \"\"}`}>{props.children}</div>\n);\n\nconst AppOverviewEmptyState = (props: AppOverviewEmptyStateProps): JSX.Element => (\n <Placeholder\n variant=\"panel\"\n title={props.title}\n description={props.description}\n icon={props.icon ? tablerIconClass(props.icon, \"ti-inbox\") : undefined}\n action={props.children}\n class={props.class}\n />\n);\n\nconst AppOverview = ((props: AppOverviewProps): JSX.Element => (\n <div class={`k2b-app-overview ${props.class ?? \"\"}`}>\n <header class=\"k2b-app-overview__header\">\n <span class=\"k2b-app-overview__icon k2b-icon-tile\" aria-hidden=\"true\">\n <i class={tablerIconClass(props.icon, \"ti-apps\")} />\n </span>\n <PanelHeader as=\"h1\" size=\"lg\" title={props.title} subtitle={props.subtitle} actions={props.actions} />\n </header>\n <div class=\"k2b-app-overview__columns\">{props.children}</div>\n </div>\n)) as AppOverviewComponent;\n\nAppOverview.Main = AppOverviewMain;\nAppOverview.Aside = AppOverviewAside;\nAppOverview.Cards = AppOverviewCards;\nAppOverview.EmptyState = AppOverviewEmptyState;\n\nexport default AppOverview;\n"],"mappings":";;;;;;;;;;;;AAAA,SAAmB,IAAI,QAAQ,UAAU;AACzC,OAAO,WAAW,MAAM,yBAAyB;AACjD,SAAS,WAAW,QAAQ,eAAe;AAwC3C,MAAM,eAAe,GAAG,CAAC,IAA+B,EAAE,QAAgB,KAAa;EACrF,MAAM,KAAK,GAAG,IAAI,EAAE,IAAI,CAAC,CAAC,IAAI,QAAQ;EACtC,OAAO,KAAK,CAAC,UAAU,CAAC,KAAK,CAAC,GAAG,KAAK,GAAG,MAAM,KAAK,EAAE;AACxD,CAAC;AAED,MAAM,sBAAsB,GAAI,KAAuE,4BAG5F,KAAK,CAAC,KAAK,8BACf,IAAI;EAAA,IAAC,IAAI;IAAA,OAAE,KAAK,CAAC,WAAW;EAAA;EAAA;IAAA,8BACqB,KAAK,CAAC,WAAW;EAAA;AAAA,gCAGpE,IAAI;EAAA,IAAC,IAAI;IAAA,OAAE,KAAK,CAAC,OAAO;EAAA;EAAA;IAAA,+BACiB,KAAK,CAAC,OAAO;EAAA;AAAA,IAG1D;AAED,MAAM,eAAe,GAAI,KAA4B,mBACnC,mCAA0B,KAAK,CAAC,KAAK,IAAI,EAAE,SAAE,6BAC1D,sBAAsB;EAAA,IAAC,KAAK;IAAA,OAAE,KAAK,CAAC,KAAK;EAAA;EAAA,IAAE,WAAW;IAAA,OAAE,KAAK,CAAC,WAAW;EAAA;EAAA,IAAE,OAAO;IAAA,OAAE,KAAK,CAAC,OAAO;EAAA;AAAA,cACjG,KAAK,CAAC,QAAQ,EAElB;AAED,MAAM,gBAAgB,GAAI,KAA4B,mBACtC,oCAA2B,KAAK,CAAC,KAAK,IAAI,EAAE,SAAE,6BACzD,sBAAsB;EAAA,IAAC,KAAK;IAAA,OAAE,KAAK,CAAC,KAAK;EAAA;EAAA,IAAE,WAAW;IAAA,OAAE,KAAK,CAAC,WAAW;EAAA;EAAA,IAAE,OAAO;IAAA,OAAE,KAAK,CAAC,OAAO;EAAA;AAAA,cACjG,KAAK,CAAC,QAAQ,EAElB;AAED,MAAM,gBAAgB,GAAI,KAA4B,mBACxC,oCAA2B,KAAK,CAAC,KAAK,IAAI,EAAE,SAAE,WAAG,KAAK,CAAC,QAAQ,EAC5E;AAED,MAAM,qBAAqB,GAAI,KAAiC,sBAC7D,WAAW;EACV,OAAO;EAAA,IACP,KAAK;IAAA,OAAE,KAAK,CAAC,KAAK;EAAA;EAAA,IAClB,WAAW;IAAA,OAAE,KAAK,CAAC,WAAW;EAAA;EAAA,IAC9B,IAAI;IAAA,OAAE,oBAAK,CAAC,IAAI,MAAG,eAAe,CAAC,KAAK,CAAC,IAAI,EAAE,UAAU,CAAC,GAAG,SAAS;EAAA;EAAA,IACtE,MAAM;IAAA,OAAE,KAAK,CAAC,QAAQ;EAAA;EAAA;IAAA,OACf,KAAK,CAAC,KAAK;EAAA;AAAA,EAErB;AAED,MAAM,WAAW,GAAK,KAAuB,mBAC/B,6BAAoB,KAAK,CAAC,KAAK,IAAI,EAAE,SAAE,mCAGnC,eAAe,CAAC,KAAK,CAAC,IAAI,EAAE,SAAS,CAAC,4CAEjD,WAAW;EAAC,EAAE;EAAM,IAAI;EAAA,IAAM,KAAK;IAAA,OAAE,KAAK,CAAC,KAAK;EAAA;EAAA,IAAE,QAAQ;IAAA,OAAE,KAAK,CAAC,QAAQ;EAAA;EAAA,IAAE,OAAO;IAAA,OAAE,KAAK,CAAC,OAAO;EAAA;AAAA,cAE7D,KAAK,CAAC,QAAQ,EAEhC;AAE1B,WAAW,CAAC,IAAI,GAAG,eAAe;AAClC,WAAW,CAAC,KAAK,GAAG,gBAAgB;AACpC,WAAW,CAAC,KAAK,GAAG,gBAAgB;AACpC,WAAW,CAAC,UAAU,GAAG,qBAAqB;AAE9C,eAAe,WAAW","ignoreList":[]}
@@ -8,14 +8,14 @@ import { ssrStyle as _$ssrStyle } from "solid-js/web";
8
8
  import { ssrAttribute as _$ssrAttribute } from "solid-js/web";
9
9
  import { escape as _$escape } from "solid-js/web";
10
10
  var _tmpl$ = ["<button type=\"button\" class=\"k2b-app-workspace__resize\" role=\"separator\"", " style=\"", "\"><span aria-hidden=\"true\"></span></button>"],
11
- _tmpl$2 = ["<p>", "</p>"],
11
+ _tmpl$2 = ["<p class=\"k2b-truncate-fade\">", "</p>"],
12
12
  _tmpl$3 = ["<div class=\"k2b-app-workspace__level-actions\">", "</div>"],
13
- _tmpl$4 = ["<header class=\"k2b-app-workspace__level-head\">", "<div class=\"k2b-app-workspace__level-title\"><h2 tabindex=\"-1\">", "</h2>", "</div>", "</header>"],
14
- _tmpl$5 = ["<div class=\"k2b-app-workspace__main-primary\" data-workspace-main-region=\"main\"", ">", "</div>"],
15
- _tmpl$6 = ["<section", " class=\"", "\"", " style=\"", "\">", "</section>"],
16
- _tmpl$7 = "<i class=\"ti ti-chevron-left\" aria-hidden=\"true\"></i>",
17
- _tmpl$8 = ["<div class=\"k2b-app-workspace__level-body\"", ">", "</div>"],
18
- _tmpl$9 = ["<style>", "</style>"],
13
+ _tmpl$4 = ["<header class=\"k2b-app-workspace__level-head\">", "<div class=\"k2b-app-workspace__level-title\"><h2 tabindex=\"-1\"><span class=\"k2b-truncate-fade\">", "</span></h2>", "</div>", "</header>"],
14
+ _tmpl$5 = ["<style>", "</style>"],
15
+ _tmpl$6 = ["<div class=\"k2b-app-workspace__main-primary\" data-workspace-main-region=\"main\"", ">", "</div>"],
16
+ _tmpl$7 = ["<section", " class=\"", "\"", " style=\"", "\">", "</section>"],
17
+ _tmpl$8 = "<i class=\"ti ti-chevron-left\" aria-hidden=\"true\"></i>",
18
+ _tmpl$9 = ["<div class=\"k2b-app-workspace__level-body\"", ">", "</div>"],
19
19
  _tmpl$0 = "<i class=\"ti ti-layout-sidebar-right\" aria-hidden=\"true\"></i>",
20
20
  _tmpl$1 = ["<aside", " class=\"", "\"", "", " style=\"", "\"><button type=\"button\" class=\"k2b-app-workspace__detail-grabber\"", " aria-pressed=\"false\"><span aria-hidden=\"true\"></span></button>", "</aside>"],
21
21
  _tmpl$10 = ["<aside", " class=\"", "\"", "", " style=\"", "\">", "</aside>"],
@@ -40,35 +40,41 @@ var _tmpl$ = ["<button type=\"button\" class=\"k2b-app-workspace__resize\" role=
40
40
  _tmpl$29 = "<span class=\"k2b-app-workspace__sidebar-status-dot\"></span>",
41
41
  _tmpl$30 = ["<span", " aria-hidden=\"true\">", "</span>"],
42
42
  _tmpl$31 = ["<span class=\"k2b-app-workspace__sidebar-item-context-meta\">", "</span>"],
43
- _tmpl$32 = ["<span class=\"k2b-app-workspace__sidebar-item-context\"><span class=\"k2b-app-workspace__sidebar-item-context-label\">", "</span>", "</span>"],
44
- _tmpl$33 = ["<span class=\"k2b-app-workspace__sidebar-item-description\">", "</span>"],
45
- _tmpl$34 = ["<span class=\"k2b-app-workspace__sidebar-item-copy\">", "<span class=\"k2b-app-workspace__sidebar-item-label\"", "><span class=\"k2b-app-workspace__sidebar-item-label-text\">", "</span></span>", "</span>"],
43
+ _tmpl$32 = ["<span class=\"k2b-app-workspace__sidebar-item-context\"><span class=\"k2b-app-workspace__sidebar-item-context-label k2b-truncate-fade\">", "</span>", "</span>"],
44
+ _tmpl$33 = ["<span class=\"k2b-app-workspace__sidebar-item-description k2b-truncate-fade\">", "</span>"],
45
+ _tmpl$34 = ["<span class=\"k2b-app-workspace__sidebar-item-copy\">", "<span class=\"k2b-app-workspace__sidebar-item-label\"", "><span class=\"k2b-app-workspace__sidebar-item-label-text k2b-truncate-fade-lines\">", "</span></span>", "</span>"],
46
46
  _tmpl$35 = ["<span class=\"k2b-app-workspace__sidebar-item-meta\"", ">", "</span>"],
47
47
  _tmpl$36 = ["<i", "></i>"],
48
48
  _tmpl$37 = ["<a", " class=\"k2b-app-workspace__sidebar-item-action\"", ">", "</a>"],
49
49
  _tmpl$38 = ["<button type=\"button\" class=\"k2b-app-workspace__sidebar-item-action\"", ">", "</button>"],
50
- _tmpl$39 = ["<span class=\"k2b-app-workspace__sidebar-item-copy\"><span class=\"k2b-app-workspace__sidebar-item-label\"", "><span class=\"k2b-app-workspace__sidebar-item-label-text\">", "</span></span><span class=\"k2b-app-workspace__sidebar-item-description\">", "</span></span>"],
50
+ _tmpl$39 = ["<span class=\"k2b-app-workspace__sidebar-item-copy\"><span class=\"k2b-app-workspace__sidebar-item-label\"", "><span class=\"k2b-app-workspace__sidebar-item-label-text k2b-truncate-fade-lines\">", "</span></span><span class=\"k2b-app-workspace__sidebar-item-description k2b-truncate-fade\">", "</span></span>"],
51
51
  _tmpl$40 = ["<span class=\"", "\"", ">", "</span>"],
52
52
  _tmpl$41 = ["<span class=\"k2b-app-workspace__nav-tree-toggle\" data-k2b-nav-tree-toggle aria-hidden=\"true\"><i class=\"", "\"></i></span>"],
53
- _tmpl$42 = ["<span class=\"k2b-app-workspace__sidebar-item-label\"", "><span class=\"k2b-app-workspace__sidebar-item-label-text\">", "</span></span>"],
53
+ _tmpl$42 = ["<span class=\"k2b-app-workspace__sidebar-item-label\"", "><span class=\"k2b-app-workspace__sidebar-item-label-text k2b-truncate-fade-lines\">", "</span></span>"],
54
54
  _tmpl$43 = ["<div class=\"k2b-app-workspace__nav-tree-group\" role=\"group\">", "</div>"],
55
55
  _tmpl$44 = ["<div class=\"k2b-app-workspace__nav-tree-node\" role=\"treeitem\"", " style=\"", "\">", "", "</div>"],
56
56
  _tmpl$45 = ["<div class=\"", "\" role=\"tree\"", ">", "</div>"],
57
57
  _tmpl$46 = ["<div class=\"k2b-app-workspace__sidebar-icon-grid\"", ">", "</div>"],
58
58
  _tmpl$47 = ["<i", " aria-hidden=\"true\"></i>"],
59
- _tmpl$48 = "<i class=\"ti ti-layout-sidebar\" aria-hidden=\"true\"></i>",
60
- _tmpl$49 = ["<div class=\"k2b-app-workspace__head\"", ">", "", "</div>"],
61
- _tmpl$50 = ["<h1 class=\"k2b-app-workspace__head-heading\" data-k2b-page-trail-title", ">", "</h1>"],
62
- _tmpl$51 = ["<div class=\"", "\" data-k2b-app-workspace", " style=\"", "\">", "", "</div>"],
63
- _tmpl$52 = ["<div class=\"", "\">", "</div>"];
59
+ _tmpl$48 = ["<span class=\"k2b-app-workspace__head-primary-label\">", "</span>"],
60
+ _tmpl$49 = "<i class=\"ti ti-layout-sidebar\" aria-hidden=\"true\"></i>",
61
+ _tmpl$50 = ["<div class=\"k2b-app-workspace__head-views\">", "</div>"],
62
+ _tmpl$51 = ["<div class=\"k2b-app-workspace__head-filters\" role=\"group\"", ">", "", "</div>"],
63
+ _tmpl$52 = ["<span class=\"k2b-app-workspace__head-count\"><span>", "</span></span>"],
64
+ _tmpl$53 = ["<div class=\"k2b-app-workspace__head-actions\">", "", "</div>"],
65
+ _tmpl$54 = ["<div class=\"k2b-app-workspace__head\"", "><div class=\"k2b-app-workspace__head-lead\">", "", "", "", "", "</div>", "</div>"],
66
+ _tmpl$55 = ["<h1 class=\"k2b-app-workspace__head-heading\" data-k2b-page-trail-title", ">", "</h1>"],
67
+ _tmpl$56 = ["<div class=\"", "\" data-k2b-app-workspace", " style=\"", "\">", "</div>"],
68
+ _tmpl$57 = ["<div class=\"", "\">", "</div>"];
64
69
  import { Link } from "@k2b/ssr/nav";
65
70
  import { children, createContext, createEffect, createMemo, createRoot, createSignal, createUniqueId, For, getOwner, mergeProps, on, onCleanup, onMount, Show, useContext } from "solid-js";
66
71
  import { Dynamic, isServer } from "solid-js/web";
67
- import { Button, IconButton, IconButtonLink } from "../actions/Button";
72
+ import { Button, ButtonLink, IconButton, IconButtonLink } from "../actions/Button";
73
+ import { useFilterMessages } from "../actions/filter-messages";
68
74
  import { dialogCore } from "../feedback/dialog-core";
69
75
  import { RenderErrorBoundary } from "../internal/render-error";
70
76
  import { APP_WORKSPACE_DETAIL_CLOSE_EVENT, APP_WORKSPACE_DETAIL_STEP_EVENT, APP_WORKSPACE_SIDEBAR_HIDE_EVENT, installAppWorkspaceController } from "./app-workspace-controller";
71
- import { APP_WORKSPACE_DETAIL_DEFAULT, APP_WORKSPACE_DETAIL_MAX, APP_WORKSPACE_DETAIL_MIN, APP_WORKSPACE_DRAWER_DEFAULT, APP_WORKSPACE_DRAWER_MAX, APP_WORKSPACE_DRAWER_MIN, APP_WORKSPACE_PANE_DEFAULT, APP_WORKSPACE_PANE_MAX, APP_WORKSPACE_PANE_MIN, APP_WORKSPACE_SIDEBAR_COLLAPSED, APP_WORKSPACE_SIDEBAR_DEFAULT, APP_WORKSPACE_SIDEBAR_MAX, APP_WORKSPACE_SIDEBAR_MIN, appWorkspaceLayoutStyle, appWorkspacePanelVariable } from "./app-workspace-state";
77
+ import { APP_WORKSPACE_DETAIL_DEFAULT, APP_WORKSPACE_DETAIL_MAX, APP_WORKSPACE_DETAIL_MIN, APP_WORKSPACE_DRAWER_DEFAULT, APP_WORKSPACE_DRAWER_MAX, APP_WORKSPACE_DRAWER_MIN, APP_WORKSPACE_MAIN_MIN, APP_WORKSPACE_PANE_DEFAULT, APP_WORKSPACE_PANE_MAX, APP_WORKSPACE_PANE_MIN, APP_WORKSPACE_SIDEBAR_COLLAPSED, APP_WORKSPACE_SIDEBAR_DEFAULT, APP_WORKSPACE_SIDEBAR_MAX, APP_WORKSPACE_SIDEBAR_MIN, appWorkspaceLayoutStyle, appWorkspacePanelVariable } from "./app-workspace-state";
72
78
  import BottomSheet, { bottomSheetAdaptiveOptions } from "./BottomSheet";
73
79
  import { PageTitle, usePageTrail } from "./PageTitle";
74
80
  import { SidebarItemPreview } from "./SidebarItemPreview";
@@ -81,6 +87,8 @@ const ResizeContext = createContext(true);
81
87
  /** The enclosing workspace: its head names the sidebar, and a nested workspace leaves the page title to it. */
82
88
  const WorkspaceContext = createContext();
83
89
  const LayoutStateContext = createContext(null);
90
+ const HEAD = Symbol("AppWorkspace.Head");
91
+ const headSlot = value => !!value && typeof value === "object" && "kind" in value && value.kind === HEAD;
84
92
  const MAIN_PANE = Symbol("AppWorkspace.MainPane");
85
93
  const SIDEBAR_DESKTOP = Symbol("AppWorkspace.SidebarDesktop");
86
94
  const SIDEBAR_ITEM_ICON = Symbol("AppWorkspace.SidebarItemIcon");
@@ -100,6 +108,13 @@ const mainPaneSlot = value => Boolean(value && typeof value === "object" && "kin
100
108
  const sidebarChildSlot = value => Boolean(value && typeof value === "object" && "kind" in value && value.kind === SIDEBAR_DESKTOP);
101
109
  const sidebarItemSlot = value => Boolean(value && typeof value === "object" && "kind" in value && [SIDEBAR_ITEM_ICON, SIDEBAR_ITEM_LABEL, SIDEBAR_ITEM_META, SIDEBAR_ITEM_ACTION].includes(value.kind));
102
110
  const navTreeItemSlot = value => Boolean(value && typeof value === "object" && "kind" in value && value.kind === NAV_TREE_ITEM);
111
+ /** Head row slot. Must be a direct child of AppWorkspace; its parts may be islands. */
112
+ function AppWorkspaceHeadSlot(props) {
113
+ return {
114
+ kind: HEAD,
115
+ props
116
+ };
117
+ }
103
118
  function ResizeHandle(props) {
104
119
  const workspaceMessages = useWorkspaceMessages();
105
120
  const workspace = useContext(WorkspaceContext);
@@ -255,10 +270,29 @@ function AppWorkspaceMain(props) {
255
270
  // layout. Deriving it from `regions()` made a workspace whose panes are all
256
271
  // closed fall back to `resolved()`, which renders the raw slot objects.
257
272
  const hasPanes = createMemo(() => paneIds().length > 0);
258
- return _$ssrElement("div", _$mergeProps({
273
+ // The workspace's tracks and queries read Main's minimum on the workspace
274
+ // itself, which cannot read Main's own variables, so this rule hands it up,
275
+ // as `AppWorkspace.Detail` does with its width.
276
+ const minWidth = () => {
277
+ const value = props.minWidth;
278
+ return value !== undefined && Number.isFinite(value) && value > APP_WORKSPACE_MAIN_MIN ? Math.round(value) : undefined;
279
+ };
280
+ const minWidthRule = value => {
281
+ const main = `.k2b-app-workspace__main[data-workspace-main-min="${value}"]`;
282
+ return `.k2b-app-workspace:has(> .k2b-app-workspace__content > ${main}, > .k2b-app-workspace__content > :is(solid-island, solid-client) > ${main}){--k2b-workspace-main-min:${value}px}`;
283
+ };
284
+ return [_$createComponent(Show, {
285
+ get when() {
286
+ return minWidth();
287
+ },
288
+ children: value => _$ssr(_tmpl$5, minWidthRule(value()))
289
+ }), _$ssrElement("div", _$mergeProps({
259
290
  get ["class"]() {
260
291
  return `k2b-app-workspace__main ${hasPanes() ? "has-panes" : ""} ${props.class ?? ""}`;
261
292
  },
293
+ get ["data-workspace-main-min"]() {
294
+ return minWidth();
295
+ },
262
296
  get ["data-workspace-levels"]() {
263
297
  return levelsMode() ? "" : undefined;
264
298
  },
@@ -298,7 +332,7 @@ function AppWorkspaceMain(props) {
298
332
  return props.mobilePane ?? (anchor?.type === "pane" ? anchor.slot.props.id : "main");
299
333
  };
300
334
  if (region.type === "primary") {
301
- return _$ssr(_tmpl$5, _$ssrAttribute("data-workspace-mobile-active", activeMobilePane() === "main" ? "true" : "false", false), _$escape(region.children));
335
+ return _$ssr(_tmpl$6, _$ssrAttribute("data-workspace-mobile-active", activeMobilePane() === "main" ? "true" : "false", false), _$escape(region.children));
302
336
  }
303
337
  const pane = region.slot;
304
338
  const levelIndex = () => levels().indexOf(pane) + 1;
@@ -351,7 +385,7 @@ function AppWorkspaceMain(props) {
351
385
  get children() {
352
386
  return handle();
353
387
  }
354
- }), _$ssr(_tmpl$6, _$ssrAttribute("id", _$escape(pane.domId, true), false), `k2b-app-workspace__main-pane ${isAnchor() ? "is-primary" : ""} ${_$escape(pane.props.class ?? "", true)}`, _$ssrAttribute("aria-label", _$escape(pane.props.label, true), false) + _$ssrAttribute("data-workspace-level", levelsMode() ? _$escape(levelIndex(), true) : _$escape(undefined, true), false) + _$ssrAttribute("data-workspace-level-shown", _$escape(levelAttr("shown"), true), false) + _$ssrAttribute("data-workspace-level-first", _$escape(levelAttr("first"), true), false) + _$ssrAttribute("data-workspace-level-last", _$escape(levelAttr("last"), true), false) + _$ssrAttribute("data-workspace-main-region", _$escape(pane.props.id, true), false) + _$ssrAttribute("data-workspace-mobile-active", (levelsMode() ? levelClasses(levelIndex(), "shown").split(" ").includes("1") : activeMobilePane() === pane.props.id) ? "true" : "false", false) + _$ssrAttribute("data-workspace-panel-id", _$escape(panelId, true), false) + _$ssrAttribute("data-workspace-resizable", resizable() ? "true" : "false", false) + _$ssrAttribute("data-surface", pane.props.surface === "navigation" ? "navigation" : _$escape(undefined, true), false) + _$ssrAttribute("data-scroll", !levelsMode() && pane.props.scroll === false ? "false" : _$escape(undefined, true), false) + _$ssrAttribute("data-scroll-fade-mode", !levelsMode() && pane.props.scroll !== false && pane.props.scrollFade !== false ? "both" : _$escape(undefined, true), false), _$ssrStyle(isAnchor() ? undefined : {
388
+ }), _$ssr(_tmpl$7, _$ssrAttribute("id", _$escape(pane.domId, true), false), `k2b-app-workspace__main-pane ${isAnchor() ? "is-primary" : ""} ${_$escape(pane.props.class ?? "", true)}`, _$ssrAttribute("aria-label", _$escape(pane.props.label, true), false) + _$ssrAttribute("data-workspace-level", levelsMode() ? _$escape(levelIndex(), true) : _$escape(undefined, true), false) + _$ssrAttribute("data-workspace-level-shown", _$escape(levelAttr("shown"), true), false) + _$ssrAttribute("data-workspace-level-first", _$escape(levelAttr("first"), true), false) + _$ssrAttribute("data-workspace-level-last", _$escape(levelAttr("last"), true), false) + _$ssrAttribute("data-workspace-main-region", _$escape(pane.props.id, true), false) + _$ssrAttribute("data-workspace-mobile-active", (levelsMode() ? levelClasses(levelIndex(), "shown").split(" ").includes("1") : activeMobilePane() === pane.props.id) ? "true" : "false", false) + _$ssrAttribute("data-workspace-panel-id", _$escape(panelId, true), false) + _$ssrAttribute("data-workspace-resizable", resizable() ? "true" : "false", false) + _$ssrAttribute("data-surface", pane.props.surface === "navigation" ? "navigation" : _$escape(undefined, true), false) + _$ssrAttribute("data-scroll", !levelsMode() && pane.props.scroll === false ? "false" : _$escape(undefined, true), false) + _$ssrAttribute("data-scroll-fade-mode", !levelsMode() && pane.props.scroll !== false && pane.props.scrollFade !== false ? "both" : _$escape(undefined, true), false), _$ssrStyle(isAnchor() ? undefined : {
355
389
  // A stored width keeps to this pane's limits before the controller attaches.
356
390
  "--k2b-workspace-panel-size": `clamp(${minSize()}px, var(${variable}, ${defaultSize()}px), ${maxSize()}px)`,
357
391
  "--k2b-workspace-panel-min": `${minSize()}px`
@@ -388,13 +422,13 @@ function AppWorkspaceMain(props) {
388
422
  return props.onLevelNavigate ? navigateBack : undefined;
389
423
  },
390
424
  get children() {
391
- return _$ssr(_tmpl$7);
425
+ return _$ssr(_tmpl$8);
392
426
  }
393
427
  });
394
428
  }
395
429
  });
396
430
  }
397
- }), _$ssr(_tmpl$8, _$ssrAttribute("data-scroll", pane.props.scroll === false ? "false" : _$escape(undefined, true), false) + _$ssrAttribute("data-scroll-fade-mode", pane.props.scroll !== false && pane.props.scrollFade !== false ? "both" : _$escape(undefined, true), false), _$escape(pane.props.children))]) : _$escape(pane.props.children)), _$createComponent(Show, {
431
+ }), _$ssr(_tmpl$9, _$ssrAttribute("data-scroll", pane.props.scroll === false ? "false" : _$escape(undefined, true), false) + _$ssrAttribute("data-scroll-fade-mode", pane.props.scroll !== false && pane.props.scrollFade !== false ? "both" : _$escape(undefined, true), false), _$escape(pane.props.children))]) : _$escape(pane.props.children)), _$createComponent(Show, {
398
432
  get when() {
399
433
  return _$memo(() => !!resizable())() && before();
400
434
  },
@@ -407,7 +441,7 @@ function AppWorkspaceMain(props) {
407
441
  }
408
442
  });
409
443
  }
410
- })), false);
444
+ })), false)];
411
445
  }
412
446
  function AppWorkspaceDetail(props) {
413
447
  const workspaceMessages = useWorkspaceMessages();
@@ -457,7 +491,7 @@ function AppWorkspaceDetail(props) {
457
491
  aside?.removeEventListener(APP_WORKSPACE_DETAIL_STEP_EVENT, step);
458
492
  });
459
493
  });
460
- return [_$ssr(_tmpl$9, workspaceRule()), _$createComponent(Button, {
494
+ return [_$ssr(_tmpl$5, workspaceRule()), _$createComponent(Button, {
461
495
  type: "button",
462
496
  variant: "ghost",
463
497
  get ["aria-controls"]() {
@@ -497,7 +531,7 @@ function AppWorkspaceDetail(props) {
497
531
  }
498
532
  });
499
533
  }
500
- }), _$ssr(_tmpl$1, _$ssrAttribute("id", _$escape(domId(), true), false), `k2b-app-workspace__detail ${_$escape(props.class ?? "", true)}`, _$ssrAttribute("data-width", _$escape(props.width ?? "md", true), false) + _$ssrAttribute("data-workspace-detail-phone", props.phone === "page" ? "page" : _$escape(undefined, true), false) + _$ssrAttribute("data-workspace-panel-id", _$escape(panelId(), true), false) + _$ssrAttribute("data-workspace-resizable", resizable() ? "true" : "false", false) + _$ssrAttribute("data-workspace-detail-closable", props.onClose ? "true" : _$escape(undefined, true), false) + _$ssrAttribute("data-workspace-detail-steppable", props.onStep ? "true" : _$escape(undefined, true), false), _$ssrAttribute("hidden", !props.open, true), _$ssrStyle({
534
+ }), _$ssr(_tmpl$1, _$ssrAttribute("id", _$escape(domId(), true), false), `k2b-app-workspace__detail ${_$escape(props.class ?? "", true)}`, _$ssrAttribute("data-width", _$escape(props.width ?? "md", true), false) + _$ssrAttribute("data-workspace-detail-phone", props.phone === "page" ? "page" : _$escape(undefined, true), false) + _$ssrAttribute("data-workspace-detail-choice", props.openOnChoice === false ? "request" : _$escape(undefined, true), false) + _$ssrAttribute("data-workspace-panel-id", _$escape(panelId(), true), false) + _$ssrAttribute("data-workspace-resizable", resizable() ? "true" : "false", false) + _$ssrAttribute("data-workspace-detail-closable", props.onClose ? "true" : _$escape(undefined, true), false) + _$ssrAttribute("data-workspace-detail-steppable", props.onStep ? "true" : _$escape(undefined, true), false), _$ssrAttribute("hidden", !props.open, true), _$ssrStyle({
501
535
  ...sizeStyle(),
502
536
  "view-transition-name": props.viewTransitionName
503
537
  }), _$ssrAttribute("aria-label", _$escape(workspaceMessages().detailFullHeight, true), false), _$escape(props.children))];
@@ -1647,16 +1681,28 @@ const AppWorkspaceSidebarIconAction = props => {
1647
1681
  * host's page title with the way up (see `PageTitle`); the page's own
1648
1682
  * `PageTitle` takes its place. The visible title is no heading, because many
1649
1683
  * pages render their own `h1`. From 64 rem a sidebar that marks the current
1650
- * page names it already: the row hides, and only on a page without its own
1651
- * `h1` its heading stays for assistive technology. It is one fixed height
1652
- * and draws no line; CSS decides when it shows, so the server-rendered page
1653
- * already has its final geometry.
1684
+ * page names it already: the title and the way up hide, and only on a page
1685
+ * without its own `h1` its heading stays for assistive technology. With an
1686
+ * `AppWorkspace.Head` slot the row is always there and also carries the
1687
+ * views, the filters, the result count, and the actions; only its title
1688
+ * follows the rules above. It draws no line; CSS decides what shows and when
1689
+ * the filters wrap, so the server-rendered page already has its final
1690
+ * geometry.
1654
1691
  */
1655
1692
  function AppWorkspaceHead(props) {
1656
1693
  const messages = useWorkspaceMessages();
1694
+ const filters = useFilterMessages();
1695
+ // JSX prop getters construct their elements on every read. Share each
1696
+ // resolved slot between its presence check and its rendered content.
1697
+ const resolvedViews = children(() => props.head?.views);
1698
+ const resolvedFilters = children(() => props.head?.filters);
1699
+ const resolvedActions = children(() => props.head?.actions);
1700
+ const resolvedCount = children(() => props.head?.count);
1657
1701
  // A nested workspace is part of a page that already shows its title.
1658
1702
  const trail = props.nested ? () => undefined : usePageTrail();
1659
- return _$ssr(_tmpl$49, _$ssrAttribute("data-trail", trail()?.ancestors.length ? "up" : trail() ? "title" : _$escape(undefined, true), false), _$escape(_$createComponent(IconButton, {
1703
+ const resetContent = () => filters().reset;
1704
+ const primaryContent = () => [_$ssr(_tmpl$47, _$ssrAttribute("class", _$escape(props.head?.primary?.icon, true), false)), _$ssr(_tmpl$48, _$escape(props.head?.primary?.label))];
1705
+ return _$ssr(_tmpl$54, _$ssrAttribute("data-trail", trail()?.ancestors.length ? "up" : trail() ? "title" : _$escape(undefined, true), false) + _$ssrAttribute("data-row", props.head ? "" : _$escape(undefined, true), false), _$escape(_$createComponent(IconButton, {
1660
1706
  "class": "k2b-app-workspace__head-toggle",
1661
1707
  get label() {
1662
1708
  return messages().showNavigation;
@@ -1667,7 +1713,7 @@ function AppWorkspaceHead(props) {
1667
1713
  "aria-expanded": "false",
1668
1714
  "data-app-workspace-sidebar-toggle": "",
1669
1715
  get children() {
1670
- return _$ssr(_tmpl$48);
1716
+ return _$ssr(_tmpl$49);
1671
1717
  }
1672
1718
  })), _$escape(_$createComponent(Show, {
1673
1719
  get when() {
@@ -1679,7 +1725,113 @@ function AppWorkspaceHead(props) {
1679
1725
  },
1680
1726
  as: "p",
1681
1727
  fallback: true
1682
- }), _$ssr(_tmpl$50, _$ssrAttribute("data-k2b-server", isServer ? "" : _$escape(undefined, true), false), _$escape(current().title))]
1728
+ }), _$ssr(_tmpl$55, _$ssrAttribute("data-k2b-server", isServer ? "" : _$escape(undefined, true), false), _$escape(current().title))]
1729
+ })), _$escape(_$createComponent(Show, {
1730
+ get when() {
1731
+ return resolvedViews.toArray().some(Boolean);
1732
+ },
1733
+ get children() {
1734
+ return _$ssr(_tmpl$50, _$escape(resolvedViews()));
1735
+ }
1736
+ })), _$escape(_$createComponent(Show, {
1737
+ get when() {
1738
+ return resolvedFilters.toArray().some(Boolean) || props.head?.filtered;
1739
+ },
1740
+ get children() {
1741
+ return _$ssr(_tmpl$51, _$ssrAttribute("aria-label", _$escape(filters().filters, true), false), _$escape(resolvedFilters()), _$escape(_$createComponent(Show, {
1742
+ get when() {
1743
+ return props.head?.filtered;
1744
+ },
1745
+ get children() {
1746
+ return _$createComponent(Show, {
1747
+ get when() {
1748
+ return props.head?.resetHref;
1749
+ },
1750
+ get fallback() {
1751
+ return _$createComponent(Button, {
1752
+ variant: "ghost",
1753
+ size: "sm",
1754
+ "class": "k2b-app-workspace__head-reset",
1755
+ onClick: () => props.head?.onReset?.(),
1756
+ get children() {
1757
+ return resetContent();
1758
+ }
1759
+ });
1760
+ },
1761
+ children: href => _$createComponent(ButtonLink, {
1762
+ variant: "ghost",
1763
+ size: "sm",
1764
+ "class": "k2b-app-workspace__head-reset",
1765
+ get href() {
1766
+ return href();
1767
+ },
1768
+ get onClick() {
1769
+ return props.head?.onReset ? event => {
1770
+ if (event.button !== 0 || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey) return;
1771
+ event.preventDefault();
1772
+ props.head?.onReset?.();
1773
+ } : undefined;
1774
+ },
1775
+ get children() {
1776
+ return resetContent();
1777
+ }
1778
+ })
1779
+ });
1780
+ }
1781
+ })));
1782
+ }
1783
+ })), _$escape(_$createComponent(Show, {
1784
+ get when() {
1785
+ return _$memo(() => !!props.head?.filtered)() && resolvedCount.toArray().some(value => value !== undefined && value !== null && value !== false);
1786
+ },
1787
+ get children() {
1788
+ return _$ssr(_tmpl$52, _$escape(resolvedCount()));
1789
+ }
1790
+ })), _$escape(_$createComponent(Show, {
1791
+ get when() {
1792
+ return resolvedActions.toArray().some(Boolean) || props.head?.primary;
1793
+ },
1794
+ get children() {
1795
+ return _$ssr(_tmpl$53, _$escape(resolvedActions()), _$escape(_$createComponent(Show, {
1796
+ get when() {
1797
+ return props.head?.primary;
1798
+ },
1799
+ children: primary => _$createComponent(Show, {
1800
+ get when() {
1801
+ return primary().href;
1802
+ },
1803
+ get fallback() {
1804
+ return _$createComponent(Button, {
1805
+ variant: "primary",
1806
+ size: "sm",
1807
+ "class": "k2b-app-workspace__head-primary",
1808
+ "data-workspace-primary": "",
1809
+ get onClick() {
1810
+ return primary().onClick;
1811
+ },
1812
+ get children() {
1813
+ return primaryContent();
1814
+ }
1815
+ });
1816
+ },
1817
+ children: href => _$createComponent(ButtonLink, {
1818
+ variant: "primary",
1819
+ size: "sm",
1820
+ "class": "k2b-app-workspace__head-primary",
1821
+ "data-workspace-primary": "",
1822
+ get href() {
1823
+ return href();
1824
+ },
1825
+ get onClick() {
1826
+ return primary().onClick;
1827
+ },
1828
+ get children() {
1829
+ return primaryContent();
1830
+ }
1831
+ })
1832
+ })
1833
+ })));
1834
+ }
1683
1835
  })));
1684
1836
  }
1685
1837
  const AppWorkspace = props => {
@@ -1707,6 +1859,20 @@ const AppWorkspace = props => {
1707
1859
  writeState: state => props.onLayoutChange?.(state)
1708
1860
  }));
1709
1861
  });
1862
+ const contents = () => {
1863
+ const resolved = children(() => props.children);
1864
+ const slots = createMemo(() => flatten(resolved()));
1865
+ // Same props object, same memo value: a sibling change must not rebuild the head's slots.
1866
+ const head = createMemo(() => slots().find(headSlot)?.props);
1867
+ const content = () => slots().filter(value => !headSlot(value));
1868
+ return [_$createComponent(AppWorkspaceHead, {
1869
+ sidebarId: sidebarId,
1870
+ nested: nested,
1871
+ get head() {
1872
+ return head();
1873
+ }
1874
+ }), content()];
1875
+ };
1710
1876
  return _$createComponent(ResizeContext.Provider, {
1711
1877
  get value() {
1712
1878
  return props.resizable !== false;
@@ -1715,10 +1881,7 @@ const AppWorkspace = props => {
1715
1881
  return _$createComponent(WorkspaceContext.Provider, {
1716
1882
  value: workspace,
1717
1883
  get children() {
1718
- return _$ssr(_tmpl$51, `k2b-app-workspace ${_$escape(props.class ?? "", true)}`, _$ssrAttribute("data-mobile-surface", _$escape(props.mobileSurface, true), false) + _$ssrAttribute("data-flat", props.flat ? "true" : _$escape(undefined, true), false) + _$ssrAttribute("data-sidebar-collapsed", initialLayoutState()?.sidebarCollapsed === undefined ? _$escape(undefined, true) : _$escape(String(initialLayoutState()?.sidebarCollapsed), true), false) + _$ssrAttribute("data-workspace-resizable", props.resizable === false ? "false" : "true", false), _$ssrStyle(appWorkspaceLayoutStyle(initialLayoutState())), _$escape(_$createComponent(AppWorkspaceHead, {
1719
- sidebarId: sidebarId,
1720
- nested: nested
1721
- })), _$escape(props.children));
1884
+ return _$ssr(_tmpl$56, `k2b-app-workspace ${_$escape(props.class ?? "", true)}`, _$ssrAttribute("data-mobile-surface", _$escape(props.mobileSurface, true), false) + _$ssrAttribute("data-flat", props.flat ? "true" : _$escape(undefined, true), false) + _$ssrAttribute("data-sidebar-collapsed", initialLayoutState()?.sidebarCollapsed === undefined ? _$escape(undefined, true) : _$escape(String(initialLayoutState()?.sidebarCollapsed), true), false) + _$ssrAttribute("data-workspace-resizable", props.resizable === false ? "false" : "true", false), _$ssrStyle(appWorkspaceLayoutStyle(initialLayoutState())), _$escape(contents()));
1722
1885
  }
1723
1886
  });
1724
1887
  }
@@ -1732,7 +1895,8 @@ AppWorkspace.LayoutStateProvider = props => _$createComponent(LayoutStateContext
1732
1895
  return props.children;
1733
1896
  }
1734
1897
  });
1735
- AppWorkspace.Content = props => _$ssr(_tmpl$52, `k2b-app-workspace__content ${_$escape(props.class ?? "", true)}`, _$escape(props.children));
1898
+ AppWorkspace.Head = AppWorkspaceHeadSlot;
1899
+ AppWorkspace.Content = props => _$ssr(_tmpl$57, `k2b-app-workspace__content ${_$escape(props.class ?? "", true)}`, _$escape(props.children));
1736
1900
  AppWorkspace.Main = AppWorkspaceMain;
1737
1901
  AppWorkspace.MainPane = AppWorkspaceMainPane;
1738
1902
  AppWorkspace.Detail = AppWorkspaceDetail;