@viglet/viglet-design-system 2026.3.13 → 2026.3.15
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.
- package/README.md +35 -7
- package/dist/bento/bento-entity-shell.d.ts +9 -1
- package/dist/bento/bento-entity-shell.d.ts.map +1 -1
- package/dist/bento/bento-form-hero.d.ts +1 -1
- package/dist/bento/bento-form-hero.d.ts.map +1 -1
- package/dist/bento/bento-hero.d.ts +14 -1
- package/dist/bento/bento-hero.d.ts.map +1 -1
- package/dist/bento/bento-list-page.d.ts +43 -11
- package/dist/bento/bento-list-page.d.ts.map +1 -1
- package/dist/bento/bento-nav-rail.d.ts +8 -2
- package/dist/bento/bento-nav-rail.d.ts.map +1 -1
- package/dist/bento/bento-nav.d.ts +7 -0
- package/dist/bento/bento-nav.d.ts.map +1 -1
- package/dist/bento/bento-shell.d.ts +5 -3
- package/dist/bento/bento-shell.d.ts.map +1 -1
- package/dist/bento/bento-trail.d.ts +27 -0
- package/dist/bento/bento-trail.d.ts.map +1 -0
- package/dist/bento/index.d.ts +1 -0
- package/dist/bento/index.d.ts.map +1 -1
- package/dist/bento.cjs +4 -4
- package/dist/bento.css +3 -3
- package/dist/bento.es.js +1101 -973
- package/dist/catalogue.json +102 -18
- package/dist/components/ui/index.d.ts +1 -1
- package/dist/components/ui/index.d.ts.map +1 -1
- package/dist/components/ui/viglet-assistant.d.ts +11 -1
- package/dist/components/ui/viglet-assistant.d.ts.map +1 -1
- package/dist/exports.json +7 -1
- package/dist/i18n/index.d.ts +8 -0
- package/dist/i18n/index.d.ts.map +1 -1
- package/dist/i18n/locales/en/bento.json.d.ts +6 -2
- package/dist/i18n/locales/pt/bento.json.d.ts +6 -2
- package/dist/i18n.cjs +1 -1
- package/dist/i18n.es.js +12 -4
- package/dist/index.cjs +1 -1
- package/dist/index.es.js +762 -718
- package/dist/lib/corner-slot.d.ts +11 -0
- package/dist/lib/corner-slot.d.ts.map +1 -1
- package/dist/{user.context-D3kmD3_y.js → user.context-DUs2lT6D.js} +201 -197
- package/dist/user.context-uYif5Mp2.cjs +1 -0
- package/dist/viglet-design-system.css +1 -1
- package/docs/BENTO-AUTHORING.md +18 -10
- package/docs/reference/README.md +9 -1
- package/docs/reference/canvas.json +1 -1
- package/docs/reference/detail.dc.html +18 -22
- package/docs/reference/form-hero.dc.html +11 -14
- package/docs/reference/list.dc.html +74 -56
- package/docs/reference/page-anatomy.dc.html +10 -9
- package/docs/reference/panel.dc.html +8 -6
- package/docs/reference/shell.dc.html +7 -4
- package/docs/reference/split.dc.html +8 -13
- package/package.json +2 -1
- package/dist/user.context-gQvBxcwr.cjs +0 -1
package/README.md
CHANGED
|
@@ -538,6 +538,12 @@ who asked for a quiet dock: the mascot holds still and the caption appears whole
|
|
|
538
538
|
instead of being typed, while it is still announced. `prefers-reduced-motion`
|
|
539
539
|
does the same system-wide.
|
|
540
540
|
|
|
541
|
+
`size` sets how big the collapsed orb is: `"sm"` (44px, the default), `"md"`
|
|
542
|
+
(88px) or `"lg"` (132px, the size the dock shipped with), or a number of CSS
|
|
543
|
+
pixels for a corner that fits none of them. The caption and the unread badge move
|
|
544
|
+
with the orb, and the open panel keeps its own header size.
|
|
545
|
+
`VIGLET_ASSISTANT_SIZES` holds the presets' pixels.
|
|
546
|
+
|
|
541
547
|
A message may carry one `action`, so an answer can offer something to do with
|
|
542
548
|
it — the label is your copy, already translated:
|
|
543
549
|
|
|
@@ -585,8 +591,11 @@ re-renders.
|
|
|
585
591
|
|
|
586
592
|
It pins itself to the bottom-right of the viewport; pass `inline` to render it
|
|
587
593
|
in flow and place it yourself. In a bento product, pass it to `BentoShell` as
|
|
588
|
-
`dock` instead
|
|
589
|
-
|
|
594
|
+
`dock` instead. With a rail, the shell rests it at the rail's foot, where it
|
|
595
|
+
opens beside the rail and covers nothing in the column. On a phone, which has no
|
|
596
|
+
rail, it sits at the header's trailing edge and opens as a dropdown. With
|
|
597
|
+
neither, it takes the corner under `BentoBackToTop`. At the rail or in the
|
|
598
|
+
header the orb is held to `"sm"`, since both have a fixed room. `open` / `onOpenChange` make it controlled,
|
|
590
599
|
Escape collapses it, and the caption is typed for everyone while a screen reader
|
|
591
600
|
is handed the whole sentence at once.
|
|
592
601
|
|
|
@@ -704,9 +713,9 @@ AppFooter, AppSwitcher, BackendStatusBanner, BackendStatusProvider, BadgeColorfu
|
|
|
704
713
|
|
|
705
714
|
`DialogDelete`, `GradientButtonLink` and `LoadProvider` are imported from `@viglet/viglet-design-system/router`; every other name above comes from the package root. `Login` and `StartupFirst` are compounds — each is a root with named parts on it, the way `Card` is.
|
|
706
715
|
|
|
707
|
-
### Bento Layer (
|
|
716
|
+
### Bento Layer (35 components)
|
|
708
717
|
|
|
709
|
-
AdaptiveSectionCard, BentoActionsMenu, BentoBackLink, BentoBackToTop, BentoCalendar, BentoChangeMark, BentoCommandPalette, BentoCountTile, BentoDataTable, BentoDiff, BentoEmptyState, BentoEntityShell, BentoEntityTile, BentoFilterBar, BentoFormHero, BentoFormSection, BentoHero, BentoHeroIconPicker, BentoInlineEdit, BentoListPage, BentoNavRail, BentoPaletteTrigger, BentoPanel, BentoSaveBar, BentoScrollSaveBar, BentoSection, BentoShell, BentoShortcutsDialog, BentoSplitPage, BentoStatusMarker, BentoTile, BentoTileGrid, BentoUserMenu, BentoVersionRail
|
|
718
|
+
AdaptiveSectionCard, BentoActionsMenu, BentoBackLink, BentoBackToTop, BentoCalendar, BentoChangeMark, BentoCommandPalette, BentoCountTile, BentoDataTable, BentoDiff, BentoEmptyState, BentoEntityShell, BentoEntityTile, BentoFilterBar, BentoFormHero, BentoFormSection, BentoHero, BentoHeroIconPicker, BentoInlineEdit, BentoListPage, BentoNavRail, BentoPaletteTrigger, BentoPanel, BentoSaveBar, BentoScrollSaveBar, BentoSection, BentoShell, BentoShortcutsDialog, BentoSplitPage, BentoStatusMarker, BentoTile, BentoTileGrid, BentoTrail, BentoUserMenu, BentoVersionRail
|
|
710
719
|
|
|
711
720
|
All from `@viglet/viglet-design-system/bento`, with `@viglet/viglet-design-system/bento.css` beside it. [The bento layer](#the-bento-layer) is what each one is for and how a page composes them; this is the inventory.
|
|
712
721
|
|
|
@@ -795,6 +804,12 @@ quota, the first-run tour) and navigation data. `BentoListPage` takes a `layout`
|
|
|
795
804
|
object rather than fetching one, because where a layout is stored is the
|
|
796
805
|
product's business — its API, its cache, its mutation library.
|
|
797
806
|
|
|
807
|
+
`BentoListPage` renders a table by default: pass `columns` (plus `rowActions`
|
|
808
|
+
and `onRowOpen` as you would to `BentoDataTable`) and the records sit under the
|
|
809
|
+
hero, with the create action as the hero's primary button. Pass `renderTile`
|
|
810
|
+
to ask for the tile mosaic instead, for things a reader picks by sight. A page
|
|
811
|
+
that already passes `renderTile` keeps its tiles. `heroIcon` is now optional.
|
|
812
|
+
|
|
798
813
|
It is a separate entry point, so a console still on the first era carries none
|
|
799
814
|
of it:
|
|
800
815
|
|
|
@@ -815,9 +830,9 @@ only the layout maths does not pull CSS it never renders. It reads the preset's
|
|
|
815
830
|
tokens, so import the preset too.
|
|
816
831
|
|
|
817
832
|
`BentoShell` is the page frame. It reserves the gutter for the rail you pass,
|
|
818
|
-
lays out the header's leading and trailing edges,
|
|
819
|
-
|
|
820
|
-
`backToTop={false}` drops
|
|
833
|
+
lays out the header's leading and trailing edges, rests the `VigletAssistant`
|
|
834
|
+
you pass as `dock` at the rail's foot (the header on a phone), holds the corner
|
|
835
|
+
for `BentoBackToTop` (`backToTop={false}` drops it), and owns `main`: the width, the gutters
|
|
821
836
|
and the vertical rhythm. A page
|
|
822
837
|
inside it sets none of those. Choose the width by name with `column`: `default`,
|
|
823
838
|
`narrow` for a single-question form, `wide` for a table, or `full` for a tool
|
|
@@ -836,6 +851,19 @@ you can redefine at `:root`.
|
|
|
836
851
|
</BentoShell>
|
|
837
852
|
```
|
|
838
853
|
|
|
854
|
+
`BentoNavRail` is 80 px wide and prints each section's `labelKey` under its
|
|
855
|
+
icon; a section with no key shows the icon alone. Give a `BentoNavItem` a
|
|
856
|
+
`count` (reviews waiting, jobs that failed) and the rail badges that item's
|
|
857
|
+
section hub with the total, capped at `99+`. The rail stays one level: it lists
|
|
858
|
+
hubs, never the items themselves. A product with its own shell reserves the
|
|
859
|
+
same width with the `bento-rail-gutter` class.
|
|
860
|
+
|
|
861
|
+
For content that nests, pass `trail` to `BentoHero`, `BentoFormHero`,
|
|
862
|
+
`BentoEntityShell` or `BentoListPage`: the ancestors as `{ to, label }`, root
|
|
863
|
+
first and the parent last. Two or more render as linked steps where the back
|
|
864
|
+
link sits, with the middle collapsed past four. A trail of one renders the usual
|
|
865
|
+
arrow back link. `BentoTrail` is the same trail on its own, for a custom eyebrow.
|
|
866
|
+
|
|
839
867
|
`BentoDataTable` is the list a curator sorts, range-selects and acts on at scale.
|
|
840
868
|
It mounts only the rows in view, so ten thousand cost what twenty do. Pass `rows`,
|
|
841
869
|
`getRowId`, `columns` (a header, a `cell`, and a `sortValue` to make it sortable),
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { Icon as TablerIcon } from '@tabler/icons-react';
|
|
2
2
|
import { ReactNode } from 'react';
|
|
3
3
|
import { BentoActionsMenuItem } from './bento-actions-menu';
|
|
4
|
+
import { BentoTrailStep } from './bento-trail';
|
|
4
5
|
import { BentoTone } from './bento-tones';
|
|
5
6
|
/**
|
|
6
7
|
* The identity fields every Bento entity hero owns: title, description,
|
|
@@ -48,6 +49,13 @@ export interface BentoEntityShellProps<TEntity extends BentoEntityLike> {
|
|
|
48
49
|
eyebrow: ReactNode;
|
|
49
50
|
/** List route the eyebrow links to and Cancel/Delete navigate back to. */
|
|
50
51
|
listRoute: string;
|
|
52
|
+
/**
|
|
53
|
+
* VDS184 — the entity's ancestors, root first and its parent last, for content
|
|
54
|
+
* that nests (a post in a folder in a site). Two or more replace the eyebrow's
|
|
55
|
+
* back link with linked steps; with one or none the eyebrow links to
|
|
56
|
+
* {@link listRoute} as before.
|
|
57
|
+
*/
|
|
58
|
+
trail?: readonly BentoTrailStep[];
|
|
51
59
|
/** Default hero icon when no Iconify icon is picked. */
|
|
52
60
|
icon: TablerIcon;
|
|
53
61
|
tone: BentoTone;
|
|
@@ -118,6 +126,6 @@ export interface BentoEntityShellProps<TEntity extends BentoEntityLike> {
|
|
|
118
126
|
* The form body is a render prop receiving `{ staged, onStateChange }` and
|
|
119
127
|
* wraps the existing react-hook-form fields in `BentoFormSection`s unchanged.
|
|
120
128
|
*/
|
|
121
|
-
export declare function BentoEntityShell<TEntity extends BentoEntityLike>({ entity, isNew, headlineFallback, eyebrow, listRoute, icon, tone, formId, feature, hasStatus, hideIcon, readOnly, autosaveOnly, badge, notice, onUpdate, onDelete, extraActions, children, }: Readonly<BentoEntityShellProps<TEntity>>): import("react").JSX.Element;
|
|
129
|
+
export declare function BentoEntityShell<TEntity extends BentoEntityLike>({ entity, isNew, headlineFallback, eyebrow, listRoute, trail, icon, tone, formId, feature, hasStatus, hideIcon, readOnly, autosaveOnly, badge, notice, onUpdate, onDelete, extraActions, children, }: Readonly<BentoEntityShellProps<TEntity>>): import("react").JSX.Element;
|
|
122
130
|
export {};
|
|
123
131
|
//# sourceMappingURL=bento-entity-shell.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bento-entity-shell.d.ts","sourceRoot":"","sources":["../../src/bento/bento-entity-shell.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,IAAI,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAG9D,OAAO,EAAoB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGzD,OAAO,EAAoB,KAAK,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;
|
|
1
|
+
{"version":3,"file":"bento-entity-shell.d.ts","sourceRoot":"","sources":["../../src/bento/bento-entity-shell.tsx"],"names":[],"mappings":"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"}
|
|
@@ -87,5 +87,5 @@ export interface BentoFormHeroProps extends BentoHeroProps {
|
|
|
87
87
|
* @author Alexandre Oliveira
|
|
88
88
|
* @since 2026.3.4
|
|
89
89
|
*/
|
|
90
|
-
export declare function BentoFormHero({ eyebrow, backTo, backLabel, leading, title, subtitle, trailing, onCancel, actions, loading, dirty, titleMissing, saveDisabled, stickyTitle, stickyBadges, }: Readonly<BentoFormHeroProps>): import("react").JSX.Element;
|
|
90
|
+
export declare function BentoFormHero({ eyebrow, backTo, backLabel, trail, leading, title, subtitle, trailing, onCancel, actions, loading, dirty, titleMissing, saveDisabled, stickyTitle, stickyBadges, }: Readonly<BentoFormHeroProps>): import("react").JSX.Element;
|
|
91
91
|
//# sourceMappingURL=bento-form-hero.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bento-form-hero.d.ts","sourceRoot":"","sources":["../../src/bento/bento-form-hero.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,
|
|
1
|
+
{"version":3,"file":"bento-form-hero.d.ts","sourceRoot":"","sources":["../../src/bento/bento-form-hero.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAA0B,KAAK,cAAc,EAAE,MAAM,cAAc,CAAC;AAG3E,MAAM,WAAW,kBAAmB,SAAQ,cAAc;IACxD;;;;;;OAMG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,2EAA2E;IAC3E,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,0EAA0E;IAC1E,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB;;;;;;;;;;;OAWG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,iEAAiE;IACjE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,qDAAqD;IACrD,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,gFAAgF;IAChF,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,sEAAsE;IACtE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iDAAiD;IACjD,YAAY,CAAC,EAAE,SAAS,CAAC;CAC1B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AACH,wBAAgB,aAAa,CAAC,EAC5B,OAAO,EACP,MAAM,EACN,SAAS,EACT,KAAK,EACL,OAAO,EACP,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,OAAO,EACP,OAAO,EACP,KAAK,EACL,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,YAAY,GACb,EAAE,QAAQ,CAAC,kBAAkB,CAAC,+BAsD9B"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { ReactNode } from 'react';
|
|
2
|
+
import { BentoTrailStep } from './bento-trail';
|
|
2
3
|
/**
|
|
3
4
|
* Canonical breadcrumb back-link for Bento heroes — a leading
|
|
4
5
|
* `IconArrowLeft` followed by the label, pointing at the parent list/route.
|
|
@@ -14,6 +15,11 @@ export declare function BentoBackLink({ to, children }: Readonly<{
|
|
|
14
15
|
to: string;
|
|
15
16
|
children: ReactNode;
|
|
16
17
|
}>): import("react").JSX.Element;
|
|
18
|
+
/**
|
|
19
|
+
* The way back a hero draws above its title: a trail when there are ancestors to
|
|
20
|
+
* name, the arrow back link when there is one parent, nothing when there is none.
|
|
21
|
+
*/
|
|
22
|
+
export declare function heroWayBack(trail: readonly BentoTrailStep[] | undefined, backTo?: string, backLabel?: ReactNode): ReactNode;
|
|
17
23
|
export interface BentoHeroProps {
|
|
18
24
|
/**
|
|
19
25
|
* Small label above the headline. Typically the parent section
|
|
@@ -35,6 +41,13 @@ export interface BentoHeroProps {
|
|
|
35
41
|
backTo?: string;
|
|
36
42
|
/** Label for the {@link BentoHeroProps.backTo} back-link. */
|
|
37
43
|
backLabel?: ReactNode;
|
|
44
|
+
/**
|
|
45
|
+
* VDS184 — the entity's ancestors, root first and its parent last, for a
|
|
46
|
+
* product whose content nests. Two or more render as linked steps where the
|
|
47
|
+
* back link sits; one renders the arrow back link to it, as `backTo` would.
|
|
48
|
+
* Wins over `backTo`; `eyebrow` still wins over both.
|
|
49
|
+
*/
|
|
50
|
+
trail?: readonly BentoTrailStep[];
|
|
38
51
|
/** Headline — a greeting, the page title, etc. */
|
|
39
52
|
title: ReactNode;
|
|
40
53
|
/** Sub-line below the title. */
|
|
@@ -58,5 +71,5 @@ export interface BentoHeroProps {
|
|
|
58
71
|
* `ml-auto` so single-child (no trailing) renders deterministically
|
|
59
72
|
* left-aligned without depending on `justify-content` quirks.
|
|
60
73
|
*/
|
|
61
|
-
export declare function BentoHero({ eyebrow, backTo, backLabel, title, subtitle, leading, trailing, }: Readonly<BentoHeroProps>): import("react").JSX.Element;
|
|
74
|
+
export declare function BentoHero({ eyebrow, backTo, backLabel, trail, title, subtitle, leading, trailing, }: Readonly<BentoHeroProps>): import("react").JSX.Element;
|
|
62
75
|
//# sourceMappingURL=bento-hero.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bento-hero.d.ts","sourceRoot":"","sources":["../../src/bento/bento-hero.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"bento-hero.d.ts","sourceRoot":"","sources":["../../src/bento/bento-hero.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,OAAO,EAAc,KAAK,cAAc,EAAE,MAAM,eAAe,CAAC;AAEhE;;;;;;;;;;GAUG;AACH,wBAAgB,aAAa,CAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,QAAQ,CAAC;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,SAAS,CAAA;CAAE,CAAC,+BAO5F;AAED;;;GAGG;AACH,wBAAgB,WAAW,CACzB,KAAK,EAAE,SAAS,cAAc,EAAE,GAAG,SAAS,EAC5C,MAAM,CAAC,EAAE,MAAM,EACf,SAAS,CAAC,EAAE,SAAS,GACpB,SAAS,CAIX;AAED,MAAM,WAAW,cAAc;IAC7B;;;;;;;;;;OAUG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,6DAA6D;IAC7D,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;;;OAKG;IACH,KAAK,CAAC,EAAE,SAAS,cAAc,EAAE,CAAC;IAClC,kDAAkD;IAClD,KAAK,EAAE,SAAS,CAAC;IACjB,gCAAgC;IAChC,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,uDAAuD;IACvD,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,oEAAoE;IACpE,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,SAAS,CAAC,EACxB,OAAO,EACP,MAAM,EACN,SAAS,EACT,KAAK,EACL,KAAK,EACL,QAAQ,EACR,OAAO,EACP,QAAQ,GACT,EAAE,QAAQ,CAAC,cAAc,CAAC,+BAwB1B"}
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import { Icon as TablerIcon } from '@tabler/icons-react';
|
|
2
2
|
import { ReactNode } from 'react';
|
|
3
|
+
import { BentoDataTableAction, BentoDataTableColumn, BentoDataTableLayout } from './bento-data-table';
|
|
4
|
+
import { BentoTrailStep } from './bento-trail';
|
|
3
5
|
import { BentoEmphasis, BentoLayoutEntry, BentoLayoutResponse } from './bento-layout';
|
|
4
6
|
import { BentoTone } from './bento-tones';
|
|
5
7
|
export interface BentoListPageProps<T> {
|
|
@@ -26,7 +28,10 @@ export interface BentoListPageProps<T> {
|
|
|
26
28
|
backTo?: string;
|
|
27
29
|
/** Label for the {@link backTo} back-link. */
|
|
28
30
|
backLabel?: ReactNode;
|
|
29
|
-
|
|
31
|
+
/** A nested list's ancestors, root first (forwarded to BentoHero). */
|
|
32
|
+
trail?: readonly BentoTrailStep[];
|
|
33
|
+
/** The hero's icon chip. Optional: a list of records names no single thing. */
|
|
34
|
+
heroIcon?: TablerIcon;
|
|
30
35
|
title: string;
|
|
31
36
|
subtitle: string;
|
|
32
37
|
/** Tone driving the hero chip + New-tile gradient. Default `indigo`. */
|
|
@@ -43,8 +48,28 @@ export interface BentoListPageProps<T> {
|
|
|
43
48
|
/** Hide the dashed "New" tile — e.g. a read-only BYO-infra catalog. */
|
|
44
49
|
hideNew?: boolean;
|
|
45
50
|
itemKey: (item: T) => string;
|
|
46
|
-
/**
|
|
47
|
-
|
|
51
|
+
/**
|
|
52
|
+
* The table's columns, as {@link BentoDataTable} takes them. A list renders as
|
|
53
|
+
* a table unless it passes {@link renderTile}: records a reader compares, such
|
|
54
|
+
* as users, roles, tokens or webhooks, are rows. The create action sits in the
|
|
55
|
+
* hero, and a `BentoFilterBar` goes in {@link headerAction}, above the table.
|
|
56
|
+
*/
|
|
57
|
+
columns?: readonly BentoDataTableColumn<T>[];
|
|
58
|
+
/** A menu of named actions on each row. */
|
|
59
|
+
rowActions?: readonly BentoDataTableAction<T>[];
|
|
60
|
+
/** Enter or a double click on a row, usually its detail route. */
|
|
61
|
+
onRowOpen?: (item: T) => void;
|
|
62
|
+
/** How a screen reader names one row. Defaults to its key. */
|
|
63
|
+
getRowLabel?: (item: T) => string;
|
|
64
|
+
/** Which columns the reader hid; the product stores it, as it stores a tile layout. */
|
|
65
|
+
columnLayout?: BentoDataTableLayout;
|
|
66
|
+
onColumnLayoutChange?: (layout: BentoDataTableLayout) => void;
|
|
67
|
+
/**
|
|
68
|
+
* Render one item's tile at the resolved {@link BentoEmphasis} size. Passing it
|
|
69
|
+
* is what asks for the mosaic instead of the table, for entities a reader picks
|
|
70
|
+
* by sight or that are few: media, blueprints, a hub.
|
|
71
|
+
*/
|
|
72
|
+
renderTile?: (item: T, emphasis: BentoEmphasis) => ReactNode;
|
|
48
73
|
emptyTitle: string;
|
|
49
74
|
emptyDescription: string;
|
|
50
75
|
/**
|
|
@@ -76,15 +101,22 @@ export interface BentoListLayout {
|
|
|
76
101
|
saving?: boolean;
|
|
77
102
|
}
|
|
78
103
|
/**
|
|
79
|
-
* The reusable Bento list surface
|
|
80
|
-
*
|
|
81
|
-
*
|
|
82
|
-
*
|
|
83
|
-
*
|
|
84
|
-
*
|
|
85
|
-
*
|
|
104
|
+
* The reusable Bento list surface: a hero over a {@link BentoDataTable} by
|
|
105
|
+
* default, or over the `bento-grid` mosaic when the page passes `renderTile`.
|
|
106
|
+
*
|
|
107
|
+
* VDS183 — the default is rows. `list.dc.html` draws the discriminator: a reader
|
|
108
|
+
* who arrives to compare many gets a table, one who arrives to pick one gets
|
|
109
|
+
* tiles. The mosaic used to be the only shape, so products rendered users and
|
|
110
|
+
* tokens as cards nobody picks by picture. As a table, the create action is the
|
|
111
|
+
* hero's one primary and an empty list is one inline card.
|
|
112
|
+
*
|
|
113
|
+
* The mosaic keeps its dashed "New" tile, its empty hint and per-item
|
|
114
|
+
* {@link BentoEmphasis} sizing. With a `listId` and a `layout` it also gains a
|
|
115
|
+
* drag-reorder + emphasis **edit mode** (T575) whose layout persists through the
|
|
116
|
+
* T574 cascade (per-user override → admin global template → featured=idx0
|
|
117
|
+
* default); the common tile shape is covered by {@link BentoEntityTile}.
|
|
86
118
|
*/
|
|
87
|
-
export declare function BentoListPage<T>({ items, error, tryAgainUrl, listId, eyebrow, backTo, backLabel, heroIcon: HeroIcon, title, subtitle, tone, headerAction, newRoute, newLabel, newSubtitle, hideNew, itemKey, renderTile, emptyTitle, emptyDescription, layout, }: Readonly<BentoListPageProps<T>>): import("react").JSX.Element;
|
|
119
|
+
export declare function BentoListPage<T>({ items, error, tryAgainUrl, listId, eyebrow, backTo, backLabel, trail, heroIcon: HeroIcon, title, subtitle, tone, headerAction, newRoute, newLabel, newSubtitle, hideNew, itemKey, columns, rowActions, onRowOpen, getRowLabel, columnLayout, onColumnLayoutChange, renderTile, emptyTitle, emptyDescription, layout, }: Readonly<BentoListPageProps<T>>): import("react").JSX.Element;
|
|
88
120
|
export interface BentoTileGridProps<T> {
|
|
89
121
|
/** Query data — `undefined` while loading (drives the LoadProvider gate). */
|
|
90
122
|
items: T[] | undefined;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bento-list-page.d.ts","sourceRoot":"","sources":["../../src/bento/bento-list-page.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,IAAI,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAW9D,OAAO,
|
|
1
|
+
{"version":3,"file":"bento-list-page.d.ts","sourceRoot":"","sources":["../../src/bento/bento-list-page.tsx"],"names":[],"mappings":"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"}
|
|
@@ -16,8 +16,8 @@ export interface BentoNavRailProps {
|
|
|
16
16
|
homeLabel?: string;
|
|
17
17
|
}
|
|
18
18
|
/**
|
|
19
|
-
* The fixed
|
|
20
|
-
*
|
|
19
|
+
* The fixed rail down the left edge, with Home and one link per section hub and
|
|
20
|
+
* never the leaf surfaces.
|
|
21
21
|
*
|
|
22
22
|
* Listing hubs rather than surfaces keeps the rail a fixed, small height however
|
|
23
23
|
* many surfaces a product has, so it cannot overflow the viewport the way a flat
|
|
@@ -25,6 +25,12 @@ export interface BentoNavRailProps {
|
|
|
25
25
|
* as a bento mosaic, and a surface is reached from there or from the command
|
|
26
26
|
* palette. `BentoShell` takes it as `rail` and reserves its gutter.
|
|
27
27
|
*
|
|
28
|
+
* VDS181 — each link shows its label under the icon, since a glyph alone does
|
|
29
|
+
* not carry an abstract section and the rail was learned by hovering. A section
|
|
30
|
+
* with no `labelKey` keeps the icon alone, with its id in a tooltip. A hub also
|
|
31
|
+
* shows the total of its items' `count`, on the destination that owns it. It
|
|
32
|
+
* stays one level: no groups, no collapse state.
|
|
33
|
+
*
|
|
28
34
|
* Hidden below `md`, where the header's palette trigger and the global shortcut
|
|
29
35
|
* navigate instead. The console era's collapsible `Sidebar` is not for a bento page.
|
|
30
36
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bento-nav-rail.d.ts","sourceRoot":"","sources":["../../src/bento/bento-nav-rail.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,aAAa,EAAmB,MAAM,aAAa,CAAC;AAmClE,MAAM,WAAW,iBAAiB;IAChC;;;OAGG;IACH,MAAM,EAAE,aAAa,EAAE,CAAC;IACxB,mCAAmC;IACnC,SAAS,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;IACvB,2EAA2E;IAC3E,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;
|
|
1
|
+
{"version":3,"file":"bento-nav-rail.d.ts","sourceRoot":"","sources":["../../src/bento/bento-nav-rail.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,aAAa,EAAmB,MAAM,aAAa,CAAC;AAmClE,MAAM,WAAW,iBAAiB;IAChC;;;OAGG;IACH,MAAM,EAAE,aAAa,EAAE,CAAC;IACxB,mCAAmC;IACnC,SAAS,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;IACvB,2EAA2E;IAC3E,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAOD;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,YAAY,CAAC,EAC3B,MAAM,EACN,SAAS,EACT,WAAW,EACX,SAAS,GACV,EAAE,QAAQ,CAAC,iBAAiB,CAAC,+BA+C7B"}
|
|
@@ -66,6 +66,13 @@ export interface BentoNavItem {
|
|
|
66
66
|
bentoRoute?: string;
|
|
67
67
|
/** Where to go while a surface has no bento route of its own. */
|
|
68
68
|
fallbackRoute: string;
|
|
69
|
+
/**
|
|
70
|
+
* What is waiting on this surface — reviews to approve, jobs that failed. The
|
|
71
|
+
* nav rail draws the section's total as a badge on the hub that holds the item,
|
|
72
|
+
* so "what needs me" is answered without a click and never from the header.
|
|
73
|
+
* Omit it, or pass 0, for no badge.
|
|
74
|
+
*/
|
|
75
|
+
count?: number;
|
|
69
76
|
}
|
|
70
77
|
/** One section and the items a product decided are visible in it. */
|
|
71
78
|
export interface BentoNavGroup {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bento-nav.d.ts","sourceRoot":"","sources":["../../src/bento/bento-nav.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAE9D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAE/C;;;;;;;;;;;;;;;;;;;;GAoBG;AAEH,4EAA4E;AAC5E,MAAM,MAAM,iBAAiB,GAAG,MAAM,CAAC;AAEvC,MAAM,WAAW,eAAe;IAC9B,EAAE,EAAE,iBAAiB,CAAC;IACtB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,4DAA4D;IAC5D,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;;;OAIG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,YAAY;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,mCAAmC;IACnC,QAAQ,EAAE,MAAM,CAAC;IACjB,iEAAiE;IACjE,cAAc,EAAE,MAAM,CAAC;IACvB,IAAI,EAAE,UAAU,CAAC;IACjB,OAAO,EAAE,iBAAiB,CAAC;IAC3B,+BAA+B;IAC/B,IAAI,EAAE,SAAS,CAAC;IAChB,sEAAsE;IACtE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,iEAAiE;IACjE,aAAa,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"bento-nav.d.ts","sourceRoot":"","sources":["../../src/bento/bento-nav.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAE9D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAE/C;;;;;;;;;;;;;;;;;;;;GAoBG;AAEH,4EAA4E;AAC5E,MAAM,MAAM,iBAAiB,GAAG,MAAM,CAAC;AAEvC,MAAM,WAAW,eAAe;IAC9B,EAAE,EAAE,iBAAiB,CAAC;IACtB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,4DAA4D;IAC5D,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;;;OAIG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,YAAY;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,mCAAmC;IACnC,QAAQ,EAAE,MAAM,CAAC;IACjB,iEAAiE;IACjE,cAAc,EAAE,MAAM,CAAC;IACvB,IAAI,EAAE,UAAU,CAAC;IACjB,OAAO,EAAE,iBAAiB,CAAC;IAC3B,+BAA+B;IAC/B,IAAI,EAAE,SAAS,CAAC;IAChB,sEAAsE;IACtE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,iEAAiE;IACjE,aAAa,EAAE,MAAM,CAAC;IACtB;;;;;OAKG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,qEAAqE;AACrE,MAAM,WAAW,aAAa;IAC5B,OAAO,EAAE,eAAe,CAAC;IACzB,KAAK,EAAE,YAAY,EAAE,CAAC;CACvB;AAED,iFAAiF;AACjF,wBAAgB,cAAc,CAAC,IAAI,EAAE,YAAY,GAAG,MAAM,CAEzD"}
|
|
@@ -27,11 +27,13 @@ export interface BentoShellProps {
|
|
|
27
27
|
/** The reading column. A page inside it sets no width, gutter or rhythm of its own. */
|
|
28
28
|
column?: BentoShellColumn;
|
|
29
29
|
/**
|
|
30
|
-
* The assistant dock, usually a `VigletAssistant`.
|
|
31
|
-
*
|
|
30
|
+
* The assistant dock, usually a `VigletAssistant`. With a rail it rests at the
|
|
31
|
+
* rail's foot and opens beside it; on a phone, at the header's trailing edge;
|
|
32
|
+
* with neither, in the corner. It renders in flow wherever it rests, without
|
|
33
|
+
* being told to.
|
|
32
34
|
*/
|
|
33
35
|
dock?: ReactNode;
|
|
34
|
-
/** Whether the back-to-top control sits in the corner, above
|
|
36
|
+
/** Whether the back-to-top control sits in the corner, above a cornered dock. On by default. */
|
|
35
37
|
backToTop?: boolean;
|
|
36
38
|
/** The routed page. */
|
|
37
39
|
children?: ReactNode;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bento-shell.d.ts","sourceRoot":"","sources":["../../src/bento/bento-shell.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"bento-shell.d.ts","sourceRoot":"","sources":["../../src/bento/bento-shell.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAsB,KAAK,SAAS,EAA4C,MAAM,OAAO,CAAC;AAUrG;;;;;;;;;;GAUG;AACH,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAC;AAEtE,MAAM,WAAW,eAAe;IAC9B;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;OAGG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,iFAAiF;IACjF,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,uFAAuF;IACvF,MAAM,CAAC,EAAE,gBAAgB,CAAC;IAC1B;;;;;OAKG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,gGAAgG;IAChG,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,uBAAuB;IACvB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,UAAU,CAAC,EACzB,IAAI,EACJ,WAAW,EACX,SAAS,EACT,MAAkB,EAClB,IAAI,EACJ,SAAgB,EAChB,QAAQ,GACT,EAAE,QAAQ,CAAC,eAAe,CAAC,+BAgH3B"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
/** One ancestor on a hero's trail: where it is and what it is called. */
|
|
3
|
+
export interface BentoTrailStep {
|
|
4
|
+
to: string;
|
|
5
|
+
label: ReactNode;
|
|
6
|
+
}
|
|
7
|
+
/**
|
|
8
|
+
* VDS184 — where a nested entity is, drawn where the hero's back link sits.
|
|
9
|
+
*
|
|
10
|
+
* A back link names one parent, which is enough for a product two levels deep
|
|
11
|
+
* and not for a CMS, where a post lives in a site, a folder and any depth of
|
|
12
|
+
* subfolders, and is reached from search or a review queue as often as from its
|
|
13
|
+
* folder. The trail lists the ancestors in order, each a link, the last being
|
|
14
|
+
* the entity's parent: the title below is the entity itself.
|
|
15
|
+
*
|
|
16
|
+
* The product passes the steps the way it passes `backTo`, so the hierarchy
|
|
17
|
+
* stays the product's and the package only draws it. Past four steps the middle
|
|
18
|
+
* collapses to an ellipsis on screen; the collapsed steps stay in the list for a
|
|
19
|
+
* screen reader, which is told the whole location.
|
|
20
|
+
*
|
|
21
|
+
* A hero given one step renders the arrow back link instead, not this, so a
|
|
22
|
+
* route with one parent reads as it always has.
|
|
23
|
+
*/
|
|
24
|
+
export declare function BentoTrail({ steps }: Readonly<{
|
|
25
|
+
steps: readonly BentoTrailStep[];
|
|
26
|
+
}>): import("react").JSX.Element;
|
|
27
|
+
//# sourceMappingURL=bento-trail.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"bento-trail.d.ts","sourceRoot":"","sources":["../../src/bento/bento-trail.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,yEAAyE;AACzE,MAAM,WAAW,cAAc;IAC7B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,SAAS,CAAC;CAClB;AAKD;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,UAAU,CAAC,EAAE,KAAK,EAAE,EAAE,QAAQ,CAAC;IAAE,KAAK,EAAE,SAAS,cAAc,EAAE,CAAA;CAAE,CAAC,+BA6BnF"}
|
package/dist/bento/index.d.ts
CHANGED
|
@@ -59,6 +59,7 @@ export { BentoNavRail, type BentoNavRailProps } from './bento-nav-rail';
|
|
|
59
59
|
export { BentoUserMenu, type BentoUserMenuProps } from './bento-user-menu';
|
|
60
60
|
export { bentoNavTarget, type BentoNavGroup, type BentoNavItem, type BentoNavSection, type BentoNavSectionId, } from './bento-nav';
|
|
61
61
|
export { BentoBackLink, BentoHero, type BentoHeroProps } from './bento-hero';
|
|
62
|
+
export { BentoTrail, type BentoTrailStep } from './bento-trail';
|
|
62
63
|
export { BentoSaveBar, type BentoSaveBarProps } from './bento-save-bar';
|
|
63
64
|
export { useBentoScrollFade } from './bento-scroll-fade';
|
|
64
65
|
export { BentoScrollSaveBar } from './bento-scroll-save-bar';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/bento/index.ts"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/bento/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AAKH,OAAO,EAAE,gBAAgB,EAAE,KAAK,oBAAoB,EAAE,KAAK,qBAAqB,EAAE,KAAK,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACrI,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAC9E,OAAO,EACL,cAAc,EACd,KAAK,oBAAoB,EACzB,KAAK,oBAAoB,EACzB,KAAK,oBAAoB,EACzB,KAAK,mBAAmB,GACzB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,eAAe,EAAE,KAAK,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AACjF,OAAO,EACL,gBAAgB,EAChB,KAAK,qBAAqB,EAC1B,KAAK,0BAA0B,EAC/B,KAAK,aAAa,EAClB,KAAK,mBAAmB,GACzB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EACL,SAAS,EACT,KAAK,cAAc,EACnB,KAAK,kBAAkB,EACvB,KAAK,eAAe,EACpB,KAAK,cAAc,EACnB,KAAK,aAAa,GACnB,MAAM,cAAc,CAAC;AACtB,OAAO,EAAE,eAAe,EAAE,KAAK,oBAAoB,EAAE,KAAK,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACxG,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAC9E,OAAO,EACL,aAAa,EACb,KAAK,kBAAkB,EACvB,KAAK,kBAAkB,EACvB,KAAK,iBAAiB,GACvB,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,eAAe,EAAE,KAAK,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AACjF,OAAO,EACL,cAAc,EACd,aAAa,EACb,KAAK,mBAAmB,EACxB,KAAK,sBAAsB,EAC3B,KAAK,oBAAoB,EACzB,KAAK,oBAAoB,EACzB,KAAK,gBAAgB,EACrB,KAAK,gBAAgB,GACtB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EACL,aAAa,EACb,KAAK,kBAAkB,EACvB,KAAK,eAAe,EACpB,aAAa,EACb,KAAK,kBAAkB,GACxB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,mBAAmB,EAAE,KAAK,wBAAwB,EAAE,MAAM,0BAA0B,CAAC;AAC9F,OAAO,EAAE,eAAe,EAAE,KAAK,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AACjF,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAC3E,OAAO,EAAE,gBAAgB,EAAE,KAAK,qBAAqB,EAAE,MAAM,sBAAsB,CAAC;AACpF,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,eAAe,CAAC;AACjE,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;AAC/E,OAAO,EACL,mBAAmB,EACnB,KAAK,wBAAwB,EAC7B,KAAK,wBAAwB,EAC7B,KAAK,yBAAyB,GAC/B,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,UAAU,EAAE,KAAK,gBAAgB,EAAE,KAAK,eAAe,EAAE,MAAM,eAAe,CAAC;AACxF,OAAO,EACL,qBAAqB,EACrB,sBAAsB,EACtB,KAAK,gBAAgB,EACrB,KAAK,kBAAkB,EACvB,KAAK,0BAA0B,GAChC,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,mBAAmB,EAAE,KAAK,wBAAwB,EAAE,MAAM,yBAAyB,CAAC;AAC7F,OAAO,EAAE,oBAAoB,EAAE,KAAK,yBAAyB,EAAE,MAAM,0BAA0B,CAAC;AAChG,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AACxE,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAC3E,OAAO,EACL,cAAc,EACd,KAAK,aAAa,EAClB,KAAK,YAAY,EACjB,KAAK,eAAe,EACpB,KAAK,iBAAiB,GACvB,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,cAAc,CAAC;AAC7E,OAAO,EAAE,UAAU,EAAE,KAAK,cAAc,EAAE,MAAM,eAAe,CAAC;AAChE,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AACxE,OAAO,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AACzD,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,mBAAmB,EAAE,KAAK,wBAAwB,EAAE,MAAM,wBAAwB,CAAC;AAC5F,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AACvE,OAAO,EAAE,iBAAiB,EAAE,KAAK,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AACvF,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9D,OAAO,EAAE,gBAAgB,EAAE,KAAK,YAAY,EAAE,KAAK,qBAAqB,EAAE,MAAM,sBAAsB,CAAC;AAEvG,OAAO,EACL,WAAW,EACX,gBAAgB,EAChB,cAAc,EACd,KAAK,SAAS,GACf,MAAM,eAAe,CAAC;AACvB,OAAO,EACL,mBAAmB,EACnB,mBAAmB,EACnB,kBAAkB,EAClB,oBAAoB,EACpB,KAAK,aAAa,EAClB,KAAK,gBAAgB,EACrB,KAAK,mBAAmB,EACxB,KAAK,iBAAiB,EACtB,KAAK,iBAAiB,GACvB,MAAM,gBAAgB,CAAC"}
|