@ketvietlab/design-system 0.1.24 → 0.1.29

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 (122) hide show
  1. package/README.md +29 -0
  2. package/dist/atlas/island-runtime.d.mts +2 -0
  3. package/dist/atlas/island-runtime.d.mts.map +1 -0
  4. package/dist/atlas/island-runtime.mjs +2 -0
  5. package/dist/atlas/island-runtime.mjs.map +1 -0
  6. package/dist/atlas/relation-select-hydration.d.ts +2 -0
  7. package/dist/atlas/relation-select-hydration.d.ts.map +1 -0
  8. package/dist/atlas/relation-select-hydration.js +40 -0
  9. package/dist/atlas/relation-select-hydration.js.map +1 -0
  10. package/dist/atlas-cli.d.ts.map +1 -1
  11. package/dist/atlas-cli.js +18 -3
  12. package/dist/atlas-cli.js.map +1 -1
  13. package/dist/catalogue/index.js +1 -1
  14. package/dist/catalogue/inventory-policy.json +49 -0
  15. package/dist/catalogue/inventory.generated.js +1 -1
  16. package/dist/catalogue/inventory.generated.js.map +1 -1
  17. package/dist/catalogue/inventory.generated.json +2613 -1092
  18. package/dist/catalogue/registry.d.ts.map +1 -1
  19. package/dist/catalogue/registry.js +18 -0
  20. package/dist/catalogue/registry.js.map +1 -1
  21. package/dist/catalogue/specimens.d.ts.map +1 -1
  22. package/dist/catalogue/specimens.js +130 -10
  23. package/dist/catalogue/specimens.js.map +1 -1
  24. package/dist/contract/index.d.ts.map +1 -1
  25. package/dist/contract/index.js +10 -0
  26. package/dist/contract/index.js.map +1 -1
  27. package/dist/foundations/tokens.css +34 -26
  28. package/dist/index.d.ts +14 -3
  29. package/dist/index.d.ts.map +1 -1
  30. package/dist/index.js +8 -3
  31. package/dist/index.js.map +1 -1
  32. package/dist/interactions/ket-table/demo.d.ts +4 -0
  33. package/dist/interactions/ket-table/demo.d.ts.map +1 -0
  34. package/dist/interactions/ket-table/demo.js +147 -0
  35. package/dist/interactions/ket-table/demo.js.map +1 -0
  36. package/dist/interactions/ket-table/index.d.ts +199 -0
  37. package/dist/interactions/ket-table/index.d.ts.map +1 -0
  38. package/dist/interactions/ket-table/index.js +376 -0
  39. package/dist/interactions/ket-table/index.js.map +1 -0
  40. package/dist/interactions/ket-table/styles.css +282 -0
  41. package/dist/interactions/lightbox/demo.d.ts +3 -0
  42. package/dist/interactions/lightbox/demo.d.ts.map +1 -0
  43. package/dist/interactions/lightbox/demo.js +21 -0
  44. package/dist/interactions/lightbox/demo.js.map +1 -0
  45. package/dist/interactions/lightbox/index.d.ts +58 -0
  46. package/dist/interactions/lightbox/index.d.ts.map +1 -0
  47. package/dist/interactions/lightbox/index.js +220 -0
  48. package/dist/interactions/lightbox/index.js.map +1 -0
  49. package/dist/interactions/lightbox/styles.css +153 -0
  50. package/dist/interactions/relation-select/demo.d.ts +3 -0
  51. package/dist/interactions/relation-select/demo.d.ts.map +1 -0
  52. package/dist/interactions/relation-select/demo.js +36 -0
  53. package/dist/interactions/relation-select/demo.js.map +1 -0
  54. package/dist/interactions/relation-select/index.d.ts +87 -0
  55. package/dist/interactions/relation-select/index.d.ts.map +1 -0
  56. package/dist/interactions/relation-select/index.js +307 -0
  57. package/dist/interactions/relation-select/index.js.map +1 -0
  58. package/dist/interactions/relation-select/styles.css +311 -0
  59. package/dist/interactions/reorder-list/index.d.ts +23 -0
  60. package/dist/interactions/reorder-list/index.d.ts.map +1 -0
  61. package/dist/interactions/reorder-list/index.js +15 -0
  62. package/dist/interactions/reorder-list/index.js.map +1 -0
  63. package/dist/interactions/reorder-list/runtime.d.ts +5 -0
  64. package/dist/interactions/reorder-list/runtime.d.ts.map +1 -0
  65. package/dist/interactions/reorder-list/runtime.js +85 -0
  66. package/dist/interactions/reorder-list/runtime.js.map +1 -0
  67. package/dist/interactions/reorder-list/styles.css +33 -0
  68. package/dist/interactions/search-filter/demo.d.ts +3 -0
  69. package/dist/interactions/search-filter/demo.d.ts.map +1 -0
  70. package/dist/interactions/search-filter/demo.js +74 -0
  71. package/dist/interactions/search-filter/demo.js.map +1 -0
  72. package/dist/interactions/search-filter/index.d.ts +153 -0
  73. package/dist/interactions/search-filter/index.d.ts.map +1 -0
  74. package/dist/interactions/search-filter/index.js +824 -0
  75. package/dist/interactions/search-filter/index.js.map +1 -0
  76. package/dist/interactions/search-filter/styles.css +580 -0
  77. package/dist/layouts/app-navigation/index.d.ts +11 -5
  78. package/dist/layouts/app-navigation/index.d.ts.map +1 -1
  79. package/dist/layouts/app-navigation/index.js +5 -3
  80. package/dist/layouts/app-navigation/index.js.map +1 -1
  81. package/dist/layouts/app-navigation/styles.css +50 -0
  82. package/dist/layouts/page-identity/index.d.ts +2 -0
  83. package/dist/layouts/page-identity/index.d.ts.map +1 -1
  84. package/dist/layouts/page-identity/index.js +2 -2
  85. package/dist/layouts/page-identity/index.js.map +1 -1
  86. package/dist/layouts/shell/index.d.ts +34 -1
  87. package/dist/layouts/shell/index.d.ts.map +1 -1
  88. package/dist/layouts/shell/index.js +26 -2
  89. package/dist/layouts/shell/index.js.map +1 -1
  90. package/dist/layouts/shell/styles.css +283 -0
  91. package/dist/patterns/data-table/styles.css +1 -1
  92. package/dist/patterns/list-page/index.d.ts +10 -3
  93. package/dist/patterns/list-page/index.d.ts.map +1 -1
  94. package/dist/patterns/list-page/index.js +10 -6
  95. package/dist/patterns/list-page/index.js.map +1 -1
  96. package/dist/patterns/list-page/responsive.css +1 -5
  97. package/dist/patterns/list-page/styles.css +25 -3
  98. package/dist/patterns/modal-sheet/index.d.ts +2 -0
  99. package/dist/patterns/modal-sheet/index.d.ts.map +1 -1
  100. package/dist/patterns/modal-sheet/index.js +3 -1
  101. package/dist/patterns/modal-sheet/index.js.map +1 -1
  102. package/dist/patterns/record-form/styles.css +34 -0
  103. package/dist/primitives/actions/index.d.ts +4 -0
  104. package/dist/primitives/actions/index.d.ts.map +1 -1
  105. package/dist/primitives/actions/index.js +2 -2
  106. package/dist/primitives/actions/index.js.map +1 -1
  107. package/dist/primitives/actions/styles.css +9 -0
  108. package/dist/primitives/feedback/styles.css +4 -1
  109. package/dist/primitives/status/index.d.ts +12 -1
  110. package/dist/primitives/status/index.d.ts.map +1 -1
  111. package/dist/primitives/status/index.js +16 -1
  112. package/dist/primitives/status/index.js.map +1 -1
  113. package/dist/primitives/status/styles.css +28 -0
  114. package/dist/record/formatted-values/index.d.ts +2 -1
  115. package/dist/record/formatted-values/index.d.ts.map +1 -1
  116. package/dist/record/formatted-values/index.js +2 -1
  117. package/dist/record/formatted-values/index.js.map +1 -1
  118. package/dist/runtime/index.d.ts.map +1 -1
  119. package/dist/runtime/index.js +129 -2
  120. package/dist/runtime/index.js.map +1 -1
  121. package/dist/styles.css +1 -1
  122. package/package.json +2 -2
@@ -151,3 +151,286 @@
151
151
  }
152
152
  }
153
153
  }
154
+
155
+ @layer ket.app {
156
+ :where([data-kv-design-system]) [data-ui="app-shell"][data-has-topbar="true"] {
157
+ grid-template-rows: var(--kv-app-topbar-height) minmax(0, 1fr);
158
+ }
159
+ :where([data-kv-design-system]) [data-ui="app-shell-topbar"] {
160
+ grid-column: 1 / -1;
161
+ grid-row: 1;
162
+ position: sticky;
163
+ top: 0;
164
+ z-index: var(--kv-z-sticky);
165
+ min-width: 0;
166
+ }
167
+ :where([data-kv-design-system])
168
+ [data-ui="app-shell"][data-has-topbar="true"]
169
+ > :is([data-ui="app-sidebar"], [data-ui="app-right-rail"]) {
170
+ top: var(--kv-app-topbar-height);
171
+ height: calc(100dvh - var(--kv-app-topbar-height));
172
+ }
173
+ :where([data-kv-design-system]) [data-ui="app-topbar"] {
174
+ --kv-text-main: var(--kv-app-topbar-text);
175
+ --kv-text-secondary: var(--kv-app-topbar-muted);
176
+ display: flex;
177
+ align-items: center;
178
+ gap: var(--kv-space-4);
179
+ height: var(--kv-app-topbar-height);
180
+ padding-inline: var(--kv-space-3);
181
+ background: var(--kv-app-topbar-bg);
182
+ color: var(--kv-app-topbar-text);
183
+ }
184
+ :where([data-kv-design-system]) [data-ui="app-topbar-brand"] {
185
+ display: flex;
186
+ align-items: center;
187
+ flex: 0 0 auto;
188
+ width: auto;
189
+ min-width: 0;
190
+ height: 100%;
191
+ text-decoration: none;
192
+ font-weight: var(--kv-weight-semibold);
193
+ }
194
+ :where([data-kv-design-system]) [data-ui="app-topbar-brand"] img {
195
+ display: block;
196
+ width: 8.5rem;
197
+ height: 2.75rem;
198
+ max-width: 100%;
199
+ object-fit: contain;
200
+ }
201
+ :where([data-kv-design-system]) [data-ui="global-search-trigger"] {
202
+ display: inline-flex;
203
+ align-items: center;
204
+ flex: 0 0 auto;
205
+ gap: var(--kv-space-2);
206
+ margin-inline-start: auto;
207
+ min-height: var(--kv-control-height);
208
+ padding-inline: var(--kv-space-2);
209
+ border-radius: var(--kv-radius-sm);
210
+ color: var(--kv-app-topbar-muted);
211
+ font-size: var(--kv-text-sm);
212
+ text-decoration: none;
213
+ white-space: nowrap;
214
+ }
215
+ :where([data-kv-design-system]) [data-ui="global-search-trigger"]:hover {
216
+ background: var(--kv-app-topbar-search-bg);
217
+ color: var(--kv-app-topbar-text);
218
+ }
219
+ :where([data-kv-design-system]) [data-ui="global-search-shortcut"] {
220
+ padding-inline: var(--kv-space-1);
221
+ border: 1px solid var(--kv-app-topbar-border);
222
+ border-radius: var(--kv-radius-sm);
223
+ font: inherit;
224
+ font-size: var(--kv-text-xs);
225
+ }
226
+ :where([data-kv-design-system]) [data-ui="global-search-dialog"] {
227
+ padding: 0;
228
+ border: 0;
229
+ max-width: none;
230
+ max-height: none;
231
+ background: transparent;
232
+ color: var(--kv-text-main);
233
+ }
234
+ :where([data-kv-design-system]) [data-ui="global-search-dialog"][open] {
235
+ position: fixed;
236
+ inset: 0;
237
+ width: 100%;
238
+ height: 100dvh;
239
+ margin: 0;
240
+ }
241
+ :where([data-kv-design-system]) [data-ui="global-search-dialog"]::backdrop {
242
+ background: transparent;
243
+ }
244
+ :where([data-kv-design-system])
245
+ [data-ui="global-search-dialog"]
246
+ [data-ui="modal-layer"][data-presentation="dialog"]
247
+ [data-ui="modal-sheet"] {
248
+ width: min(36rem, 100%);
249
+ }
250
+ :where([data-kv-design-system]) [data-ui="global-search"] {
251
+ display: flex;
252
+ flex: 1 1 auto;
253
+ min-width: 0;
254
+ height: calc(var(--kv-touch-target) + 2px);
255
+ border: 1px solid var(--kv-border-strong);
256
+ border-radius: var(--kv-radius-sm);
257
+ background: var(--kv-panel-bg);
258
+ }
259
+ :where([data-kv-design-system]) [data-ui="global-search-input"] {
260
+ min-width: 0;
261
+ width: 100%;
262
+ border: 0;
263
+ background: transparent;
264
+ color: inherit;
265
+ padding-inline: var(--kv-space-3);
266
+ font: inherit;
267
+ font-size: var(--kv-text-lg);
268
+ }
269
+ :where([data-kv-design-system]) [data-ui="global-search-input"]::placeholder {
270
+ color: var(--kv-text-secondary);
271
+ opacity: 1;
272
+ }
273
+ :where([data-kv-design-system]) [data-ui="global-search-submit"] {
274
+ flex: 0 0 var(--kv-touch-target);
275
+ display: grid;
276
+ place-items: center;
277
+ padding: 0;
278
+ border: 0;
279
+ background: transparent;
280
+ color: inherit;
281
+ cursor: pointer;
282
+ }
283
+ :where([data-kv-design-system]) [data-ui="app-topbar-context"] {
284
+ display: flex;
285
+ align-items: center;
286
+ min-width: 0;
287
+ font-size: var(--kv-text-xs);
288
+ }
289
+ :where([data-kv-design-system]) [data-ui="app-topbar"] :focus-visible {
290
+ outline: 2px solid var(--kv-app-topbar-focus);
291
+ outline-offset: 2px;
292
+ }
293
+ @media (max-width: 48rem) {
294
+ :where([data-kv-design-system]) [data-ui="app-shell"][data-has-topbar="true"] > [data-ui="app-sidebar"] {
295
+ position: static;
296
+ height: 0;
297
+ min-height: 0;
298
+ border: 0;
299
+ overflow: visible;
300
+ }
301
+ :where([data-kv-design-system]) [data-ui="app-shell"][data-has-topbar="true"] > [data-ui="app-main"] {
302
+ grid-column: 1;
303
+ grid-row: 2;
304
+ }
305
+ :where([data-kv-design-system]) [data-ui="app-topbar"] {
306
+ gap: var(--kv-space-2);
307
+ padding-inline: var(--kv-space-2);
308
+ }
309
+ :where([data-kv-design-system]) [data-ui="app-topbar-brand"] {
310
+ width: 5.25rem;
311
+ }
312
+ :where([data-kv-design-system]) [data-ui="global-search-trigger"] {
313
+ justify-content: center;
314
+ width: var(--kv-touch-target);
315
+ height: var(--kv-touch-target);
316
+ padding: 0;
317
+ }
318
+ :where([data-kv-design-system])
319
+ :is([data-ui="global-search-trigger-label"], [data-ui="global-search-shortcut"]) {
320
+ display: none;
321
+ }
322
+ :where([data-kv-design-system])
323
+ [data-ui="global-search-dialog"]
324
+ [data-ui="modal-layer"][data-presentation="dialog"]
325
+ [data-ui="modal-sheet"] {
326
+ width: 100%;
327
+ }
328
+ :where([data-kv-design-system]) [data-ui="global-search"] {
329
+ height: calc(var(--kv-touch-target) + 2px);
330
+ }
331
+ :where([data-kv-design-system]) [data-ui="global-search-submit"] {
332
+ flex-basis: var(--kv-touch-target);
333
+ }
334
+ :where([data-kv-design-system]) [data-ui="global-search-input"] {
335
+ padding-inline: var(--kv-space-2);
336
+ }
337
+ }
338
+ }
339
+
340
+ @layer ket.app {
341
+ :where([data-kv-design-system]) [data-ui="app-brand"] {
342
+ display: inline-flex;
343
+ align-items: center;
344
+ color: inherit;
345
+ text-decoration: none;
346
+ }
347
+ :where([data-kv-design-system]) [data-ui="app-brand"] img {
348
+ display: block;
349
+ width: 8.5rem;
350
+ height: calc(var(--kv-space-8) + var(--kv-space-1));
351
+ object-fit: contain;
352
+ }
353
+ :where([data-kv-design-system]) [data-ui="app-brand"][data-image-fit="cover"] img {
354
+ object-fit: cover;
355
+ }
356
+ :where([data-kv-design-system]) [data-ui="navigation-header"]:has([data-ui="app-brand"]) {
357
+ min-height: var(--kv-app-topbar-height);
358
+ padding-block: var(--kv-space-1);
359
+ }
360
+ :where([data-kv-design-system]) [data-ui="app-location-bar"] {
361
+ display: flex;
362
+ align-items: center;
363
+ gap: var(--kv-space-3);
364
+ min-width: 0;
365
+ min-height: var(--kv-app-topbar-height);
366
+ padding-inline: var(--kv-page-padding-x);
367
+ border-bottom: 1px solid var(--kv-panel-divider);
368
+ background: var(--kv-page-bg);
369
+ color: var(--kv-text-main);
370
+ }
371
+ :where([data-kv-design-system]) [data-ui="app-location-context"] {
372
+ min-width: 0;
373
+ flex: 1 1 auto;
374
+ }
375
+ :where([data-kv-design-system]) [data-ui="app-location-bar"] [data-ui="global-search-trigger"] {
376
+ margin-inline-start: 0;
377
+ color: var(--kv-text-secondary);
378
+ }
379
+ :where([data-kv-design-system]) [data-ui="app-location-bar"] [data-ui="global-search-trigger"]:hover {
380
+ color: var(--kv-text-main);
381
+ background: var(--kv-sidebar-bg);
382
+ }
383
+ :where([data-kv-design-system]) [data-ui="app-location-bar"] [data-ui="app-topbar-context"] {
384
+ flex: 0 1 auto;
385
+ max-width: 24rem;
386
+ }
387
+ /* A shell location strip owns navigation once; standalone page contexts remain supported. */
388
+ :where([data-kv-design-system])
389
+ [data-ui="app-shell"][data-has-location="true"]
390
+ > [data-ui="app-main"]
391
+ [data-kv-page-identity="context"] {
392
+ display: none;
393
+ }
394
+ @media (max-width: 48rem) {
395
+ :where([data-kv-design-system])
396
+ [data-ui="app-shell"][data-has-location="true"]
397
+ > [data-ui="app-sidebar"] {
398
+ height: 0;
399
+ min-height: 0;
400
+ border: 0;
401
+ overflow: visible;
402
+ }
403
+ :where([data-kv-design-system]) [data-ui="app-location-bar"] {
404
+ gap: var(--kv-space-1);
405
+ padding-inline: var(--kv-space-2);
406
+ }
407
+ }
408
+ }
409
+
410
+ @layer ket.app {
411
+ /* Follow the system until an explicit preference is set on the root or a local theme scope. */
412
+ :where(:root) {
413
+ --kv-brand-light-display: block;
414
+ --kv-brand-dark-display: none;
415
+ }
416
+ @media (prefers-color-scheme: dark) {
417
+ :where(:root) {
418
+ --kv-brand-light-display: none;
419
+ --kv-brand-dark-display: block;
420
+ }
421
+ }
422
+ :where([data-theme="light"]) {
423
+ --kv-brand-light-display: block;
424
+ --kv-brand-dark-display: none;
425
+ }
426
+ :where([data-theme="dark"]) {
427
+ --kv-brand-light-display: none;
428
+ --kv-brand-dark-display: block;
429
+ }
430
+ :where([data-kv-design-system]) [data-ui="app-brand"] [data-appearance="light"] {
431
+ display: var(--kv-brand-light-display, block);
432
+ }
433
+ :where([data-kv-design-system]) [data-ui="app-brand"] [data-appearance="dark"] {
434
+ display: var(--kv-brand-dark-display, none);
435
+ }
436
+ }
@@ -44,7 +44,7 @@
44
44
  font-weight: var(--kv-weight-semibold);
45
45
  letter-spacing: 0;
46
46
  text-align: left;
47
- text-transform: uppercase;
47
+ text-transform: none;
48
48
  white-space: nowrap;
49
49
  }
50
50
 
@@ -1,5 +1,5 @@
1
1
  import type { JSXChild, TemplateResult } from '@ketvietlab/ketjs-view';
2
- export declare const HOOKS: readonly ['list-page', 'list-page-context', 'list-page-header', 'list-page-heading', 'list-page-title-row', 'list-page-eyebrow', 'list-page-title', 'list-page-description', 'list-page-actions', 'list-page-toolbar', 'list-page-controls', 'list-page-status', 'list-page-body', 'list-page-footer'];
2
+ export declare const HOOKS: readonly ['list-page', 'list-page-context', 'list-page-header', 'list-page-heading', 'list-page-title-row', 'list-page-eyebrow', 'list-page-title', 'list-page-description', 'list-page-actions', 'list-page-tools', 'list-page-toolbar', 'list-page-controls', 'list-page-status', 'list-page-body', 'list-page-footer'];
3
3
  export type ListPageProps = {
4
4
  title: string;
5
5
  body: JSXChild;
@@ -15,7 +15,14 @@ export type ListPageProps = {
15
15
  variant?: 'operational';
16
16
  eyebrow?: string | null;
17
17
  description?: string | null;
18
+ /** Primary actions beside the title of an operational page, above its query controls. */
19
+ headerActions?: JSXChild;
20
+ /** Tool actions follow query controls by default, or join primary actions in the header. */
18
21
  actions?: JSXChild;
22
+ /** Place operational tools next to primary header actions without a separate body row. */
23
+ actionsPlacement?: 'header';
24
+ /** Hide only the operational tool slot without unmounting associated forms or hiding primary actions. */
25
+ actionsHidden?: boolean;
19
26
  controls?: JSXChild;
20
27
  status?: JSXChild;
21
28
  footer?: JSXChild;
@@ -24,8 +31,8 @@ export type ListPageProps = {
24
31
  * The baseline for an operational collection screen.
25
32
  *
26
33
  * Applications own the translated copy, URL-driven controls and records. This
27
- * pattern owns their order and rhythm: identity and primary action first, query
28
- * controls second, then the result status and the collection itself.
34
+ * pattern owns their order and rhythm: identity and optional primary actions,
35
+ * query controls, optional separate tools, then the collection itself.
29
36
  */
30
37
  export declare const ListPage: (props: ListPageProps) => TemplateResult;
31
38
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../packages/design-system/src/patterns/list-page/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAA;AAGtE,eAAO,MAAM,KAAK,YAChB,WAAW,EACX,mBAAmB,EACnB,kBAAkB,EAClB,mBAAmB,EACnB,qBAAqB,EACrB,mBAAmB,EACnB,iBAAiB,EACjB,uBAAuB,EACvB,mBAAmB,EACnB,mBAAmB,EACnB,oBAAoB,EACpB,kBAAkB,EAClB,gBAAgB,EAChB,kBAAkB,CACV,CAAA;AAEV,MAAM,MAAM,aAAa,GAAG;IAC1B,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,QAAQ,CAAA;IACd;;;OAGG;IACH,OAAO,CAAC,EAAE,QAAQ,CAAA;IAClB;;;OAGG;IACH,OAAO,CAAC,EAAE,aAAa,CAAA;IACvB,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACvB,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC3B,OAAO,CAAC,EAAE,QAAQ,CAAA;IAClB,QAAQ,CAAC,EAAE,QAAQ,CAAA;IACnB,MAAM,CAAC,EAAE,QAAQ,CAAA;IACjB,MAAM,CAAC,EAAE,QAAQ,CAAA;CAClB,CAAA;AAED;;;;;;GAMG;AACH,eAAO,MAAM,QAAQ,UAAW,aAAa,KAAG,cA2B/C,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../packages/design-system/src/patterns/list-page/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAA;AAGtE,eAAO,MAAM,KAAK,YAChB,WAAW,EACX,mBAAmB,EACnB,kBAAkB,EAClB,mBAAmB,EACnB,qBAAqB,EACrB,mBAAmB,EACnB,iBAAiB,EACjB,uBAAuB,EACvB,mBAAmB,EACnB,iBAAiB,EACjB,mBAAmB,EACnB,oBAAoB,EACpB,kBAAkB,EAClB,gBAAgB,EAChB,kBAAkB,CACV,CAAA;AAEV,MAAM,MAAM,aAAa,GAAG;IAC1B,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,QAAQ,CAAA;IACd;;;OAGG;IACH,OAAO,CAAC,EAAE,QAAQ,CAAA;IAClB;;;OAGG;IACH,OAAO,CAAC,EAAE,aAAa,CAAA;IACvB,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACvB,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC3B,yFAAyF;IACzF,aAAa,CAAC,EAAE,QAAQ,CAAA;IACxB,4FAA4F;IAC5F,OAAO,CAAC,EAAE,QAAQ,CAAA;IAClB,0FAA0F;IAC1F,gBAAgB,CAAC,EAAE,QAAQ,CAAA;IAC3B,yGAAyG;IACzG,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,QAAQ,CAAC,EAAE,QAAQ,CAAA;IACnB,MAAM,CAAC,EAAE,QAAQ,CAAA;IACjB,MAAM,CAAC,EAAE,QAAQ,CAAA;CAClB,CAAA;AAED;;;;;;GAMG;AACH,eAAO,MAAM,QAAQ,UAAW,aAAa,KAAG,cAkD/C,CAAA"}
@@ -1,4 +1,4 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "@ketvietlab/ketjs-view/jsx-runtime";
1
+ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "@ketvietlab/ketjs-view/jsx-runtime";
2
2
  import { pageIdentity } from '../page-shell.js';
3
3
  export const HOOKS = [
4
4
  'list-page',
@@ -10,6 +10,7 @@ export const HOOKS = [
10
10
  'list-page-title',
11
11
  'list-page-description',
12
12
  'list-page-actions',
13
+ 'list-page-tools',
13
14
  'list-page-toolbar',
14
15
  'list-page-controls',
15
16
  'list-page-status',
@@ -20,22 +21,25 @@ export const HOOKS = [
20
21
  * The baseline for an operational collection screen.
21
22
  *
22
23
  * Applications own the translated copy, URL-driven controls and records. This
23
- * pattern owns their order and rhythm: identity and primary action first, query
24
- * controls second, then the result status and the collection itself.
24
+ * pattern owns their order and rhythm: identity and optional primary actions,
25
+ * query controls, optional separate tools, then the collection itself.
25
26
  */
26
27
  export const ListPage = (props) => {
27
28
  const operational = props.variant === 'operational';
29
+ const headerTools = operational && props.actionsPlacement === 'header';
30
+ const headerActions = headerTools && props.actions !== undefined ? (_jsxs(_Fragment, { children: [props.headerActions, _jsx("div", { "data-ui": "list-page-tools", hidden: props.actionsHidden === true, children: props.actions })] })) : (props.headerActions);
28
31
  // Result summaries close the collection in an operational workspace. Keeping
29
32
  // the legacy `status` prop as the input lets existing screens migrate without
30
33
  // duplicating their translated count as a separate footer value.
31
34
  const toolbarStatus = operational ? undefined : props.status;
32
35
  const footer = props.footer ?? (operational ? props.status : undefined);
33
- return (_jsxs("section", { "data-ui": "list-page", "data-variant": props.variant ?? null, "data-pattern": "list", children: [pageIdentity('list-page', {
36
+ return (_jsxs("section", { "data-ui": "list-page", "data-variant": props.variant ?? null, "data-pattern": "list", "data-ket-preserve-context": "", children: [pageIdentity('list-page', {
34
37
  context: props.context,
35
38
  eyebrow: props.eyebrow,
36
39
  title: props.title,
37
40
  description: props.description,
38
- actions: props.actions,
39
- }), (props.controls !== undefined || toolbarStatus !== undefined) && (_jsxs("div", { "data-ui": "list-page-toolbar", children: [toolbarStatus !== undefined && _jsx("div", { "data-ui": "list-page-status", children: toolbarStatus }), props.controls !== undefined && _jsx("div", { "data-ui": "list-page-controls", children: props.controls })] })), _jsx("div", { "data-ui": "list-page-body", children: props.body }), footer !== undefined && _jsx("footer", { "data-ui": "list-page-footer", children: footer })] }));
41
+ actions: operational ? headerActions : props.actions,
42
+ actionsHidden: headerTools && props.headerActions == null && props.actionsHidden === true,
43
+ }), (props.controls !== undefined || toolbarStatus !== undefined) && (_jsxs("div", { "data-ui": "list-page-toolbar", children: [toolbarStatus !== undefined && _jsx("div", { "data-ui": "list-page-status", children: toolbarStatus }), props.controls !== undefined && _jsx("div", { "data-ui": "list-page-controls", children: props.controls })] })), operational && !headerTools && props.actions !== undefined && (_jsx("div", { "data-ui": "list-page-actions", hidden: props.actionsHidden === true, children: props.actions })), _jsx("div", { "data-ui": "list-page-body", children: props.body }), footer !== undefined && _jsx("footer", { "data-ui": "list-page-footer", children: footer })] }));
40
44
  };
41
45
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../packages/design-system/src/patterns/list-page/index.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAmB,CAAA;AAEhD,MAAM,CAAC,MAAM,KAAK,GAAG;IACnB,WAAW;IACX,mBAAmB;IACnB,kBAAkB;IAClB,mBAAmB;IACnB,qBAAqB;IACrB,mBAAmB;IACnB,iBAAiB;IACjB,uBAAuB;IACvB,mBAAmB;IACnB,mBAAmB;IACnB,oBAAoB;IACpB,kBAAkB;IAClB,gBAAgB;IAChB,kBAAkB;CACV,CAAA;AAuBV;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,KAAoB,EAAkB,EAAE;IAC/D,MAAM,WAAW,GAAG,KAAK,CAAC,OAAO,KAAK,aAAa,CAAA;IACnD,6EAA6E;IAC7E,8EAA8E;IAC9E,iEAAiE;IACjE,MAAM,aAAa,GAAG,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAA;IAC5D,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAA;IAEvE,OAAO,CACL,8BAAiB,WAAW,kBAAe,KAAK,CAAC,OAAO,IAAI,IAAI,kBAAe,MAAM,aAClF,YAAY,CAAC,WAAW,EAAE;gBACzB,OAAO,EAAE,KAAK,CAAC,OAAO;gBACtB,OAAO,EAAE,KAAK,CAAC,OAAO;gBACtB,KAAK,EAAE,KAAK,CAAC,KAAK;gBAClB,WAAW,EAAE,KAAK,CAAC,WAAW;gBAC9B,OAAO,EAAE,KAAK,CAAC,OAAO;aACvB,CAAC,EACD,CAAC,KAAK,CAAC,QAAQ,KAAK,SAAS,IAAI,aAAa,KAAK,SAAS,CAAC,IAAI,CAChE,0BAAa,mBAAmB,aAC7B,aAAa,KAAK,SAAS,IAAI,yBAAa,kBAAkB,YAAE,aAAa,GAAO,EACpF,KAAK,CAAC,QAAQ,KAAK,SAAS,IAAI,yBAAa,oBAAoB,YAAE,KAAK,CAAC,QAAQ,GAAO,IACrF,CACP,EACD,yBAAa,gBAAgB,YAAE,KAAK,CAAC,IAAI,GAAO,EAC/C,MAAM,KAAK,SAAS,IAAI,4BAAgB,kBAAkB,YAAE,MAAM,GAAU,IACrE,CACX,CAAA;AACH,CAAC,CAAA"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../packages/design-system/src/patterns/list-page/index.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAmB,CAAA;AAEhD,MAAM,CAAC,MAAM,KAAK,GAAG;IACnB,WAAW;IACX,mBAAmB;IACnB,kBAAkB;IAClB,mBAAmB;IACnB,qBAAqB;IACrB,mBAAmB;IACnB,iBAAiB;IACjB,uBAAuB;IACvB,mBAAmB;IACnB,iBAAiB;IACjB,mBAAmB;IACnB,oBAAoB;IACpB,kBAAkB;IAClB,gBAAgB;IAChB,kBAAkB;CACV,CAAA;AA8BV;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,KAAoB,EAAkB,EAAE;IAC/D,MAAM,WAAW,GAAG,KAAK,CAAC,OAAO,KAAK,aAAa,CAAA;IACnD,MAAM,WAAW,GAAG,WAAW,IAAI,KAAK,CAAC,gBAAgB,KAAK,QAAQ,CAAA;IACtE,MAAM,aAAa,GACjB,WAAW,IAAI,KAAK,CAAC,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,CAC3C,8BACG,KAAK,CAAC,aAAa,EACpB,yBAAa,iBAAiB,EAAC,MAAM,EAAE,KAAK,CAAC,aAAa,KAAK,IAAI,YAChE,KAAK,CAAC,OAAO,GACV,IACL,CACJ,CAAC,CAAC,CAAC,CACF,KAAK,CAAC,aAAa,CACpB,CAAA;IACH,6EAA6E;IAC7E,8EAA8E;IAC9E,iEAAiE;IACjE,MAAM,aAAa,GAAG,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAA;IAC5D,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAA;IAEvE,OAAO,CACL,8BACU,WAAW,kBACL,KAAK,CAAC,OAAO,IAAI,IAAI,kBACtB,MAAM,+BACO,EAAE,aAE3B,YAAY,CAAC,WAAW,EAAE;gBACzB,OAAO,EAAE,KAAK,CAAC,OAAO;gBACtB,OAAO,EAAE,KAAK,CAAC,OAAO;gBACtB,KAAK,EAAE,KAAK,CAAC,KAAK;gBAClB,WAAW,EAAE,KAAK,CAAC,WAAW;gBAC9B,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO;gBACpD,aAAa,EAAE,WAAW,IAAI,KAAK,CAAC,aAAa,IAAI,IAAI,IAAI,KAAK,CAAC,aAAa,KAAK,IAAI;aAC1F,CAAC,EACD,CAAC,KAAK,CAAC,QAAQ,KAAK,SAAS,IAAI,aAAa,KAAK,SAAS,CAAC,IAAI,CAChE,0BAAa,mBAAmB,aAC7B,aAAa,KAAK,SAAS,IAAI,yBAAa,kBAAkB,YAAE,aAAa,GAAO,EACpF,KAAK,CAAC,QAAQ,KAAK,SAAS,IAAI,yBAAa,oBAAoB,YAAE,KAAK,CAAC,QAAQ,GAAO,IACrF,CACP,EACA,WAAW,IAAI,CAAC,WAAW,IAAI,KAAK,CAAC,OAAO,KAAK,SAAS,IAAI,CAC7D,yBAAa,mBAAmB,EAAC,MAAM,EAAE,KAAK,CAAC,aAAa,KAAK,IAAI,YAClE,KAAK,CAAC,OAAO,GACV,CACP,EACD,yBAAa,gBAAgB,YAAE,KAAK,CAAC,IAAI,GAAO,EAC/C,MAAM,KAAK,SAAS,IAAI,4BAAgB,kBAAkB,YAAE,MAAM,GAAU,IACrE,CACX,CAAA;AACH,CAAC,CAAA"}
@@ -68,11 +68,7 @@
68
68
 
69
69
  :where([data-kv-design-system])
70
70
  [data-ui="list-page"][data-variant="operational"]
71
- [data-ui="list-page-actions"],
72
- :where([data-kv-design-system])
73
- [data-ui="list-page"][data-variant="operational"]
74
- [data-ui="list-page-actions"]
75
- > [data-ui="inline"] {
71
+ [data-ui="list-page-actions"] {
76
72
  width: 100%;
77
73
  }
78
74
 
@@ -1,4 +1,9 @@
1
1
  @layer ket.app {
2
+ /* Hidden action slots retain their forms but contribute no layout space. */
3
+ :where([data-kv-design-system]) :is([data-ui="list-page-actions"], [data-ui="list-page-tools"])[hidden] {
4
+ display: none;
5
+ }
6
+
2
7
  :where([data-kv-design-system])
3
8
  :is(
4
9
  [data-ui="list-page"],
@@ -63,7 +68,7 @@
63
68
  line-height: var(--kv-leading-normal);
64
69
  }
65
70
 
66
- :where([data-kv-design-system]) [data-ui="list-page-actions"] {
71
+ :where([data-kv-design-system]) :is([data-ui="list-page-actions"], [data-ui="list-page-tools"]) {
67
72
  display: flex;
68
73
  flex: 0 0 auto;
69
74
  flex-wrap: wrap;
@@ -153,8 +158,9 @@
153
158
 
154
159
  :where([data-kv-design-system])
155
160
  [data-ui="list-page"][data-variant="operational"]
156
- [data-ui="list-page-actions"] {
157
- justify-content: flex-end;
161
+ > [data-ui="list-page-actions"] {
162
+ justify-content: flex-start;
163
+ padding: var(--kv-space-2) var(--kv-page-padding-x);
158
164
  }
159
165
 
160
166
  :where([data-kv-design-system])
@@ -230,3 +236,19 @@
230
236
  background: var(--kv-table-row-hover);
231
237
  }
232
238
  }
239
+
240
+ @layer ket.app {
241
+ :where([data-kv-design-system][data-density="compact"]) [data-ui="list-page"][data-variant="operational"] {
242
+ --kv-page-title-size: var(--kv-text-lg);
243
+ }
244
+ :where([data-kv-design-system][data-density="compact"])
245
+ [data-ui="list-page"][data-variant="operational"]
246
+ [data-ui="list-page-header"] {
247
+ padding-block: var(--kv-space-2);
248
+ }
249
+ :where([data-kv-design-system][data-density="compact"])
250
+ [data-ui="list-page"][data-variant="operational"]
251
+ [data-ui="list-page-toolbar"] {
252
+ padding-block: var(--kv-space-2);
253
+ }
254
+ }
@@ -40,6 +40,8 @@ export declare const ModalSheet: (props: {
40
40
  * no navigation layer ever treats closing it as a page change.
41
41
  */
42
42
  mode?: 'overlay' | 'embedded' | 'client';
43
+ /** A native dialog ancestor can own the accessible dialog role and name. */
44
+ dialogSemantics?: 'self' | 'parent';
43
45
  unsavedPrompt?: string | null;
44
46
  }) => TemplateResult;
45
47
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../packages/design-system/src/patterns/modal-sheet/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAA;AAEtE,eAAO,MAAM,KAAK,YAChB,aAAa,EACb,gBAAgB,EAChB,aAAa,EACb,YAAY,EACZ,eAAe,EACf,iBAAiB,EACjB,aAAa,EACb,mBAAmB,EACnB,aAAa,EACb,YAAY,EACZ,eAAe,CACP,CAAA;AAEV,eAAO,MAAM,UAAU,UAAW;IAChC,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,QAAQ,CAAA;IACd,4FAA4F;IAC5F,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,UAAU,EAAE,MAAM,CAAA;IAClB,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC3B;;;;OAIG;IACH,MAAM,CAAC,EAAE,QAAQ,CAAA;IACjB,OAAO,CAAC,EAAE,QAAQ,CAAA;IAClB,YAAY,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;IACjC,IAAI,CAAC,EAAE,SAAS,GAAG,OAAO,CAAA;IAC1B;;;;OAIG;IACH,MAAM,CAAC,EAAE,SAAS,GAAG,OAAO,CAAA;IAC5B;;;;;;;;OAQG;IACH,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,QAAQ,CAAA;IACxC,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;CAC9B,KAAG,cAwEH,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../packages/design-system/src/patterns/modal-sheet/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAA;AAEtE,eAAO,MAAM,KAAK,YAChB,aAAa,EACb,gBAAgB,EAChB,aAAa,EACb,YAAY,EACZ,eAAe,EACf,iBAAiB,EACjB,aAAa,EACb,mBAAmB,EACnB,aAAa,EACb,YAAY,EACZ,eAAe,CACP,CAAA;AAEV,eAAO,MAAM,UAAU,UAAW;IAChC,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,QAAQ,CAAA;IACd,4FAA4F;IAC5F,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,UAAU,EAAE,MAAM,CAAA;IAClB,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC3B;;;;OAIG;IACH,MAAM,CAAC,EAAE,QAAQ,CAAA;IACjB,OAAO,CAAC,EAAE,QAAQ,CAAA;IAClB,YAAY,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;IACjC,IAAI,CAAC,EAAE,SAAS,GAAG,OAAO,CAAA;IAC1B;;;;OAIG;IACH,MAAM,CAAC,EAAE,SAAS,GAAG,OAAO,CAAA;IAC5B;;;;;;;;OAQG;IACH,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,QAAQ,CAAA;IACxC,4EAA4E;IAC5E,eAAe,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAA;IACnC,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;CAC9B,KAAG,cA2EH,CAAA"}
@@ -15,6 +15,8 @@ export const HOOKS = [
15
15
  export const ModalSheet = (props) => {
16
16
  const client = props.mode === 'client';
17
17
  const embedded = props.mode === 'embedded';
18
- return (_jsxs("div", { "data-ui": "modal-layer", "data-mode": props.mode ?? 'overlay', "data-route-modal": embedded || client ? null : 'true', "data-client-modal": client ? 'true' : null, "data-presentation": props.presentation ?? 'sheet', "data-unsaved-prompt": props.unsavedPrompt ?? null, children: [client ? (_jsx("button", { "data-ui": "modal-backdrop", type: "button", "aria-label": props.closeLabel, tabindex: "-1", children: _jsx("span", { children: props.closeLabel }) })) : (_jsx("a", { "data-ui": "modal-backdrop", href: props.closeHref ?? '#', "aria-label": props.closeLabel, children: _jsx("span", { children: props.closeLabel }) })), _jsxs("section", { id: props.id, "data-ui": "modal-sheet", "data-size": props.size ?? 'default', "data-height": props.height === 'fixed' ? 'fixed' : null, style: props.height === 'fixed' && props.fixedHeight ? `height: ${props.fixedHeight} !important` : '', role: "dialog", "aria-modal": embedded ? 'false' : 'true', "aria-labelledby": `${props.id}-title`, "aria-describedby": props.description ? `${props.id}-description` : null, tabindex: embedded ? null : '-1', children: [_jsxs("header", { "data-ui": "modal-head", children: [_jsxs("div", { "data-ui": "modal-heading", children: [_jsxs("div", { "data-ui": "modal-title-row", children: [_jsx("h2", { "data-ui": "modal-title", id: `${props.id}-title`, children: props.title }), props.status !== undefined && props.status] }), !!props.description && (_jsx("p", { "data-ui": "modal-description", id: `${props.id}-description`, children: props.description }))] }), client ? (_jsx("button", { "data-ui": "modal-close", type: "button", "aria-label": props.closeLabel, title: props.closeLabel, children: "\u00D7" })) : (_jsx("a", { "data-ui": "modal-close", href: props.closeHref ?? '#', "aria-label": props.closeLabel, title: props.closeLabel, children: "\u00D7" }))] }), _jsx("div", { "data-ui": "modal-body", children: props.body }), props.actions !== undefined && _jsx("footer", { "data-ui": "modal-actions", children: props.actions })] })] }));
18
+ return (_jsxs("div", { "data-ui": "modal-layer", "data-mode": props.mode ?? 'overlay', "data-route-modal": embedded || client ? null : 'true', "data-client-modal": client ? 'true' : null, "data-presentation": props.presentation ?? 'sheet', "data-unsaved-prompt": props.unsavedPrompt ?? null, children: [client ? (_jsx("button", { "data-ui": "modal-backdrop", type: "button", "aria-hidden": "true", tabIndex: -1, children: _jsx("span", { children: props.closeLabel }) })) : (_jsx("a", { "data-ui": "modal-backdrop", href: props.closeHref ?? '#', "aria-label": props.closeLabel, children: _jsx("span", { children: props.closeLabel }) })), _jsxs("section", { id: props.id, "data-ui": "modal-sheet", "data-size": props.size ?? 'default', "data-height": props.height === 'fixed' ? 'fixed' : null, style: props.height === 'fixed' && props.fixedHeight ? `height: ${props.fixedHeight} !important` : '', ...(props.dialogSemantics === 'parent'
19
+ ? {}
20
+ : { role: 'dialog', 'aria-modal': embedded ? 'false' : 'true' }), "aria-labelledby": props.dialogSemantics === 'parent' ? null : `${props.id}-title`, "aria-describedby": props.dialogSemantics !== 'parent' && props.description ? `${props.id}-description` : null, tabindex: embedded ? null : '-1', children: [_jsxs("header", { "data-ui": "modal-head", children: [_jsxs("div", { "data-ui": "modal-heading", children: [_jsxs("div", { "data-ui": "modal-title-row", children: [_jsx("h2", { "data-ui": "modal-title", id: `${props.id}-title`, children: props.title }), props.status !== undefined && props.status] }), !!props.description && (_jsx("p", { "data-ui": "modal-description", id: `${props.id}-description`, children: props.description }))] }), client ? (_jsx("button", { "data-ui": "modal-close", type: "button", "aria-label": props.closeLabel, title: props.closeLabel, children: "\u00D7" })) : (_jsx("a", { "data-ui": "modal-close", href: props.closeHref ?? '#', "aria-label": props.closeLabel, title: props.closeLabel, children: "\u00D7" }))] }), _jsx("div", { "data-ui": "modal-body", children: props.body }), props.actions !== undefined && _jsx("footer", { "data-ui": "modal-actions", children: props.actions })] })] }));
19
21
  };
20
22
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../packages/design-system/src/patterns/modal-sheet/index.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../packages/design-system/src/patterns/modal-sheet/index.tsx"],"names":[],"mappings":"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"}
@@ -7,6 +7,14 @@
7
7
  gap: var(--kv-gap-field-group);
8
8
  }
9
9
 
10
+ /* Action-only forms must contribute their button's intrinsic width in footers.
11
+ Inline-size containment would collapse them to zero and overlap adjacent actions. */
12
+ :where([data-kv-design-system]) [data-ui="record-form"][data-layout="actions"] {
13
+ container-type: normal;
14
+ display: block;
15
+ flex: 0 0 auto;
16
+ }
17
+
10
18
  @media (max-width: 48rem) {
11
19
  :where([data-kv-design-system]) [data-ui="table-scroll"][data-responsive="stack"] {
12
20
  overflow: hidden;
@@ -99,6 +107,19 @@
99
107
  }
100
108
  }
101
109
 
110
+ /* Full-row controls share the label track of either half-row field. At
111
+ narrower desktop widths, 35% of a half-row is smaller than the 9rem cap. */
112
+ @media (min-width: 48rem) {
113
+ :where([data-kv-design-system])
114
+ [data-ui="form-grid"]
115
+ > [data-ui="field"][data-span="full"]:not([data-kind="group"]) {
116
+ grid-template-columns: minmax(0, min(9rem, calc((100% - var(--kv-gap-field-group)) * 0.175))) minmax(
117
+ 0,
118
+ 1fr
119
+ );
120
+ }
121
+ }
122
+
102
123
  @media (max-width: 47.9375rem) {
103
124
  :where([data-kv-design-system]) [data-ui="list-chrome-row"][data-row="query"] {
104
125
  flex-wrap: wrap;
@@ -163,6 +184,19 @@
163
184
  border-top: 1px solid var(--kv-panel-divider);
164
185
  }
165
186
 
187
+ /* Full-row controls share the label track of either half-row field. At
188
+ narrower desktop widths, 35% of a half-row is smaller than the 9rem cap. */
189
+ @media (min-width: 48rem) {
190
+ :where([data-kv-design-system])
191
+ [data-ui="form-grid"]
192
+ > [data-ui="field"][data-span="full"]:not([data-kind="group"]) {
193
+ grid-template-columns: minmax(0, min(9rem, calc((100% - var(--kv-gap-field-group)) * 0.175))) minmax(
194
+ 0,
195
+ 1fr
196
+ );
197
+ }
198
+ }
199
+
166
200
  @media (max-width: 47.9375rem) {
167
201
  :where([data-kv-design-system]) [data-ui="form-grid"] {
168
202
  grid-template-columns: minmax(0, 1fr);
@@ -16,6 +16,10 @@ export type ButtonProps = ActionBase & {
16
16
  name?: string | null;
17
17
  value?: string | null;
18
18
  form?: string | null;
19
+ /** For a button that shows or hides a region: whether that region is open now. */
20
+ expanded?: boolean;
21
+ /** The id of the region an `expanded` button shows or hides. */
22
+ controls?: string | null;
19
23
  };
20
24
  export type LinkButtonProps = ActionBase & {
21
25
  href: string;
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../packages/design-system/src/primitives/actions/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAA;AAEtE,eAAO,MAAM,KAAK,YAAI,QAAQ,EAAE,gBAAgB,EAAE,cAAc,EAAE,gBAAgB,EAAE,cAAc,CAAU,CAAA;AAE5G,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,aAAa,CAAA;AAChF,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,SAAS,GAAG,WAAW,CAAA;AAE5D,KAAK,UAAU,GAAG;IAChB,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,aAAa,CAAA;IACvB,IAAI,CAAC,EAAE,UAAU,CAAA;IACjB,OAAO,CAAC,EAAE,QAAQ,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;CAC5B,CAAA;AAED,MAAM,MAAM,WAAW,GAAG,UAAU,GAAG;IACrC,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAA;IACpC,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACpB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACrB,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;CACrB,CAAA;AAED,MAAM,MAAM,eAAe,GAAG,UAAU,GAAG;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,CAAA;AAC3D,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,WAAW,EAAE,SAAS,CAAC,GAAG;IAC3D,IAAI,EAAE,QAAQ,CAAA;IACd,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,CAAA;AAcD,eAAO,MAAM,MAAM,UAAW,WAAW,KAAG,cAe3C,CAAA;AAED,sEAAsE;AACtE,eAAO,MAAM,UAAU,UAAW,eAAe,KAAG,cAmBnD,CAAA;AAED,eAAO,MAAM,UAAU,UAAW,eAAe,KAAG,cAuBjD,CAAA;AAEH,eAAO,MAAM,WAAW,UAAW;IACjC,OAAO,EAAE,SAAS,QAAQ,EAAE,CAAA;IAC5B,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;CACtB,KAAG,cAUH,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../packages/design-system/src/primitives/actions/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAA;AAEtE,eAAO,MAAM,KAAK,YAAI,QAAQ,EAAE,gBAAgB,EAAE,cAAc,EAAE,gBAAgB,EAAE,cAAc,CAAU,CAAA;AAE5G,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,aAAa,CAAA;AAChF,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,SAAS,GAAG,WAAW,CAAA;AAE5D,KAAK,UAAU,GAAG;IAChB,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,aAAa,CAAA;IACvB,IAAI,CAAC,EAAE,UAAU,CAAA;IACjB,OAAO,CAAC,EAAE,QAAQ,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;CAC5B,CAAA;AAED,MAAM,MAAM,WAAW,GAAG,UAAU,GAAG;IACrC,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAA;IACpC,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACpB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACrB,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACpB,kFAAkF;IAClF,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,gEAAgE;IAChE,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;CACzB,CAAA;AAED,MAAM,MAAM,eAAe,GAAG,UAAU,GAAG;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,CAAA;AAC3D,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,WAAW,EAAE,SAAS,CAAC,GAAG;IAC3D,IAAI,EAAE,QAAQ,CAAA;IACd,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,CAAA;AAcD,eAAO,MAAM,MAAM,UAAW,WAAW,KAAG,cAiB3C,CAAA;AAED,sEAAsE;AACtE,eAAO,MAAM,UAAU,UAAW,eAAe,KAAG,cAqBnD,CAAA;AAED,eAAO,MAAM,UAAU,UAAW,eAAe,KAAG,cAuBjD,CAAA;AAEH,eAAO,MAAM,WAAW,UAAW;IACjC,OAAO,EAAE,SAAS,QAAQ,EAAE,CAAA;IAC5B,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;CACtB,KAAG,cAUH,CAAA"}
@@ -2,9 +2,9 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "@ketvietlab/k
2
2
  import { each } from '@ketvietlab/ketjs-view';
3
3
  export const HOOKS = ['action', 'action-leading', 'action-label', 'action-spinner', 'action-group'];
4
4
  const ActionContent = (props) => (_jsxs(_Fragment, { children: [props.loading === true && _jsx("span", { "data-ui": "action-spinner", "aria-hidden": "true" }), props.loading !== true && props.leading !== undefined && (_jsx("span", { "data-ui": "action-leading", "aria-hidden": "true", children: props.leading })), !props.iconOnly && _jsx("span", { "data-ui": "action-label", children: props.label })] }));
5
- export const Button = (props) => (_jsx("button", { "data-ui": "action", "data-variant": props.variant ?? 'secondary', "data-size": props.size ?? 'default', type: props.type ?? 'button', name: props.name ?? null, value: props.value ?? null, form: props.form ?? null, disabled: props.disabled === true || props.loading === true, "aria-busy": props.loading === true ? 'true' : null, "aria-describedby": props.describedBy ?? null, children: _jsx(ActionContent, { ...props }) }));
5
+ export const Button = (props) => (_jsx("button", { "data-ui": "action", "data-variant": props.variant ?? 'secondary', "data-size": props.size ?? 'default', type: props.type ?? 'button', name: props.name ?? null, value: props.value ?? null, form: props.form ?? null, disabled: props.disabled === true || props.loading === true, "aria-busy": props.loading === true ? 'true' : null, "aria-describedby": props.describedBy ?? null, "aria-expanded": props.expanded === undefined ? null : String(props.expanded), "aria-controls": props.controls ?? null, children: _jsx(ActionContent, { ...props }) }));
6
6
  /** An icon-only action with a visible tooltip and accessible name. */
7
- export const IconButton = (props) => (_jsx("button", { "data-ui": "action", "data-icon-only": "true", "data-variant": props.variant ?? 'tertiary', "data-size": props.size ?? 'default', type: props.type ?? 'button', name: props.name ?? null, value: props.value ?? null, form: props.form ?? null, disabled: props.disabled === true || props.loading === true, "aria-label": props.label, "aria-pressed": props.pressed === undefined ? null : String(props.pressed), "aria-busy": props.loading === true ? 'true' : null, "aria-describedby": props.describedBy ?? null, title: props.label, children: _jsx(ActionContent, { ...props, leading: props.icon, iconOnly: true }) }));
7
+ export const IconButton = (props) => (_jsx("button", { "data-ui": "action", "data-icon-only": "true", "data-variant": props.variant ?? 'tertiary', "data-size": props.size ?? 'default', type: props.type ?? 'button', name: props.name ?? null, value: props.value ?? null, form: props.form ?? null, disabled: props.disabled === true || props.loading === true, "aria-label": props.label, "aria-pressed": props.pressed === undefined ? null : String(props.pressed), "aria-busy": props.loading === true ? 'true' : null, "aria-describedby": props.describedBy ?? null, "aria-expanded": props.expanded === undefined ? null : String(props.expanded), "aria-controls": props.controls ?? null, title: props.label, children: _jsx(ActionContent, { ...props, leading: props.icon, iconOnly: true }) }));
8
8
  export const LinkButton = (props) => props.disabled || props.loading ? (_jsx("button", { "data-ui": "action", "data-variant": props.variant ?? 'secondary', "data-size": props.size ?? 'default', type: "button", disabled: true, "aria-busy": props.loading === true ? 'true' : null, "aria-describedby": props.describedBy ?? null, children: _jsx(ActionContent, { ...props }) })) : (_jsx("a", { "data-ui": "action", "data-variant": props.variant ?? 'secondary', "data-size": props.size ?? 'default', href: props.href, "aria-describedby": props.describedBy ?? null, children: _jsx(ActionContent, { ...props }) }));
9
9
  export const ActionGroup = (props) => (_jsx("div", { "data-ui": "action-group", role: "group", "aria-label": props.label ?? null, children: each(props.actions, (_, index) => index, (action) => (_jsx(_Fragment, { children: action }))) }));
10
10
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../packages/design-system/src/primitives/actions/index.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../packages/design-system/src/primitives/actions/index.tsx"],"names":[],"mappings":"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"}
@@ -147,3 +147,12 @@
147
147
  }
148
148
  }
149
149
  }
150
+
151
+ @layer ket.app {
152
+ @media (max-width: 48rem) {
153
+ :where([data-kv-design-system]) [data-ui="action"][data-size] {
154
+ min-height: var(--kv-touch-target);
155
+ min-width: var(--kv-touch-target);
156
+ }
157
+ }
158
+ }