@estiva-app/ui 0.12.1 → 0.12.3
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/dist/Button.d.ts.map +1 -1
- package/dist/CollapsibleSection.d.ts +3 -1
- package/dist/CollapsibleSection.d.ts.map +1 -1
- package/dist/DialogShell.d.ts +14 -2
- package/dist/DialogShell.d.ts.map +1 -1
- package/dist/Field.d.ts +36 -0
- package/dist/Field.d.ts.map +1 -1
- package/dist/IconButton.d.ts.map +1 -1
- package/dist/Menu.d.ts.map +1 -1
- package/dist/Popover.d.ts +11 -2
- package/dist/Popover.d.ts.map +1 -1
- package/dist/ScrollArea.d.ts +14 -2
- package/dist/ScrollArea.d.ts.map +1 -1
- package/dist/SectionHeader.d.ts +10 -1
- package/dist/SectionHeader.d.ts.map +1 -1
- package/dist/Toast.d.ts +17 -7
- package/dist/Toast.d.ts.map +1 -1
- package/dist/cn.d.ts.map +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +72 -21
- package/dist/index.js.map +2 -2
- package/package.json +1 -1
- package/src/Button.tsx +7 -1
- package/src/CollapsibleSection.tsx +4 -2
- package/src/DialogShell.mdx +9 -3
- package/src/DialogShell.stories.tsx +29 -0
- package/src/DialogShell.test.tsx +35 -0
- package/src/DialogShell.tsx +31 -4
- package/src/Field.mdx +3 -2
- package/src/Field.tsx +57 -2
- package/src/FieldLine.mdx +57 -0
- package/src/FieldLine.stories.tsx +80 -0
- package/src/FieldLine.test.tsx +56 -0
- package/src/IconButton.stories.tsx +16 -0
- package/src/IconButton.test.tsx +16 -0
- package/src/IconButton.tsx +6 -1
- package/src/Menu.test.tsx +13 -0
- package/src/Menu.tsx +11 -8
- package/src/Popover.mdx +3 -1
- package/src/Popover.stories.tsx +15 -0
- package/src/Popover.test.tsx +20 -0
- package/src/Popover.tsx +12 -3
- package/src/ScrollArea.mdx +5 -0
- package/src/ScrollArea.test.tsx +27 -1
- package/src/ScrollArea.tsx +16 -2
- package/src/SectionHeader.mdx +4 -0
- package/src/SectionHeader.stories.tsx +10 -1
- package/src/SectionHeader.test.tsx +25 -0
- package/src/SectionHeader.tsx +14 -1
- package/src/Toast.mdx +8 -2
- package/src/Toast.stories.tsx +13 -3
- package/src/Toast.tsx +44 -11
- package/src/cn.ts +1 -1
- package/src/index.ts +1 -1
- package/stories/Choosing.mdx +2 -0
- package/tailwind-preset.js +4 -0
package/dist/Button.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../src/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAK7D;;;;;;;;;;;;;;;;;;;GAmBG;AACH,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,UAAU,GAAG,OAAO,GAAG,aAAa,CAAA;AAC5E,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,OAAO,CAAA;AAE5C;;;;;;;;;GASG;AACH,MAAM,WAAW,WAAY,SAAQ,qBAAqB,CAAC,QAAQ,CAAC;IAClE,OAAO,CAAC,EAAE,aAAa,CAAA;IACvB,IAAI,CAAC,EAAE,UAAU,CAAA;IACjB,2DAA2D;IAC3D,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB;6EACyE;IACzE,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,QAAQ,EAAE,SAAS,CAAA;CACpB;AAED,wBAAgB,MAAM,CAAC,EACrB,OAAiB,EACjB,IAAgB,EAChB,WAAW,EACX,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,cAAc,EACd,IAAe,EACf,GAAG,KAAK,EACT,EAAE,WAAW,+
|
|
1
|
+
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../src/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAK7D;;;;;;;;;;;;;;;;;;;GAmBG;AACH,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,UAAU,GAAG,OAAO,GAAG,aAAa,CAAA;AAC5E,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,OAAO,CAAA;AAE5C;;;;;;;;;GASG;AACH,MAAM,WAAW,WAAY,SAAQ,qBAAqB,CAAC,QAAQ,CAAC;IAClE,OAAO,CAAC,EAAE,aAAa,CAAA;IACvB,IAAI,CAAC,EAAE,UAAU,CAAA;IACjB,2DAA2D;IAC3D,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB;6EACyE;IACzE,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,QAAQ,EAAE,SAAS,CAAA;CACpB;AAED,wBAAgB,MAAM,CAAC,EACrB,OAAiB,EACjB,IAAgB,EAChB,WAAW,EACX,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,cAAc,EACd,IAAe,EACf,GAAG,KAAK,EACT,EAAE,WAAW,+BA2Cb"}
|
|
@@ -28,6 +28,8 @@ export interface CollapsibleSectionProps {
|
|
|
28
28
|
onOpenChange?: (open: boolean) => void;
|
|
29
29
|
/** Remember open or closed in this browser, under this key. The app prefixes it. */
|
|
30
30
|
storageKey?: string;
|
|
31
|
+
/** Beside the title and always visible, before the actions — a count. `SectionHeader`'s. */
|
|
32
|
+
trailing?: ReactNode;
|
|
31
33
|
/** Beside the title, revealed on hover or focus — `SectionHeader`'s. */
|
|
32
34
|
actions?: SectionAction[];
|
|
33
35
|
showActions?: 'hover' | 'always';
|
|
@@ -38,5 +40,5 @@ export interface CollapsibleSectionProps {
|
|
|
38
40
|
/** On the box the rows sit in: the gap between them. */
|
|
39
41
|
contentClassName?: string;
|
|
40
42
|
}
|
|
41
|
-
export declare function CollapsibleSection({ title, defaultOpen, open: openProp, onOpenChange, storageKey, actions, showActions, children, className, contentClassName }: CollapsibleSectionProps): import("react").JSX.Element;
|
|
43
|
+
export declare function CollapsibleSection({ title, defaultOpen, open: openProp, onOpenChange, storageKey, trailing, actions, showActions, children, className, contentClassName }: CollapsibleSectionProps): import("react").JSX.Element;
|
|
42
44
|
//# sourceMappingURL=CollapsibleSection.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CollapsibleSection.d.ts","sourceRoot":"","sources":["../src/CollapsibleSection.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAGhD,OAAO,EAAiB,KAAK,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAEnE;;;;;;;;;;;;;;;;;;GAkBG;AACH,MAAM,WAAW,uBAAuB;IACtC,KAAK,EAAE,MAAM,CAAA;IACb,kCAAkC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,iCAAiC;IACjC,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACtC,oFAAoF;IACpF,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,wEAAwE;IACxE,OAAO,CAAC,EAAE,aAAa,EAAE,CAAA;IACzB,WAAW,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;IAChC,gBAAgB;IAChB,QAAQ,EAAE,SAAS,CAAA;IACnB,qFAAqF;IACrF,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,wDAAwD;IACxD,gBAAgB,CAAC,EAAE,MAAM,CAAA;CAC1B;AAwBD,wBAAgB,kBAAkB,CAAC,EAAE,KAAK,EAAE,WAAkB,EAAE,IAAI,EAAE,QAAQ,EAAE,YAAY,EAAE,UAAU,EAAE,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,SAAS,EAAE,gBAAgB,EAAE,EAAE,uBAAuB,+
|
|
1
|
+
{"version":3,"file":"CollapsibleSection.d.ts","sourceRoot":"","sources":["../src/CollapsibleSection.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAGhD,OAAO,EAAiB,KAAK,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAEnE;;;;;;;;;;;;;;;;;;GAkBG;AACH,MAAM,WAAW,uBAAuB;IACtC,KAAK,EAAE,MAAM,CAAA;IACb,kCAAkC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,iCAAiC;IACjC,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACtC,oFAAoF;IACpF,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,4FAA4F;IAC5F,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,wEAAwE;IACxE,OAAO,CAAC,EAAE,aAAa,EAAE,CAAA;IACzB,WAAW,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;IAChC,gBAAgB;IAChB,QAAQ,EAAE,SAAS,CAAA;IACnB,qFAAqF;IACrF,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,wDAAwD;IACxD,gBAAgB,CAAC,EAAE,MAAM,CAAA;CAC1B;AAwBD,wBAAgB,kBAAkB,CAAC,EAAE,KAAK,EAAE,WAAkB,EAAE,IAAI,EAAE,QAAQ,EAAE,YAAY,EAAE,UAAU,EAAE,QAAQ,EAAE,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,SAAS,EAAE,gBAAgB,EAAE,EAAE,uBAAuB,+BAyBzM"}
|
package/dist/DialogShell.d.ts
CHANGED
|
@@ -35,8 +35,20 @@ export interface DialogShellProps {
|
|
|
35
35
|
* (a roster that simply ends). */
|
|
36
36
|
footer?: ReactNode;
|
|
37
37
|
children: ReactNode;
|
|
38
|
-
/** Extra classes on the body (
|
|
38
|
+
/** Extra classes on the body: its layout and any padding override (`flex flex-col gap-6`, `p-0 py-2`). */
|
|
39
39
|
bodyClassName?: string;
|
|
40
|
+
/**
|
|
41
|
+
* How tall the body may get before it scrolls, as the cap class —
|
|
42
|
+
* `max-h-[400px]`, `max-h-[70vh]`. Setting it makes the body a `ScrollArea`,
|
|
43
|
+
* so a long roster or a tall form scrolls in the package's bar rather than
|
|
44
|
+
* the browser's (D40, ADOPTION B19).
|
|
45
|
+
*
|
|
46
|
+
* Without it the body is what it always was and grows to its content, so no
|
|
47
|
+
* dialog written before 0.12.2 moves a pixel. A `bodyClassName` carrying
|
|
48
|
+
* `overflow-y-auto` and no cap never scrolled anything — the box grew — and
|
|
49
|
+
* is the case this replaces.
|
|
50
|
+
*/
|
|
51
|
+
bodyMaxHeight?: string;
|
|
40
52
|
width?: number;
|
|
41
53
|
/**
|
|
42
54
|
* A question that has to be answered rather than clicked away: a press on
|
|
@@ -46,5 +58,5 @@ export interface DialogShellProps {
|
|
|
46
58
|
*/
|
|
47
59
|
alert?: boolean;
|
|
48
60
|
}
|
|
49
|
-
export declare function DialogShell({ title, onClose, headerContent, footer, children, bodyClassName, width, alert }: DialogShellProps): import("react").JSX.Element;
|
|
61
|
+
export declare function DialogShell({ title, onClose, headerContent, footer, children, bodyClassName, bodyMaxHeight, width, alert }: DialogShellProps): import("react").JSX.Element;
|
|
50
62
|
//# sourceMappingURL=DialogShell.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DialogShell.d.ts","sourceRoot":"","sources":["../src/DialogShell.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAU,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"DialogShell.d.ts","sourceRoot":"","sources":["../src/DialogShell.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAU,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAQ9C;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,MAAM,WAAW,gBAAgB;IAC/B;8CAC0C;IAC1C,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB;yDACqD;IACrD,aAAa,CAAC,EAAE,SAAS,CAAA;IACzB;uCACmC;IACnC,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,QAAQ,EAAE,SAAS,CAAA;IACnB,0GAA0G;IAC1G,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB;;;;;;;;;;OAUG;IACH,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;;;;OAKG;IACH,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB;AAED,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,aAAa,EAAE,MAAM,EAAE,QAAQ,EAAE,aAAa,EAAE,aAAa,EAAE,KAAW,EAAE,KAAa,EAAE,EAAE,gBAAgB,+BAmG1J"}
|
package/dist/Field.d.ts
CHANGED
|
@@ -54,4 +54,40 @@ export interface FieldProps {
|
|
|
54
54
|
children: ReactNode;
|
|
55
55
|
}
|
|
56
56
|
export declare function Field({ label, required, helper, error, children }: FieldProps): import("react").JSX.Element;
|
|
57
|
+
/**
|
|
58
|
+
* The line on its own — the same small line `Field` draws under a control,
|
|
59
|
+
* for the places where there is no single control to draw it under.
|
|
60
|
+
*
|
|
61
|
+
* **Why it is not a `Field`.** Three surfaces in Peek put this line under a
|
|
62
|
+
* *group*: the rename row (a field and two buttons), a Folder's action
|
|
63
|
+
* controls, another app's action controls. Each already has a section heading
|
|
64
|
+
* above it, and `Field` comes with a label of its own — so wrapping the group
|
|
65
|
+
* in one would either say the heading twice or restyle it. Found at step 4 of
|
|
66
|
+
* Peek's adoption (`ADOPTION.md` B24); until this existed, all three spelled
|
|
67
|
+
* `text-xs text-error-default` by hand.
|
|
68
|
+
*
|
|
69
|
+
* **It announces itself**, which is the half the hand-written spans never had.
|
|
70
|
+
* These lines appear *after* something was done — a rename that the relay
|
|
71
|
+
* refused, an action that failed — so a reader who cannot see them is told:
|
|
72
|
+
* `role="alert"` for an error, `role="status"` for the rest. That is `Banner`'s
|
|
73
|
+
* rule (2026-09-02), kept here so the two agree.
|
|
74
|
+
*
|
|
75
|
+
* **`warning` is the tone `Field` has not got**, and deliberately: `Field`'s
|
|
76
|
+
* `error` also marks its control invalid, and a warning is not invalid — the
|
|
77
|
+
* rename went through, and something about it needs saying. A group has no
|
|
78
|
+
* single control to mark, so the distinction is free here and would not be
|
|
79
|
+
* there.
|
|
80
|
+
*
|
|
81
|
+
* When the line belongs to one control, it is `Field`'s `helper` or `error`:
|
|
82
|
+
* those are wired to the control with `aria-describedby` and `aria-invalid`,
|
|
83
|
+
* which this cannot be.
|
|
84
|
+
*/
|
|
85
|
+
export type FieldLineTone = 'helper' | 'warning' | 'error';
|
|
86
|
+
export interface FieldLineProps {
|
|
87
|
+
/** `helper` (muted) is a hint; `warning` (amber) and `error` (red) are outcomes. Default `helper`. */
|
|
88
|
+
tone?: FieldLineTone;
|
|
89
|
+
children: ReactNode;
|
|
90
|
+
className?: string;
|
|
91
|
+
}
|
|
92
|
+
export declare function FieldLine({ tone, children, className }: FieldLineProps): import("react").JSX.Element;
|
|
57
93
|
//# sourceMappingURL=Field.d.ts.map
|
package/dist/Field.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Field.d.ts","sourceRoot":"","sources":["../src/Field.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAmD,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAIvF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,MAAM,WAAW,UAAU;IACzB,KAAK,EAAE,MAAM,CAAA;IACb;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAA;IACf;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,EAAE,SAAS,CAAA;CACpB;
|
|
1
|
+
{"version":3,"file":"Field.d.ts","sourceRoot":"","sources":["../src/Field.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAmD,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAIvF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,MAAM,WAAW,UAAU;IACzB,KAAK,EAAE,MAAM,CAAA;IACb;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAA;IACf;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,EAAE,SAAS,CAAA;CACpB;AAYD,wBAAgB,KAAK,CAAC,EAAE,KAAK,EAAE,QAAgB,EAAE,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,UAAU,+BAqDrF;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,MAAM,MAAM,aAAa,GAAG,QAAQ,GAAG,SAAS,GAAG,OAAO,CAAA;AAE1D,MAAM,WAAW,cAAc;IAC7B,sGAAsG;IACtG,IAAI,CAAC,EAAE,aAAa,CAAA;IACpB,QAAQ,EAAE,SAAS,CAAA;IACnB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,wBAAgB,SAAS,CAAC,EAAE,IAAe,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,cAAc,+BAMjF"}
|
package/dist/IconButton.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../src/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAK7D;;;;;;;;;GASG;AACH,MAAM,MAAM,iBAAiB,GAAG,OAAO,GAAG,UAAU,GAAG,SAAS,CAAA;AAEhE,2EAA2E;AAC3E,MAAM,WAAW,eAAgB,SAAQ,qBAAqB,CAAC,QAAQ,CAAC;IACtE,OAAO,CAAC,EAAE,iBAAiB,CAAA;IAC3B,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB;8DAC0D;IAC1D,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,gBAAgB,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAA;IACnC;sEACkE;IAClE,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,kCAAkC;IAClC,QAAQ,EAAE,SAAS,CAAA;CACpB;AAED,wBAAgB,UAAU,CAAC,EACzB,OAAiB,EACjB,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,cAAc,EACd,OAAO,EACP,eAAe,EACf,gBAAgB,EAChB,IAAe,EACf,GAAG,KAAK,EACT,EAAE,eAAe,+
|
|
1
|
+
{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../src/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAK7D;;;;;;;;;GASG;AACH,MAAM,MAAM,iBAAiB,GAAG,OAAO,GAAG,UAAU,GAAG,SAAS,CAAA;AAEhE,2EAA2E;AAC3E,MAAM,WAAW,eAAgB,SAAQ,qBAAqB,CAAC,QAAQ,CAAC;IACtE,OAAO,CAAC,EAAE,iBAAiB,CAAA;IAC3B,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB;8DAC0D;IAC1D,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,gBAAgB,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAA;IACnC;sEACkE;IAClE,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,kCAAkC;IAClC,QAAQ,EAAE,SAAS,CAAA;CACpB;AAED,wBAAgB,UAAU,CAAC,EACzB,OAAiB,EACjB,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,cAAc,EACd,OAAO,EACP,eAAe,EACf,gBAAgB,EAChB,IAAe,EACf,GAAG,KAAK,EACT,EAAE,eAAe,+BA4CjB"}
|
package/dist/Menu.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Menu.d.ts","sourceRoot":"","sources":["../src/Menu.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA6B,KAAK,qBAAqB,EAAE,KAAK,YAAY,EAAE,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AA+DhI;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,WAAW,cAAe,SAAQ,IAAI,CAAC,qBAAqB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC;IACpF;;gBAEY;IACZ,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB;AAED,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,+BAwB1E;AAED,MAAM,WAAW,SAAS;IACxB;;;;;;;;OAQG;IACH,OAAO,EAAE,YAAY,CAAA;IACrB,wEAAwE;IACxE,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IACxB;;;;;;;OAOG;IACH,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB;gDAC4C;IAC5C,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACtC;;kFAE8E;IAC9E,UAAU,CAAC,EAAE,SAAS,CAAC;QAAE,KAAK,EAAE,MAAM,IAAI,CAAC;QAAC,OAAO,EAAE,MAAM,IAAI,CAAA;KAAE,GAAG,IAAI,CAAC,CAAA;IACzE,QAAQ,EAAE,SAAS,CAAA;IACnB,8DAA8D;IAC9D,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAmBD,wBAAgB,IAAI,CAAC,EAAE,OAAO,EAAE,KAAc,EAAE,WAAmB,EAAE,IAAI,EAAE,YAAY,EAAE,UAAU,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,SAAS,+BA8DpI;AAED;;;;;;;;;;GAUG;AACH,MAAM,WAAW,YAAY;IAC3B,+BAA+B;IAC/B,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,uDAAuD;IACvD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,0BAA0B;IAC1B,QAAQ,EAAE,SAAS,CAAA;IACnB,4BAA4B;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,wBAAgB,OAAO,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,YAAY,+BAkDtF;AAED,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,qBAAqB,CAAC,QAAQ,CAAC,EAAE,UAAU,CAAC;IACtF,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;8EAC0E;IAC1E,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB;;wCAEoC;IACpC,IAAI,CAAC,EAAE,SAAS,GAAG,MAAM,CAAA;IACzB,wFAAwF;IACxF,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,mGAAmG;IACnG,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,yFAAyF;IACzF,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB;;;;;;;;;;;;;;;OAeG;IACH,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,uEAAuE;IACvE,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,uEAAuE;IACvE,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;
|
|
1
|
+
{"version":3,"file":"Menu.d.ts","sourceRoot":"","sources":["../src/Menu.tsx"],"names":[],"mappings":"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"}
|
package/dist/Popover.d.ts
CHANGED
|
@@ -45,8 +45,17 @@ export interface PopoverProps {
|
|
|
45
45
|
* Render it always and toggle `open`; do not mount it only while it is open.
|
|
46
46
|
*/
|
|
47
47
|
anchor?: HTMLElement | DOMRect | null;
|
|
48
|
-
/**
|
|
49
|
-
|
|
48
|
+
/**
|
|
49
|
+
* Which of the panel's edges hangs from the trigger's, or `center` to put
|
|
50
|
+
* the panel's middle over the anchor's. Default left.
|
|
51
|
+
*
|
|
52
|
+
* **`center` is what a toolbar over a text selection wants** (Katerina,
|
|
53
|
+
* PEE-19, after Linear): the panel sits over the middle of what you
|
|
54
|
+
* selected, wherever in the line that is. Until 0.12.2 only the two edges
|
|
55
|
+
* were mapped, so Peek's selection toolbar kept the placement arithmetic
|
|
56
|
+
* the move onto this component was meant to delete (ADOPTION B21).
|
|
57
|
+
*/
|
|
58
|
+
align?: 'left' | 'center' | 'right';
|
|
50
59
|
/**
|
|
51
60
|
* Which side of the trigger, or of the anchor, the panel prefers. Default
|
|
52
61
|
* `bottom`.
|
package/dist/Popover.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Popover.d.ts","sourceRoot":"","sources":["../src/Popover.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAW,KAAK,YAAY,EAAE,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAOlF;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,MAAM,WAAW,YAAY;IAC3B;;;;;;;;OAQG;IACH,OAAO,CAAC,EAAE,YAAY,CAAA;IACtB;;;;;;;;;;OAUG;IACH,MAAM,CAAC,EAAE,WAAW,GAAG,OAAO,GAAG,IAAI,CAAA;IACrC
|
|
1
|
+
{"version":3,"file":"Popover.d.ts","sourceRoot":"","sources":["../src/Popover.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAW,KAAK,YAAY,EAAE,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAOlF;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,MAAM,WAAW,YAAY;IAC3B;;;;;;;;OAQG;IACH,OAAO,CAAC,EAAE,YAAY,CAAA;IACtB;;;;;;;;;;OAUG;IACH,MAAM,CAAC,EAAE,WAAW,GAAG,OAAO,GAAG,IAAI,CAAA;IACrC;;;;;;;;;OASG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAA;IACnC;;;;;;;;OAQG;IACH,IAAI,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAA;IACvB;kFAC8E;IAC9E,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACtC;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;IAC1C;kEAC8D;IAC9D,UAAU,CAAC,EAAE,SAAS,CAAC;QAAE,KAAK,EAAE,MAAM,IAAI,CAAC;QAAC,OAAO,EAAE,MAAM,IAAI,CAAA;KAAE,GAAG,IAAI,CAAC,CAAA;IACzE;uDACmD;IACnD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,EAAE,SAAS,CAAA;IACnB,+DAA+D;IAC/D,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAOD,wBAAgB,OAAO,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,KAAc,EAAE,IAAe,EAAE,IAAI,EAAE,YAAY,EAAE,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,YAAY,+BAkErK"}
|
package/dist/ScrollArea.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { ReactNode } from 'react';
|
|
1
|
+
import type { ReactNode, Ref, UIEventHandler } from 'react';
|
|
2
2
|
/**
|
|
3
3
|
* A region that scrolls without taking width for its scrollbar.
|
|
4
4
|
*
|
|
@@ -40,7 +40,19 @@ export interface ScrollAreaProps {
|
|
|
40
40
|
viewportClassName?: string;
|
|
41
41
|
/** On the content, the box the children sit in: padding, gap, layout. */
|
|
42
42
|
contentClassName?: string;
|
|
43
|
+
/**
|
|
44
|
+
* The scrolling box itself, for a region that reads or drives its own
|
|
45
|
+
* scrolling: `ref.current.scrollTop`, `scrollTo`, `scrollHeight`.
|
|
46
|
+
*
|
|
47
|
+
* A conversation is the case this exists for (ADOPTION B20): it arrives at
|
|
48
|
+
* the newest message, keeps its place when older ones load above, and jumps
|
|
49
|
+
* to the bottom when a reply is sent — none of which the region can do for
|
|
50
|
+
* the caller, and all of which the caller cannot do without the box.
|
|
51
|
+
*/
|
|
52
|
+
viewportRef?: Ref<HTMLDivElement>;
|
|
53
|
+
/** Fires as the viewport scrolls — the unread policy's input, beside `viewportRef`. */
|
|
54
|
+
onScroll?: UIEventHandler<HTMLDivElement>;
|
|
43
55
|
children: ReactNode;
|
|
44
56
|
}
|
|
45
|
-
export declare function ScrollArea({ orientation, className, viewportClassName, contentClassName, children }: ScrollAreaProps): import("react").JSX.Element;
|
|
57
|
+
export declare function ScrollArea({ orientation, className, viewportClassName, contentClassName, viewportRef, onScroll, children }: ScrollAreaProps): import("react").JSX.Element;
|
|
46
58
|
//# sourceMappingURL=ScrollArea.d.ts.map
|
package/dist/ScrollArea.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScrollArea.d.ts","sourceRoot":"","sources":["../src/ScrollArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"ScrollArea.d.ts","sourceRoot":"","sources":["../src/ScrollArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,GAAG,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAI3D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,MAAM,WAAW,eAAe;IAC9B,WAAW,CAAC,EAAE,UAAU,GAAG,YAAY,GAAG,MAAM,CAAA;IAChD,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,8DAA8D;IAC9D,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,yEAAyE;IACzE,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB;;;;;;;;OAQG;IACH,WAAW,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAA;IACjC,uFAAuF;IACvF,QAAQ,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAA;IACzC,QAAQ,EAAE,SAAS,CAAA;CACpB;AAKD,wBAAgB,UAAU,CAAC,EAAE,WAAwB,EAAE,SAAS,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,WAAW,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,eAAe,+BA4CxJ"}
|
package/dist/SectionHeader.d.ts
CHANGED
|
@@ -40,6 +40,15 @@ export interface SectionHeaderProps {
|
|
|
40
40
|
chevron?: boolean;
|
|
41
41
|
isExpanded?: boolean;
|
|
42
42
|
onToggle?: () => void;
|
|
43
|
+
/**
|
|
44
|
+
* Beside the title and always visible, before the actions — a count.
|
|
45
|
+
*
|
|
46
|
+
* The actions come and go with the hover; this does not, because a count is
|
|
47
|
+
* information rather than an affordance. Peek's Screener header carries its
|
|
48
|
+
* number as a `Chip` here, and was the last hand-drawn folding header in the
|
|
49
|
+
* app for want of the slot (ADOPTION B23).
|
|
50
|
+
*/
|
|
51
|
+
trailing?: ReactNode;
|
|
43
52
|
/** Right-aligned, in the order given. */
|
|
44
53
|
actions?: SectionAction[];
|
|
45
54
|
/** `hover` reveals the actions while the row is hovered or focused; `always` keeps them. */
|
|
@@ -51,5 +60,5 @@ export interface SectionHeaderProps {
|
|
|
51
60
|
render?: useRender.RenderProp;
|
|
52
61
|
className?: string;
|
|
53
62
|
}
|
|
54
|
-
export declare function SectionHeader({ title, chevron, isExpanded, onToggle, actions, showActions, render, className }: SectionHeaderProps): import("react").JSX.Element;
|
|
63
|
+
export declare function SectionHeader({ title, chevron, isExpanded, onToggle, trailing, actions, showActions, render, className }: SectionHeaderProps): import("react").JSX.Element;
|
|
55
64
|
//# sourceMappingURL=SectionHeader.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SectionHeader.d.ts","sourceRoot":"","sources":["../src/SectionHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtC,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AAKrD;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,MAAM,WAAW,aAAa;IAC5B,wBAAwB;IACxB,IAAI,EAAE,SAAS,CAAA;IACf,OAAO,EAAE,MAAM,CAAA;IACf,OAAO,EAAE,MAAM,IAAI,CAAA;CACpB;AAED,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAA;IACb,gFAAgF;IAChF,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,yCAAyC;IACzC,OAAO,CAAC,EAAE,aAAa,EAAE,CAAA;IACzB,4FAA4F;IAC5F,WAAW,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;IAChC;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC,UAAU,CAAA;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,wBAAgB,aAAa,CAAC,EAAE,KAAK,EAAE,OAAe,EAAE,UAAiB,EAAE,QAAQ,EAAE,OAAO,EAAE,WAAqB,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE,kBAAkB,+
|
|
1
|
+
{"version":3,"file":"SectionHeader.d.ts","sourceRoot":"","sources":["../src/SectionHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtC,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AAKrD;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,MAAM,WAAW,aAAa;IAC5B,wBAAwB;IACxB,IAAI,EAAE,SAAS,CAAA;IACf,OAAO,EAAE,MAAM,CAAA;IACf,OAAO,EAAE,MAAM,IAAI,CAAA;CACpB;AAED,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAA;IACb,gFAAgF;IAChF,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,yCAAyC;IACzC,OAAO,CAAC,EAAE,aAAa,EAAE,CAAA;IACzB,4FAA4F;IAC5F,WAAW,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;IAChC;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC,UAAU,CAAA;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,wBAAgB,aAAa,CAAC,EAAE,KAAK,EAAE,OAAe,EAAE,UAAiB,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,WAAqB,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE,kBAAkB,+BA2DrK"}
|
package/dist/Toast.d.ts
CHANGED
|
@@ -2,8 +2,9 @@ import { type ReactNode } from 'react';
|
|
|
2
2
|
/**
|
|
3
3
|
* Peek's Toast (Figma: Alert) and its provider (2026-09-01), verbatim.
|
|
4
4
|
*
|
|
5
|
-
* The pill:
|
|
6
|
-
*
|
|
5
|
+
* The pill: five types — `success`, `brand`, `neutral`, `warning`, `error` —
|
|
6
|
+
* a leading icon that says which (a check, a `!`, an `×`), an optional action
|
|
7
|
+
* on the right. Under Signal every toast is
|
|
7
8
|
* the same dark overlay pill; the type lives in the icon's colour and glow,
|
|
8
9
|
* not the surface.
|
|
9
10
|
*
|
|
@@ -11,12 +12,21 @@ import { type ReactNode } from 'react';
|
|
|
11
12
|
* (5 s; pass `durationMs: 0` to keep one up). One toast at a time — a new
|
|
12
13
|
* one replaces the standing one, it does not queue.
|
|
13
14
|
*/
|
|
14
|
-
export type ToastType = 'success' | 'brand' | 'neutral';
|
|
15
|
+
export type ToastType = 'success' | 'brand' | 'neutral' | 'warning' | 'error';
|
|
15
16
|
export interface ToastProps {
|
|
16
17
|
label: string;
|
|
17
|
-
/**
|
|
18
|
+
/**
|
|
19
|
+
* Which of the five this is. It decides the surface in the light themes,
|
|
20
|
+
* and under Signal — where every pill is the same dark overlay — the icon
|
|
21
|
+
* and its colour.
|
|
22
|
+
*
|
|
23
|
+
* `warning` and `error` arrived at 0.12.2, for a notice that has to stay up
|
|
24
|
+
* and for one that reports a failure. Until then the set had no way to say
|
|
25
|
+
* either, so a caller with bad news passed `leadingIcon: false` rather than
|
|
26
|
+
* put a tick beside it.
|
|
27
|
+
*/
|
|
18
28
|
type?: ToastType;
|
|
19
|
-
/** Show the leading
|
|
29
|
+
/** Show the leading icon — a check, a `!` or an `×`, per `type`. Defaults to true. */
|
|
20
30
|
leadingIcon?: boolean;
|
|
21
31
|
/** When set together with onAction, renders a clickable action on the right side. */
|
|
22
32
|
actionLabel?: string;
|
|
@@ -26,12 +36,12 @@ export interface ToastProps {
|
|
|
26
36
|
export declare function Toast({ label, type, leadingIcon, actionLabel, onAction, className }: ToastProps): import("react").JSX.Element;
|
|
27
37
|
export interface ToastOptions {
|
|
28
38
|
label: string;
|
|
29
|
-
/**
|
|
39
|
+
/** Which of the five this is — it decides the surface and the leading icon. Defaults to 'neutral'. */
|
|
30
40
|
type?: ToastType;
|
|
31
41
|
/** When set, renders a clickable action on the right side. */
|
|
32
42
|
actionLabel?: string;
|
|
33
43
|
onAction?: () => void;
|
|
34
|
-
/** Show the leading
|
|
44
|
+
/** Show the leading icon — a check, a `!` or an `×`, per `type`. Defaults to true. */
|
|
35
45
|
leadingIcon?: boolean;
|
|
36
46
|
/** Auto-dismiss after this many ms. Defaults to 5000. Pass 0 to disable. */
|
|
37
47
|
durationMs?: number;
|
package/dist/Toast.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toast.d.ts","sourceRoot":"","sources":["../src/Toast.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAwE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAK5G
|
|
1
|
+
{"version":3,"file":"Toast.d.ts","sourceRoot":"","sources":["../src/Toast.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAwE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAK5G;;;;;;;;;;;;GAYG;AACH,MAAM,MAAM,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAA;AAE7E,MAAM,WAAW,UAAU;IACzB,KAAK,EAAE,MAAM,CAAA;IACb;;;;;;;;;OASG;IACH,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,sFAAsF;IACtF,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,qFAAqF;IACrF,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AA8CD,wBAAgB,KAAK,CAAC,EAAE,KAAK,EAAE,IAAgB,EAAE,WAAkB,EAAE,WAAW,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,UAAU,+BAiClH;AAED,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAA;IACb,sGAAsG;IACtG,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,8DAA8D;IAC9D,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,sFAAsF;IACtF,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,4EAA4E;IAC5E,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB;AAMD,UAAU,UAAU;IAClB,SAAS,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAA;IACvC,YAAY,EAAE,MAAM,IAAI,CAAA;CACzB;AAMD,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,+BAiDlE;AAED,wBAAgB,QAAQ,IAAI,UAAU,CAIrC"}
|
package/dist/cn.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cn.d.ts","sourceRoot":"","sources":["../src/cn.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,UAAU,EAAE,MAAM,MAAM,CAAA;AAG5C;;;;;;;;;;;;;GAaG;AACH,QAAA,MAAM,gBAAgB,UAIrB,CAAA;AAED;;;;;;GAMG;AACH,QAAA,MAAM,iBAAiB,UAAqG,CAAA;AAC5H,QAAA,MAAM,kBAAkB,
|
|
1
|
+
{"version":3,"file":"cn.d.ts","sourceRoot":"","sources":["../src/cn.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,UAAU,EAAE,MAAM,MAAM,CAAA;AAG5C;;;;;;;;;;;;;GAaG;AACH,QAAA,MAAM,gBAAgB,UAIrB,CAAA;AAED;;;;;;GAMG;AACH,QAAA,MAAM,iBAAiB,UAAqG,CAAA;AAC5H,QAAA,MAAM,kBAAkB,UAAkD,CAAA;AAY1E,0EAA0E;AAC1E,wBAAgB,EAAE,CAAC,GAAG,MAAM,EAAE,UAAU,EAAE,UAEzC;AAED,OAAO,EAAE,gBAAgB,IAAI,eAAe,EAAE,iBAAiB,IAAI,gBAAgB,EAAE,kBAAkB,IAAI,iBAAiB,EAAE,CAAA"}
|
package/dist/index.d.ts
CHANGED
|
@@ -21,7 +21,7 @@ export { IconButton, type IconButtonProps, type IconButtonVariant } from './Icon
|
|
|
21
21
|
export { Kbd, type KbdProps } from './Kbd';
|
|
22
22
|
export { IdentityMenu, IdentityPanel, type Identity, type IdentityMenuProps, type IdentityPanelProps } from './IdentityMenu';
|
|
23
23
|
export { Tooltip, TooltipProvider, WithTooltip, type TooltipProps, type TooltipProviderProps, type WithTooltipProps } from './Tooltip';
|
|
24
|
-
export { Field, type FieldProps } from './Field';
|
|
24
|
+
export { Field, FieldLine, type FieldLineProps, type FieldLineTone, type FieldProps } from './Field';
|
|
25
25
|
export { Select, type SelectOption, type SelectProps } from './Select';
|
|
26
26
|
export { TextInput, type TextInputProps } from './TextInput';
|
|
27
27
|
export { Textarea, type TextareaProps } from './Textarea';
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,YAAY,CAAA;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAA;AACxE,OAAO,EAAE,WAAW,EAAE,KAAK,iBAAiB,EAAE,KAAK,gBAAgB,EAAE,MAAM,eAAe,CAAA;AAC1F,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,KAAK,UAAU,EAAE,MAAM,UAAU,CAAA;AACpE,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,KAAK,UAAU,EAAE,KAAK,aAAa,EAAE,MAAM,UAAU,CAAA;AACxF,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,YAAY,CAAA;AACzD,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,KAAK,QAAQ,EAAE,MAAM,QAAQ,CAAA;AAC5D,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,KAAK,eAAe,EAAE,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,aAAa,CAAA;AAClH,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,KAAK,iBAAiB,EAAE,MAAM,cAAc,CAAA;AACvF,OAAO,EAAE,GAAG,EAAE,KAAK,QAAQ,EAAE,MAAM,OAAO,CAAA;AAC1C,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,KAAK,QAAQ,EAAE,KAAK,iBAAiB,EAAE,KAAK,kBAAkB,EAAE,MAAM,gBAAgB,CAAA;AAC5H,OAAO,EAAE,OAAO,EAAE,eAAe,EAAE,WAAW,EAAE,KAAK,YAAY,EAAE,KAAK,oBAAoB,EAAE,KAAK,gBAAgB,EAAE,MAAM,WAAW,CAAA;AACtI,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,SAAS,CAAA;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
|
package/dist/index.js
CHANGED
|
@@ -20,7 +20,7 @@ var FONT_SIZE_TOKENS = [
|
|
|
20
20
|
"chip"
|
|
21
21
|
];
|
|
22
22
|
var BOX_SHADOW_TOKENS = ["sm", "md", "lg", "focus-ring", "glow-warning", "glow-success", "glow-accent", "highlight-inset"];
|
|
23
|
-
var DROP_SHADOW_TOKENS = ["glow-success", "glow-accent"];
|
|
23
|
+
var DROP_SHADOW_TOKENS = ["glow-success", "glow-accent", "glow-warning"];
|
|
24
24
|
var twMerge = extendTailwindMerge({
|
|
25
25
|
extend: {
|
|
26
26
|
classGroups: {
|
|
@@ -39,13 +39,15 @@ import { ScrollArea as BaseScrollArea } from "@base-ui/react/scroll-area";
|
|
|
39
39
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
40
40
|
var BAR = "flex touch-none select-none rounded-full opacity-0 transition-opacity delay-300 data-[hovering]:opacity-100 data-[hovering]:delay-0 data-[scrolling]:opacity-100 data-[scrolling]:delay-0";
|
|
41
41
|
var THUMB = "rounded-full bg-border-strong";
|
|
42
|
-
function ScrollArea({ orientation = "vertical", className, viewportClassName, contentClassName, children }) {
|
|
42
|
+
function ScrollArea({ orientation = "vertical", className, viewportClassName, contentClassName, viewportRef, onScroll, children }) {
|
|
43
43
|
const vertical = orientation !== "horizontal";
|
|
44
44
|
const horizontal = orientation !== "vertical";
|
|
45
45
|
return /* @__PURE__ */ jsxs(BaseScrollArea.Root, { className: cn("relative min-h-0 min-w-0", className), children: [
|
|
46
46
|
/* @__PURE__ */ jsx(
|
|
47
47
|
BaseScrollArea.Viewport,
|
|
48
48
|
{
|
|
49
|
+
ref: viewportRef,
|
|
50
|
+
onScroll,
|
|
49
51
|
className: cn(
|
|
50
52
|
"h-full w-full outline-none data-[has-overflow-x]:overscroll-x-contain data-[has-overflow-y]:overscroll-y-contain",
|
|
51
53
|
viewportClassName
|
|
@@ -305,7 +307,12 @@ function IconButton({
|
|
|
305
307
|
disabled: disabled || !!disabledReason,
|
|
306
308
|
focusableWhenDisabled: !!disabledReason,
|
|
307
309
|
className: (state) => cn(
|
|
308
|
-
|
|
310
|
+
// `shrink-0` stops a flex parent squashing the button; `self-center`
|
|
311
|
+
// stops one stretching it. Two different failures, and both have
|
|
312
|
+
// happened here: a row with no `items-*` drew this 24 wide and 228
|
|
313
|
+
// tall in Peek's TopicMoreMenu story (Katerina, 2026-09-11). A button
|
|
314
|
+
// is the size of its icon and its padding, whatever box it lands in.
|
|
315
|
+
"flex items-center justify-center p-1 rounded-lg transition-colors shrink-0 self-center cursor-pointer",
|
|
309
316
|
!state.disabled && variant === "primary" && "bg-accent-primary hover:bg-accent-hover text-text-inverse",
|
|
310
317
|
!state.disabled && variant === "muted" && "text-text-secondary hover:bg-bg-hover hover:text-text-primary",
|
|
311
318
|
!state.disabled && variant === "outlined" && "border border-border-default hover:bg-bg-hover text-text-secondary",
|
|
@@ -372,7 +379,13 @@ function Button({
|
|
|
372
379
|
disabled: disabled || !!disabledReason,
|
|
373
380
|
focusableWhenDisabled: !!disabledReason,
|
|
374
381
|
className: (state) => cn(
|
|
375
|
-
|
|
382
|
+
// `self-center` for the same reason as IconButton's: a flex parent
|
|
383
|
+
// with no `items-*` stretches its children, and a button stretched to
|
|
384
|
+
// a column's height is not a button. `h-8` and `h-6` below set the
|
|
385
|
+
// height, and stretching overrode them. No caller in the suite wants
|
|
386
|
+
// a stretched one — checked across both apps and this package on
|
|
387
|
+
// 2026-09-11, and none passes `w-full` either.
|
|
388
|
+
"inline-flex items-center justify-center gap-1 rounded-md transition-colors font-sans font-medium self-center",
|
|
376
389
|
size === "default" && "h-8 text-btn-default",
|
|
377
390
|
size === "small" && "h-6 text-btn-small",
|
|
378
391
|
// Extra right padding beside a leading icon, for optical balance.
|
|
@@ -634,11 +647,14 @@ function menuItemClassName({ size, selected, className }) {
|
|
|
634
647
|
// on exactly the same :hover, so they cannot come apart, and a row
|
|
635
648
|
// lights and unlights crisply as the pointer crosses it.
|
|
636
649
|
"group flex w-full shrink-0 cursor-pointer items-center rounded-lg text-left outline-none hover:bg-bg-hover data-[highlighted]:bg-bg-hover",
|
|
637
|
-
//
|
|
638
|
-
//
|
|
639
|
-
//
|
|
640
|
-
//
|
|
641
|
-
|
|
650
|
+
// Both sizes are as tall as their content and never shorter than a
|
|
651
|
+
// floor: 36px for a default row (Katerina, 2026-09-11), 40px for a
|
|
652
|
+
// tall one (Katerina, 2026-09-01). A single-line action row sits at
|
|
653
|
+
// 36, a picker row at 40, a row with a 32px face and a role line
|
|
654
|
+
// comes out at its natural 48. One rule, not a hand-picked height
|
|
655
|
+
// per file — Peek's Later menu had been forcing `h-9` for exactly
|
|
656
|
+
// this 36px and was the only menu in either app out of step.
|
|
657
|
+
size === "tall" ? "min-h-10 gap-3 px-3 py-1.5" : "min-h-9 gap-2 px-2 py-1.5",
|
|
642
658
|
selected && "bg-bg-hover",
|
|
643
659
|
className
|
|
644
660
|
);
|
|
@@ -1090,6 +1106,11 @@ function Note({ children }) {
|
|
|
1090
1106
|
import { cloneElement, isValidElement } from "react";
|
|
1091
1107
|
import { Field as BaseField } from "@base-ui/react/field";
|
|
1092
1108
|
import { jsx as jsx20, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
1109
|
+
var LINE_STYLES = {
|
|
1110
|
+
helper: "text-caption text-text-muted",
|
|
1111
|
+
warning: "text-caption text-warning-default",
|
|
1112
|
+
error: "text-caption text-error-default"
|
|
1113
|
+
};
|
|
1093
1114
|
function Field({ label, required = false, helper, error, children }) {
|
|
1094
1115
|
const control = required && isValidElement(children) ? cloneElement(children, {
|
|
1095
1116
|
"aria-required": children.props["aria-required"] ?? true
|
|
@@ -1101,10 +1122,13 @@ function Field({ label, required = false, helper, error, children }) {
|
|
|
1101
1122
|
] }),
|
|
1102
1123
|
/* @__PURE__ */ jsxs14("div", { className: "flex flex-col gap-1.5", children: [
|
|
1103
1124
|
control,
|
|
1104
|
-
error != null ? /* @__PURE__ */ jsx20(BaseField.Error, { match: true, className:
|
|
1125
|
+
error != null ? /* @__PURE__ */ jsx20(BaseField.Error, { match: true, className: LINE_STYLES.error, children: error }) : helper != null ? /* @__PURE__ */ jsx20(BaseField.Description, { className: LINE_STYLES.helper, children: helper }) : null
|
|
1105
1126
|
] })
|
|
1106
1127
|
] });
|
|
1107
1128
|
}
|
|
1129
|
+
function FieldLine({ tone = "helper", children, className }) {
|
|
1130
|
+
return /* @__PURE__ */ jsx20("p", { role: tone === "error" ? "alert" : "status", className: cn(LINE_STYLES[tone], className), children });
|
|
1131
|
+
}
|
|
1108
1132
|
|
|
1109
1133
|
// src/Select.tsx
|
|
1110
1134
|
import { IconCheck as IconCheck2, IconChevronDown as IconChevronDown2 } from "@tabler/icons-react";
|
|
@@ -1259,7 +1283,7 @@ import { Dialog } from "@base-ui/react/dialog";
|
|
|
1259
1283
|
import { AlertDialog } from "@base-ui/react/alert-dialog";
|
|
1260
1284
|
import { IconX as IconX3 } from "@tabler/icons-react";
|
|
1261
1285
|
import { jsx as jsx24, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
1262
|
-
function DialogShell({ title, onClose, headerContent, footer, children, bodyClassName, width = 502, alert = false }) {
|
|
1286
|
+
function DialogShell({ title, onClose, headerContent, footer, children, bodyClassName, bodyMaxHeight, width = 502, alert = false }) {
|
|
1263
1287
|
const Parts = alert ? AlertDialog : Dialog;
|
|
1264
1288
|
const popupRef = useRef3(null);
|
|
1265
1289
|
return /* @__PURE__ */ jsx24(
|
|
@@ -1289,7 +1313,15 @@ function DialogShell({ title, onClose, headerContent, footer, children, bodyClas
|
|
|
1289
1313
|
}
|
|
1290
1314
|
)
|
|
1291
1315
|
] }),
|
|
1292
|
-
/* @__PURE__ */ jsx24(
|
|
1316
|
+
bodyMaxHeight ? /* @__PURE__ */ jsx24(
|
|
1317
|
+
ScrollArea,
|
|
1318
|
+
{
|
|
1319
|
+
className: cn(footer != null && "border-b border-border-subtle"),
|
|
1320
|
+
viewportClassName: bodyMaxHeight,
|
|
1321
|
+
contentClassName: cn("pl-5 pr-4 py-4", bodyClassName),
|
|
1322
|
+
children
|
|
1323
|
+
}
|
|
1324
|
+
) : /* @__PURE__ */ jsx24("div", { className: cn("pl-5 pr-4 py-4", footer != null && "border-b border-border-subtle", bodyClassName), children }),
|
|
1293
1325
|
footer != null && /* @__PURE__ */ jsx24("div", { className: "h-12 flex items-center justify-end gap-2 pl-5 pr-4 shrink-0", children: footer })
|
|
1294
1326
|
]
|
|
1295
1327
|
}
|
|
@@ -1575,7 +1607,7 @@ function Popover({ trigger, anchor, align = "left", side = "bottom", open, onOpe
|
|
|
1575
1607
|
{
|
|
1576
1608
|
anchor: anchorTarget,
|
|
1577
1609
|
side,
|
|
1578
|
-
align: align === "right" ? "end" : "start",
|
|
1610
|
+
align: align === "right" ? "end" : align === "center" ? "center" : "start",
|
|
1579
1611
|
sideOffset: GAP5,
|
|
1580
1612
|
collisionPadding: VIEWPORT_PAD4,
|
|
1581
1613
|
className: "z-50 data-[anchor-hidden]:hidden",
|
|
@@ -1845,7 +1877,7 @@ function SearchInput({ shortcut, className, placeholder = "Search\u2026", ...pro
|
|
|
1845
1877
|
import { IconChevronRight as IconChevronRight2 } from "@tabler/icons-react";
|
|
1846
1878
|
import { useRender } from "@base-ui/react/use-render";
|
|
1847
1879
|
import { Fragment as Fragment5, jsx as jsx41, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
1848
|
-
function SectionHeader({ title, chevron = false, isExpanded = true, onToggle, actions, showActions = "hover", render, className }) {
|
|
1880
|
+
function SectionHeader({ title, chevron = false, isExpanded = true, onToggle, trailing, actions, showActions = "hover", render, className }) {
|
|
1849
1881
|
const titleElement = useRender({
|
|
1850
1882
|
render: render ?? (chevron ? /* @__PURE__ */ jsx41("button", { type: "button", onClick: onToggle, "aria-expanded": isExpanded }) : /* @__PURE__ */ jsx41("span", {})),
|
|
1851
1883
|
props: {
|
|
@@ -1879,6 +1911,7 @@ function SectionHeader({ title, chevron = false, isExpanded = true, onToggle, ac
|
|
|
1879
1911
|
),
|
|
1880
1912
|
children: [
|
|
1881
1913
|
titleElement,
|
|
1914
|
+
trailing != null && /* @__PURE__ */ jsx41("div", { className: "flex shrink-0 items-center", children: trailing }),
|
|
1882
1915
|
actions && actions.length > 0 && /* @__PURE__ */ jsx41(
|
|
1883
1916
|
"div",
|
|
1884
1917
|
{
|
|
@@ -1916,7 +1949,7 @@ function writeStored(key, open) {
|
|
|
1916
1949
|
} catch {
|
|
1917
1950
|
}
|
|
1918
1951
|
}
|
|
1919
|
-
function CollapsibleSection({ title, defaultOpen = true, open: openProp, onOpenChange, storageKey, actions, showActions, children, className, contentClassName }) {
|
|
1952
|
+
function CollapsibleSection({ title, defaultOpen = true, open: openProp, onOpenChange, storageKey, trailing, actions, showActions, children, className, contentClassName }) {
|
|
1920
1953
|
const [openState, setOpenState] = useState6(() => readStored(storageKey) ?? defaultOpen);
|
|
1921
1954
|
const open = openProp ?? openState;
|
|
1922
1955
|
const setOpen = (next) => {
|
|
@@ -1925,7 +1958,7 @@ function CollapsibleSection({ title, defaultOpen = true, open: openProp, onOpenC
|
|
|
1925
1958
|
onOpenChange?.(next);
|
|
1926
1959
|
};
|
|
1927
1960
|
return /* @__PURE__ */ jsxs29(Collapsible.Root, { open, onOpenChange: setOpen, className: cn("flex flex-col", className), children: [
|
|
1928
|
-
/* @__PURE__ */ jsx42(SectionHeader, { title, chevron: true, isExpanded: open, actions, showActions, className: "shrink-0", render: /* @__PURE__ */ jsx42(Collapsible.Trigger, {}) }),
|
|
1961
|
+
/* @__PURE__ */ jsx42(SectionHeader, { title, chevron: true, isExpanded: open, trailing, actions, showActions, className: "shrink-0", render: /* @__PURE__ */ jsx42(Collapsible.Trigger, {}) }),
|
|
1929
1962
|
/* @__PURE__ */ jsx42(
|
|
1930
1963
|
Collapsible.Panel,
|
|
1931
1964
|
{
|
|
@@ -1986,25 +2019,42 @@ function Tabs({ tabs, active, onChange, size = "default", className, ...aria })
|
|
|
1986
2019
|
// src/Toast.tsx
|
|
1987
2020
|
import { createContext as createContext2, useCallback as useCallback3, useContext as useContext2, useEffect as useEffect3, useMemo as useMemo3, useState as useState7 } from "react";
|
|
1988
2021
|
import { createPortal as createPortal2 } from "react-dom";
|
|
1989
|
-
import { IconCircleCheck } from "@tabler/icons-react";
|
|
2022
|
+
import { IconAlertCircle, IconCircleCheck, IconCircleX } from "@tabler/icons-react";
|
|
1990
2023
|
import { jsx as jsx44, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
1991
2024
|
var SURFACE_STYLES = {
|
|
1992
2025
|
success: "bg-success-muted signal:bg-bg-inset signal:border signal:border-border-default signal:shadow-[shadow:var(--shadow-md)]",
|
|
1993
2026
|
brand: "bg-accent-muted signal:bg-bg-inset signal:border signal:border-border-default signal:shadow-[shadow:var(--shadow-md)]",
|
|
1994
|
-
neutral: "bg-bg-inset border border-border-subtle signal:border-border-default signal:shadow-[shadow:var(--shadow-md)]"
|
|
2027
|
+
neutral: "bg-bg-inset border border-border-subtle signal:border-border-default signal:shadow-[shadow:var(--shadow-md)]",
|
|
2028
|
+
warning: "bg-warning-muted signal:bg-bg-inset signal:border signal:border-border-default signal:shadow-[shadow:var(--shadow-md)]",
|
|
2029
|
+
error: "bg-error-muted signal:bg-bg-inset signal:border signal:border-border-default signal:shadow-[shadow:var(--shadow-md)]"
|
|
2030
|
+
};
|
|
2031
|
+
var ICONS = {
|
|
2032
|
+
success: IconCircleCheck,
|
|
2033
|
+
brand: IconCircleCheck,
|
|
2034
|
+
neutral: IconCircleCheck,
|
|
2035
|
+
warning: IconAlertCircle,
|
|
2036
|
+
error: IconCircleX
|
|
1995
2037
|
};
|
|
1996
2038
|
var ICON_STYLES = {
|
|
1997
2039
|
success: "signal:text-success-default signal:drop-shadow-glow-success",
|
|
1998
2040
|
brand: "signal:text-text-interactive signal:drop-shadow-glow-accent",
|
|
1999
|
-
neutral: "signal:text-text-secondary"
|
|
2041
|
+
neutral: "signal:text-text-secondary",
|
|
2042
|
+
warning: "signal:text-warning-default signal:drop-shadow-glow-warning",
|
|
2043
|
+
// No glow: the theme defines `--glow-warning`, `--glow-success` and
|
|
2044
|
+
// `--glow-accent` and no error glow, and a colour with no token is not
|
|
2045
|
+
// approximated here (D16).
|
|
2046
|
+
error: "signal:text-error-default"
|
|
2000
2047
|
};
|
|
2001
2048
|
var ACTION_BORDER_STYLES = {
|
|
2002
2049
|
success: "signal:border signal:border-border-default signal:hover:border-border-strong",
|
|
2003
2050
|
brand: "signal:border signal:border-border-default signal:hover:border-border-strong",
|
|
2004
|
-
neutral: "border border-border-default"
|
|
2051
|
+
neutral: "border border-border-default",
|
|
2052
|
+
warning: "signal:border signal:border-border-default signal:hover:border-border-strong",
|
|
2053
|
+
error: "signal:border signal:border-border-default signal:hover:border-border-strong"
|
|
2005
2054
|
};
|
|
2006
2055
|
function Toast({ label, type = "neutral", leadingIcon = true, actionLabel, onAction, className }) {
|
|
2007
2056
|
const hasAction = !!(actionLabel && onAction);
|
|
2057
|
+
const LeadingIcon = ICONS[type];
|
|
2008
2058
|
return /* @__PURE__ */ jsxs31(
|
|
2009
2059
|
"div",
|
|
2010
2060
|
{
|
|
@@ -2018,7 +2068,7 @@ function Toast({ label, type = "neutral", leadingIcon = true, actionLabel, onAct
|
|
|
2018
2068
|
),
|
|
2019
2069
|
children: [
|
|
2020
2070
|
/* @__PURE__ */ jsxs31("div", { className: "flex items-center gap-2 shrink-0", children: [
|
|
2021
|
-
leadingIcon && /* @__PURE__ */ jsx44(
|
|
2071
|
+
leadingIcon && /* @__PURE__ */ jsx44(LeadingIcon, { size: 16, stroke: 1.5, className: cn("text-text-primary shrink-0", ICON_STYLES[type]) }),
|
|
2022
2072
|
/* @__PURE__ */ jsx44("span", { className: "font-normal text-[14px] leading-[1.4] text-text-primary whitespace-nowrap", children: label })
|
|
2023
2073
|
] }),
|
|
2024
2074
|
hasAction && /* @__PURE__ */ jsx44(
|
|
@@ -2102,6 +2152,7 @@ export {
|
|
|
2102
2152
|
EmptyState,
|
|
2103
2153
|
EnterHint,
|
|
2104
2154
|
Field,
|
|
2155
|
+
FieldLine,
|
|
2105
2156
|
IconButton,
|
|
2106
2157
|
IdentityMenu,
|
|
2107
2158
|
IdentityPanel,
|