@salemcobalt/ui 0.2.0-rc.1 → 0.2.0-rc.11

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/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as react from 'react';
2
- import { ComponentPropsWithRef, ReactNode, ReactElement } from 'react';
2
+ import { ComponentPropsWithRef, ReactNode, ReactElement, CSSProperties, MouseEvent, MouseEventHandler } from 'react';
3
3
  import { useRender } from '@base-ui/react/use-render';
4
4
  import { Dialog as Dialog$1 } from '@base-ui/react/dialog';
5
5
  import * as _base_ui_react from '@base-ui/react';
@@ -8,6 +8,7 @@ import { Checkbox as Checkbox$1 } from '@base-ui/react/checkbox';
8
8
  import { Switch as Switch$1 } from '@base-ui/react/switch';
9
9
  import { Tabs as Tabs$1 } from '@base-ui/react/tabs';
10
10
  import { Toolbar as Toolbar$1 } from '@base-ui/react/toolbar';
11
+ import { Popover as Popover$1 } from '@base-ui/react/popover';
11
12
 
12
13
  type ButtonVariant = 'primary' | 'secondary' | 'ghost' | 'danger';
13
14
  type ButtonSize = 'sm' | 'md' | 'lg';
@@ -24,9 +25,13 @@ interface ButtonProps extends ComponentPropsWithRef<'button'> {
24
25
  loading?: boolean | undefined;
25
26
  /** Stretches to the container. */
26
27
  fullWidth?: boolean | undefined;
28
+ /** A keyboard hint after the label: `shortcut={<Kbd>N</Kbd>}`. Hidden from assistive tech; announce the key with `aria-keyshortcuts="n"`. */
29
+ shortcut?: ReactNode | undefined;
30
+ /** Shows only `iconStart` (or `iconEnd`) in a square button; the label stays the accessible name and the shortcut hides. Toggles without remounting, e.g. when a header runs out of room. Pair with a Tooltip carrying the label. */
31
+ iconOnly?: boolean | undefined;
27
32
  }
28
33
  /** The one way to trigger an action. Renders a native `<button>`; `type` defaults to `button`. */
29
- declare function Button({ variant, size, iconStart, iconEnd, loading, fullWidth, type, className, children, onClick, ...rest }: ButtonProps): react.JSX.Element;
34
+ declare function Button({ variant, size, iconStart, iconEnd, loading, fullWidth, shortcut, iconOnly, type, className, children, onClick, ...rest }: ButtonProps): react.JSX.Element;
30
35
 
31
36
  type BadgeTone = 'neutral' | 'accent' | 'success' | 'warning' | 'danger' | 'info';
32
37
  type BadgeVariant = 'soft' | 'solid' | 'outline';
@@ -46,7 +51,7 @@ declare function Badge({ tone, variant, size, dot, className, children, ...rest
46
51
 
47
52
  type CardVariant = 'outlined' | 'elevated' | 'filled';
48
53
  type CardPadding = 'none' | 'sm' | 'md' | 'lg';
49
- type CardElement = 'div' | 'article' | 'section' | 'li' | 'a' | 'button';
54
+ type CardElement = 'div' | 'article' | 'section' | 'nav' | 'li' | 'a' | 'button';
50
55
  interface CardProps extends useRender.ComponentProps<'div'> {
51
56
  /** `outlined` hairline (default), `elevated` floats, `filled` is an inset region. */
52
57
  variant?: CardVariant | undefined;
@@ -56,7 +61,7 @@ interface CardProps extends useRender.ComponentProps<'div'> {
56
61
  interactive?: boolean | undefined;
57
62
  /** Accent border with a 1px inset, for the active row or chosen option. */
58
63
  selected?: boolean | undefined;
59
- /** Element to render when `render` is not given. */
64
+ /** Element to render when `render` is not given. Use `nav` (with an `aria-label`) for a carded navigation landmark. */
60
65
  as?: CardElement | undefined;
61
66
  }
62
67
  /** A bordered surface that groups related content. Compose the inside with Stack and Inline. */
@@ -694,6 +699,7 @@ declare const Kbd: typeof KbdBase & {
694
699
  };
695
700
 
696
701
  type DialogSize = 'sm' | 'md' | 'lg';
702
+ type DialogVariant = 'dialog' | 'sheet';
697
703
  interface DialogRootProps {
698
704
  /** Controlled open state. */
699
705
  open?: boolean | undefined;
@@ -706,27 +712,39 @@ interface DialogRootProps {
706
712
  children?: ReactNode | undefined;
707
713
  }
708
714
  /** Owns the open state. Wrap a `Dialog.Trigger` and a `Dialog.Content`. */
709
- declare function Root$3({ dismissible, onOpenChange, open, defaultOpen, children }: DialogRootProps): react.JSX.Element;
715
+ declare function Root$5({ dismissible, onOpenChange, open, defaultOpen, children }: DialogRootProps): react.JSX.Element;
710
716
  interface DialogContentProps extends Omit<Dialog$1.Popup.Props, 'className'> {
711
- /** `sm` 400px for yes/no, `md` 560px (default) for a short form, `lg` 720px rarely. */
717
+ /**
718
+ * Maximum width: `sm` 400px for yes/no, `md` 560px (default) for a short form, `lg` 720px rarely.
719
+ * Every size clamps to the viewport minus a 16px gutter, so a 390px phone gets a 358px dialog.
720
+ */
712
721
  size?: DialogSize | undefined;
722
+ /**
723
+ * `dialog` (default) centres the popup. `sheet` is the same on wide viewports but below 640px it
724
+ * becomes a bottom sheet: full width, rounded top, title and actions pinned while `Dialog.Body`
725
+ * scrolls, padding that clears the home indicator. Use it for forms and pickers opened from a list.
726
+ */
727
+ variant?: DialogVariant | undefined;
713
728
  className?: string | undefined;
714
729
  }
715
- /** Portal, backdrop and the popup. Focus moves inside on open and returns to the trigger on close. */
716
- declare function Content$1({ size, className, children, ...rest }: DialogContentProps): react.JSX.Element;
730
+ /**
731
+ * Portal, backdrop and the popup. Focus moves inside on open and returns to the trigger on close.
732
+ * Menus, selects and tooltips opened from inside render above it (`--sc-z-dropdown` > `--sc-z-dialog`).
733
+ */
734
+ declare function Content$2({ size, variant, className, children, ...rest }: DialogContentProps): react.JSX.Element;
717
735
  interface DialogTitleProps extends Omit<Dialog$1.Title.Props, 'className'> {
718
736
  className?: string | undefined;
719
737
  }
720
738
  /** Required. Labels the dialog; a question or a statement. Renders an `<h2>`. */
721
- declare function Title({ className, ...rest }: DialogTitleProps): react.JSX.Element;
739
+ declare function Title$1({ className, ...rest }: DialogTitleProps): react.JSX.Element;
722
740
  interface DialogDescriptionProps extends Omit<Dialog$1.Description.Props, 'className'> {
723
741
  className?: string | undefined;
724
742
  }
725
743
  /** Optional, muted. Says what will happen. */
726
- declare function Description({ className, ...rest }: DialogDescriptionProps): react.JSX.Element;
744
+ declare function Description$1({ className, ...rest }: DialogDescriptionProps): react.JSX.Element;
727
745
  type DialogBodyProps = ComponentPropsWithRef<'div'>;
728
- /** Free content between the description and the actions. */
729
- declare function Body({ className, ...rest }: DialogBodyProps): react.JSX.Element;
746
+ /** Free content between the description and the actions. In a `sheet` it is the part that scrolls. */
747
+ declare function Body$1({ className, ...rest }: DialogBodyProps): react.JSX.Element;
730
748
  type DialogActionsProps = Omit<InlineProps, 'justify'>;
731
749
  /** Right-aligned row of Buttons. Put the confirming action last. */
732
750
  declare function Actions({ className, ...rest }: DialogActionsProps): react.JSX.Element;
@@ -734,17 +752,17 @@ interface DialogCloseProps extends Omit<Dialog$1.Close.Props, 'className'> {
734
752
  className?: string | undefined;
735
753
  }
736
754
  /** With no children or `render`, the × in the corner. Otherwise wraps any Button: `<Dialog.Close render={<Button variant="secondary" />}>Cancel</Dialog.Close>`. */
737
- declare function Close({ className, children, render, ...rest }: DialogCloseProps): react.JSX.Element;
755
+ declare function Close$1({ className, children, render, ...rest }: DialogCloseProps): react.JSX.Element;
738
756
  /** A modal that interrupts for a decision or a short form. Built on Base UI's Dialog. */
739
757
  declare const Dialog: {
740
- Root: typeof Root$3;
758
+ Root: typeof Root$5;
741
759
  Trigger: Dialog$1.Trigger;
742
- Content: typeof Content$1;
743
- Title: typeof Title;
744
- Description: typeof Description;
745
- Body: typeof Body;
760
+ Content: typeof Content$2;
761
+ Title: typeof Title$1;
762
+ Description: typeof Description$1;
763
+ Body: typeof Body$1;
746
764
  Actions: typeof Actions;
747
- Close: typeof Close;
765
+ Close: typeof Close$1;
748
766
  };
749
767
 
750
768
  type IconSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'em';
@@ -766,10 +784,14 @@ declare function Icon({ size, title, className, children, ...rest }: IconProps):
766
784
 
767
785
  /** `archive` */
768
786
  declare function ArchiveIcon(props: IconGlyphProps): react.JSX.Element;
787
+ /** `arrow-down` */
788
+ declare function ArrowDownIcon(props: IconGlyphProps): react.JSX.Element;
769
789
  /** `arrow-left` */
770
790
  declare function ArrowLeftIcon(props: IconGlyphProps): react.JSX.Element;
771
791
  /** `arrow-right` */
772
792
  declare function ArrowRightIcon(props: IconGlyphProps): react.JSX.Element;
793
+ /** `arrow-up` */
794
+ declare function ArrowUpIcon(props: IconGlyphProps): react.JSX.Element;
773
795
  /** `bell` */
774
796
  declare function BellIcon(props: IconGlyphProps): react.JSX.Element;
775
797
  /** `briefcase` */
@@ -860,7 +882,7 @@ declare function WarningIcon(props: IconGlyphProps): react.JSX.Element;
860
882
  declare function XIcon(props: IconGlyphProps): react.JSX.Element;
861
883
 
862
884
  /** Every icon shipped by this package, as `<Name>Icon` components. */
863
- declare const iconNames: readonly ["archive", "arrow-left", "arrow-right", "bell", "briefcase", "calendar", "check", "chevron-down", "chevron-left", "chevron-right", "chevron-up", "circle-check", "circle-x", "clock", "copy", "document", "download", "edit", "external-link", "eye", "filter", "flag", "inbox", "info", "link", "mail", "map-pin", "menu", "minus", "moon", "more-horizontal", "more-vertical", "pause", "play", "plus", "refresh", "search", "settings", "star", "sun", "thumbs-down", "thumbs-up", "trash", "undo", "user", "warning", "x"];
885
+ declare const iconNames: readonly ["archive", "arrow-down", "arrow-left", "arrow-right", "arrow-up", "bell", "briefcase", "calendar", "check", "chevron-down", "chevron-left", "chevron-right", "chevron-up", "circle-check", "circle-x", "clock", "copy", "document", "download", "edit", "external-link", "eye", "filter", "flag", "inbox", "info", "link", "mail", "map-pin", "menu", "minus", "moon", "more-horizontal", "more-vertical", "pause", "play", "plus", "refresh", "search", "settings", "star", "sun", "thumbs-down", "thumbs-up", "trash", "undo", "user", "warning", "x"];
864
886
  type IconName = (typeof iconNames)[number];
865
887
 
866
888
  type TooltipSide = 'top' | 'bottom' | 'left' | 'right';
@@ -897,7 +919,8 @@ declare const Tooltip: typeof TooltipBase & {
897
919
  Provider: react.FC<_base_ui_react.TooltipProviderProps>;
898
920
  };
899
921
 
900
- interface IconButtonProps extends Omit<ComponentPropsWithRef<'button'>, 'children' | 'aria-label'> {
922
+ type IconButtonDotTone = 'neutral' | 'accent' | 'success' | 'warning' | 'danger' | 'info';
923
+ interface IconButtonProps extends Omit<useRender.ComponentProps<'button'>, 'children' | 'aria-label'> {
901
924
  /** Required. The accessible name, and the tooltip text when `tooltip` is `true`. */
902
925
  label: string;
903
926
  /** The icon, usually a shipped `<Name>Icon`. It is decorative; `label` names the button. Optional only so a popup trigger can supply it through `render`. */
@@ -914,9 +937,15 @@ interface IconButtonProps extends Omit<ComponentPropsWithRef<'button'>, 'childre
914
937
  round?: boolean | undefined;
915
938
  /** Shows a spinner, sets `aria-busy` and ignores clicks. */
916
939
  loading?: boolean | undefined;
940
+ /** A status dot in the top-left corner, ringed in `--sc-icon-button-dot-ring` (default `surface-default`). Decorative: put the status in `label` too ("Sweeps: paused"). */
941
+ dot?: IconButtonDotTone | undefined;
917
942
  }
918
- /** A square Button for one icon. Always named by `label`; use `tooltip` to show that name on hover. */
919
- declare function IconButton({ label, children, variant, size, tooltip, tooltipSide, round, loading, type, className, onClick, ...rest }: IconButtonProps): react.JSX.Element;
943
+ /**
944
+ * A square Button for one icon. Always named by `label`; use `tooltip` to show that name on hover.
945
+ * Renders a `<button>` unless `render` gives another element: `render={<a href="/settings" />}` or a
946
+ * Next.js `<Link href="/settings" />` makes it a link with the same look and name.
947
+ */
948
+ declare function IconButton({ label, children, variant, size, tooltip, tooltipSide, round, loading, dot, type, className, onClick, render, ref, ...rest }: IconButtonProps): react.JSX.Element;
920
949
 
921
950
  type MenuSide = 'top' | 'bottom' | 'left' | 'right';
922
951
  type MenuAlign = 'start' | 'center' | 'end';
@@ -935,7 +964,7 @@ interface MenuRootProps {
935
964
  children?: ReactNode | undefined;
936
965
  }
937
966
  /** Owns the open state. Wrap a `Menu.Trigger` and a `Menu.Content`. */
938
- declare function Root$2({ open, defaultOpen, onOpenChange, disabled, modal, children }: MenuRootProps): react.JSX.Element;
967
+ declare function Root$4({ open, defaultOpen, onOpenChange, disabled, modal, children }: MenuRootProps): react.JSX.Element;
939
968
  interface MenuTriggerProps extends Omit<Menu$1.Trigger.Props, 'className'> {
940
969
  className?: string | undefined;
941
970
  }
@@ -943,7 +972,7 @@ interface MenuTriggerProps extends Omit<Menu$1.Trigger.Props, 'className'> {
943
972
  * Opens the menu. With no `render` it is a secondary Button with a chevron; pass any Button or
944
973
  * IconButton through `render`: `<Menu.Trigger render={<IconButton label="More" />}><MoreHorizontalIcon /></Menu.Trigger>`.
945
974
  */
946
- declare function Trigger({ render, className, children, ...rest }: MenuTriggerProps): react.JSX.Element;
975
+ declare function Trigger$1({ render, className, children, ...rest }: MenuTriggerProps): react.JSX.Element;
947
976
  interface MenuContentProps extends Omit<Menu$1.Popup.Props, 'className'> {
948
977
  /** Side of the trigger the menu opens on; flips when there is no room. Default `bottom`. */
949
978
  side?: MenuSide | undefined;
@@ -954,7 +983,7 @@ interface MenuContentProps extends Omit<Menu$1.Popup.Props, 'className'> {
954
983
  className?: string | undefined;
955
984
  }
956
985
  /** Portal, positioner and the popup. Items go inside. */
957
- declare function Content({ side, align, sideOffset, className, children, ...rest }: MenuContentProps): react.JSX.Element;
986
+ declare function Content$1({ side, align, sideOffset, className, children, ...rest }: MenuContentProps): react.JSX.Element;
958
987
  interface ItemSlots {
959
988
  /** A 16px icon before the label. */
960
989
  icon?: ReactNode | undefined;
@@ -1017,9 +1046,9 @@ interface MenuSeparatorProps extends Omit<Menu$1.Separator.Props, 'className'> {
1017
1046
  declare function Separator$1({ className, ...rest }: MenuSeparatorProps): react.JSX.Element;
1018
1047
  /** A dropdown of actions on a trigger, with full keyboard support. Built on Base UI's Menu. */
1019
1048
  declare const Menu: {
1020
- Root: typeof Root$2;
1021
- Trigger: typeof Trigger;
1022
- Content: typeof Content;
1049
+ Root: typeof Root$4;
1050
+ Trigger: typeof Trigger$1;
1051
+ Content: typeof Content$1;
1023
1052
  Item: typeof Item;
1024
1053
  LinkItem: typeof LinkItem;
1025
1054
  CheckboxItem: typeof CheckboxItem;
@@ -1061,19 +1090,30 @@ interface InputProps extends Omit<ComponentPropsWithRef<'input'>, 'size' | 'name
1061
1090
  /** Called with the string value on every change, beside the native `onChange`. */
1062
1091
  onValueChange?: ((value: string) => void) | undefined;
1063
1092
  }
1064
- /** A labelled single-line text field. Renders a native `<input>` inside Base UI's Field. */
1093
+ /**
1094
+ * A labelled single-line text field. Renders a native `<input>` inside Base UI's Field, so every native
1095
+ * attribute passes through: `type="date" | "time" | "number" | "url" | …` keep the same height and
1096
+ * `iconStart` slot; `list="id"` with a `<datalist>` beside it gives native suggestions. Date and time
1097
+ * fields show the browser's picker at the end edge, so leave `iconEnd` off those.
1098
+ */
1065
1099
  declare function Input({ label, hideLabel, description, error, invalid, required, disabled, name, size, className, iconStart, iconEnd, onValueChange, ...rest }: InputProps): react.JSX.Element;
1066
1100
 
1101
+ type TextareaVariant = 'default' | 'code';
1067
1102
  interface TextareaProps extends Omit<ComponentPropsWithRef<'textarea'>, 'name' | 'disabled' | 'required' | 'className'>, Omit<FieldProps, 'size'> {
1068
1103
  /** Visible lines. Default 3. */
1069
1104
  rows?: number | undefined;
1070
1105
  /** `vertical` (default) lets the user drag it taller; `none` fixes the height. */
1071
1106
  resize?: 'vertical' | 'none' | undefined;
1107
+ /**
1108
+ * `code` for Markdown, JSON and other source: monospace, `tab-size: 2`, spellcheck, autocorrect and
1109
+ * autocapitalize off. Add the native `wrap="off"` to keep long lines on one line and scroll sideways.
1110
+ */
1111
+ variant?: TextareaVariant | undefined;
1072
1112
  /** Called with the string value on every change, beside the native `onChange`. */
1073
1113
  onValueChange?: ((value: string) => void) | undefined;
1074
1114
  }
1075
1115
  /** A labelled multi-line text field. Renders a native `<textarea>` inside Base UI's Field. */
1076
- declare function Textarea({ label, hideLabel, description, error, invalid, required, disabled, name, className, rows, resize, onValueChange, ...rest }: TextareaProps): react.JSX.Element;
1116
+ declare function Textarea({ label, hideLabel, description, error, invalid, required, disabled, name, className, rows, resize, variant, onValueChange, spellCheck, autoCorrect, autoCapitalize, ...rest }: TextareaProps): react.JSX.Element;
1077
1117
 
1078
1118
  interface SelectOption<Value extends string = string> {
1079
1119
  value: Value;
@@ -1088,14 +1128,21 @@ interface SelectGroup<Value extends string = string> {
1088
1128
  interface SelectProps<Value extends string = string> extends FieldProps {
1089
1129
  /** Flat options, or groups of options with a heading. */
1090
1130
  options: Array<SelectOption<Value> | SelectGroup<Value>>;
1091
- /** Controlled value; `null` for none. */
1131
+ /** Controlled value; `null` for none, which shows `placeholder`. No sentinel option needed. */
1092
1132
  value?: Value | null | undefined;
1093
- /** Initial value when uncontrolled. */
1133
+ /** Initial value when uncontrolled; `null` (default) for none. */
1094
1134
  defaultValue?: Value | null | undefined;
1095
- /** Called with the chosen value. */
1135
+ /** Called with the chosen value, or `null` when the field is cleared. */
1096
1136
  onValueChange?: ((value: Value | null) => void) | undefined;
1097
1137
  /** Shown in the trigger while nothing is chosen. */
1098
1138
  placeholder?: ReactNode | undefined;
1139
+ /**
1140
+ * Shows an × beside the chevron while a value is chosen; pressing it, or Backspace/Delete on the
1141
+ * focused trigger, sets the value to `null` and calls `onValueChange(null)`.
1142
+ */
1143
+ clearable?: boolean | undefined;
1144
+ /** Accessible name of the clear button. Default "Clear". */
1145
+ clearLabel?: string | undefined;
1099
1146
  /** Prevents choosing a different option. */
1100
1147
  readOnly?: boolean | undefined;
1101
1148
  /** Stretches the trigger to the container. */
@@ -1106,7 +1153,7 @@ interface SelectProps<Value extends string = string> extends FieldProps {
1106
1153
  * A labelled single-choice dropdown. Built on Base UI's Select so the list is styled and keyboard
1107
1154
  * complete; submits like a native select through `name`.
1108
1155
  */
1109
- declare function Select<Value extends string = string>({ label, hideLabel, description, error, invalid, required, disabled, name, size, className, options, value, defaultValue, onValueChange, placeholder, readOnly, fullWidth, id, }: SelectProps<Value>): react.JSX.Element;
1156
+ declare function Select<Value extends string = string>({ label, hideLabel, description, error, invalid, required, disabled, name, size, className, options, value, defaultValue, onValueChange, placeholder, clearable, clearLabel, readOnly, fullWidth, id, }: SelectProps<Value>): react.JSX.Element;
1110
1157
 
1111
1158
  interface CheckboxProps extends Omit<Checkbox$1.Root.Props, 'className' | 'onCheckedChange' | 'render' | 'children'> {
1112
1159
  /** Required. The visible label; clicking it toggles the box. */
@@ -1144,16 +1191,19 @@ interface TabsRootProps extends Omit<Tabs$1.Root.Props, 'className' | 'value' |
1144
1191
  className?: string | undefined;
1145
1192
  }
1146
1193
  /** Owns the active tab. Wrap a `Tabs.List` and one `Tabs.Panel` per tab. */
1147
- declare function Root$1({ className, onValueChange, ...rest }: TabsRootProps): react.JSX.Element;
1194
+ declare function Root$3({ className, onValueChange, ...rest }: TabsRootProps): react.JSX.Element;
1195
+ type TabsListVariant = 'line' | 'segmented';
1148
1196
  interface TabsListProps extends Omit<Tabs$1.List.Props, 'className'> {
1149
1197
  /** Names the set of tabs for assistive tech: "Inbox sections". */
1150
1198
  'aria-label': string;
1151
1199
  /** Tabs share the width equally instead of sizing to their labels. */
1152
1200
  fill?: boolean | undefined;
1201
+ /** `line` (default): an accent underline on the active tab. `segmented`: a quiet segmented control, a sunken track with the active tab raised and no accent colour. */
1202
+ variant?: TabsListVariant | undefined;
1153
1203
  className?: string | undefined;
1154
1204
  }
1155
1205
  /** The row of tabs with the sliding indicator. Arrow keys move between tabs; Enter or Space activates. */
1156
- declare function List({ fill, className, children, ...rest }: TabsListProps): react.JSX.Element;
1206
+ declare function List({ fill, variant, className, children, ...rest }: TabsListProps): react.JSX.Element;
1157
1207
  interface TabsTabProps extends Omit<Tabs$1.Tab.Props, 'className' | 'value'> {
1158
1208
  value: string;
1159
1209
  /** A 16px icon before the label. */
@@ -1172,7 +1222,7 @@ interface TabsPanelProps extends Omit<Tabs$1.Panel.Props, 'className' | 'value'>
1172
1222
  declare function Panel({ className, ...rest }: TabsPanelProps): react.JSX.Element;
1173
1223
  /** Switches between sections of one view. Built on Base UI's Tabs. */
1174
1224
  declare const Tabs: {
1175
- Root: typeof Root$1;
1225
+ Root: typeof Root$3;
1176
1226
  List: typeof List;
1177
1227
  Tab: typeof Tab;
1178
1228
  Panel: typeof Panel;
@@ -1191,7 +1241,7 @@ interface ToolbarRootProps extends Omit<Toolbar$1.Root.Props, 'className'> {
1191
1241
  * A row of controls with one tab stop: Tab enters, arrow keys move between items, Tab leaves. Put every
1192
1242
  * control through `Toolbar.Button` (`render={<IconButton … />}`) so it joins the roving focus.
1193
1243
  */
1194
- declare function Root({ wrap, gap, className, ...rest }: ToolbarRootProps): react.JSX.Element;
1244
+ declare function Root$2({ wrap, gap, className, ...rest }: ToolbarRootProps): react.JSX.Element;
1195
1245
  interface ToolbarGroupProps extends Omit<Toolbar$1.Group.Props, 'className'> {
1196
1246
  /** Names the group: "Playback". */
1197
1247
  'aria-label'?: string | undefined;
@@ -1209,6 +1259,9 @@ declare function Separator({ className, ...rest }: ToolbarSeparatorProps): react
1209
1259
  interface ToolbarButtonProps extends Omit<Toolbar$1.Button.Props, 'className'> {
1210
1260
  className?: string | undefined;
1211
1261
  }
1262
+ interface ToolbarLinkProps extends Omit<Toolbar$1.Link.Props, 'className'> {
1263
+ className?: string | undefined;
1264
+ }
1212
1265
  interface ToolbarSpacerProps {
1213
1266
  className?: string | undefined;
1214
1267
  }
@@ -1216,10 +1269,11 @@ interface ToolbarSpacerProps {
1216
1269
  declare function Spacer({ className }: ToolbarSpacerProps): react.JSX.Element;
1217
1270
  /** A horizontal container of controls. Built on Base UI's Toolbar. */
1218
1271
  declare const Toolbar: {
1219
- Root: typeof Root;
1272
+ Root: typeof Root$2;
1220
1273
  Group: typeof Group;
1221
1274
  Separator: typeof Separator;
1222
1275
  Button: react.ForwardRefExoticComponent<Omit<_base_ui_react.ToolbarButtonProps, "ref"> & react.RefAttributes<HTMLButtonElement>>;
1276
+ Link: react.ForwardRefExoticComponent<Omit<_base_ui_react.ToolbarLinkProps, "ref"> & react.RefAttributes<HTMLAnchorElement>>;
1223
1277
  Spacer: typeof Spacer;
1224
1278
  };
1225
1279
 
@@ -1611,7 +1665,1088 @@ interface TextProps extends ComponentPropsWithRef<'p'> {
1611
1665
  /** Running text and labels from the type scale. Parents own spacing: Text has no margins. */
1612
1666
  declare function Text({ as, size, tone, weight, align, truncate, numeric, className, style, ...rest }: TextProps): ReactElement;
1613
1667
 
1668
+ /** The header checkbox: nothing, some or every row selected. */
1669
+ type RowSelectionHeaderState = 'none' | 'some' | 'all';
1670
+
1671
+ interface RowSelection {
1672
+ /** The selectable ids, in the order passed in. */
1673
+ ids: readonly string[];
1674
+ /** The selected ids; a subset of the ids passed in. */
1675
+ selected: ReadonlySet<string>;
1676
+ /** The selected ids in visible order. */
1677
+ selectedIds: readonly string[];
1678
+ count: number;
1679
+ /** Where the next Shift range starts. */
1680
+ anchor: string | null;
1681
+ /** For the header checkbox. */
1682
+ headerState: RowSelectionHeaderState;
1683
+ isSelected: (id: string) => boolean;
1684
+ toggle: (id: string) => void;
1685
+ /** Every row from the anchor to `id`, inclusive, in the current order, takes `id`'s new state. */
1686
+ toggleRange: (id: string) => void;
1687
+ selectAll: () => void;
1688
+ clear: () => void;
1689
+ }
1690
+ /**
1691
+ * Selection state for a list of rows, by id. Pass the selectable ids in visible order (after filtering and
1692
+ * sorting); when one disappears it leaves the selection and the rest stay. Hand the result to
1693
+ * `Table.Root selection` for the checkbox column and keyboard, or read it for a bulk-action bar.
1694
+ */
1695
+ declare function useRowSelection(ids: readonly string[]): RowSelection;
1696
+
1697
+ type TableAlign = 'start' | 'center' | 'end';
1698
+ type TableDensity = 'comfortable' | 'compact';
1699
+ type TableSortDirection = 'ascending' | 'descending' | 'none';
1700
+ interface TableRootProps extends Omit<ComponentPropsWithRef<'table'>, 'style'> {
1701
+ /** Column headers stay visible while the table scrolls. Give `maxHeight` to scroll inside the table; otherwise they stick to the page. */
1702
+ stickyHeader?: boolean | undefined;
1703
+ /** Limits the height and scrolls rows inside; pairs with `stickyHeader`. A CSS length. */
1704
+ maxHeight?: string | undefined;
1705
+ /** `compact` tightens row height and padding; `data-density="compact"` on an ancestor does the same. */
1706
+ density?: TableDensity | undefined;
1707
+ /** Hairlines between rows (default) or none. */
1708
+ divided?: boolean | undefined;
1709
+ /** `fixed` column widths from the first row, for truncating cells. Default `auto`. */
1710
+ layout?: 'auto' | 'fixed' | undefined;
1711
+ /** Style and class for the scrolling wrapper; `className` goes on the `<table>`. */
1712
+ wrapperClassName?: string | undefined;
1713
+ wrapperStyle?: CSSProperties | undefined;
1714
+ style?: CSSProperties | undefined;
1715
+ children?: ReactNode | undefined;
1716
+ /**
1717
+ * `useRowSelection(ids)`. Turns on the selection column parts (`Table.SelectionHeader`, `Table.SelectionCell`),
1718
+ * modifier clicks on rows with a `selectionId`, and the keyboard: Cmd/Ctrl+A selects every row while focus
1719
+ * is inside the table, Escape clears.
1720
+ */
1721
+ selection?: RowSelection | undefined;
1722
+ }
1723
+ /** A semantic `<table>` in a horizontally scrolling wrapper. Compose `Table.Head`, `Table.Body`, `Table.Row`, `Table.Header`, `Table.Cell`. */
1724
+ declare function Root$1({ stickyHeader, maxHeight, density, divided, layout, wrapperClassName, wrapperStyle, className, style, children, selection, onKeyDown, ...rest }: TableRootProps): react.JSX.Element;
1725
+ type TableCaptionProps = ComponentPropsWithRef<'caption'>;
1726
+ /** Names the table for assistive tech; visually a muted line above it. */
1727
+ declare function Caption({ className, ...rest }: TableCaptionProps): react.JSX.Element;
1728
+ type TableHeadProps = ComponentPropsWithRef<'thead'>;
1729
+ declare function Head({ className, ...rest }: TableHeadProps): react.JSX.Element;
1730
+ type TableBodyProps = ComponentPropsWithRef<'tbody'>;
1731
+ declare function Body({ className, ...rest }: TableBodyProps): react.JSX.Element;
1732
+ type TableFootProps = ComponentPropsWithRef<'tfoot'>;
1733
+ declare function Foot({ className, ...rest }: TableFootProps): react.JSX.Element;
1734
+ interface TableRowProps extends ComponentPropsWithRef<'tr'> {
1735
+ /** Accent wash, for the current row. With `selectionId` it defaults to the row's selection. */
1736
+ selected?: boolean | undefined;
1737
+ /** Hover wash and pointer; make the primary cell a link or button for the real target. */
1738
+ interactive?: boolean | undefined;
1739
+ /**
1740
+ * The row's id in `Table.Root selection`. Shift+click extends the range to this row and Cmd/Ctrl+click
1741
+ * toggles it, unless the click is on a link, button or field inside the row; neither reaches `onClick`,
1742
+ * so a plain click can still open the row.
1743
+ */
1744
+ selectionId?: string | undefined;
1745
+ }
1746
+ declare function Row({ selected, interactive, selectionId, className, onClick, onMouseDown, ...rest }: TableRowProps): react.JSX.Element;
1747
+ interface TableSelectionHeaderProps extends Omit<ComponentPropsWithRef<'th'>, 'children'> {
1748
+ /** The checkbox's accessible name. Default "Select all rows". */
1749
+ label?: string | undefined;
1750
+ }
1751
+ /**
1752
+ * The selection column's header: a checkbox that is checked when every row is, mixed when some are, and
1753
+ * selects every row (or, when all are selected, none). The whole cell is the hit area.
1754
+ */
1755
+ declare function SelectionHeader({ label, className, onClick, ...rest }: TableSelectionHeaderProps): react.JSX.Element;
1756
+ interface TableSelectionCellProps extends Omit<ComponentPropsWithRef<'td'>, 'children'> {
1757
+ /** Required. Names the row's checkbox: "Select Tailscale, Front End Engineer". */
1758
+ label: string;
1759
+ }
1760
+ /**
1761
+ * The row's checkbox, inside a `Table.Row selectionId`. Click or Space toggles; Shift+click or Shift+Space
1762
+ * extends the range from the last toggled row. The whole cell is the hit area, and its clicks never reach the
1763
+ * row's `onClick`.
1764
+ */
1765
+ declare function SelectionCell({ label, className, onClick, onClickCapture, ...rest }: TableSelectionCellProps): react.JSX.Element;
1766
+ interface CellSlots {
1767
+ /** Horizontal alignment. Default `start`; `end` for numbers. */
1768
+ align?: TableAlign | undefined;
1769
+ /** Tabular figures and end alignment. */
1770
+ numeric?: boolean | undefined;
1771
+ /** No wrapping. */
1772
+ nowrap?: boolean | undefined;
1773
+ /** One line with an ellipsis; needs `layout="fixed"` or a `width`. */
1774
+ truncate?: boolean | undefined;
1775
+ /** Column width as a CSS length, on headers. */
1776
+ width?: string | undefined;
1777
+ }
1778
+ interface TableHeaderProps extends Omit<ComponentPropsWithRef<'th'>, 'align' | 'width'>, CellSlots {
1779
+ /** Renders the label as a button that sorts the column. The table stays controlled: sort the rows yourself in `onSort`. */
1780
+ sortable?: boolean | undefined;
1781
+ /** The column's current sort, reflected as `aria-sort`. `none` (default) for every column but the sorted one. */
1782
+ sortDirection?: TableSortDirection | undefined;
1783
+ /** Called with the direction to apply: `ascending` first, then it toggles. */
1784
+ onSort?: ((direction: Exclude<TableSortDirection, 'none'>) => void) | undefined;
1785
+ }
1786
+ /** A `<th>`; `scope` defaults to `col`, pass `row` for the first cell of a row. */
1787
+ declare function Header({ align, numeric, nowrap, truncate, width, sortable, sortDirection, onSort, scope, className, style, children, ...rest }: TableHeaderProps): react.JSX.Element;
1788
+ interface TableCellProps extends Omit<ComponentPropsWithRef<'td'>, 'align' | 'width'>, CellSlots {
1789
+ }
1790
+ declare function Cell({ align, numeric, nowrap, truncate, width, className, style, ...rest }: TableCellProps): react.JSX.Element;
1791
+ /** Rows of records with column headers. Native table elements, so screen readers get rows and columns. */
1792
+ declare const Table: {
1793
+ Root: typeof Root$1;
1794
+ Caption: typeof Caption;
1795
+ Head: typeof Head;
1796
+ Body: typeof Body;
1797
+ Foot: typeof Foot;
1798
+ Row: typeof Row;
1799
+ Header: typeof Header;
1800
+ Cell: typeof Cell;
1801
+ SelectionHeader: typeof SelectionHeader;
1802
+ SelectionCell: typeof SelectionCell;
1803
+ };
1804
+
1805
+ interface SelectionBarProps {
1806
+ /** How many rows are selected. The bar shows from 1 and leaves at 0. */
1807
+ count: number;
1808
+ /** Clears the selection (the Clear button). */
1809
+ onClear: () => void;
1810
+ /** The actions, each a `Toolbar.Button`: `<Toolbar.Button render={<Button size="sm" variant="secondary" />}>Close 3</Toolbar.Button>`. */
1811
+ children?: ReactNode | undefined;
1812
+ /** Names the toolbar. Default "Bulk actions". */
1813
+ 'aria-label'?: string | undefined;
1814
+ /** The count text, visible and announced. Default `${count} selected`. */
1815
+ countLabel?: ((count: number) => string) | undefined;
1816
+ /** Default "Clear". */
1817
+ clearLabel?: string | undefined;
1818
+ /** Announced when the selection goes back to none. Default "Selection cleared". */
1819
+ clearedMessage?: string | undefined;
1820
+ className?: string | undefined;
1821
+ }
1822
+ /**
1823
+ * A floating bar for bulk actions on selected rows, centred at the bottom of the viewport: the count, the actions
1824
+ * and Clear, as one Toolbar (one tab stop, arrow keys inside). A polite status region announces the count as it
1825
+ * changes. Put it after the table, at the end of the scrolling content: while it shows, it leaves a spacer as
1826
+ * tall as itself there, so the last rows can scroll clear of it. When it leaves while holding focus (an action
1827
+ * cleared the selection), focus goes back to where it came from, usually the last row checkbox.
1828
+ */
1829
+ declare function SelectionBar({ count, onClear, children, 'aria-label': ariaLabel, countLabel, clearLabel, clearedMessage, className, }: SelectionBarProps): react.JSX.Element;
1830
+
1831
+ type ToastTone = 'neutral' | 'success' | 'danger';
1832
+ interface ToastOptions {
1833
+ /** Required. One line: "Closed 5 applications". */
1834
+ title: ReactNode;
1835
+ description?: ReactNode | undefined;
1836
+ /** A coloured edge. Default `neutral`. */
1837
+ tone?: ToastTone | undefined;
1838
+ /** One action, usually Undo. It closes the toast after `onClick`. */
1839
+ action?: {
1840
+ label: string;
1841
+ onClick: () => void;
1842
+ } | undefined;
1843
+ /** Milliseconds before it closes; paused while hovered or focused; `0` keeps it. Default: the Provider's. */
1844
+ timeout?: number | undefined;
1845
+ /** `high` announces assertively (errors). Default `low`, polite. */
1846
+ priority?: 'low' | 'high' | undefined;
1847
+ }
1848
+ interface ToastProviderProps {
1849
+ children?: ReactNode | undefined;
1850
+ /** Default auto-close, in milliseconds. Default 6000. */
1851
+ timeout?: number | undefined;
1852
+ /** How many show at once; older ones close. Default 3. */
1853
+ limit?: number | undefined;
1854
+ }
1855
+ /** Holds the toasts for `useToast()` below it and renders them, bottom-end, in the top layer. */
1856
+ declare function Provider({ children, timeout, limit }: ToastProviderProps): react.JSX.Element;
1857
+ interface ToastApi {
1858
+ /** Shows a toast and returns its id. */
1859
+ add: (options: ToastOptions) => string;
1860
+ /** Closes one toast, or every toast without an id. */
1861
+ close: (id?: string) => void;
1862
+ }
1863
+ /** Shows toasts from inside a `Toast.Provider`. */
1864
+ declare function useToast(): ToastApi;
1865
+ /**
1866
+ * Short-lived status messages: "Closed 5 applications · Undo". Built on Base UI's Toast: announced through a
1867
+ * polite region (`priority: 'high'` for errors), paused while hovered or focused, F6 moves focus to them.
1868
+ */
1869
+ declare const Toast: {
1870
+ Provider: typeof Provider;
1871
+ };
1872
+
1873
+ type StatTrend = 'up' | 'down' | 'flat';
1874
+ type StatDeltaTone = 'positive' | 'negative' | 'neutral';
1875
+ type StatElement = 'div' | 'li' | 'article';
1876
+ type StatVariant = 'outlined' | 'filled' | 'plain';
1877
+ type StatSize = 'sm' | 'md';
1878
+ interface StatProps extends Omit<ComponentPropsWithRef<'div'>, 'children'> {
1879
+ /** What the number is: "Applications", "Reply rate". */
1880
+ label: ReactNode;
1881
+ /** The number, already formatted: "1,204", "37%". */
1882
+ value: ReactNode;
1883
+ /** The change beside the value: "+12", "−3.1 pts", "same as last week". */
1884
+ delta?: ReactNode | undefined;
1885
+ /** Colour of the delta: `positive` green, `negative` red, `neutral` muted (default). Say which is good; up is not always good. */
1886
+ deltaTone?: StatDeltaTone | undefined;
1887
+ /** Arrow before the delta. */
1888
+ trend?: StatTrend | undefined;
1889
+ /** Muted line under the value: "last 7 days", "of 2,000 budget". */
1890
+ hint?: ReactNode | undefined;
1891
+ /** A 20px icon in the corner. Decorative. */
1892
+ icon?: ReactNode | undefined;
1893
+ /** `outlined` surface (default), `filled` inset, `plain` no surface for a row of stats inside a Card. */
1894
+ variant?: StatVariant | undefined;
1895
+ /** `md` (default) or `sm` for dense rows. */
1896
+ size?: StatSize | undefined;
1897
+ /** Element to render; `li` in a list of stats. */
1898
+ as?: StatElement | undefined;
1899
+ }
1900
+ /** One number with its label: a KPI tile. The value is text, so it reads as "Applications, 1,204, up 12". */
1901
+ declare function Stat({ label, value, delta, deltaTone, trend, hint, icon, variant, size, as, className, ...rest }: StatProps): react.DetailedReactHTMLElement<{
1902
+ slot?: string | undefined | undefined;
1903
+ style?: react.CSSProperties | undefined;
1904
+ title?: string | undefined | undefined;
1905
+ ref?: react.Ref<HTMLDivElement> | undefined;
1906
+ key?: react.Key | null | undefined;
1907
+ defaultChecked?: boolean | undefined | undefined;
1908
+ defaultValue?: string | number | readonly string[] | undefined;
1909
+ suppressContentEditableWarning?: boolean | undefined | undefined;
1910
+ suppressHydrationWarning?: boolean | undefined | undefined;
1911
+ accessKey?: string | undefined | undefined;
1912
+ autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
1913
+ autoFocus?: boolean | undefined | undefined;
1914
+ contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
1915
+ contextMenu?: string | undefined | undefined;
1916
+ dir?: string | undefined | undefined;
1917
+ draggable?: (boolean | "true" | "false") | undefined;
1918
+ enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
1919
+ hidden?: boolean | undefined | undefined;
1920
+ id?: string | undefined | undefined;
1921
+ lang?: string | undefined | undefined;
1922
+ nonce?: string | undefined | undefined;
1923
+ spellCheck?: (boolean | "true" | "false") | undefined;
1924
+ tabIndex?: number | undefined | undefined;
1925
+ translate?: "yes" | "no" | undefined | undefined;
1926
+ radioGroup?: string | undefined | undefined;
1927
+ role?: react.AriaRole | undefined;
1928
+ about?: string | undefined | undefined;
1929
+ content?: string | undefined | undefined;
1930
+ datatype?: string | undefined | undefined;
1931
+ inlist?: any;
1932
+ prefix?: string | undefined | undefined;
1933
+ property?: string | undefined | undefined;
1934
+ rel?: string | undefined | undefined;
1935
+ resource?: string | undefined | undefined;
1936
+ rev?: string | undefined | undefined;
1937
+ typeof?: string | undefined | undefined;
1938
+ vocab?: string | undefined | undefined;
1939
+ autoCorrect?: string | undefined | undefined;
1940
+ autoSave?: string | undefined | undefined;
1941
+ color?: string | undefined | undefined;
1942
+ itemProp?: string | undefined | undefined;
1943
+ itemScope?: boolean | undefined | undefined;
1944
+ itemType?: string | undefined | undefined;
1945
+ itemID?: string | undefined | undefined;
1946
+ itemRef?: string | undefined | undefined;
1947
+ results?: number | undefined | undefined;
1948
+ security?: string | undefined | undefined;
1949
+ unselectable?: "on" | "off" | undefined | undefined;
1950
+ popover?: "" | "auto" | "manual" | "hint" | undefined | undefined;
1951
+ popoverTargetAction?: "toggle" | "show" | "hide" | undefined | undefined;
1952
+ popoverTarget?: string | undefined | undefined;
1953
+ inert?: boolean | undefined | undefined;
1954
+ inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
1955
+ is?: string | undefined | undefined;
1956
+ exportparts?: string | undefined | undefined;
1957
+ part?: string | undefined | undefined;
1958
+ "aria-activedescendant"?: string | undefined | undefined;
1959
+ "aria-atomic"?: (boolean | "true" | "false") | undefined;
1960
+ "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined | undefined;
1961
+ "aria-braillelabel"?: string | undefined | undefined;
1962
+ "aria-brailleroledescription"?: string | undefined | undefined;
1963
+ "aria-busy"?: (boolean | "true" | "false") | undefined;
1964
+ "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
1965
+ "aria-colcount"?: number | undefined | undefined;
1966
+ "aria-colindex"?: number | undefined | undefined;
1967
+ "aria-colindextext"?: string | undefined | undefined;
1968
+ "aria-colspan"?: number | undefined | undefined;
1969
+ "aria-controls"?: string | undefined | undefined;
1970
+ "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined | undefined;
1971
+ "aria-describedby"?: string | undefined | undefined;
1972
+ "aria-description"?: string | undefined | undefined;
1973
+ "aria-details"?: string | undefined | undefined;
1974
+ "aria-disabled"?: (boolean | "true" | "false") | undefined;
1975
+ "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined | undefined;
1976
+ "aria-errormessage"?: string | undefined | undefined;
1977
+ "aria-expanded"?: (boolean | "true" | "false") | undefined;
1978
+ "aria-flowto"?: string | undefined | undefined;
1979
+ "aria-grabbed"?: (boolean | "true" | "false") | undefined;
1980
+ "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined | undefined;
1981
+ "aria-hidden"?: (boolean | "true" | "false") | undefined;
1982
+ "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined | undefined;
1983
+ "aria-keyshortcuts"?: string | undefined | undefined;
1984
+ "aria-label"?: string | undefined | undefined;
1985
+ "aria-labelledby"?: string | undefined | undefined;
1986
+ "aria-level"?: number | undefined | undefined;
1987
+ "aria-live"?: "off" | "assertive" | "polite" | undefined | undefined;
1988
+ "aria-modal"?: (boolean | "true" | "false") | undefined;
1989
+ "aria-multiline"?: (boolean | "true" | "false") | undefined;
1990
+ "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
1991
+ "aria-orientation"?: "horizontal" | "vertical" | undefined | undefined;
1992
+ "aria-owns"?: string | undefined | undefined;
1993
+ "aria-placeholder"?: string | undefined | undefined;
1994
+ "aria-posinset"?: number | undefined | undefined;
1995
+ "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
1996
+ "aria-readonly"?: (boolean | "true" | "false") | undefined;
1997
+ "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined | undefined;
1998
+ "aria-required"?: (boolean | "true" | "false") | undefined;
1999
+ "aria-roledescription"?: string | undefined | undefined;
2000
+ "aria-rowcount"?: number | undefined | undefined;
2001
+ "aria-rowindex"?: number | undefined | undefined;
2002
+ "aria-rowindextext"?: string | undefined | undefined;
2003
+ "aria-rowspan"?: number | undefined | undefined;
2004
+ "aria-selected"?: (boolean | "true" | "false") | undefined;
2005
+ "aria-setsize"?: number | undefined | undefined;
2006
+ "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined | undefined;
2007
+ "aria-valuemax"?: number | undefined | undefined;
2008
+ "aria-valuemin"?: number | undefined | undefined;
2009
+ "aria-valuenow"?: number | undefined | undefined;
2010
+ "aria-valuetext"?: string | undefined | undefined;
2011
+ dangerouslySetInnerHTML?: {
2012
+ __html: string | TrustedHTML;
2013
+ } | undefined | undefined;
2014
+ onCopy?: react.ClipboardEventHandler<HTMLDivElement> | undefined;
2015
+ onCopyCapture?: react.ClipboardEventHandler<HTMLDivElement> | undefined;
2016
+ onCut?: react.ClipboardEventHandler<HTMLDivElement> | undefined;
2017
+ onCutCapture?: react.ClipboardEventHandler<HTMLDivElement> | undefined;
2018
+ onPaste?: react.ClipboardEventHandler<HTMLDivElement> | undefined;
2019
+ onPasteCapture?: react.ClipboardEventHandler<HTMLDivElement> | undefined;
2020
+ onCompositionEnd?: react.CompositionEventHandler<HTMLDivElement> | undefined;
2021
+ onCompositionEndCapture?: react.CompositionEventHandler<HTMLDivElement> | undefined;
2022
+ onCompositionStart?: react.CompositionEventHandler<HTMLDivElement> | undefined;
2023
+ onCompositionStartCapture?: react.CompositionEventHandler<HTMLDivElement> | undefined;
2024
+ onCompositionUpdate?: react.CompositionEventHandler<HTMLDivElement> | undefined;
2025
+ onCompositionUpdateCapture?: react.CompositionEventHandler<HTMLDivElement> | undefined;
2026
+ onFocus?: react.FocusEventHandler<HTMLDivElement> | undefined;
2027
+ onFocusCapture?: react.FocusEventHandler<HTMLDivElement> | undefined;
2028
+ onBlur?: react.FocusEventHandler<HTMLDivElement> | undefined;
2029
+ onBlurCapture?: react.FocusEventHandler<HTMLDivElement> | undefined;
2030
+ onChange?: react.ChangeEventHandler<HTMLDivElement, Element> | undefined;
2031
+ onChangeCapture?: react.ChangeEventHandler<HTMLDivElement, Element> | undefined;
2032
+ onBeforeInput?: react.InputEventHandler<HTMLDivElement> | undefined;
2033
+ onBeforeInputCapture?: react.InputEventHandler<HTMLDivElement> | undefined;
2034
+ onInput?: react.InputEventHandler<HTMLDivElement> | undefined;
2035
+ onInputCapture?: react.InputEventHandler<HTMLDivElement> | undefined;
2036
+ onReset?: react.ReactEventHandler<HTMLDivElement> | undefined;
2037
+ onResetCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2038
+ onSubmit?: react.SubmitEventHandler<HTMLDivElement> | undefined;
2039
+ onSubmitCapture?: react.SubmitEventHandler<HTMLDivElement> | undefined;
2040
+ onInvalid?: react.ReactEventHandler<HTMLDivElement> | undefined;
2041
+ onInvalidCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2042
+ onLoad?: react.ReactEventHandler<HTMLDivElement> | undefined;
2043
+ onLoadCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2044
+ onError?: react.ReactEventHandler<HTMLDivElement> | undefined;
2045
+ onErrorCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2046
+ onKeyDown?: react.KeyboardEventHandler<HTMLDivElement> | undefined;
2047
+ onKeyDownCapture?: react.KeyboardEventHandler<HTMLDivElement> | undefined;
2048
+ onKeyPress?: react.KeyboardEventHandler<HTMLDivElement> | undefined;
2049
+ onKeyPressCapture?: react.KeyboardEventHandler<HTMLDivElement> | undefined;
2050
+ onKeyUp?: react.KeyboardEventHandler<HTMLDivElement> | undefined;
2051
+ onKeyUpCapture?: react.KeyboardEventHandler<HTMLDivElement> | undefined;
2052
+ onAbort?: react.ReactEventHandler<HTMLDivElement> | undefined;
2053
+ onAbortCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2054
+ onCanPlay?: react.ReactEventHandler<HTMLDivElement> | undefined;
2055
+ onCanPlayCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2056
+ onCanPlayThrough?: react.ReactEventHandler<HTMLDivElement> | undefined;
2057
+ onCanPlayThroughCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2058
+ onDurationChange?: react.ReactEventHandler<HTMLDivElement> | undefined;
2059
+ onDurationChangeCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2060
+ onEmptied?: react.ReactEventHandler<HTMLDivElement> | undefined;
2061
+ onEmptiedCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2062
+ onEncrypted?: react.ReactEventHandler<HTMLDivElement> | undefined;
2063
+ onEncryptedCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2064
+ onEnded?: react.ReactEventHandler<HTMLDivElement> | undefined;
2065
+ onEndedCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2066
+ onLoadedData?: react.ReactEventHandler<HTMLDivElement> | undefined;
2067
+ onLoadedDataCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2068
+ onLoadedMetadata?: react.ReactEventHandler<HTMLDivElement> | undefined;
2069
+ onLoadedMetadataCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2070
+ onLoadStart?: react.ReactEventHandler<HTMLDivElement> | undefined;
2071
+ onLoadStartCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2072
+ onPause?: react.ReactEventHandler<HTMLDivElement> | undefined;
2073
+ onPauseCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2074
+ onPlay?: react.ReactEventHandler<HTMLDivElement> | undefined;
2075
+ onPlayCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2076
+ onPlaying?: react.ReactEventHandler<HTMLDivElement> | undefined;
2077
+ onPlayingCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2078
+ onProgress?: react.ReactEventHandler<HTMLDivElement> | undefined;
2079
+ onProgressCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2080
+ onRateChange?: react.ReactEventHandler<HTMLDivElement> | undefined;
2081
+ onRateChangeCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2082
+ onSeeked?: react.ReactEventHandler<HTMLDivElement> | undefined;
2083
+ onSeekedCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2084
+ onSeeking?: react.ReactEventHandler<HTMLDivElement> | undefined;
2085
+ onSeekingCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2086
+ onStalled?: react.ReactEventHandler<HTMLDivElement> | undefined;
2087
+ onStalledCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2088
+ onSuspend?: react.ReactEventHandler<HTMLDivElement> | undefined;
2089
+ onSuspendCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2090
+ onTimeUpdate?: react.ReactEventHandler<HTMLDivElement> | undefined;
2091
+ onTimeUpdateCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2092
+ onVolumeChange?: react.ReactEventHandler<HTMLDivElement> | undefined;
2093
+ onVolumeChangeCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2094
+ onWaiting?: react.ReactEventHandler<HTMLDivElement> | undefined;
2095
+ onWaitingCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2096
+ onAuxClick?: react.MouseEventHandler<HTMLDivElement> | undefined;
2097
+ onAuxClickCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
2098
+ onClick?: react.MouseEventHandler<HTMLDivElement> | undefined;
2099
+ onClickCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
2100
+ onContextMenu?: react.MouseEventHandler<HTMLDivElement> | undefined;
2101
+ onContextMenuCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
2102
+ onDoubleClick?: react.MouseEventHandler<HTMLDivElement> | undefined;
2103
+ onDoubleClickCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
2104
+ onDrag?: react.DragEventHandler<HTMLDivElement> | undefined;
2105
+ onDragCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
2106
+ onDragEnd?: react.DragEventHandler<HTMLDivElement> | undefined;
2107
+ onDragEndCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
2108
+ onDragEnter?: react.DragEventHandler<HTMLDivElement> | undefined;
2109
+ onDragEnterCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
2110
+ onDragExit?: react.DragEventHandler<HTMLDivElement> | undefined;
2111
+ onDragExitCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
2112
+ onDragLeave?: react.DragEventHandler<HTMLDivElement> | undefined;
2113
+ onDragLeaveCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
2114
+ onDragOver?: react.DragEventHandler<HTMLDivElement> | undefined;
2115
+ onDragOverCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
2116
+ onDragStart?: react.DragEventHandler<HTMLDivElement> | undefined;
2117
+ onDragStartCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
2118
+ onDrop?: react.DragEventHandler<HTMLDivElement> | undefined;
2119
+ onDropCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
2120
+ onMouseDown?: react.MouseEventHandler<HTMLDivElement> | undefined;
2121
+ onMouseDownCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
2122
+ onMouseEnter?: react.MouseEventHandler<HTMLDivElement> | undefined;
2123
+ onMouseLeave?: react.MouseEventHandler<HTMLDivElement> | undefined;
2124
+ onMouseMove?: react.MouseEventHandler<HTMLDivElement> | undefined;
2125
+ onMouseMoveCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
2126
+ onMouseOut?: react.MouseEventHandler<HTMLDivElement> | undefined;
2127
+ onMouseOutCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
2128
+ onMouseOver?: react.MouseEventHandler<HTMLDivElement> | undefined;
2129
+ onMouseOverCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
2130
+ onMouseUp?: react.MouseEventHandler<HTMLDivElement> | undefined;
2131
+ onMouseUpCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
2132
+ onSelect?: react.ReactEventHandler<HTMLDivElement> | undefined;
2133
+ onSelectCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2134
+ onTouchCancel?: react.TouchEventHandler<HTMLDivElement> | undefined;
2135
+ onTouchCancelCapture?: react.TouchEventHandler<HTMLDivElement> | undefined;
2136
+ onTouchEnd?: react.TouchEventHandler<HTMLDivElement> | undefined;
2137
+ onTouchEndCapture?: react.TouchEventHandler<HTMLDivElement> | undefined;
2138
+ onTouchMove?: react.TouchEventHandler<HTMLDivElement> | undefined;
2139
+ onTouchMoveCapture?: react.TouchEventHandler<HTMLDivElement> | undefined;
2140
+ onTouchStart?: react.TouchEventHandler<HTMLDivElement> | undefined;
2141
+ onTouchStartCapture?: react.TouchEventHandler<HTMLDivElement> | undefined;
2142
+ onPointerDown?: react.PointerEventHandler<HTMLDivElement> | undefined;
2143
+ onPointerDownCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
2144
+ onPointerMove?: react.PointerEventHandler<HTMLDivElement> | undefined;
2145
+ onPointerMoveCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
2146
+ onPointerUp?: react.PointerEventHandler<HTMLDivElement> | undefined;
2147
+ onPointerUpCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
2148
+ onPointerCancel?: react.PointerEventHandler<HTMLDivElement> | undefined;
2149
+ onPointerCancelCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
2150
+ onPointerEnter?: react.PointerEventHandler<HTMLDivElement> | undefined;
2151
+ onPointerLeave?: react.PointerEventHandler<HTMLDivElement> | undefined;
2152
+ onPointerOver?: react.PointerEventHandler<HTMLDivElement> | undefined;
2153
+ onPointerOverCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
2154
+ onPointerOut?: react.PointerEventHandler<HTMLDivElement> | undefined;
2155
+ onPointerOutCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
2156
+ onGotPointerCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
2157
+ onGotPointerCaptureCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
2158
+ onLostPointerCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
2159
+ onLostPointerCaptureCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
2160
+ onScroll?: react.UIEventHandler<HTMLDivElement> | undefined;
2161
+ onScrollCapture?: react.UIEventHandler<HTMLDivElement> | undefined;
2162
+ onScrollEnd?: react.UIEventHandler<HTMLDivElement> | undefined;
2163
+ onScrollEndCapture?: react.UIEventHandler<HTMLDivElement> | undefined;
2164
+ onWheel?: react.WheelEventHandler<HTMLDivElement> | undefined;
2165
+ onWheelCapture?: react.WheelEventHandler<HTMLDivElement> | undefined;
2166
+ onAnimationStart?: react.AnimationEventHandler<HTMLDivElement> | undefined;
2167
+ onAnimationStartCapture?: react.AnimationEventHandler<HTMLDivElement> | undefined;
2168
+ onAnimationEnd?: react.AnimationEventHandler<HTMLDivElement> | undefined;
2169
+ onAnimationEndCapture?: react.AnimationEventHandler<HTMLDivElement> | undefined;
2170
+ onAnimationIteration?: react.AnimationEventHandler<HTMLDivElement> | undefined;
2171
+ onAnimationIterationCapture?: react.AnimationEventHandler<HTMLDivElement> | undefined;
2172
+ onToggle?: react.ToggleEventHandler<HTMLDivElement> | undefined;
2173
+ onBeforeToggle?: react.ToggleEventHandler<HTMLDivElement> | undefined;
2174
+ onTransitionCancel?: react.TransitionEventHandler<HTMLDivElement> | undefined;
2175
+ onTransitionCancelCapture?: react.TransitionEventHandler<HTMLDivElement> | undefined;
2176
+ onTransitionEnd?: react.TransitionEventHandler<HTMLDivElement> | undefined;
2177
+ onTransitionEndCapture?: react.TransitionEventHandler<HTMLDivElement> | undefined;
2178
+ onTransitionRun?: react.TransitionEventHandler<HTMLDivElement> | undefined;
2179
+ onTransitionRunCapture?: react.TransitionEventHandler<HTMLDivElement> | undefined;
2180
+ onTransitionStart?: react.TransitionEventHandler<HTMLDivElement> | undefined;
2181
+ onTransitionStartCapture?: react.TransitionEventHandler<HTMLDivElement> | undefined;
2182
+ className: string;
2183
+ 'data-variant': StatVariant;
2184
+ 'data-size': StatSize;
2185
+ }, HTMLDivElement>;
2186
+
2187
+ type ChipTone = 'neutral' | 'accent' | 'success' | 'warning' | 'danger' | 'info';
2188
+ type ChipSize = 'sm' | 'md';
2189
+ interface ChipProps extends Omit<ComponentPropsWithRef<'span'>, 'onClick' | 'onRemove'> {
2190
+ /** The chip text. Keep it to a word or three. */
2191
+ children: ReactNode;
2192
+ /** A 14px icon before the text. Decorative. */
2193
+ icon?: ReactNode | undefined;
2194
+ /** Colour. `neutral` (default) for filters, a status tone when the chip is the status. */
2195
+ tone?: ChipTone | undefined;
2196
+ /** `md` 32px (default) or `sm` 24px inside table rows and Card headers. */
2197
+ size?: ChipSize | undefined;
2198
+ /** Filled and `aria-pressed`. Use with `onClick` for a toggling filter chip. */
2199
+ selected?: boolean | undefined;
2200
+ /** Makes the chip a `<button>` that toggles; `selected` is reflected as `aria-pressed`. */
2201
+ onClick?: ((event: MouseEvent<HTMLButtonElement>) => void) | undefined;
2202
+ /**
2203
+ * Adds a labelled × that calls this. Backspace or Delete on the focused chip (or on the ×) removes it
2204
+ * too. Focus is yours to manage after removal: move it to the next chip or the filter input.
2205
+ */
2206
+ onRemove?: (() => void) | undefined;
2207
+ /** Accessible name of the ×. Default "Remove" followed by the chip text when that text is a string. */
2208
+ removeLabel?: string | undefined;
2209
+ disabled?: boolean | undefined;
2210
+ }
2211
+ /**
2212
+ * A small pill: an applied filter, a tag, a selectable option in a row of a few. `onClick` makes it a
2213
+ * toggle button, `onRemove` adds the ×, and the two combine. Plain text otherwise.
2214
+ */
2215
+ declare function Chip({ children, icon, tone, size, selected, onClick, onRemove, removeLabel, disabled, className, ...rest }: ChipProps): react.JSX.Element;
2216
+
2217
+ interface DisclosureProps extends Omit<ComponentPropsWithRef<'details'>, 'open' | 'onToggle'> {
2218
+ /** Required. The summary line, a verb phrase: "Show full description". */
2219
+ summary: ReactNode;
2220
+ /** Replaces `summary` while open: "Show less". */
2221
+ summaryOpen?: ReactNode | undefined;
2222
+ /** Controlled open state. */
2223
+ open?: boolean | undefined;
2224
+ /** Initial open state when uncontrolled. */
2225
+ defaultOpen?: boolean | undefined;
2226
+ /** Called when the user toggles it. */
2227
+ onOpenChange?: ((open: boolean) => void) | undefined;
2228
+ /**
2229
+ * While closed, shows this many lines of the content fading out, so a long description still reads
2230
+ * as a teaser. Puts the summary line under the preview. Needs `::details-content` (2025 browsers);
2231
+ * older ones show the summary alone.
2232
+ */
2233
+ previewLines?: number | undefined;
2234
+ /** Puts the summary line above (default) or below the content. Defaults to `end` with `previewLines`. */
2235
+ summaryPosition?: 'start' | 'end' | undefined;
2236
+ children?: ReactNode | undefined;
2237
+ }
2238
+ /**
2239
+ * A native `<details>` collapse with a styled summary. Works without JavaScript, is announced as a
2240
+ * disclosure, and shares `name` with siblings for an exclusive group.
2241
+ */
2242
+ declare function Disclosure({ summary, summaryOpen, open, defaultOpen, onOpenChange, previewLines, summaryPosition, className, style, children, ref, ...rest }: DisclosureProps): react.JSX.Element;
2243
+
2244
+ type EmptyStateSize = 'sm' | 'md';
2245
+ type EmptyStateElement = 'div' | 'section' | 'li';
2246
+ interface EmptyStateProps extends Omit<ComponentPropsWithRef<'div'>, 'title'> {
2247
+ /** Required. What is empty, as a short statement: "No applications yet". */
2248
+ title: ReactNode;
2249
+ /** One sentence on why, or what to do: "Postings you apply to show up here." */
2250
+ description?: ReactNode | undefined;
2251
+ /** A 24px icon in a muted circle above the title. Decorative. */
2252
+ icon?: ReactNode | undefined;
2253
+ /** The actions, usually one primary Button and at most one secondary. Rendered in an Inline. */
2254
+ children?: ReactNode | undefined;
2255
+ /** `md` (default) for a whole view or panel, `sm` inside a Card or a table body. */
2256
+ size?: EmptyStateSize | undefined;
2257
+ /** Element to render. Default `div`. */
2258
+ as?: EmptyStateElement | undefined;
2259
+ }
2260
+ /**
2261
+ * Centred placeholder for a view with nothing in it: an icon, a title, a sentence and the action that
2262
+ * fills it. Say what is missing and the next step; never apologise.
2263
+ */
2264
+ declare function EmptyState({ title, description, icon, children, size, as, className, ...rest }: EmptyStateProps): react.DetailedReactHTMLElement<{
2265
+ slot?: string | undefined | undefined;
2266
+ style?: react.CSSProperties | undefined;
2267
+ ref?: react.Ref<HTMLDivElement> | undefined;
2268
+ key?: react.Key | null | undefined;
2269
+ defaultChecked?: boolean | undefined | undefined;
2270
+ defaultValue?: string | number | readonly string[] | undefined;
2271
+ suppressContentEditableWarning?: boolean | undefined | undefined;
2272
+ suppressHydrationWarning?: boolean | undefined | undefined;
2273
+ accessKey?: string | undefined | undefined;
2274
+ autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
2275
+ autoFocus?: boolean | undefined | undefined;
2276
+ contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
2277
+ contextMenu?: string | undefined | undefined;
2278
+ dir?: string | undefined | undefined;
2279
+ draggable?: (boolean | "true" | "false") | undefined;
2280
+ enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
2281
+ hidden?: boolean | undefined | undefined;
2282
+ id?: string | undefined | undefined;
2283
+ lang?: string | undefined | undefined;
2284
+ nonce?: string | undefined | undefined;
2285
+ spellCheck?: (boolean | "true" | "false") | undefined;
2286
+ tabIndex?: number | undefined | undefined;
2287
+ translate?: "yes" | "no" | undefined | undefined;
2288
+ radioGroup?: string | undefined | undefined;
2289
+ role?: react.AriaRole | undefined;
2290
+ about?: string | undefined | undefined;
2291
+ content?: string | undefined | undefined;
2292
+ datatype?: string | undefined | undefined;
2293
+ inlist?: any;
2294
+ prefix?: string | undefined | undefined;
2295
+ property?: string | undefined | undefined;
2296
+ rel?: string | undefined | undefined;
2297
+ resource?: string | undefined | undefined;
2298
+ rev?: string | undefined | undefined;
2299
+ typeof?: string | undefined | undefined;
2300
+ vocab?: string | undefined | undefined;
2301
+ autoCorrect?: string | undefined | undefined;
2302
+ autoSave?: string | undefined | undefined;
2303
+ color?: string | undefined | undefined;
2304
+ itemProp?: string | undefined | undefined;
2305
+ itemScope?: boolean | undefined | undefined;
2306
+ itemType?: string | undefined | undefined;
2307
+ itemID?: string | undefined | undefined;
2308
+ itemRef?: string | undefined | undefined;
2309
+ results?: number | undefined | undefined;
2310
+ security?: string | undefined | undefined;
2311
+ unselectable?: "on" | "off" | undefined | undefined;
2312
+ popover?: "" | "auto" | "manual" | "hint" | undefined | undefined;
2313
+ popoverTargetAction?: "toggle" | "show" | "hide" | undefined | undefined;
2314
+ popoverTarget?: string | undefined | undefined;
2315
+ inert?: boolean | undefined | undefined;
2316
+ inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
2317
+ is?: string | undefined | undefined;
2318
+ exportparts?: string | undefined | undefined;
2319
+ part?: string | undefined | undefined;
2320
+ "aria-activedescendant"?: string | undefined | undefined;
2321
+ "aria-atomic"?: (boolean | "true" | "false") | undefined;
2322
+ "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined | undefined;
2323
+ "aria-braillelabel"?: string | undefined | undefined;
2324
+ "aria-brailleroledescription"?: string | undefined | undefined;
2325
+ "aria-busy"?: (boolean | "true" | "false") | undefined;
2326
+ "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
2327
+ "aria-colcount"?: number | undefined | undefined;
2328
+ "aria-colindex"?: number | undefined | undefined;
2329
+ "aria-colindextext"?: string | undefined | undefined;
2330
+ "aria-colspan"?: number | undefined | undefined;
2331
+ "aria-controls"?: string | undefined | undefined;
2332
+ "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined | undefined;
2333
+ "aria-describedby"?: string | undefined | undefined;
2334
+ "aria-description"?: string | undefined | undefined;
2335
+ "aria-details"?: string | undefined | undefined;
2336
+ "aria-disabled"?: (boolean | "true" | "false") | undefined;
2337
+ "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined | undefined;
2338
+ "aria-errormessage"?: string | undefined | undefined;
2339
+ "aria-expanded"?: (boolean | "true" | "false") | undefined;
2340
+ "aria-flowto"?: string | undefined | undefined;
2341
+ "aria-grabbed"?: (boolean | "true" | "false") | undefined;
2342
+ "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined | undefined;
2343
+ "aria-hidden"?: (boolean | "true" | "false") | undefined;
2344
+ "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined | undefined;
2345
+ "aria-keyshortcuts"?: string | undefined | undefined;
2346
+ "aria-label"?: string | undefined | undefined;
2347
+ "aria-labelledby"?: string | undefined | undefined;
2348
+ "aria-level"?: number | undefined | undefined;
2349
+ "aria-live"?: "off" | "assertive" | "polite" | undefined | undefined;
2350
+ "aria-modal"?: (boolean | "true" | "false") | undefined;
2351
+ "aria-multiline"?: (boolean | "true" | "false") | undefined;
2352
+ "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
2353
+ "aria-orientation"?: "horizontal" | "vertical" | undefined | undefined;
2354
+ "aria-owns"?: string | undefined | undefined;
2355
+ "aria-placeholder"?: string | undefined | undefined;
2356
+ "aria-posinset"?: number | undefined | undefined;
2357
+ "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
2358
+ "aria-readonly"?: (boolean | "true" | "false") | undefined;
2359
+ "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined | undefined;
2360
+ "aria-required"?: (boolean | "true" | "false") | undefined;
2361
+ "aria-roledescription"?: string | undefined | undefined;
2362
+ "aria-rowcount"?: number | undefined | undefined;
2363
+ "aria-rowindex"?: number | undefined | undefined;
2364
+ "aria-rowindextext"?: string | undefined | undefined;
2365
+ "aria-rowspan"?: number | undefined | undefined;
2366
+ "aria-selected"?: (boolean | "true" | "false") | undefined;
2367
+ "aria-setsize"?: number | undefined | undefined;
2368
+ "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined | undefined;
2369
+ "aria-valuemax"?: number | undefined | undefined;
2370
+ "aria-valuemin"?: number | undefined | undefined;
2371
+ "aria-valuenow"?: number | undefined | undefined;
2372
+ "aria-valuetext"?: string | undefined | undefined;
2373
+ dangerouslySetInnerHTML?: {
2374
+ __html: string | TrustedHTML;
2375
+ } | undefined | undefined;
2376
+ onCopy?: react.ClipboardEventHandler<HTMLDivElement> | undefined;
2377
+ onCopyCapture?: react.ClipboardEventHandler<HTMLDivElement> | undefined;
2378
+ onCut?: react.ClipboardEventHandler<HTMLDivElement> | undefined;
2379
+ onCutCapture?: react.ClipboardEventHandler<HTMLDivElement> | undefined;
2380
+ onPaste?: react.ClipboardEventHandler<HTMLDivElement> | undefined;
2381
+ onPasteCapture?: react.ClipboardEventHandler<HTMLDivElement> | undefined;
2382
+ onCompositionEnd?: react.CompositionEventHandler<HTMLDivElement> | undefined;
2383
+ onCompositionEndCapture?: react.CompositionEventHandler<HTMLDivElement> | undefined;
2384
+ onCompositionStart?: react.CompositionEventHandler<HTMLDivElement> | undefined;
2385
+ onCompositionStartCapture?: react.CompositionEventHandler<HTMLDivElement> | undefined;
2386
+ onCompositionUpdate?: react.CompositionEventHandler<HTMLDivElement> | undefined;
2387
+ onCompositionUpdateCapture?: react.CompositionEventHandler<HTMLDivElement> | undefined;
2388
+ onFocus?: react.FocusEventHandler<HTMLDivElement> | undefined;
2389
+ onFocusCapture?: react.FocusEventHandler<HTMLDivElement> | undefined;
2390
+ onBlur?: react.FocusEventHandler<HTMLDivElement> | undefined;
2391
+ onBlurCapture?: react.FocusEventHandler<HTMLDivElement> | undefined;
2392
+ onChange?: react.ChangeEventHandler<HTMLDivElement, Element> | undefined;
2393
+ onChangeCapture?: react.ChangeEventHandler<HTMLDivElement, Element> | undefined;
2394
+ onBeforeInput?: react.InputEventHandler<HTMLDivElement> | undefined;
2395
+ onBeforeInputCapture?: react.InputEventHandler<HTMLDivElement> | undefined;
2396
+ onInput?: react.InputEventHandler<HTMLDivElement> | undefined;
2397
+ onInputCapture?: react.InputEventHandler<HTMLDivElement> | undefined;
2398
+ onReset?: react.ReactEventHandler<HTMLDivElement> | undefined;
2399
+ onResetCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2400
+ onSubmit?: react.SubmitEventHandler<HTMLDivElement> | undefined;
2401
+ onSubmitCapture?: react.SubmitEventHandler<HTMLDivElement> | undefined;
2402
+ onInvalid?: react.ReactEventHandler<HTMLDivElement> | undefined;
2403
+ onInvalidCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2404
+ onLoad?: react.ReactEventHandler<HTMLDivElement> | undefined;
2405
+ onLoadCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2406
+ onError?: react.ReactEventHandler<HTMLDivElement> | undefined;
2407
+ onErrorCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2408
+ onKeyDown?: react.KeyboardEventHandler<HTMLDivElement> | undefined;
2409
+ onKeyDownCapture?: react.KeyboardEventHandler<HTMLDivElement> | undefined;
2410
+ onKeyPress?: react.KeyboardEventHandler<HTMLDivElement> | undefined;
2411
+ onKeyPressCapture?: react.KeyboardEventHandler<HTMLDivElement> | undefined;
2412
+ onKeyUp?: react.KeyboardEventHandler<HTMLDivElement> | undefined;
2413
+ onKeyUpCapture?: react.KeyboardEventHandler<HTMLDivElement> | undefined;
2414
+ onAbort?: react.ReactEventHandler<HTMLDivElement> | undefined;
2415
+ onAbortCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2416
+ onCanPlay?: react.ReactEventHandler<HTMLDivElement> | undefined;
2417
+ onCanPlayCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2418
+ onCanPlayThrough?: react.ReactEventHandler<HTMLDivElement> | undefined;
2419
+ onCanPlayThroughCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2420
+ onDurationChange?: react.ReactEventHandler<HTMLDivElement> | undefined;
2421
+ onDurationChangeCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2422
+ onEmptied?: react.ReactEventHandler<HTMLDivElement> | undefined;
2423
+ onEmptiedCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2424
+ onEncrypted?: react.ReactEventHandler<HTMLDivElement> | undefined;
2425
+ onEncryptedCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2426
+ onEnded?: react.ReactEventHandler<HTMLDivElement> | undefined;
2427
+ onEndedCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2428
+ onLoadedData?: react.ReactEventHandler<HTMLDivElement> | undefined;
2429
+ onLoadedDataCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2430
+ onLoadedMetadata?: react.ReactEventHandler<HTMLDivElement> | undefined;
2431
+ onLoadedMetadataCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2432
+ onLoadStart?: react.ReactEventHandler<HTMLDivElement> | undefined;
2433
+ onLoadStartCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2434
+ onPause?: react.ReactEventHandler<HTMLDivElement> | undefined;
2435
+ onPauseCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2436
+ onPlay?: react.ReactEventHandler<HTMLDivElement> | undefined;
2437
+ onPlayCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2438
+ onPlaying?: react.ReactEventHandler<HTMLDivElement> | undefined;
2439
+ onPlayingCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2440
+ onProgress?: react.ReactEventHandler<HTMLDivElement> | undefined;
2441
+ onProgressCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2442
+ onRateChange?: react.ReactEventHandler<HTMLDivElement> | undefined;
2443
+ onRateChangeCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2444
+ onSeeked?: react.ReactEventHandler<HTMLDivElement> | undefined;
2445
+ onSeekedCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2446
+ onSeeking?: react.ReactEventHandler<HTMLDivElement> | undefined;
2447
+ onSeekingCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2448
+ onStalled?: react.ReactEventHandler<HTMLDivElement> | undefined;
2449
+ onStalledCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2450
+ onSuspend?: react.ReactEventHandler<HTMLDivElement> | undefined;
2451
+ onSuspendCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2452
+ onTimeUpdate?: react.ReactEventHandler<HTMLDivElement> | undefined;
2453
+ onTimeUpdateCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2454
+ onVolumeChange?: react.ReactEventHandler<HTMLDivElement> | undefined;
2455
+ onVolumeChangeCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2456
+ onWaiting?: react.ReactEventHandler<HTMLDivElement> | undefined;
2457
+ onWaitingCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2458
+ onAuxClick?: react.MouseEventHandler<HTMLDivElement> | undefined;
2459
+ onAuxClickCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
2460
+ onClick?: react.MouseEventHandler<HTMLDivElement> | undefined;
2461
+ onClickCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
2462
+ onContextMenu?: react.MouseEventHandler<HTMLDivElement> | undefined;
2463
+ onContextMenuCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
2464
+ onDoubleClick?: react.MouseEventHandler<HTMLDivElement> | undefined;
2465
+ onDoubleClickCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
2466
+ onDrag?: react.DragEventHandler<HTMLDivElement> | undefined;
2467
+ onDragCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
2468
+ onDragEnd?: react.DragEventHandler<HTMLDivElement> | undefined;
2469
+ onDragEndCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
2470
+ onDragEnter?: react.DragEventHandler<HTMLDivElement> | undefined;
2471
+ onDragEnterCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
2472
+ onDragExit?: react.DragEventHandler<HTMLDivElement> | undefined;
2473
+ onDragExitCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
2474
+ onDragLeave?: react.DragEventHandler<HTMLDivElement> | undefined;
2475
+ onDragLeaveCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
2476
+ onDragOver?: react.DragEventHandler<HTMLDivElement> | undefined;
2477
+ onDragOverCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
2478
+ onDragStart?: react.DragEventHandler<HTMLDivElement> | undefined;
2479
+ onDragStartCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
2480
+ onDrop?: react.DragEventHandler<HTMLDivElement> | undefined;
2481
+ onDropCapture?: react.DragEventHandler<HTMLDivElement> | undefined;
2482
+ onMouseDown?: react.MouseEventHandler<HTMLDivElement> | undefined;
2483
+ onMouseDownCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
2484
+ onMouseEnter?: react.MouseEventHandler<HTMLDivElement> | undefined;
2485
+ onMouseLeave?: react.MouseEventHandler<HTMLDivElement> | undefined;
2486
+ onMouseMove?: react.MouseEventHandler<HTMLDivElement> | undefined;
2487
+ onMouseMoveCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
2488
+ onMouseOut?: react.MouseEventHandler<HTMLDivElement> | undefined;
2489
+ onMouseOutCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
2490
+ onMouseOver?: react.MouseEventHandler<HTMLDivElement> | undefined;
2491
+ onMouseOverCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
2492
+ onMouseUp?: react.MouseEventHandler<HTMLDivElement> | undefined;
2493
+ onMouseUpCapture?: react.MouseEventHandler<HTMLDivElement> | undefined;
2494
+ onSelect?: react.ReactEventHandler<HTMLDivElement> | undefined;
2495
+ onSelectCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
2496
+ onTouchCancel?: react.TouchEventHandler<HTMLDivElement> | undefined;
2497
+ onTouchCancelCapture?: react.TouchEventHandler<HTMLDivElement> | undefined;
2498
+ onTouchEnd?: react.TouchEventHandler<HTMLDivElement> | undefined;
2499
+ onTouchEndCapture?: react.TouchEventHandler<HTMLDivElement> | undefined;
2500
+ onTouchMove?: react.TouchEventHandler<HTMLDivElement> | undefined;
2501
+ onTouchMoveCapture?: react.TouchEventHandler<HTMLDivElement> | undefined;
2502
+ onTouchStart?: react.TouchEventHandler<HTMLDivElement> | undefined;
2503
+ onTouchStartCapture?: react.TouchEventHandler<HTMLDivElement> | undefined;
2504
+ onPointerDown?: react.PointerEventHandler<HTMLDivElement> | undefined;
2505
+ onPointerDownCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
2506
+ onPointerMove?: react.PointerEventHandler<HTMLDivElement> | undefined;
2507
+ onPointerMoveCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
2508
+ onPointerUp?: react.PointerEventHandler<HTMLDivElement> | undefined;
2509
+ onPointerUpCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
2510
+ onPointerCancel?: react.PointerEventHandler<HTMLDivElement> | undefined;
2511
+ onPointerCancelCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
2512
+ onPointerEnter?: react.PointerEventHandler<HTMLDivElement> | undefined;
2513
+ onPointerLeave?: react.PointerEventHandler<HTMLDivElement> | undefined;
2514
+ onPointerOver?: react.PointerEventHandler<HTMLDivElement> | undefined;
2515
+ onPointerOverCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
2516
+ onPointerOut?: react.PointerEventHandler<HTMLDivElement> | undefined;
2517
+ onPointerOutCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
2518
+ onGotPointerCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
2519
+ onGotPointerCaptureCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
2520
+ onLostPointerCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
2521
+ onLostPointerCaptureCapture?: react.PointerEventHandler<HTMLDivElement> | undefined;
2522
+ onScroll?: react.UIEventHandler<HTMLDivElement> | undefined;
2523
+ onScrollCapture?: react.UIEventHandler<HTMLDivElement> | undefined;
2524
+ onScrollEnd?: react.UIEventHandler<HTMLDivElement> | undefined;
2525
+ onScrollEndCapture?: react.UIEventHandler<HTMLDivElement> | undefined;
2526
+ onWheel?: react.WheelEventHandler<HTMLDivElement> | undefined;
2527
+ onWheelCapture?: react.WheelEventHandler<HTMLDivElement> | undefined;
2528
+ onAnimationStart?: react.AnimationEventHandler<HTMLDivElement> | undefined;
2529
+ onAnimationStartCapture?: react.AnimationEventHandler<HTMLDivElement> | undefined;
2530
+ onAnimationEnd?: react.AnimationEventHandler<HTMLDivElement> | undefined;
2531
+ onAnimationEndCapture?: react.AnimationEventHandler<HTMLDivElement> | undefined;
2532
+ onAnimationIteration?: react.AnimationEventHandler<HTMLDivElement> | undefined;
2533
+ onAnimationIterationCapture?: react.AnimationEventHandler<HTMLDivElement> | undefined;
2534
+ onToggle?: react.ToggleEventHandler<HTMLDivElement> | undefined;
2535
+ onBeforeToggle?: react.ToggleEventHandler<HTMLDivElement> | undefined;
2536
+ onTransitionCancel?: react.TransitionEventHandler<HTMLDivElement> | undefined;
2537
+ onTransitionCancelCapture?: react.TransitionEventHandler<HTMLDivElement> | undefined;
2538
+ onTransitionEnd?: react.TransitionEventHandler<HTMLDivElement> | undefined;
2539
+ onTransitionEndCapture?: react.TransitionEventHandler<HTMLDivElement> | undefined;
2540
+ onTransitionRun?: react.TransitionEventHandler<HTMLDivElement> | undefined;
2541
+ onTransitionRunCapture?: react.TransitionEventHandler<HTMLDivElement> | undefined;
2542
+ onTransitionStart?: react.TransitionEventHandler<HTMLDivElement> | undefined;
2543
+ onTransitionStartCapture?: react.TransitionEventHandler<HTMLDivElement> | undefined;
2544
+ className: string;
2545
+ 'data-size': EmptyStateSize;
2546
+ }, HTMLDivElement>;
2547
+
2548
+ type SkeletonVariant = 'text' | 'rect' | 'circle';
2549
+ interface SkeletonProps extends ComponentPropsWithRef<'span'> {
2550
+ /** `text` (default) is one line of the current font size; `rect` a block; `circle` an avatar. */
2551
+ variant?: SkeletonVariant | undefined;
2552
+ /** Any CSS length. Default: text `100%`, rect `100%`, circle `40px`. */
2553
+ width?: string | number | undefined;
2554
+ /** Any CSS length. Default: text `1em` (one line), rect `80px`, circle = `width`. */
2555
+ height?: string | number | undefined;
2556
+ /** For `text`: how many lines; the last is shorter. Default 1. */
2557
+ lines?: number | undefined;
2558
+ /** Hides the shimmer. Default `false`; reduced motion hides it anyway. */
2559
+ still?: boolean | undefined;
2560
+ }
2561
+ /**
2562
+ * A placeholder shape shown while real content loads. It is hidden from assistive tech: put
2563
+ * `aria-busy="true"` on the region being filled, or a `Spinner` with a label beside it, so the loading
2564
+ * state is announced once instead of per block.
2565
+ */
2566
+ declare function Skeleton({ variant, width, height, lines, still, className, style, ...rest }: SkeletonProps): react.JSX.Element;
2567
+
2568
+ interface FileInputProps extends FieldProps {
2569
+ /** Accepted types, as for the native attribute: `".pdf,.docx,text/plain"` or a list. Extensions, exact MIME types and `image/*` wildcards. */
2570
+ accept?: string | readonly string[] | undefined;
2571
+ /** How the accepted types read in the error message. Default derived from `accept` ("PDF, DOCX or plain text"). */
2572
+ acceptLabel?: string | undefined;
2573
+ /** Largest file accepted, in bytes or as `"10MB"` (base 1000, like the size shown in the list). */
2574
+ maxFileSize?: number | string | undefined;
2575
+ /** Allows several files. Without it a new file replaces the current one. */
2576
+ multiple?: boolean | undefined;
2577
+ /** With `multiple`, the most files the list holds. */
2578
+ maxFiles?: number | undefined;
2579
+ /** Controlled list of accepted files. Pass `[]` to clear. */
2580
+ files?: readonly File[] | undefined;
2581
+ /** Initial files when uncontrolled. */
2582
+ defaultFiles?: readonly File[] | undefined;
2583
+ /** Called with the accepted files (plain `File` objects) after every add or remove. Rejected files never appear here. */
2584
+ onFilesChange?: ((files: File[]) => void) | undefined;
2585
+ /** Drop zone text before the browse link. Default "Drop a file here or" (or "Drop files here or" with `multiple`). */
2586
+ idleLabel?: string | undefined;
2587
+ /** The browse link's text. Default "browse". */
2588
+ browseLabel?: string | undefined;
2589
+ /**
2590
+ * Lets people check a file before it is uploaded: the name of each PDF, plain text, Markdown or image
2591
+ * file becomes a button that opens it in a `FilePreviewDialog`. Other types (DOCX …) show a plain name.
2592
+ * Default `true`; no preview while `disabled`.
2593
+ */
2594
+ preview?: boolean | undefined;
2595
+ }
2596
+ /**
2597
+ * A labelled file picker with a drop zone, on FilePond (docs/adr/0004). Files stay in the browser: the
2598
+ * component hands plain `File` objects to `onFilesChange`, and with `name` it also keeps them in a file
2599
+ * input so a `<form>` (or a Server Action) submits them. Type, size and count are checked before a file
2600
+ * joins the list; a rejected file never joins it, and the reason shows in the field's error slot and is
2601
+ * announced. FilePond loads on mount, so the server renders a static drop zone and nothing of FilePond.
2602
+ */
2603
+ declare function FileInput({ label, hideLabel, description, error, invalid, required, disabled, name, size, className, accept, acceptLabel, maxFileSize, multiple, maxFiles, files, defaultFiles, onFilesChange, idleLabel, browseLabel, preview, }: FileInputProps): react.JSX.Element;
2604
+
2605
+ interface FilePreviewDialogProps {
2606
+ /** The file to show. Kept while the dialog closes, so pass `null` only once it has. */
2607
+ file: File | null | undefined;
2608
+ /** Controlled open state. */
2609
+ open: boolean;
2610
+ /** Called when the dialog asks to close (Esc, the ×, the backdrop). */
2611
+ onOpenChange: (open: boolean) => void;
2612
+ /** Where focus goes on close. Default: the element that had focus when it opened. */
2613
+ finalFocus?: DialogContentProps['finalFocus'];
2614
+ }
2615
+ /**
2616
+ * Shows a local file before it is uploaded: a PDF in the browser's own viewer, plain text and Markdown as
2617
+ * text, an image as an image. Any other type gets a short note and nothing else, because a blob URL runs
2618
+ * with the page's origin: only a PDF is ever framed, and it is re-typed `application/pdf` first, so an HTML
2619
+ * file named `.pdf` cannot run. The object URL exists only while the dialog is open.
2620
+ */
2621
+ declare function FilePreviewDialog({ file, open, onOpenChange, finalFocus }: FilePreviewDialogProps): react.JSX.Element;
2622
+
2623
+ interface PriorityNavItem {
2624
+ /** Where the link goes. */
2625
+ href: string;
2626
+ /** The visible text. A string (or number) is part of the width cache key; see `PriorityNav`. */
2627
+ label: ReactNode;
2628
+ /** A stable key. Defaults to `href`. */
2629
+ id?: string | undefined;
2630
+ /** The page being shown: `aria-current="page"`, and the link never collapses into "More". */
2631
+ current?: boolean | undefined;
2632
+ }
2633
+ /** What `renderLink` receives: spread it onto your link component. */
2634
+ interface PriorityNavLinkProps {
2635
+ href: string;
2636
+ className: string;
2637
+ 'aria-current': 'page' | undefined;
2638
+ onClick: MouseEventHandler<HTMLAnchorElement> | undefined;
2639
+ children: ReactNode;
2640
+ }
2641
+ interface PriorityNavProps extends Omit<ComponentPropsWithRef<'nav'>, 'children'> {
2642
+ /** Names the landmark: "Main". */
2643
+ 'aria-label': string;
2644
+ /** The links, in priority order: the first ones stay inline longest. */
2645
+ items: readonly PriorityNavItem[];
2646
+ /** Visible text of the overflow toggle. Default "More". */
2647
+ moreLabel?: string | undefined;
2648
+ /** Appended to the toggle's accessible name only: "More, 3 links". Default `n link(s)`. */
2649
+ moreCountLabel?: ((hidden: number) => string) | undefined;
2650
+ /** Renders each link. Default a plain `<a>`; pass a router link: `(props) => <Link {...props} />`. */
2651
+ renderLink?: ((props: PriorityNavLinkProps, item: PriorityNavItem) => ReactElement) | undefined;
2652
+ /**
2653
+ * Called when links start or stop collapsing into "More" (also `data-overflowing` on the `nav`), so a
2654
+ * header can make room, e.g. an action button going icon-only.
2655
+ */
2656
+ onOverflowChange?: ((overflowing: boolean) => void) | undefined;
2657
+ /**
2658
+ * Room in px the row must have beyond fitting every link before it stops reporting overflow. Set it to
2659
+ * the space your header gives back on overflow (the button label's width), so the two cannot oscillate.
2660
+ * Default 0.
2661
+ */
2662
+ overflowHysteresis?: number | undefined;
2663
+ }
2664
+ /**
2665
+ * Priority+ navigation: a row of primary links that keeps the ones that fit inline and collapses the rest
2666
+ * into a "More" disclosure at the end of the row. The current page is never collapsed. Follows the
2667
+ * WAI-ARIA APG disclosure navigation pattern (links in a list, a real button with `aria-expanded`), not
2668
+ * `role="menu"`. Server-renders every link inline, so it works before hydration and without JavaScript;
2669
+ * see docs/adr/0005-priority-nav.md.
2670
+ */
2671
+ declare function PriorityNav({ items, moreLabel, moreCountLabel, renderLink, onOverflowChange, overflowHysteresis, className, style, ...rest }: PriorityNavProps): react.JSX.Element;
2672
+
2673
+ type PopoverSide = 'top' | 'bottom' | 'left' | 'right';
2674
+ type PopoverAlign = 'start' | 'center' | 'end';
2675
+ interface PopoverRootProps {
2676
+ /** Controlled open state. */
2677
+ open?: boolean | undefined;
2678
+ /** Initial open state when uncontrolled. */
2679
+ defaultOpen?: boolean | undefined;
2680
+ /** Called when the popover opens or closes. */
2681
+ onOpenChange?: ((open: boolean) => void) | undefined;
2682
+ /** Default `false`: the page stays interactive and focus may leave. `true` makes the page inert until it closes. */
2683
+ modal?: boolean | undefined;
2684
+ children?: ReactNode | undefined;
2685
+ }
2686
+ /** Owns the open state. Wrap a `Popover.Trigger` and a `Popover.Content`. */
2687
+ declare function Root({ open, defaultOpen, onOpenChange, modal, children }: PopoverRootProps): react.JSX.Element;
2688
+ interface PopoverTriggerProps extends Omit<Popover$1.Trigger.Props, 'className'> {
2689
+ className?: string | undefined;
2690
+ }
2691
+ /**
2692
+ * Opens the popover. With no `render` it is a secondary Button; pass any Button or IconButton through
2693
+ * `render`: `<Popover.Trigger render={<IconButton label="Sweeps: running" dot="success" />}>`.
2694
+ */
2695
+ declare function Trigger({ render, className, children, ...rest }: PopoverTriggerProps): react.JSX.Element;
2696
+ interface PopoverContentProps extends Omit<Popover$1.Popup.Props, 'className'> {
2697
+ /** Side of the trigger it opens on; flips when there is no room. Default `bottom`. */
2698
+ side?: PopoverSide | undefined;
2699
+ /** Alignment along that side. Default `center`. */
2700
+ align?: PopoverAlign | undefined;
2701
+ /** Distance from the trigger in px. Default 4, or 8 with `arrow`. */
2702
+ sideOffset?: number | undefined;
2703
+ /** Draws a tip pointing at the trigger. */
2704
+ arrow?: boolean | undefined;
2705
+ className?: string | undefined;
2706
+ }
2707
+ /** Portal, positioner and the panel. Any content goes inside; name it with `Popover.Title`. */
2708
+ declare function Content({ side, align, sideOffset, arrow, className, children, ...rest }: PopoverContentProps): react.JSX.Element;
2709
+ interface PopoverTitleProps extends Omit<Popover$1.Title.Props, 'className'> {
2710
+ className?: string | undefined;
2711
+ }
2712
+ /** Names the popover (`aria-labelledby`). A heading, `h2` by default. */
2713
+ declare function Title({ className, ...rest }: PopoverTitleProps): react.JSX.Element;
2714
+ interface PopoverDescriptionProps extends Omit<Popover$1.Description.Props, 'className'> {
2715
+ className?: string | undefined;
2716
+ }
2717
+ /** Describes the popover (`aria-describedby`). Muted text. */
2718
+ declare function Description({ className, ...rest }: PopoverDescriptionProps): react.JSX.Element;
2719
+ interface PopoverCloseProps extends Omit<Popover$1.Close.Props, 'className'> {
2720
+ className?: string | undefined;
2721
+ }
2722
+ /** With no children or `render`, the × in the corner. Otherwise wraps any Button: `<Popover.Close render={<Button variant="ghost" />}>Done</Popover.Close>`. */
2723
+ declare function Close({ className, children, render, ...rest }: PopoverCloseProps): react.JSX.Element;
2724
+ /** A non-modal panel anchored to a trigger, for a small form, a status summary or a legend. Built on Base UI's Popover. */
2725
+ declare const Popover: {
2726
+ Root: typeof Root;
2727
+ Trigger: typeof Trigger;
2728
+ Content: typeof Content;
2729
+ Title: typeof Title;
2730
+ Description: typeof Description;
2731
+ Close: typeof Close;
2732
+ };
2733
+
2734
+ interface BroomIconProps extends Omit<ComponentPropsWithRef<'svg'>, 'children'> {
2735
+ /** Sweeps back and forth while dust drifts. With `prefers-reduced-motion` it holds still and shows the dust. */
2736
+ sweeping?: boolean | undefined;
2737
+ /** The Icon sizes (`lg` 20, the nav size, is the default), or `display` (72px, stroke 1.75px) for empty states and showcases. Inside an IconButton it fills the icon slot one step up, since it is drawn on a 24px grid. */
2738
+ size?: IconSize | 'display' | undefined;
2739
+ /** Gives the icon an accessible name (`role="img"`). Without it the icon is decorative and hidden from assistive tech. */
2740
+ title?: string | undefined;
2741
+ }
2742
+ /**
2743
+ * An animated broom on a 24×24 grid, for "a sweep is running". Inline SVG, because CSS cannot animate
2744
+ * inside a `<use>` clone. Strokes keep a fixed screen width at every size (`vector-effect: non-scaling-stroke`).
2745
+ * Decorative by default: say what is happening in the surrounding control's label ("Sweeps: running").
2746
+ */
2747
+ declare function BroomIcon({ sweeping, size, title, className, ...rest }: BroomIconProps): react.JSX.Element;
2748
+
1614
2749
  declare const version = "0.1.1";
1615
2750
 
1616
- export { ArchiveIcon, ArrowLeftIcon, ArrowRightIcon, Badge, Banner, BellIcon, BriefcaseIcon, Button, CalendarIcon, Card, CheckIcon, Checkbox, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CircleCheckIcon, CircleXIcon, ClockIcon, CopyIcon, Dialog, DocumentIcon, DownloadIcon, EditIcon, ExternalLinkIcon, EyeIcon, FilterIcon, FlagIcon, Heading, Icon, IconButton, InboxIcon, InfoIcon, Inline, Input, Kbd, LinkIcon, MailIcon, MapPinIcon, Menu, MenuIcon, MinusIcon, MoonIcon, MoreHorizontalIcon, MoreVerticalIcon, PauseIcon, PlayIcon, PlusIcon, Progress, RefreshIcon, SearchIcon, Select, SettingsIcon, Spinner, Stack, StarIcon, SunIcon, Switch, Tabs, Text, Textarea, ThumbsDownIcon, ThumbsUpIcon, Toolbar, Tooltip, TrashIcon, UndoIcon, UserIcon, WarningIcon, XIcon, iconNames, version };
1617
- export type { BadgeProps, BadgeSize, BadgeTone, BadgeVariant, BannerProps, BannerTone, ButtonProps, ButtonSize, ButtonVariant, CardElement, CardPadding, CardProps, CardVariant, CheckboxProps, ControlSize, DialogActionsProps, DialogBodyProps, DialogCloseProps, DialogContentProps, DialogDescriptionProps, DialogRootProps, DialogSize, DialogTitleProps, FieldProps, HeadingElement, HeadingLevel, HeadingProps, HeadingSize, IconButtonProps, IconGlyphProps, IconName, IconProps, IconSize, InlineAlign, InlineElement, InlineJustify, InlineProps, InputProps, KbdGroupProps, KbdProps, MenuAlign, MenuCheckboxItemProps, MenuContentProps, MenuGroupProps, MenuItemProps, MenuItemTone, MenuLinkItemProps, MenuRadioGroupProps, MenuRadioItemProps, MenuRootProps, MenuSeparatorProps, MenuSide, MenuTriggerProps, ProgressProps, ProgressSize, ProgressTone, ProgressVariant, SelectGroup, SelectOption, SelectProps, SpacingSize, SpinnerProps, StackAlign, StackElement, StackJustify, StackProps, SwitchProps, TabsListProps, TabsPanelProps, TabsRootProps, TabsTabProps, TextAlign, TextElement, TextProps, TextSize, TextTone, TextWeight, TextareaProps, ToolbarButtonProps, ToolbarGroupProps, ToolbarRootProps, ToolbarSeparatorProps, ToolbarSpacerProps, TooltipAlign, TooltipProps, TooltipSide };
2751
+ export { ArchiveIcon, ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpIcon, Badge, Banner, BellIcon, BriefcaseIcon, BroomIcon, Button, CalendarIcon, Card, CheckIcon, Checkbox, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, Chip, CircleCheckIcon, CircleXIcon, ClockIcon, CopyIcon, Dialog, Disclosure, DocumentIcon, DownloadIcon, EditIcon, EmptyState, ExternalLinkIcon, EyeIcon, FileInput, FilePreviewDialog, FilterIcon, FlagIcon, Heading, Icon, IconButton, InboxIcon, InfoIcon, Inline, Input, Kbd, LinkIcon, MailIcon, MapPinIcon, Menu, MenuIcon, MinusIcon, MoonIcon, MoreHorizontalIcon, MoreVerticalIcon, PauseIcon, PlayIcon, PlusIcon, Popover, PriorityNav, Progress, RefreshIcon, SearchIcon, Select, SelectionBar, SettingsIcon, Skeleton, Spinner, Stack, StarIcon, Stat, SunIcon, Switch, Table, Tabs, Text, Textarea, ThumbsDownIcon, ThumbsUpIcon, Toast, Toolbar, Tooltip, TrashIcon, UndoIcon, UserIcon, WarningIcon, XIcon, iconNames, useRowSelection, useToast, version };
2752
+ export type { BadgeProps, BadgeSize, BadgeTone, BadgeVariant, BannerProps, BannerTone, BroomIconProps, ButtonProps, ButtonSize, ButtonVariant, CardElement, CardPadding, CardProps, CardVariant, CheckboxProps, ChipProps, ChipSize, ChipTone, ControlSize, DialogActionsProps, DialogBodyProps, DialogCloseProps, DialogContentProps, DialogDescriptionProps, DialogRootProps, DialogSize, DialogTitleProps, DialogVariant, DisclosureProps, EmptyStateElement, EmptyStateProps, EmptyStateSize, FieldProps, FileInputProps, FilePreviewDialogProps, HeadingElement, HeadingLevel, HeadingProps, HeadingSize, IconButtonDotTone, IconButtonProps, IconGlyphProps, IconName, IconProps, IconSize, InlineAlign, InlineElement, InlineJustify, InlineProps, InputProps, KbdGroupProps, KbdProps, MenuAlign, MenuCheckboxItemProps, MenuContentProps, MenuGroupProps, MenuItemProps, MenuItemTone, MenuLinkItemProps, MenuRadioGroupProps, MenuRadioItemProps, MenuRootProps, MenuSeparatorProps, MenuSide, MenuTriggerProps, PopoverAlign, PopoverCloseProps, PopoverContentProps, PopoverDescriptionProps, PopoverRootProps, PopoverSide, PopoverTitleProps, PopoverTriggerProps, PriorityNavItem, PriorityNavLinkProps, PriorityNavProps, ProgressProps, ProgressSize, ProgressTone, ProgressVariant, RowSelection, RowSelectionHeaderState, SelectGroup, SelectOption, SelectProps, SelectionBarProps, SkeletonProps, SkeletonVariant, SpacingSize, SpinnerProps, StackAlign, StackElement, StackJustify, StackProps, StatDeltaTone, StatElement, StatProps, StatSize, StatTrend, StatVariant, SwitchProps, TableAlign, TableBodyProps, TableCaptionProps, TableCellProps, TableDensity, TableFootProps, TableHeadProps, TableHeaderProps, TableRootProps, TableRowProps, TableSelectionCellProps, TableSelectionHeaderProps, TableSortDirection, TabsListProps, TabsListVariant, TabsPanelProps, TabsRootProps, TabsTabProps, TextAlign, TextElement, TextProps, TextSize, TextTone, TextWeight, TextareaProps, TextareaVariant, ToastApi, ToastOptions, ToastProviderProps, ToastTone, ToolbarButtonProps, ToolbarGroupProps, ToolbarLinkProps, ToolbarRootProps, ToolbarSeparatorProps, ToolbarSpacerProps, TooltipAlign, TooltipProps, TooltipSide };