@xenide-io/the-old-ui-theme 0.7.0 → 0.9.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +9 -10
- package/dist/{Chip-Cq3AiAji.d.mts → Chip-BzuNgJIa.d.mts} +81 -23
- package/dist/{Chip-Cq3AiAji.d.ts → Chip-BzuNgJIa.d.ts} +81 -23
- package/dist/{ai-message-blocknote-WABTHFY7.mjs → ai-message-blocknote-D4Z6DUCJ.mjs} +9 -3
- package/dist/chunk-2EO5VCXP.mjs +3912 -0
- package/dist/chunk-APKRZQRO.mjs +251 -0
- package/dist/chunk-BS7BZI5W.mjs +19 -0
- package/dist/chunk-IULORI3A.mjs +8 -0
- package/dist/index.d.mts +3 -3
- package/dist/index.d.ts +3 -3
- package/dist/index.js +997 -576
- package/dist/index.mjs +49 -45
- package/dist/suite.d.mts +157 -55
- package/dist/suite.d.ts +157 -55
- package/dist/suite.js +4249 -801
- package/dist/suite.mjs +2578 -594
- package/dist/theme-boot-P-oqKVZF.d.mts +74 -0
- package/dist/theme-boot-P-oqKVZF.d.ts +74 -0
- package/dist/theme-boot.d.mts +2 -0
- package/dist/theme-boot.d.ts +2 -0
- package/dist/theme-boot.js +44 -0
- package/dist/theme-boot.mjs +8 -0
- package/dist/ui.d.mts +5 -29
- package/dist/ui.d.ts +5 -29
- package/dist/ui.js +647 -352
- package/dist/ui.mjs +10 -12
- package/docs/README.md +34 -0
- package/docs/ai-quick-reference.md +56 -0
- package/docs/component-library-improvement-plan.md +751 -0
- package/docs/component-reference.md +81 -0
- package/docs/components.md +48 -0
- package/docs/demos.md +19 -0
- package/docs/installation.md +117 -0
- package/docs/suite-audit.md +34 -0
- package/docs/theme-token-reference.md +67 -0
- package/docs/themes.md +164 -0
- package/package.json +22 -21
- package/public/fonts/OpenRunde-Bold.woff2 +0 -0
- package/public/fonts/OpenRunde-Medium.woff2 +0 -0
- package/public/fonts/OpenRunde-Regular.woff2 +0 -0
- package/public/fonts/OpenRunde-Semibold.woff2 +0 -0
- package/scripts/package-smoke.mjs +43 -0
- package/src/app/globals.css +2 -1
- package/src/components/ui/Accordion.tsx +20 -6
- package/src/components/ui/Avatar.tsx +5 -3
- package/src/components/ui/Calendar.tsx +187 -63
- package/src/components/ui/Card.test.tsx +38 -0
- package/src/components/ui/Card.tsx +77 -14
- package/src/components/ui/CollapsibleSection.tsx +12 -4
- package/src/components/ui/CommandPalette.test.tsx +91 -4
- package/src/components/ui/CommandPalette.tsx +138 -128
- package/src/components/ui/EmptyState.tsx +2 -2
- package/src/components/ui/FormField.tsx +1 -1
- package/src/components/ui/Input.tsx +42 -18
- package/src/components/ui/Kbd.tsx +18 -3
- package/src/components/ui/Modal.tsx +3 -1
- package/src/components/ui/Progress.tsx +14 -5
- package/src/components/ui/SegmentedControl.tsx +2 -2
- package/src/components/ui/SettingsLayout.tsx +1 -1
- package/src/components/ui/Stat.tsx +3 -2
- package/src/components/ui/Table.tsx +8 -3
- package/src/components/ui/Tooltip.test.tsx +70 -1
- package/src/components/ui/Tooltip.tsx +53 -29
- package/src/components/ui/Typography.tsx +103 -49
- package/src/components/ui/avatar-stat.test.tsx +23 -0
- package/src/components/ui/calendar.test.tsx +88 -0
- package/src/components/ui/disclosure.test.tsx +39 -0
- package/src/components/ui/index.ts +44 -6
- package/src/components/ui/progress.test.tsx +15 -0
- package/src/components/ui/typography.test.tsx +26 -1
- package/src/styles/suite-skin.css +8 -2
- package/src/styles/themes.css +184 -68
- package/src/suite/components/ai-message-blocknote.tsx +13 -2
- package/src/suite/components/ai-panel.tsx +41 -10
- package/src/suite/components/app-switcher.test.tsx +21 -6
- package/src/suite/components/app-switcher.tsx +7 -11
- package/src/suite/components/suite-app-layout.tsx +12 -3
- package/src/suite/components/suite-bottom-nav.tsx +0 -1
- package/src/suite/components/suite-clients-projects-directory.test.tsx +71 -0
- package/src/suite/components/suite-clients-projects-directory.tsx +943 -0
- package/src/suite/components/suite-integration-picker.test.tsx +224 -0
- package/src/suite/components/suite-integration-picker.tsx +939 -0
- package/src/suite/components/suite-integration-rules.test.tsx +157 -0
- package/src/suite/components/suite-integration-rules.tsx +471 -0
- package/src/suite/components/suite-mobile-drawer.test.tsx +18 -2
- package/src/suite/components/suite-mobile-drawer.tsx +65 -98
- package/src/suite/components/suite-notification-bell.tsx +29 -4
- package/src/suite/components/suite-sidebar.tsx +25 -25
- package/src/suite/components/suite-skeleton.tsx +2 -2
- package/src/suite/components/suite-user-menu.tsx +9 -8
- package/src/suite/components/theme-provider.test.tsx +87 -3
- package/src/suite/components/theme-provider.tsx +144 -23
- package/src/suite/components/today-ui.tsx +79 -68
- package/src/suite/components/workspace-switcher.test.tsx +56 -0
- package/src/suite/components/workspace-switcher.tsx +3 -3
- package/src/suite/icons/app-accents.ts +12 -12
- package/src/suite/icons/glyphs.ts +6 -12
- package/src/suite/index.ts +27 -0
- package/src/suite/lib/apps.test.ts +9 -1
- package/src/suite/lib/apps.ts +14 -8
- package/src/suite/lib/cookies.ts +53 -0
- package/src/suite/lib/theme-boot.ts +32 -0
- package/src/suite/lib/theme-cookie.ts +7 -0
- package/src/suite/lib/use-sidebar-width.ts +5 -51
- package/dist/chunk-KDR6HI6F.mjs +0 -1075
- package/dist/chunk-NOI42JNZ.mjs +0 -151
- package/dist/chunk-VXISSXTB.mjs +0 -2564
- package/src/suite/lib/use-lock-mobile-page-zoom.test.tsx +0 -65
- package/src/suite/lib/use-lock-mobile-page-zoom.ts +0 -51
package/README.md
CHANGED
|
@@ -10,9 +10,8 @@ npm install @xenide-io/the-old-ui-theme
|
|
|
10
10
|
bun add @xenide-io/the-old-ui-theme
|
|
11
11
|
```
|
|
12
12
|
|
|
13
|
-
For
|
|
14
|
-
|
|
15
|
-
For AI-readable usage docs, see [`docs/`](./docs/README.md).
|
|
13
|
+
For source setup and API documentation, see the
|
|
14
|
+
[repository docs](https://github.com/xenide-io/the-old-ui-theme/tree/main/docs).
|
|
16
15
|
|
|
17
16
|
## Setup In Your App
|
|
18
17
|
|
|
@@ -88,11 +87,11 @@ import { Alert, Badge, Button, Card, Input, H1, H2, P } from "@xenide-io/the-old
|
|
|
88
87
|
| Area | Components |
|
|
89
88
|
| ---------- | ---------------------------------------------------------------------------------------------------------------------------------------- |
|
|
90
89
|
| Actions | `Button`, `DropdownButton`, `DropdownMenu`, `DropdownItem` |
|
|
91
|
-
| Feedback | `Alert`, `Badge`, `
|
|
92
|
-
| Inputs | `FormField`, `Input`, `Select`, `Textarea`, `Checkbox`, `Radio`, `Toggle`, `
|
|
93
|
-
| Layout | `Card`, `Modal`, `
|
|
94
|
-
| Navigation | `
|
|
95
|
-
| Data | `Table`, `Stat`,
|
|
90
|
+
| Feedback | `Alert`, `Badge`, `EmptyState`, `Progress`, `Loader`, `LoadingState`, `Skeleton` |
|
|
91
|
+
| Inputs | `FormField`, `Input`, `Select`, `Textarea`, `Checkbox`, `Radio`, `Toggle`, `FileUpload`, `SearchInput` |
|
|
92
|
+
| Layout | `Card`, `Modal`, `Panel`, `Accordion`, `SettingsLayout`, `AuthLayout` |
|
|
93
|
+
| Navigation | `DropdownMenu`, `SegmentedControl`, `CommandPalette`, `FilterBar`, `FilterChips` |
|
|
94
|
+
| Data | `Table`, `Stat`, `Avatar`, `AvatarGroup`, `Calendar` |
|
|
96
95
|
| Typography | `H1`, `H2`, `H3`, `H4`, `H5`, `P`, `Small`, `Caption`, `Lead`, `Mono`, `Overline`, `Display` |
|
|
97
96
|
| Foundation | icons, theme switcher, code block, color tokens |
|
|
98
97
|
|
|
@@ -132,8 +131,8 @@ from a second typeface competing with Open Runde.
|
|
|
132
131
|
|
|
133
132
|
Marketing sizes are fluid (`clamp()`), so a hero is one class instead of three
|
|
134
133
|
breakpoint variants: `.ph-hero-title`, `.ph-section-title`, `.ph-feature-title`,
|
|
135
|
-
`.ph-lead`, `.ph-eyebrow`. Product UI keeps the Tailwind step scale.
|
|
136
|
-
|
|
134
|
+
`.ph-lead`, `.ph-eyebrow`. Product UI keeps the Tailwind step scale. Open Runde
|
|
135
|
+
weights are included and loaded by `styles.css`.
|
|
137
136
|
|
|
138
137
|
## Themes
|
|
139
138
|
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
|
-
import { ButtonHTMLAttributes, ReactNode, HTMLAttributes, AriaAttributes, ComponentPropsWithoutRef, CSSProperties, SVGAttributes, ReactElement, AnchorHTMLAttributes } from 'react';
|
|
2
|
+
import { ButtonHTMLAttributes, ReactNode, HTMLAttributes, AriaAttributes, MouseEventHandler, ComponentPropsWithoutRef, CSSProperties, Key, SVGAttributes, ReactElement, ElementType, AnchorHTMLAttributes } from 'react';
|
|
3
3
|
import * as DropdownPrimitive from '@radix-ui/react-dropdown-menu';
|
|
4
4
|
|
|
5
5
|
type ButtonVariant = "primary" | "secondary" | "tertiary" | "signal" | "accent" | "neutral" | "info" | "success" | "warning" | "danger" | "ghost" | "link";
|
|
@@ -55,7 +55,7 @@ interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {
|
|
|
55
55
|
declare const Badge: react.ForwardRefExoticComponent<BadgeProps & react.RefAttributes<HTMLSpanElement>>;
|
|
56
56
|
|
|
57
57
|
type CardVariant = "default" | "outlined" | "elevated" | "highlighted";
|
|
58
|
-
interface CardProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
|
|
58
|
+
interface CardProps extends Omit<HTMLAttributes<HTMLDivElement>, "title" | "onClick"> {
|
|
59
59
|
children?: ReactNode;
|
|
60
60
|
title?: ReactNode;
|
|
61
61
|
description?: ReactNode;
|
|
@@ -65,10 +65,36 @@ interface CardProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
|
|
|
65
65
|
variant?: CardVariant;
|
|
66
66
|
className?: string;
|
|
67
67
|
bodyClassName?: string;
|
|
68
|
+
/**
|
|
69
|
+
* Applies interactive chrome to a card containing its own semantic control.
|
|
70
|
+
* This alone does not make the card clickable; use `href` or `onClick` for a
|
|
71
|
+
* full-card action.
|
|
72
|
+
*/
|
|
68
73
|
interactive?: boolean;
|
|
74
|
+
/** Renders the full card as a semantic link. Do not combine with nested controls. */
|
|
75
|
+
href?: string;
|
|
76
|
+
/** Renders the full card as a semantic button. Do not combine with nested controls. */
|
|
77
|
+
onClick?: MouseEventHandler<HTMLElement>;
|
|
78
|
+
/** Link target, used when `href` is provided. */
|
|
79
|
+
target?: string;
|
|
80
|
+
/** Link relationship, used when `href` is provided. */
|
|
81
|
+
rel?: string;
|
|
82
|
+
/** Button behaviour, used when `onClick` is provided without `href`. */
|
|
83
|
+
type?: "button" | "submit" | "reset";
|
|
69
84
|
titleAs?: "h2" | "h3" | "h4";
|
|
70
85
|
}
|
|
71
|
-
declare const Card: react.ForwardRefExoticComponent<CardProps & react.RefAttributes<
|
|
86
|
+
declare const Card: react.ForwardRefExoticComponent<CardProps & react.RefAttributes<HTMLElement>>;
|
|
87
|
+
|
|
88
|
+
type KbdVariant = "shortcut" | "key" | "token";
|
|
89
|
+
type KbdPlatform = "text" | "mac" | "windows";
|
|
90
|
+
interface KbdProps extends HTMLAttributes<HTMLElement> {
|
|
91
|
+
variant?: KbdVariant;
|
|
92
|
+
keys?: readonly ReactNode[];
|
|
93
|
+
platform?: KbdPlatform;
|
|
94
|
+
separator?: ReactNode;
|
|
95
|
+
children?: ReactNode;
|
|
96
|
+
}
|
|
97
|
+
declare function Kbd({ variant, keys, platform, separator, children, className, "aria-label": ariaLabel, ...props }: KbdProps): react.JSX.Element;
|
|
72
98
|
|
|
73
99
|
type LoaderVariant = "spinner" | "dots" | "pulse";
|
|
74
100
|
type LoaderSize = "sm" | "md" | "lg";
|
|
@@ -283,6 +309,7 @@ interface ModalProps {
|
|
|
283
309
|
footer?: ReactNode;
|
|
284
310
|
size?: ModalSize;
|
|
285
311
|
className?: string;
|
|
312
|
+
bodyClassName?: string;
|
|
286
313
|
customLayout?: boolean;
|
|
287
314
|
showCloseButton?: boolean;
|
|
288
315
|
closeOnOutsideClick?: boolean;
|
|
@@ -294,7 +321,7 @@ interface ModalProps {
|
|
|
294
321
|
"aria-label"?: string;
|
|
295
322
|
"aria-labelledby"?: string;
|
|
296
323
|
}
|
|
297
|
-
declare function Modal({ open, onClose, title, description, children, footer, size, className, customLayout, showCloseButton, closeOnOutsideClick, closeOnEscape, dataTest, panelDataTest, zIndex, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, }: ModalProps): react.JSX.Element;
|
|
324
|
+
declare function Modal({ open, onClose, title, description, children, footer, size, className, bodyClassName, customLayout, showCloseButton, closeOnOutsideClick, closeOnEscape, dataTest, panelDataTest, zIndex, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, }: ModalProps): react.JSX.Element;
|
|
298
325
|
|
|
299
326
|
interface PanelProps extends Omit<ComponentPropsWithoutRef<"div">, "title"> {
|
|
300
327
|
title?: ReactNode;
|
|
@@ -335,10 +362,11 @@ interface TableProps<T> {
|
|
|
335
362
|
compact?: boolean;
|
|
336
363
|
ribbon?: boolean;
|
|
337
364
|
getRowStyle?: (row: T) => CSSProperties | undefined;
|
|
365
|
+
getRowKey?: (row: T, index: number) => Key;
|
|
338
366
|
className?: string;
|
|
339
367
|
caption?: string;
|
|
340
368
|
}
|
|
341
|
-
declare function Table<T>({ data, columns, zebra, compact, ribbon, getRowStyle, className, caption, }: TableProps<T>): react.JSX.Element;
|
|
369
|
+
declare function Table<T>({ data, columns, zebra, compact, ribbon, getRowStyle, getRowKey, className, caption, }: TableProps<T>): react.JSX.Element;
|
|
342
370
|
|
|
343
371
|
type StatTone = "default" | "brand" | "blue" | "purple" | "warning";
|
|
344
372
|
interface StatProps extends ComponentPropsWithoutRef<"article"> {
|
|
@@ -350,6 +378,19 @@ interface StatProps extends ComponentPropsWithoutRef<"article"> {
|
|
|
350
378
|
}
|
|
351
379
|
declare function Stat({ icon, label, value, footer, tone, className, ...props }: StatProps): react.JSX.Element;
|
|
352
380
|
|
|
381
|
+
/**
|
|
382
|
+
* Re-applies `html[data-theme]` after React commits. Hydration can clear attributes
|
|
383
|
+
* that were set only by `THEME_INIT_SCRIPT` — without this sync, `:root`-scoped
|
|
384
|
+
* light tokens effectively win visually.
|
|
385
|
+
*/
|
|
386
|
+
declare function ThemeDomSync(): null;
|
|
387
|
+
|
|
388
|
+
interface ThemeSwitcherProps {
|
|
389
|
+
className?: string;
|
|
390
|
+
}
|
|
391
|
+
/** Colour-only theme picker — persists to localStorage and sets html[data-theme]. */
|
|
392
|
+
declare function ThemeSwitcher({ className }: ThemeSwitcherProps): react.JSX.Element;
|
|
393
|
+
|
|
353
394
|
interface IconProps extends SVGAttributes<SVGSVGElement> {
|
|
354
395
|
/** Pixel size or CSS length; defaults to `1em`. */
|
|
355
396
|
size?: number | string;
|
|
@@ -674,7 +715,7 @@ interface CommandPaletteProps {
|
|
|
674
715
|
inputId?: string;
|
|
675
716
|
inputDataTest?: string;
|
|
676
717
|
}
|
|
677
|
-
declare function CommandPalette({ items, isOpen, onClose, placeholder, className, id, dataTest, inputId, inputDataTest, }: CommandPaletteProps): react.JSX.Element
|
|
718
|
+
declare function CommandPalette({ items, isOpen, onClose, placeholder, className, id, dataTest, inputId, inputDataTest, }: CommandPaletteProps): react.JSX.Element;
|
|
678
719
|
|
|
679
720
|
interface CalendarProps {
|
|
680
721
|
value?: Date;
|
|
@@ -695,16 +736,18 @@ interface TooltipProps {
|
|
|
695
736
|
side?: TooltipSide;
|
|
696
737
|
align?: TooltipAlign;
|
|
697
738
|
sideOffset?: number;
|
|
739
|
+
/** Minimum distance between the tooltip and the viewport edge. */
|
|
698
740
|
collisionPadding?: number;
|
|
699
741
|
className?: string;
|
|
700
742
|
open?: boolean;
|
|
701
743
|
defaultOpen?: boolean;
|
|
702
744
|
onOpenChange?: (open: boolean) => void;
|
|
703
745
|
delayDuration?: number;
|
|
746
|
+
/** Prevents the pointer from keeping the tooltip open over its content. */
|
|
704
747
|
disableHoverableContent?: boolean;
|
|
705
748
|
}
|
|
706
749
|
declare function TooltipProvider({ children, delayDuration, }: TooltipProviderProps): react.JSX.Element;
|
|
707
|
-
declare function Tooltip({ content, children, side, align, sideOffset, className, open, defaultOpen, onOpenChange, delayDuration, }: TooltipProps): react.JSX.Element;
|
|
750
|
+
declare function Tooltip({ content, children, side, align, sideOffset, collisionPadding, className, open, defaultOpen, onOpenChange, delayDuration, disableHoverableContent, }: TooltipProps): react.JSX.Element;
|
|
708
751
|
|
|
709
752
|
interface EmptyStateProps {
|
|
710
753
|
icon?: React.ReactNode;
|
|
@@ -771,37 +814,52 @@ interface TextBaseProps {
|
|
|
771
814
|
children?: ReactNode;
|
|
772
815
|
truncate?: boolean;
|
|
773
816
|
}
|
|
817
|
+
type TypographyProps<T extends ElementType> = TextBaseProps & Omit<ComponentPropsWithoutRef<T>, keyof TextBaseProps>;
|
|
818
|
+
type DisplayProps = TypographyProps<"h1">;
|
|
819
|
+
type SectionTitleProps = TypographyProps<"h2">;
|
|
820
|
+
type H1Props = TypographyProps<"h1">;
|
|
821
|
+
type H2Props = TypographyProps<"h2">;
|
|
822
|
+
type H3Props = TypographyProps<"h3">;
|
|
823
|
+
type H4Props = TypographyProps<"h4">;
|
|
824
|
+
type H5Props = TypographyProps<"h5">;
|
|
825
|
+
type PProps = TypographyProps<"p">;
|
|
826
|
+
type SmallProps = TypographyProps<"span">;
|
|
827
|
+
type CaptionProps = TypographyProps<"span">;
|
|
828
|
+
type OverlineProps = TypographyProps<"span">;
|
|
829
|
+
type LeadProps = TypographyProps<"p">;
|
|
830
|
+
type MonoProps = TypographyProps<"code">;
|
|
831
|
+
type LabelProps = TypographyProps<"label">;
|
|
774
832
|
/**
|
|
775
833
|
* Display — the marketing hero: fluid size, tight tracking, one per page.
|
|
776
834
|
* Product page titles use H1/`SuitePageHeader` instead.
|
|
777
835
|
*/
|
|
778
|
-
declare
|
|
836
|
+
declare const Display: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLHeadingElement>>;
|
|
779
837
|
/** Section title — fluid; pairs with Display on public pages. */
|
|
780
|
-
declare
|
|
838
|
+
declare const SectionTitle: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLHeadingElement>>;
|
|
781
839
|
/** H1 — page title */
|
|
782
|
-
declare
|
|
840
|
+
declare const H1: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLHeadingElement>>;
|
|
783
841
|
/** H2 — section title */
|
|
784
|
-
declare
|
|
842
|
+
declare const H2: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLHeadingElement>>;
|
|
785
843
|
/** H3 — subsection title */
|
|
786
|
-
declare
|
|
844
|
+
declare const H3: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLHeadingElement>>;
|
|
787
845
|
/** H4 — card / panel title */
|
|
788
|
-
declare
|
|
846
|
+
declare const H4: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLHeadingElement>>;
|
|
789
847
|
/** H5 — small heading */
|
|
790
|
-
declare
|
|
848
|
+
declare const H5: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLHeadingElement>>;
|
|
791
849
|
/** Body — default paragraph text */
|
|
792
|
-
declare
|
|
850
|
+
declare const P: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLParagraphElement>>;
|
|
793
851
|
/** Small body text */
|
|
794
|
-
declare
|
|
852
|
+
declare const Small: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLSpanElement>>;
|
|
795
853
|
/** Extra small text — captions, meta */
|
|
796
|
-
declare
|
|
854
|
+
declare const Caption: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLSpanElement>>;
|
|
797
855
|
/** Overline — tiny eyebrow text */
|
|
798
|
-
declare
|
|
856
|
+
declare const Overline: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLSpanElement>>;
|
|
799
857
|
/** Lead — intro paragraph under a Display/SectionTitle; measure-capped for readability */
|
|
800
|
-
declare
|
|
858
|
+
declare const Lead: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLParagraphElement>>;
|
|
801
859
|
/** Mono — code, data, technical text */
|
|
802
|
-
declare
|
|
860
|
+
declare const Mono: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLElement>, HTMLElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLElement>>;
|
|
803
861
|
/** Label — form labels, tags */
|
|
804
|
-
declare
|
|
862
|
+
declare const Label: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLLabelElement>>;
|
|
805
863
|
|
|
806
864
|
type AvatarSize = "xs" | "sm" | "md" | "lg" | "xl";
|
|
807
865
|
type AvatarStatus = "online" | "offline" | "away" | "busy";
|
|
@@ -840,7 +898,7 @@ interface ProgressProps extends ComponentPropsWithoutRef<"div"> {
|
|
|
840
898
|
/** Size variant */
|
|
841
899
|
size?: "sm" | "md" | "lg";
|
|
842
900
|
}
|
|
843
|
-
declare function Progress({ value, max, color, label, showPercentage, size, className, ...props }: ProgressProps): react.JSX.Element;
|
|
901
|
+
declare function Progress({ value, max, color, label, showPercentage, size, className, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, ...props }: ProgressProps): react.JSX.Element;
|
|
844
902
|
|
|
845
903
|
interface LinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
|
|
846
904
|
children: ReactNode;
|
|
@@ -873,4 +931,4 @@ interface ChipProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
|
873
931
|
}
|
|
874
932
|
declare const Chip: react.ForwardRefExoticComponent<ChipProps & react.RefAttributes<HTMLButtonElement>>;
|
|
875
933
|
|
|
876
|
-
export { type
|
|
934
|
+
export { type DropdownItemProps as $, Accordion as A, Badge as B, type ButtonVariant as C, CANONICAL_ICONS as D, Calendar as E, type CalendarProps as F, type CanonicalIconName as G, Caption as H, type CaptionProps as I, Card as J, type CardProps as K, type CardVariant as L, Checkbox as M, type CheckboxProps as N, Chip as O, type ChipProps as P, type CommandItem as Q, CommandPalette as R, type CommandPaletteProps as S, Display as T, type DisplayProps as U, Dot as V, type DotProps as W, type DropdownAlign as X, DropdownButton as Y, type DropdownButtonProps as Z, DropdownItem as _, type AccordionItem as a, IconExperimentSplit as a$, DropdownMenu as a0, type DropdownMenuProps as a1, DropdownRadioGroup as a2, type DropdownRadioGroupProps as a3, DropdownRadioItem as a4, type DropdownRadioItemProps as a5, type DropdownSide as a6, EmptyState as a7, type EmptyStateProps as a8, FileUpload as a9, IconArrowUp as aA, IconBase as aB, IconBell as aC, IconBellOff as aD, IconBolt as aE, IconBox as aF, IconByName as aG, IconCancel as aH, IconCheck as aI, IconCheckCircle as aJ, IconChevronDown as aK, IconChevronLeft as aL, IconChevronRight as aM, IconClipboardEdit as aN, IconClose as aO, IconCodePreview as aP, IconCohort as aQ, IconCommandCursor as aR, IconCopy as aS, IconCumulativeChart as aT, IconDataReel as aU, IconDatabase as aV, IconDownload as aW, IconEdit as aX, IconErrorOutline as aY, IconEventStream as aZ, IconExclamation as a_, type FileUploadProps as aa, FilterBar as ab, type FilterBarProps as ac, type FilterChip as ad, FilterChips as ae, type FilterChipsProps as af, FilterMenu as ag, type FilterMenuOption as ah, type FilterMenuProps as ai, FormField as aj, type FormFieldControlProps as ak, type FormFieldProps as al, H1 as am, type H1Props as an, H2 as ao, type H2Props as ap, H3 as aq, type H3Props as ar, H4 as as, type H4Props as at, H5 as au, type H5Props as av, IconActivity as aw, type IconAliasName as ax, IconAreaChart as ay, IconArrowDown as az, type AccordionProps as b, Loader as b$, IconFeatureGate as b0, IconFlag as b1, IconFlare as b2, IconFlask as b3, IconGift as b4, IconGridView as b5, IconHandClick as b6, IconHome as b7, IconInfo as b8, IconInsightBoard as b9, IconSubArrowRight as bA, IconSun as bB, IconSurveyCard as bC, IconSurveys as bD, IconSync as bE, IconTableChart as bF, IconTerminal as bG, IconToggle as bH, IconTrash as bI, IconTuning as bJ, IconUpload as bK, IconVolume as bL, IconVolumeOff as bM, Input as bN, type InputProps as bO, type InputSize as bP, type InputVariant as bQ, Kbd as bR, type KbdPlatform as bS, type KbdProps as bT, type KbdVariant as bU, Label as bV, type LabelProps as bW, Lead as bX, type LeadProps as bY, Link as bZ, type LinkProps as b_, IconLayers as ba, IconListView as bb, IconLogout as bc, IconMail as bd, IconMoon as be, type IconName as bf, IconOldWindow as bg, IconPanelRight as bh, IconPerson as bi, IconPlayCircle as bj, IconPlus as bk, IconPremium as bl, type IconProps as bm, IconQueryEditor as bn, IconQueryStack as bo, IconRadar as bp, IconRecording as bq, IconReplayFrame as br, IconRobot as bs, IconRocket as bt, IconSave as bu, IconSearch as bv, IconSelectEvents as bw, IconShoppingCart as bx, IconSpinner as by, IconStar as bz, Alert as c, ThemeSwitcher as c$, type LoaderProps as c0, type LoaderSize as c1, type LoaderVariant as c2, LoadingState as c3, type LoadingStateProps as c4, Modal as c5, type ModalProps as c6, type ModalSize as c7, Mono as c8, type MonoProps as c9, SettingsLayout as cA, type SettingsLayoutProps as cB, SettingsNav as cC, type SettingsNavGroup as cD, type SettingsNavItem as cE, type SettingsNavProps as cF, Skeleton as cG, type SkeletonProps as cH, type SkeletonShape as cI, Small as cJ, type SmallProps as cK, SortMenu as cL, type SortMenuProps as cM, Spinner as cN, type SpinnerProps as cO, Stat as cP, type StatProps as cQ, type StatTone as cR, Table as cS, type TableColumn as cT, type TableProps as cU, type TextBaseProps as cV, type TextTone as cW, type TextWeight as cX, Textarea as cY, type TextareaProps as cZ, ThemeDomSync as c_, OLD_UI_ICONS as ca, Overline as cb, type OverlineProps as cc, P as cd, PH_ICONS as ce, PH_ICON_ALIASES as cf, type PProps as cg, Panel as ch, type PanelProps as ci, Progress as cj, type ProgressProps as ck, Radio as cl, type RadioProps as cm, Range as cn, type RangeProps as co, SearchGroup as cp, type SearchGroupProps as cq, SearchInput as cr, type SearchInputProps as cs, SectionTitle as ct, type SectionTitleProps as cu, SegmentedControl as cv, type SegmentedControlOption as cw, type SegmentedControlProps as cx, Select as cy, type SelectProps as cz, type AlertProps as d, type ThemeSwitcherProps as d0, Toggle as d1, type ToggleProps as d2, Tooltip as d3, type TooltipAlign as d4, type TooltipProps as d5, TooltipProvider as d6, type TooltipProviderProps as d7, type TooltipSide as d8, type AlertStatus as e, AuthCard as f, type AuthCardProps as g, AuthDivider as h, type AuthDividerProps as i, AuthLayout as j, type AuthLayoutProps as k, Avatar as l, AvatarGroup as m, type AvatarGroupProps as n, type AvatarProps as o, type AvatarSize as p, type AvatarStatus as q, type BadgeProps as r, type BadgeSize as s, type BadgeVariant as t, Button as u, ButtonChrome as v, type ButtonChromeProps as w, type ButtonProps as x, type ButtonShape as y, type ButtonSize as z };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
|
-
import { ButtonHTMLAttributes, ReactNode, HTMLAttributes, AriaAttributes, ComponentPropsWithoutRef, CSSProperties, SVGAttributes, ReactElement, AnchorHTMLAttributes } from 'react';
|
|
2
|
+
import { ButtonHTMLAttributes, ReactNode, HTMLAttributes, AriaAttributes, MouseEventHandler, ComponentPropsWithoutRef, CSSProperties, Key, SVGAttributes, ReactElement, ElementType, AnchorHTMLAttributes } from 'react';
|
|
3
3
|
import * as DropdownPrimitive from '@radix-ui/react-dropdown-menu';
|
|
4
4
|
|
|
5
5
|
type ButtonVariant = "primary" | "secondary" | "tertiary" | "signal" | "accent" | "neutral" | "info" | "success" | "warning" | "danger" | "ghost" | "link";
|
|
@@ -55,7 +55,7 @@ interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {
|
|
|
55
55
|
declare const Badge: react.ForwardRefExoticComponent<BadgeProps & react.RefAttributes<HTMLSpanElement>>;
|
|
56
56
|
|
|
57
57
|
type CardVariant = "default" | "outlined" | "elevated" | "highlighted";
|
|
58
|
-
interface CardProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
|
|
58
|
+
interface CardProps extends Omit<HTMLAttributes<HTMLDivElement>, "title" | "onClick"> {
|
|
59
59
|
children?: ReactNode;
|
|
60
60
|
title?: ReactNode;
|
|
61
61
|
description?: ReactNode;
|
|
@@ -65,10 +65,36 @@ interface CardProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
|
|
|
65
65
|
variant?: CardVariant;
|
|
66
66
|
className?: string;
|
|
67
67
|
bodyClassName?: string;
|
|
68
|
+
/**
|
|
69
|
+
* Applies interactive chrome to a card containing its own semantic control.
|
|
70
|
+
* This alone does not make the card clickable; use `href` or `onClick` for a
|
|
71
|
+
* full-card action.
|
|
72
|
+
*/
|
|
68
73
|
interactive?: boolean;
|
|
74
|
+
/** Renders the full card as a semantic link. Do not combine with nested controls. */
|
|
75
|
+
href?: string;
|
|
76
|
+
/** Renders the full card as a semantic button. Do not combine with nested controls. */
|
|
77
|
+
onClick?: MouseEventHandler<HTMLElement>;
|
|
78
|
+
/** Link target, used when `href` is provided. */
|
|
79
|
+
target?: string;
|
|
80
|
+
/** Link relationship, used when `href` is provided. */
|
|
81
|
+
rel?: string;
|
|
82
|
+
/** Button behaviour, used when `onClick` is provided without `href`. */
|
|
83
|
+
type?: "button" | "submit" | "reset";
|
|
69
84
|
titleAs?: "h2" | "h3" | "h4";
|
|
70
85
|
}
|
|
71
|
-
declare const Card: react.ForwardRefExoticComponent<CardProps & react.RefAttributes<
|
|
86
|
+
declare const Card: react.ForwardRefExoticComponent<CardProps & react.RefAttributes<HTMLElement>>;
|
|
87
|
+
|
|
88
|
+
type KbdVariant = "shortcut" | "key" | "token";
|
|
89
|
+
type KbdPlatform = "text" | "mac" | "windows";
|
|
90
|
+
interface KbdProps extends HTMLAttributes<HTMLElement> {
|
|
91
|
+
variant?: KbdVariant;
|
|
92
|
+
keys?: readonly ReactNode[];
|
|
93
|
+
platform?: KbdPlatform;
|
|
94
|
+
separator?: ReactNode;
|
|
95
|
+
children?: ReactNode;
|
|
96
|
+
}
|
|
97
|
+
declare function Kbd({ variant, keys, platform, separator, children, className, "aria-label": ariaLabel, ...props }: KbdProps): react.JSX.Element;
|
|
72
98
|
|
|
73
99
|
type LoaderVariant = "spinner" | "dots" | "pulse";
|
|
74
100
|
type LoaderSize = "sm" | "md" | "lg";
|
|
@@ -283,6 +309,7 @@ interface ModalProps {
|
|
|
283
309
|
footer?: ReactNode;
|
|
284
310
|
size?: ModalSize;
|
|
285
311
|
className?: string;
|
|
312
|
+
bodyClassName?: string;
|
|
286
313
|
customLayout?: boolean;
|
|
287
314
|
showCloseButton?: boolean;
|
|
288
315
|
closeOnOutsideClick?: boolean;
|
|
@@ -294,7 +321,7 @@ interface ModalProps {
|
|
|
294
321
|
"aria-label"?: string;
|
|
295
322
|
"aria-labelledby"?: string;
|
|
296
323
|
}
|
|
297
|
-
declare function Modal({ open, onClose, title, description, children, footer, size, className, customLayout, showCloseButton, closeOnOutsideClick, closeOnEscape, dataTest, panelDataTest, zIndex, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, }: ModalProps): react.JSX.Element;
|
|
324
|
+
declare function Modal({ open, onClose, title, description, children, footer, size, className, bodyClassName, customLayout, showCloseButton, closeOnOutsideClick, closeOnEscape, dataTest, panelDataTest, zIndex, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, }: ModalProps): react.JSX.Element;
|
|
298
325
|
|
|
299
326
|
interface PanelProps extends Omit<ComponentPropsWithoutRef<"div">, "title"> {
|
|
300
327
|
title?: ReactNode;
|
|
@@ -335,10 +362,11 @@ interface TableProps<T> {
|
|
|
335
362
|
compact?: boolean;
|
|
336
363
|
ribbon?: boolean;
|
|
337
364
|
getRowStyle?: (row: T) => CSSProperties | undefined;
|
|
365
|
+
getRowKey?: (row: T, index: number) => Key;
|
|
338
366
|
className?: string;
|
|
339
367
|
caption?: string;
|
|
340
368
|
}
|
|
341
|
-
declare function Table<T>({ data, columns, zebra, compact, ribbon, getRowStyle, className, caption, }: TableProps<T>): react.JSX.Element;
|
|
369
|
+
declare function Table<T>({ data, columns, zebra, compact, ribbon, getRowStyle, getRowKey, className, caption, }: TableProps<T>): react.JSX.Element;
|
|
342
370
|
|
|
343
371
|
type StatTone = "default" | "brand" | "blue" | "purple" | "warning";
|
|
344
372
|
interface StatProps extends ComponentPropsWithoutRef<"article"> {
|
|
@@ -350,6 +378,19 @@ interface StatProps extends ComponentPropsWithoutRef<"article"> {
|
|
|
350
378
|
}
|
|
351
379
|
declare function Stat({ icon, label, value, footer, tone, className, ...props }: StatProps): react.JSX.Element;
|
|
352
380
|
|
|
381
|
+
/**
|
|
382
|
+
* Re-applies `html[data-theme]` after React commits. Hydration can clear attributes
|
|
383
|
+
* that were set only by `THEME_INIT_SCRIPT` — without this sync, `:root`-scoped
|
|
384
|
+
* light tokens effectively win visually.
|
|
385
|
+
*/
|
|
386
|
+
declare function ThemeDomSync(): null;
|
|
387
|
+
|
|
388
|
+
interface ThemeSwitcherProps {
|
|
389
|
+
className?: string;
|
|
390
|
+
}
|
|
391
|
+
/** Colour-only theme picker — persists to localStorage and sets html[data-theme]. */
|
|
392
|
+
declare function ThemeSwitcher({ className }: ThemeSwitcherProps): react.JSX.Element;
|
|
393
|
+
|
|
353
394
|
interface IconProps extends SVGAttributes<SVGSVGElement> {
|
|
354
395
|
/** Pixel size or CSS length; defaults to `1em`. */
|
|
355
396
|
size?: number | string;
|
|
@@ -674,7 +715,7 @@ interface CommandPaletteProps {
|
|
|
674
715
|
inputId?: string;
|
|
675
716
|
inputDataTest?: string;
|
|
676
717
|
}
|
|
677
|
-
declare function CommandPalette({ items, isOpen, onClose, placeholder, className, id, dataTest, inputId, inputDataTest, }: CommandPaletteProps): react.JSX.Element
|
|
718
|
+
declare function CommandPalette({ items, isOpen, onClose, placeholder, className, id, dataTest, inputId, inputDataTest, }: CommandPaletteProps): react.JSX.Element;
|
|
678
719
|
|
|
679
720
|
interface CalendarProps {
|
|
680
721
|
value?: Date;
|
|
@@ -695,16 +736,18 @@ interface TooltipProps {
|
|
|
695
736
|
side?: TooltipSide;
|
|
696
737
|
align?: TooltipAlign;
|
|
697
738
|
sideOffset?: number;
|
|
739
|
+
/** Minimum distance between the tooltip and the viewport edge. */
|
|
698
740
|
collisionPadding?: number;
|
|
699
741
|
className?: string;
|
|
700
742
|
open?: boolean;
|
|
701
743
|
defaultOpen?: boolean;
|
|
702
744
|
onOpenChange?: (open: boolean) => void;
|
|
703
745
|
delayDuration?: number;
|
|
746
|
+
/** Prevents the pointer from keeping the tooltip open over its content. */
|
|
704
747
|
disableHoverableContent?: boolean;
|
|
705
748
|
}
|
|
706
749
|
declare function TooltipProvider({ children, delayDuration, }: TooltipProviderProps): react.JSX.Element;
|
|
707
|
-
declare function Tooltip({ content, children, side, align, sideOffset, className, open, defaultOpen, onOpenChange, delayDuration, }: TooltipProps): react.JSX.Element;
|
|
750
|
+
declare function Tooltip({ content, children, side, align, sideOffset, collisionPadding, className, open, defaultOpen, onOpenChange, delayDuration, disableHoverableContent, }: TooltipProps): react.JSX.Element;
|
|
708
751
|
|
|
709
752
|
interface EmptyStateProps {
|
|
710
753
|
icon?: React.ReactNode;
|
|
@@ -771,37 +814,52 @@ interface TextBaseProps {
|
|
|
771
814
|
children?: ReactNode;
|
|
772
815
|
truncate?: boolean;
|
|
773
816
|
}
|
|
817
|
+
type TypographyProps<T extends ElementType> = TextBaseProps & Omit<ComponentPropsWithoutRef<T>, keyof TextBaseProps>;
|
|
818
|
+
type DisplayProps = TypographyProps<"h1">;
|
|
819
|
+
type SectionTitleProps = TypographyProps<"h2">;
|
|
820
|
+
type H1Props = TypographyProps<"h1">;
|
|
821
|
+
type H2Props = TypographyProps<"h2">;
|
|
822
|
+
type H3Props = TypographyProps<"h3">;
|
|
823
|
+
type H4Props = TypographyProps<"h4">;
|
|
824
|
+
type H5Props = TypographyProps<"h5">;
|
|
825
|
+
type PProps = TypographyProps<"p">;
|
|
826
|
+
type SmallProps = TypographyProps<"span">;
|
|
827
|
+
type CaptionProps = TypographyProps<"span">;
|
|
828
|
+
type OverlineProps = TypographyProps<"span">;
|
|
829
|
+
type LeadProps = TypographyProps<"p">;
|
|
830
|
+
type MonoProps = TypographyProps<"code">;
|
|
831
|
+
type LabelProps = TypographyProps<"label">;
|
|
774
832
|
/**
|
|
775
833
|
* Display — the marketing hero: fluid size, tight tracking, one per page.
|
|
776
834
|
* Product page titles use H1/`SuitePageHeader` instead.
|
|
777
835
|
*/
|
|
778
|
-
declare
|
|
836
|
+
declare const Display: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLHeadingElement>>;
|
|
779
837
|
/** Section title — fluid; pairs with Display on public pages. */
|
|
780
|
-
declare
|
|
838
|
+
declare const SectionTitle: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLHeadingElement>>;
|
|
781
839
|
/** H1 — page title */
|
|
782
|
-
declare
|
|
840
|
+
declare const H1: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLHeadingElement>>;
|
|
783
841
|
/** H2 — section title */
|
|
784
|
-
declare
|
|
842
|
+
declare const H2: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLHeadingElement>>;
|
|
785
843
|
/** H3 — subsection title */
|
|
786
|
-
declare
|
|
844
|
+
declare const H3: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLHeadingElement>>;
|
|
787
845
|
/** H4 — card / panel title */
|
|
788
|
-
declare
|
|
846
|
+
declare const H4: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLHeadingElement>>;
|
|
789
847
|
/** H5 — small heading */
|
|
790
|
-
declare
|
|
848
|
+
declare const H5: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLHeadingElement>>;
|
|
791
849
|
/** Body — default paragraph text */
|
|
792
|
-
declare
|
|
850
|
+
declare const P: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLParagraphElement>>;
|
|
793
851
|
/** Small body text */
|
|
794
|
-
declare
|
|
852
|
+
declare const Small: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLSpanElement>>;
|
|
795
853
|
/** Extra small text — captions, meta */
|
|
796
|
-
declare
|
|
854
|
+
declare const Caption: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLSpanElement>>;
|
|
797
855
|
/** Overline — tiny eyebrow text */
|
|
798
|
-
declare
|
|
856
|
+
declare const Overline: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLSpanElement>>;
|
|
799
857
|
/** Lead — intro paragraph under a Display/SectionTitle; measure-capped for readability */
|
|
800
|
-
declare
|
|
858
|
+
declare const Lead: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLParagraphElement>>;
|
|
801
859
|
/** Mono — code, data, technical text */
|
|
802
|
-
declare
|
|
860
|
+
declare const Mono: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLElement>, HTMLElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLElement>>;
|
|
803
861
|
/** Label — form labels, tags */
|
|
804
|
-
declare
|
|
862
|
+
declare const Label: react.ForwardRefExoticComponent<TextBaseProps & Omit<Omit<react.DetailedHTMLProps<react.LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "ref">, keyof TextBaseProps> & react.RefAttributes<HTMLLabelElement>>;
|
|
805
863
|
|
|
806
864
|
type AvatarSize = "xs" | "sm" | "md" | "lg" | "xl";
|
|
807
865
|
type AvatarStatus = "online" | "offline" | "away" | "busy";
|
|
@@ -840,7 +898,7 @@ interface ProgressProps extends ComponentPropsWithoutRef<"div"> {
|
|
|
840
898
|
/** Size variant */
|
|
841
899
|
size?: "sm" | "md" | "lg";
|
|
842
900
|
}
|
|
843
|
-
declare function Progress({ value, max, color, label, showPercentage, size, className, ...props }: ProgressProps): react.JSX.Element;
|
|
901
|
+
declare function Progress({ value, max, color, label, showPercentage, size, className, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, ...props }: ProgressProps): react.JSX.Element;
|
|
844
902
|
|
|
845
903
|
interface LinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
|
|
846
904
|
children: ReactNode;
|
|
@@ -873,4 +931,4 @@ interface ChipProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
|
873
931
|
}
|
|
874
932
|
declare const Chip: react.ForwardRefExoticComponent<ChipProps & react.RefAttributes<HTMLButtonElement>>;
|
|
875
933
|
|
|
876
|
-
export { type
|
|
934
|
+
export { type DropdownItemProps as $, Accordion as A, Badge as B, type ButtonVariant as C, CANONICAL_ICONS as D, Calendar as E, type CalendarProps as F, type CanonicalIconName as G, Caption as H, type CaptionProps as I, Card as J, type CardProps as K, type CardVariant as L, Checkbox as M, type CheckboxProps as N, Chip as O, type ChipProps as P, type CommandItem as Q, CommandPalette as R, type CommandPaletteProps as S, Display as T, type DisplayProps as U, Dot as V, type DotProps as W, type DropdownAlign as X, DropdownButton as Y, type DropdownButtonProps as Z, DropdownItem as _, type AccordionItem as a, IconExperimentSplit as a$, DropdownMenu as a0, type DropdownMenuProps as a1, DropdownRadioGroup as a2, type DropdownRadioGroupProps as a3, DropdownRadioItem as a4, type DropdownRadioItemProps as a5, type DropdownSide as a6, EmptyState as a7, type EmptyStateProps as a8, FileUpload as a9, IconArrowUp as aA, IconBase as aB, IconBell as aC, IconBellOff as aD, IconBolt as aE, IconBox as aF, IconByName as aG, IconCancel as aH, IconCheck as aI, IconCheckCircle as aJ, IconChevronDown as aK, IconChevronLeft as aL, IconChevronRight as aM, IconClipboardEdit as aN, IconClose as aO, IconCodePreview as aP, IconCohort as aQ, IconCommandCursor as aR, IconCopy as aS, IconCumulativeChart as aT, IconDataReel as aU, IconDatabase as aV, IconDownload as aW, IconEdit as aX, IconErrorOutline as aY, IconEventStream as aZ, IconExclamation as a_, type FileUploadProps as aa, FilterBar as ab, type FilterBarProps as ac, type FilterChip as ad, FilterChips as ae, type FilterChipsProps as af, FilterMenu as ag, type FilterMenuOption as ah, type FilterMenuProps as ai, FormField as aj, type FormFieldControlProps as ak, type FormFieldProps as al, H1 as am, type H1Props as an, H2 as ao, type H2Props as ap, H3 as aq, type H3Props as ar, H4 as as, type H4Props as at, H5 as au, type H5Props as av, IconActivity as aw, type IconAliasName as ax, IconAreaChart as ay, IconArrowDown as az, type AccordionProps as b, Loader as b$, IconFeatureGate as b0, IconFlag as b1, IconFlare as b2, IconFlask as b3, IconGift as b4, IconGridView as b5, IconHandClick as b6, IconHome as b7, IconInfo as b8, IconInsightBoard as b9, IconSubArrowRight as bA, IconSun as bB, IconSurveyCard as bC, IconSurveys as bD, IconSync as bE, IconTableChart as bF, IconTerminal as bG, IconToggle as bH, IconTrash as bI, IconTuning as bJ, IconUpload as bK, IconVolume as bL, IconVolumeOff as bM, Input as bN, type InputProps as bO, type InputSize as bP, type InputVariant as bQ, Kbd as bR, type KbdPlatform as bS, type KbdProps as bT, type KbdVariant as bU, Label as bV, type LabelProps as bW, Lead as bX, type LeadProps as bY, Link as bZ, type LinkProps as b_, IconLayers as ba, IconListView as bb, IconLogout as bc, IconMail as bd, IconMoon as be, type IconName as bf, IconOldWindow as bg, IconPanelRight as bh, IconPerson as bi, IconPlayCircle as bj, IconPlus as bk, IconPremium as bl, type IconProps as bm, IconQueryEditor as bn, IconQueryStack as bo, IconRadar as bp, IconRecording as bq, IconReplayFrame as br, IconRobot as bs, IconRocket as bt, IconSave as bu, IconSearch as bv, IconSelectEvents as bw, IconShoppingCart as bx, IconSpinner as by, IconStar as bz, Alert as c, ThemeSwitcher as c$, type LoaderProps as c0, type LoaderSize as c1, type LoaderVariant as c2, LoadingState as c3, type LoadingStateProps as c4, Modal as c5, type ModalProps as c6, type ModalSize as c7, Mono as c8, type MonoProps as c9, SettingsLayout as cA, type SettingsLayoutProps as cB, SettingsNav as cC, type SettingsNavGroup as cD, type SettingsNavItem as cE, type SettingsNavProps as cF, Skeleton as cG, type SkeletonProps as cH, type SkeletonShape as cI, Small as cJ, type SmallProps as cK, SortMenu as cL, type SortMenuProps as cM, Spinner as cN, type SpinnerProps as cO, Stat as cP, type StatProps as cQ, type StatTone as cR, Table as cS, type TableColumn as cT, type TableProps as cU, type TextBaseProps as cV, type TextTone as cW, type TextWeight as cX, Textarea as cY, type TextareaProps as cZ, ThemeDomSync as c_, OLD_UI_ICONS as ca, Overline as cb, type OverlineProps as cc, P as cd, PH_ICONS as ce, PH_ICON_ALIASES as cf, type PProps as cg, Panel as ch, type PanelProps as ci, Progress as cj, type ProgressProps as ck, Radio as cl, type RadioProps as cm, Range as cn, type RangeProps as co, SearchGroup as cp, type SearchGroupProps as cq, SearchInput as cr, type SearchInputProps as cs, SectionTitle as ct, type SectionTitleProps as cu, SegmentedControl as cv, type SegmentedControlOption as cw, type SegmentedControlProps as cx, Select as cy, type SelectProps as cz, type AlertProps as d, type ThemeSwitcherProps as d0, Toggle as d1, type ToggleProps as d2, Tooltip as d3, type TooltipAlign as d4, type TooltipProps as d5, TooltipProvider as d6, type TooltipProviderProps as d7, type TooltipSide as d8, type AlertStatus as e, AuthCard as f, type AuthCardProps as g, AuthDivider as h, type AuthDividerProps as i, AuthLayout as j, type AuthLayoutProps as k, Avatar as l, AvatarGroup as m, type AvatarGroupProps as n, type AvatarProps as o, type AvatarSize as p, type AvatarStatus as q, type BadgeProps as r, type BadgeSize as s, type BadgeVariant as t, Button as u, ButtonChrome as v, type ButtonChromeProps as w, type ButtonProps as x, type ButtonShape as y, type ButtonSize as z };
|
|
@@ -1,15 +1,17 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import {
|
|
3
3
|
useSuiteTheme
|
|
4
|
-
} from "./chunk-
|
|
4
|
+
} from "./chunk-APKRZQRO.mjs";
|
|
5
|
+
import "./chunk-IULORI3A.mjs";
|
|
5
6
|
import "./chunk-FWCSY2DS.mjs";
|
|
6
7
|
|
|
7
8
|
// src/suite/components/ai-message-blocknote.tsx
|
|
8
|
-
import { useEffect } from "react";
|
|
9
|
+
import { useEffect, useLayoutEffect } from "react";
|
|
9
10
|
import { BlockNoteSchema, defaultBlockSpecs } from "@blocknote/core";
|
|
10
11
|
import { BlockNoteViewRaw, useCreateBlockNote } from "@blocknote/react";
|
|
11
12
|
import "@blocknote/react/style.css";
|
|
12
13
|
import { jsx } from "react/jsx-runtime";
|
|
14
|
+
var useIsomorphicLayoutEffect = typeof window !== "undefined" ? useLayoutEffect : useEffect;
|
|
13
15
|
var assistantSchema = BlockNoteSchema.create({
|
|
14
16
|
blockSpecs: {
|
|
15
17
|
paragraph: defaultBlockSpecs.paragraph,
|
|
@@ -28,7 +30,7 @@ function SuiteAiBlockNoteMessage({
|
|
|
28
30
|
}) {
|
|
29
31
|
const { resolvedTheme } = useSuiteTheme();
|
|
30
32
|
const editor = useCreateBlockNote({ schema: assistantSchema });
|
|
31
|
-
|
|
33
|
+
useIsomorphicLayoutEffect(() => {
|
|
32
34
|
try {
|
|
33
35
|
const blocks = editor.tryParseMarkdownToBlocks(markdown);
|
|
34
36
|
editor.replaceBlocks(
|
|
@@ -41,6 +43,10 @@ function SuiteAiBlockNoteMessage({
|
|
|
41
43
|
]);
|
|
42
44
|
}
|
|
43
45
|
}, [editor, markdown]);
|
|
46
|
+
useEffect(() => {
|
|
47
|
+
const el = editor.domElement;
|
|
48
|
+
el == null ? void 0 : el.setAttribute("aria-label", "Assistant message");
|
|
49
|
+
}, [editor]);
|
|
44
50
|
return /* @__PURE__ */ jsx(
|
|
45
51
|
BlockNoteViewRaw,
|
|
46
52
|
{
|