@nvidia-elements/core 2.1.6 → 2.2.1
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/CHANGELOG.md +24 -0
- package/dist/accordion/accordion.d.ts +7 -5
- package/dist/accordion/accordion2.js +4 -4
- package/dist/accordion/accordion2.js.map +1 -1
- package/dist/alert/alert-group2.js +1 -1
- package/dist/alert/alert2.js +1 -1
- package/dist/avatar/avatar-group.d.ts +1 -1
- package/dist/avatar/avatar-group2.js +1 -1
- package/dist/avatar/avatar-group2.js.map +1 -1
- package/dist/avatar/avatar.d.ts +1 -1
- package/dist/avatar/avatar2.js +1 -1
- package/dist/avatar/avatar2.js.map +1 -1
- package/dist/badge/badge.d.ts +1 -1
- package/dist/badge/badge2.js +1 -1
- package/dist/badge/badge2.js.map +1 -1
- package/dist/breadcrumb/breadcrumb2.js +1 -1
- package/dist/bundles/index.d.ts +81 -45
- package/dist/bundles/index.js +2 -2
- package/dist/button/button2.js +1 -1
- package/dist/button-group/button-group2.js +1 -1
- package/dist/card/card.d.ts +3 -1
- package/dist/card/card2.js +4 -4
- package/dist/card/card2.js.map +1 -1
- package/dist/chat-message/chat-message.d.ts +3 -1
- package/dist/chat-message/chat-message2.js +1 -1
- package/dist/chat-message/chat-message2.js.map +1 -1
- package/dist/checkbox/checkbox-group2.js +1 -1
- package/dist/checkbox/checkbox2.js +1 -1
- package/dist/color/color2.js +1 -1
- package/dist/combobox/combobox2.js +1 -1
- package/dist/copy-button/copy-button.d.ts +1 -1
- package/dist/copy-button/copy-button2.js +1 -1
- package/dist/copy-button/copy-button2.js.map +1 -1
- package/dist/custom-elements-jsx.d.ts +1340 -982
- package/dist/custom-elements-vue.d.ts +1048 -859
- package/dist/custom-elements.json +1382 -1948
- package/dist/data.html.json +330 -510
- package/dist/date/date2.js +1 -1
- package/dist/datetime/datetime2.js +1 -1
- package/dist/dialog/dialog-footer2.js +1 -1
- package/dist/dialog/dialog-header2.js +1 -1
- package/dist/dialog/dialog.d.ts +1 -1
- package/dist/dialog/dialog2.js +1 -1
- package/dist/dialog/dialog2.js.map +1 -1
- package/dist/divider/divider2.js +1 -1
- package/dist/dot/dot2.js +1 -1
- package/dist/drawer/drawer-content2.js +1 -1
- package/dist/drawer/drawer-footer2.js +1 -1
- package/dist/drawer/drawer-header2.js +1 -1
- package/dist/drawer/drawer.d.ts +1 -1
- package/dist/drawer/drawer2.js +1 -1
- package/dist/drawer/drawer2.js.map +1 -1
- package/dist/dropdown/dropdown-footer2.js +1 -1
- package/dist/dropdown/dropdown-header2.js +1 -1
- package/dist/dropdown/dropdown.d.ts +1 -0
- package/dist/dropdown/dropdown2.js +1 -1
- package/dist/dropdown/dropdown2.js.map +1 -1
- package/dist/dropdown-group/dropdown-group.d.ts +1 -2
- package/dist/dropdown-group/dropdown-group.js +1 -1
- package/dist/dropdown-group/dropdown-group.js.map +1 -1
- package/dist/dropzone/dropzone.d.ts +6 -3
- package/dist/dropzone/dropzone2.js +1 -1
- package/dist/dropzone/dropzone2.js.map +1 -1
- package/dist/file/file2.js +1 -1
- package/dist/format-datetime/format-datetime2.js +1 -1
- package/dist/format-number/format-number.d.ts +1 -1
- package/dist/format-number/format-number2.js +1 -1
- package/dist/format-number/format-number2.js.map +1 -1
- package/dist/format-relative-time/format-relative-time2.js +1 -1
- package/dist/forms/control/control2.js +1 -1
- package/dist/forms/control-group/control-group2.js +1 -1
- package/dist/forms/control-message/control-message.d.ts +2 -1
- package/dist/forms/control-message/control-message2.js +1 -1
- package/dist/forms/control-message/control-message2.js.map +1 -1
- package/dist/gauge/gauge2.js +1 -1
- package/dist/grid/cell/cell.d.ts +1 -1
- package/dist/grid/cell/cell2.js +1 -1
- package/dist/grid/cell/cell2.js.map +1 -1
- package/dist/grid/column/column.d.ts +1 -1
- package/dist/grid/column/column2.js +1 -1
- package/dist/grid/column/column2.js.map +1 -1
- package/dist/grid/footer/footer.d.ts +2 -1
- package/dist/grid/footer/footer2.js +1 -1
- package/dist/grid/footer/footer2.js.map +1 -1
- package/dist/grid/grid.d.ts +1 -1
- package/dist/grid/grid2.js +1 -1
- package/dist/grid/grid2.js.map +1 -1
- package/dist/grid/header/header2.js +1 -1
- package/dist/grid/placeholder/placeholder.d.ts +1 -1
- package/dist/grid/placeholder/placeholder2.js +1 -1
- package/dist/grid/placeholder/placeholder2.js.map +1 -1
- package/dist/grid/row/row2.js +1 -1
- package/dist/icon/icon2.js +2 -2
- package/dist/icon-button/icon-button2.js +1 -1
- package/dist/index.js +1 -1
- package/dist/input/input-group2.js +1 -1
- package/dist/input/input2.js +1 -1
- package/dist/internal/services/global.service.js +1 -1
- package/dist/internal/services/i18n.service.d.ts +14 -0
- package/dist/internal/services/i18n.service.js +15 -1
- package/dist/internal/services/i18n.service.js.map +1 -1
- package/dist/internal/types/index.d.ts +3 -3
- package/dist/internal/types/index.js.map +1 -1
- package/dist/logo/logo.d.ts +1 -1
- package/dist/logo/logo2.js +1 -1
- package/dist/logo/logo2.js.map +1 -1
- package/dist/menu/menu-item.d.ts +2 -1
- package/dist/menu/menu-item2.js +1 -1
- package/dist/menu/menu-item2.js.map +1 -1
- package/dist/menu/menu2.js +1 -1
- package/dist/month/month2.js +1 -1
- package/dist/notification/notification-group2.js +1 -1
- package/dist/notification/notification.d.ts +1 -1
- package/dist/notification/notification2.js +1 -1
- package/dist/notification/notification2.js.map +1 -1
- package/dist/page/page-panel/page-panel-content2.js +1 -1
- package/dist/page/page-panel/page-panel-footer.d.ts +1 -0
- package/dist/page/page-panel/page-panel-footer2.js +1 -1
- package/dist/page/page-panel/page-panel-footer2.js.map +1 -1
- package/dist/page/page-panel/page-panel-header.d.ts +1 -0
- package/dist/page/page-panel/page-panel-header2.js +1 -1
- package/dist/page/page-panel/page-panel-header2.js.map +1 -1
- package/dist/page/page-panel/page-panel.d.ts +1 -1
- package/dist/page/page-panel/page-panel2.js +1 -1
- package/dist/page/page-panel/page-panel2.js.map +1 -1
- package/dist/page/page2.js +1 -1
- package/dist/page-header/page-header2.js +1 -1
- package/dist/page-loader/page-loader.d.ts +1 -1
- package/dist/page-loader/page-loader2.js +1 -1
- package/dist/page-loader/page-loader2.js.map +1 -1
- package/dist/pagination/pagination.d.ts +4 -3
- package/dist/pagination/pagination2.js +5 -2
- package/dist/pagination/pagination2.js.map +1 -1
- package/dist/panel/panel2.js +4 -4
- package/dist/password/password2.js +1 -1
- package/dist/preferences-input/preferences-input.d.ts +2 -0
- package/dist/preferences-input/preferences-input2.js +1 -1
- package/dist/preferences-input/preferences-input2.js.map +1 -1
- package/dist/progress-bar/progress-bar2.js +1 -1
- package/dist/progress-ring/progress-ring2.js +1 -1
- package/dist/progressive-filter-chip/progressive-filter-chip.d.ts +1 -1
- package/dist/progressive-filter-chip/progressive-filter-chip2.js +1 -1
- package/dist/progressive-filter-chip/progressive-filter-chip2.js.map +1 -1
- package/dist/pulse/pulse2.js +1 -1
- package/dist/radio/radio-group2.js +1 -1
- package/dist/radio/radio2.js +1 -1
- package/dist/range/range2.js +1 -1
- package/dist/resize-handle/resize-handle2.js +1 -1
- package/dist/search/search2.js +1 -1
- package/dist/select/select2.js +1 -1
- package/dist/skeleton/skeleton.d.ts +2 -2
- package/dist/skeleton/skeleton2.js +1 -1
- package/dist/skeleton/skeleton2.js.map +1 -1
- package/dist/sort-button/sort-button2.js +1 -1
- package/dist/sparkline/sparkline2.js +1 -1
- package/dist/star-rating/star-rating2.js +1 -1
- package/dist/steps/steps.d.ts +1 -1
- package/dist/steps/steps2.js +2 -2
- package/dist/steps/steps2.js.map +1 -1
- package/dist/switch/switch-group2.js +1 -1
- package/dist/switch/switch2.js +1 -1
- package/dist/tabs/tabs-group2.js +1 -1
- package/dist/tabs/tabs.d.ts +1 -1
- package/dist/tabs/tabs2.js +2 -2
- package/dist/tabs/tabs2.js.map +1 -1
- package/dist/tag/tag.d.ts +1 -1
- package/dist/tag/tag2.js +1 -1
- package/dist/tag/tag2.js.map +1 -1
- package/dist/textarea/textarea2.js +1 -1
- package/dist/time/time2.js +1 -1
- package/dist/toast/toast.d.ts +1 -1
- package/dist/toast/toast2.js +1 -1
- package/dist/toast/toast2.js.map +1 -1
- package/dist/toggletip/toggletip-footer2.js +1 -1
- package/dist/toggletip/toggletip-header2.js +1 -1
- package/dist/toggletip/toggletip.d.ts +1 -0
- package/dist/toggletip/toggletip2.js +1 -1
- package/dist/toggletip/toggletip2.js.map +1 -1
- package/dist/toolbar/toolbar.d.ts +1 -1
- package/dist/toolbar/toolbar2.js +1 -1
- package/dist/toolbar/toolbar2.js.map +1 -1
- package/dist/tooltip/tooltip.d.ts +2 -1
- package/dist/tooltip/tooltip2.js +1 -1
- package/dist/tooltip/tooltip2.js.map +1 -1
- package/dist/tree/tree-node.d.ts +3 -0
- package/dist/tree/tree-node2.js +1 -1
- package/dist/tree/tree-node2.js.map +1 -1
- package/dist/tree/tree2.js +1 -1
- package/dist/week/week2.js +1 -1
- package/package.json +5 -5
|
@@ -73,21 +73,17 @@ type BaseEvents = {
|
|
|
73
73
|
onPointerMove?: (event: PointerEvent) => void;
|
|
74
74
|
};
|
|
75
75
|
|
|
76
|
-
export type AccordionHeaderProps = {
|
|
77
|
-
/** */
|
|
78
|
-
slot?: string;
|
|
79
|
-
};
|
|
76
|
+
export type AccordionHeaderProps = {};
|
|
80
77
|
|
|
81
78
|
export type AccordionContentProps = {};
|
|
82
79
|
|
|
83
80
|
export type AccordionProps = {
|
|
81
|
+
/** Determines whether the accordion should opt-in to stateful expansion behavior (defaults to stateless) */
|
|
82
|
+
"behavior-expand"?: boolean;
|
|
84
83
|
/** Enables updating internal string values for internationalization. */
|
|
85
84
|
i18n?: string;
|
|
86
|
-
/**
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
- `inset` Element container optimizes for embedding or inset placement inside another containing element. */
|
|
90
|
-
container?: "flat" | "inset" | "default";
|
|
85
|
+
/** Determines the container styles of component. Flat suits nesting accordions within other containers. Inset suits more complex accordions where content needs distinct separation. */
|
|
86
|
+
container?: "flat" | "inset" | undefined;
|
|
91
87
|
/** Indicates whether collapsible content is currently visible or hidden from the user. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)
|
|
92
88
|
- `true` The associated content expands and becomes visible to the user.
|
|
93
89
|
|
|
@@ -99,7 +95,7 @@ export type AccordionProps = {
|
|
|
99
95
|
- `false` The element has an enabled state and accepts interaction. */
|
|
100
96
|
disabled?: boolean;
|
|
101
97
|
/** Determines whether the accordion should opt-in to stateful expansion behavior (defaults to stateless) */
|
|
102
|
-
|
|
98
|
+
behaviorExpand?: boolean;
|
|
103
99
|
};
|
|
104
100
|
|
|
105
101
|
export type AccordionGroupProps = {
|
|
@@ -107,11 +103,12 @@ export type AccordionGroupProps = {
|
|
|
107
103
|
"behavior-expand"?: boolean;
|
|
108
104
|
/** Determines whether the accordion should opt-in to stateful expansion of a single accordion at a time */
|
|
109
105
|
"behavior-expand-single"?: boolean;
|
|
110
|
-
/**
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
container
|
|
106
|
+
/** Determines whether the accordion should opt-in to stateful expansion behavior (defaults to stateless) */
|
|
107
|
+
behaviorExpand?: boolean;
|
|
108
|
+
/** Determines whether the accordion should opt-in to stateful expansion of a single accordion at a time */
|
|
109
|
+
behaviorExpandSingle?: boolean;
|
|
110
|
+
/** Controls the container style applied to child accordions. `flat` removes the visual container, `inset` adds rounded containment, and omission uses the default divided presentation. */
|
|
111
|
+
container?: "flat" | "inset" | undefined;
|
|
115
112
|
};
|
|
116
113
|
|
|
117
114
|
export type AlertGroupProps = {
|
|
@@ -123,10 +120,9 @@ export type AlertGroupProps = {
|
|
|
123
120
|
- `success` Represents positive outcomes, confirmations, or constructive actions.
|
|
124
121
|
|
|
125
122
|
- `danger` Signals destructive or irreversible actions that need extra attention and confirmation. */
|
|
126
|
-
status?: "accent" | "warning" | "success" | "danger" |
|
|
127
|
-
/**
|
|
128
|
-
|
|
129
|
-
prominence?: "emphasis" | "default";
|
|
123
|
+
status?: "accent" | "warning" | "success" | "danger" | undefined;
|
|
124
|
+
/** Determines the visual prominence or weight, emphasis applies banner style alerts */
|
|
125
|
+
prominence?: "emphasis" | undefined;
|
|
130
126
|
/** Defines a base color from the theme color palette */
|
|
131
127
|
color?:
|
|
132
128
|
| "red-cardinal"
|
|
@@ -151,13 +147,12 @@ export type AlertGroupProps = {
|
|
|
151
147
|
| "lime-pear"
|
|
152
148
|
| "yellow-nova"
|
|
153
149
|
| "brand-green";
|
|
154
|
-
/**
|
|
155
|
-
|
|
156
|
-
container?: "full" | "default";
|
|
150
|
+
/** Determines the container bounds of the element */
|
|
151
|
+
container?: "full" | undefined;
|
|
157
152
|
};
|
|
158
153
|
|
|
159
154
|
export type AlertProps = {
|
|
160
|
-
/**
|
|
155
|
+
/** Defines visual treatment to represent a ongoing task or support status.
|
|
161
156
|
- `accent` Highlights important actions or draws attention to primary interactive elements.
|
|
162
157
|
|
|
163
158
|
- `warning` Indicates cautionary actions that require careful consideration before proceeding.
|
|
@@ -204,7 +199,7 @@ export type AlertProps = {
|
|
|
204
199
|
| "unknown"
|
|
205
200
|
| "ignored"
|
|
206
201
|
| "muted"
|
|
207
|
-
|
|
|
202
|
+
| undefined;
|
|
208
203
|
/** Indicates whether the user can dismiss or close the element.
|
|
209
204
|
- `true` The element displays a close control and the user can dismiss it.
|
|
210
205
|
|
|
@@ -212,7 +207,6 @@ export type AlertProps = {
|
|
|
212
207
|
closable?: boolean;
|
|
213
208
|
/** Enables updating internal string values for internationalization. */
|
|
214
209
|
i18n?: string;
|
|
215
|
-
|
|
216
210
|
/** Dispatched when the alert closes within an alert group. */
|
|
217
211
|
onclose?: (e: CustomEvent<never>) => void;
|
|
218
212
|
};
|
|
@@ -220,13 +214,13 @@ export type AlertProps = {
|
|
|
220
214
|
export type AvatarGroupProps = {};
|
|
221
215
|
|
|
222
216
|
export type AvatarProps = {
|
|
223
|
-
/**
|
|
217
|
+
/** Sets size of the avatar component. Update size through the `width + height` css props as an alternative.
|
|
224
218
|
- `sm` Compact size for dense layouts or secondary elements with less visual prominence.
|
|
225
219
|
|
|
226
220
|
- `md` Standard size that works well in most contexts and provides balanced visibility.
|
|
227
221
|
|
|
228
222
|
- `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts. */
|
|
229
|
-
size?: "sm" | "md" | "lg" | "xs" |
|
|
223
|
+
size?: "sm" | "md" | "lg" | "xs" | undefined;
|
|
230
224
|
/** Defines a base color from the theme color palette */
|
|
231
225
|
color?:
|
|
232
226
|
| "red-cardinal"
|
|
@@ -254,7 +248,7 @@ export type AvatarProps = {
|
|
|
254
248
|
};
|
|
255
249
|
|
|
256
250
|
export type BadgeProps = {
|
|
257
|
-
/**
|
|
251
|
+
/** Visual treatment to represent a ongoing task, support status.
|
|
258
252
|
- `accent` Highlights important actions or draws attention to primary interactive elements.
|
|
259
253
|
|
|
260
254
|
- `warning` Indicates cautionary actions that require careful consideration before proceeding.
|
|
@@ -324,12 +318,10 @@ export type BadgeProps = {
|
|
|
324
318
|
| "lime-pear"
|
|
325
319
|
| "yellow-nova"
|
|
326
320
|
| "brand-green";
|
|
327
|
-
/**
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
- `emphasis` Increases visual weight to draw attention and highlight important elements. */
|
|
332
|
-
prominence?: "emphasis" | "default";
|
|
321
|
+
/** Determines the container styles of component. Flat suits nesting within other containers. */
|
|
322
|
+
container?: "flat" | undefined;
|
|
323
|
+
/** Determines the visual prominence or weight */
|
|
324
|
+
prominence?: "emphasis" | undefined;
|
|
333
325
|
/** Enables updating internal string values for internationalization. */
|
|
334
326
|
i18n?: string;
|
|
335
327
|
};
|
|
@@ -339,14 +331,15 @@ export type BreadcrumbProps = {};
|
|
|
339
331
|
export type ButtonGroupProps = {
|
|
340
332
|
/** By default the button group is stateless. Add the `behavior-select` attribute and set to `single` or `multi` to enable stateful selction handling. */
|
|
341
333
|
"behavior-select"?: "single" | "multi";
|
|
342
|
-
/**
|
|
343
|
-
|
|
344
|
-
container
|
|
334
|
+
/** By default the button group is stateless. Add the `behavior-select` attribute and set to `single` or `multi` to enable stateful selction handling. */
|
|
335
|
+
behaviorSelect?: "single" | "multi";
|
|
336
|
+
/** Set the style of the button group using the `container` property. Options are the default display when omitting the attribute, `flat` or `rounded`. */
|
|
337
|
+
container?: "flat" | "rounded" | undefined;
|
|
345
338
|
/** Controls the directional flow of the element's layout and interaction pattern.
|
|
346
339
|
- `horizontal` Element orients horizontally with left-to-right flow.
|
|
347
340
|
|
|
348
341
|
- `vertical` Element orients vertically with top-to-bottom flow. */
|
|
349
|
-
orientation?: "horizontal" | "vertical" |
|
|
342
|
+
orientation?: "horizontal" | "vertical" | undefined;
|
|
350
343
|
/** The Interaction type provides a way to show the intent of an interactive element. This can help users quickly understand what each interaction does and reduce the potential for confusion or errors.
|
|
351
344
|
- `emphasis` Shows the interaction targets emphasis or highlighting primary actions.
|
|
352
345
|
|
|
@@ -358,22 +351,34 @@ export type ButtonGroupProps = {
|
|
|
358
351
|
- `md` Standard size that works well in most contexts and provides balanced visibility.
|
|
359
352
|
|
|
360
353
|
- `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts. */
|
|
361
|
-
size?: "sm" | "md" | "lg" |
|
|
354
|
+
size?: "sm" | "md" | "lg" | undefined;
|
|
362
355
|
};
|
|
363
356
|
|
|
364
357
|
export type ButtonProps = {
|
|
365
|
-
/**
|
|
366
|
-
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
358
|
+
/** Indicates whether the element is a noninteractive visual treatment instead of a button.
|
|
359
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly */
|
|
360
|
+
readonly?: boolean;
|
|
361
|
+
/** Establishes a relationship between a popover and its invoker button.
|
|
362
|
+
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetElement */
|
|
363
|
+
popovertarget?: string;
|
|
364
|
+
/** The popover target action to perform on the popover target element.
|
|
365
|
+
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetAction */
|
|
366
|
+
popovertargetaction?: "show" | "hide" | "toggle";
|
|
367
|
+
/** The element that receives the command.
|
|
368
|
+
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
369
|
+
commandfor?: string;
|
|
370
|
+
/** The element that receives the interest.
|
|
371
|
+
https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement */
|
|
372
|
+
interestfor?: string;
|
|
373
|
+
/** Determines the container of the button. Flat suits nesting within other containers or more muted style. Inline suits inline content such as text. */
|
|
374
|
+
container?: "flat" | "inline" | undefined;
|
|
370
375
|
/** Controls the visual scale of an element to match its importance and available space.
|
|
371
376
|
- `sm` Compact size for dense layouts or secondary elements with less visual prominence.
|
|
372
377
|
|
|
373
378
|
- `md` Standard size that works well in most contexts and provides balanced visibility.
|
|
374
379
|
|
|
375
380
|
- `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts. */
|
|
376
|
-
size?: "sm" | "md" | "lg" |
|
|
381
|
+
size?: "sm" | "md" | "lg" | undefined;
|
|
377
382
|
/** The Interaction type provides a way to show the intent of an interactive element. This can help users quickly understand what each interaction does and reduce the potential for confusion or errors.
|
|
378
383
|
- `emphasis` Shows the interaction targets emphasis or highlighting primary actions.
|
|
379
384
|
|
|
@@ -389,14 +394,15 @@ export type ButtonProps = {
|
|
|
389
394
|
|
|
390
395
|
- `false` The associated content collapses and hides from the user. */
|
|
391
396
|
expanded?: boolean;
|
|
392
|
-
/**
|
|
397
|
+
/** Indicates whether the element is a noninteractive visual treatment instead of a button.
|
|
393
398
|
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly */
|
|
394
|
-
|
|
395
|
-
/**
|
|
396
|
-
|
|
399
|
+
readOnly?: boolean;
|
|
400
|
+
/** Associates the button with a form. Set the property to a form element or its ID. The HTML attribute accepts only
|
|
401
|
+
the form ID. Reading the property returns the associated form element or `null`.
|
|
397
402
|
https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/form */
|
|
398
403
|
form?: string | HTMLFormElement | null;
|
|
399
|
-
/** The name of the
|
|
404
|
+
/** The name of the button, submitted as a pair with the button value as part of the form data.
|
|
405
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-name */
|
|
400
406
|
name?: string;
|
|
401
407
|
/** Defines the value associated with the element's name when submitting the form data. The server receives this value in params when the form submits through this button. [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#value) */
|
|
402
408
|
value?: string;
|
|
@@ -420,53 +426,36 @@ https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type */
|
|
|
420
426
|
current?: "page" | "step";
|
|
421
427
|
/** Establishes a relationship between a popover and its invoker button.
|
|
422
428
|
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetElement */
|
|
423
|
-
|
|
429
|
+
popoverTargetElement?: HTMLElement | null;
|
|
424
430
|
/** The popover target action to perform on the popover target element.
|
|
425
431
|
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetAction */
|
|
426
|
-
|
|
432
|
+
popoverTargetAction?: "show" | "hide" | "toggle";
|
|
427
433
|
/** The element that receives the command.
|
|
428
434
|
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
429
|
-
|
|
435
|
+
commandForElement?: HTMLElement | null;
|
|
430
436
|
/** The command to execute on the element.
|
|
431
437
|
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
432
438
|
command?: string;
|
|
433
439
|
/** The element that receives the interest.
|
|
434
|
-
https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement */
|
|
435
|
-
interestfor?: string;
|
|
436
|
-
/** Establishes a relationship between a popover and its invoker button.
|
|
437
|
-
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetElement */
|
|
438
|
-
popoverTargetElement?: HTMLElement | null;
|
|
439
|
-
/** The element that receives the command.
|
|
440
|
-
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
441
|
-
commandForElement?: HTMLElement | null;
|
|
442
|
-
/** The element that receives the interest.
|
|
443
440
|
https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement */
|
|
444
441
|
interestForElement?: HTMLElement | null;
|
|
445
442
|
};
|
|
446
443
|
|
|
447
444
|
export type CardProps = {
|
|
448
|
-
/**
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
- `full` Element container optimizes for filling its container bounds. */
|
|
452
|
-
container?: "flat" | "full" | "default";
|
|
445
|
+
/** flat (embed into parent container) or full (width of viewport) */
|
|
446
|
+
container?: "flat" | "full" | undefined;
|
|
453
447
|
};
|
|
454
448
|
|
|
455
|
-
export type CardHeaderProps = {
|
|
456
|
-
/** */
|
|
457
|
-
slot?: string;
|
|
458
|
-
};
|
|
449
|
+
export type CardHeaderProps = {};
|
|
459
450
|
|
|
460
451
|
export type CardContentProps = {};
|
|
461
452
|
|
|
462
|
-
export type CardFooterProps = {
|
|
463
|
-
/** */
|
|
464
|
-
slot?: string;
|
|
465
|
-
};
|
|
453
|
+
export type CardFooterProps = {};
|
|
466
454
|
|
|
467
455
|
export type ChatMessageProps = {
|
|
468
|
-
/**
|
|
469
|
-
-
|
|
456
|
+
/** Removes the border radius from the selected message corner to indicate the speaker direction. */
|
|
457
|
+
"arrow-position"?: "top-start" | "top-end" | "bottom-start" | "bottom-end";
|
|
458
|
+
/** Applies a transparent background and reduced horizontal padding for embedding the message in another container. */
|
|
470
459
|
container?: "flat";
|
|
471
460
|
/** Defines a base color from the theme color palette */
|
|
472
461
|
color?:
|
|
@@ -492,8 +481,8 @@ export type ChatMessageProps = {
|
|
|
492
481
|
| "lime-pear"
|
|
493
482
|
| "yellow-nova"
|
|
494
483
|
| "brand-green";
|
|
495
|
-
/**
|
|
496
|
-
|
|
484
|
+
/** Removes the border radius from the selected message corner to indicate the speaker direction. */
|
|
485
|
+
arrowPosition?: "top-start" | "top-end" | "bottom-start" | "bottom-end";
|
|
497
486
|
};
|
|
498
487
|
|
|
499
488
|
export type CheckboxGroupProps = {
|
|
@@ -506,16 +495,12 @@ export type CheckboxGroupProps = {
|
|
|
506
495
|
|
|
507
496
|
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
508
497
|
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
509
|
-
/**
|
|
510
|
-
- `muted` Reduces visual weight for supporting content that should remain subtle and unobtrusive. */
|
|
498
|
+
/** Set the visual prominence of the control group */
|
|
511
499
|
prominence?: "muted";
|
|
512
500
|
};
|
|
513
501
|
|
|
514
502
|
export type CheckboxProps = {
|
|
515
|
-
/**
|
|
516
|
-
- `warning` Indicates cautionary actions that require careful consideration before proceeding.
|
|
517
|
-
|
|
518
|
-
- `success` Represents positive outcomes, confirmations, or constructive actions. */
|
|
503
|
+
/** Set current visual state for control. This overrides any validation states active. */
|
|
519
504
|
status?: "warning" | "error" | "success" | "disabled";
|
|
520
505
|
/** Controls the directional arrangement and spacing behavior of the element's content.
|
|
521
506
|
- `vertical` Arranges content in a vertical stack with block-level spacing.
|
|
@@ -526,28 +511,23 @@ export type CheckboxProps = {
|
|
|
526
511
|
|
|
527
512
|
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
528
513
|
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
529
|
-
/**
|
|
530
|
-
"fit-text"?: boolean;
|
|
531
|
-
/** Sets the input to match native default content block */
|
|
532
|
-
"fit-content"?: boolean;
|
|
533
|
-
/** Enables updating internal string values for internationalization. */
|
|
514
|
+
/** Enables internal string values to update for internationalization. */
|
|
534
515
|
i18n?: string;
|
|
535
|
-
/**
|
|
536
|
-
- `muted` Reduces visual weight for supporting content that should remain subtle and unobtrusive. */
|
|
516
|
+
/** Set the visual prominence of the control */
|
|
537
517
|
prominence?: "muted";
|
|
538
|
-
|
|
539
518
|
/** */
|
|
540
519
|
onreset?: (e: CustomEvent<CustomEvent>) => void;
|
|
541
520
|
};
|
|
542
521
|
|
|
543
522
|
export type ColorProps = {
|
|
544
|
-
/**
|
|
545
|
-
-
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
|
|
523
|
+
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
524
|
+
"fit-text"?: boolean;
|
|
525
|
+
/** Sets the input to match native default content block */
|
|
526
|
+
"fit-content"?: boolean;
|
|
527
|
+
/** Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.
|
|
528
|
+
Use when embedding within another container such as a toolbar. */
|
|
529
|
+
container?: "flat" | undefined;
|
|
530
|
+
/** Set current visual state for control. This overrides any validation states active. */
|
|
551
531
|
status?: "warning" | "error" | "success" | "disabled";
|
|
552
532
|
/** Controls the directional arrangement and spacing behavior of the element's content.
|
|
553
533
|
- `vertical` Arranges content in a vertical stack with block-level spacing.
|
|
@@ -559,31 +539,34 @@ export type ColorProps = {
|
|
|
559
539
|
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
560
540
|
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
561
541
|
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
562
|
-
|
|
542
|
+
fitText?: boolean;
|
|
563
543
|
/** Sets the input to match native default content block */
|
|
564
|
-
|
|
565
|
-
/** Enables
|
|
544
|
+
fitContent?: boolean;
|
|
545
|
+
/** Enables internal string values to update for internationalization. */
|
|
566
546
|
i18n?: string;
|
|
567
|
-
/**
|
|
568
|
-
- `muted` Reduces visual weight for supporting content that should remain subtle and unobtrusive. */
|
|
547
|
+
/** Set the visual prominence of the control */
|
|
569
548
|
prominence?: "muted";
|
|
570
|
-
|
|
571
549
|
/** */
|
|
572
550
|
onreset?: (e: CustomEvent<CustomEvent>) => void;
|
|
573
551
|
};
|
|
574
552
|
|
|
575
553
|
export type ComboboxProps = {
|
|
576
|
-
/** Demonstrates different container styles to accommodate visual weight and context.
|
|
577
|
-
- `flat` Element has white space bounds but reduced visual container. */
|
|
578
|
-
container?: "flat";
|
|
579
554
|
/** Manage inline tag rendering for many-item select */
|
|
580
555
|
"tag-layout"?: "hidden" | "wrap";
|
|
581
556
|
/** Enable creation of new options when the input value doesn't match any existing option. Dispatches a `create` event with `{ value }` detail. */
|
|
582
557
|
"behavior-create"?: boolean;
|
|
583
|
-
/**
|
|
584
|
-
-
|
|
585
|
-
|
|
586
|
-
-
|
|
558
|
+
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
559
|
+
"fit-text"?: boolean;
|
|
560
|
+
/** Sets the input to match native default content block */
|
|
561
|
+
"fit-content"?: boolean;
|
|
562
|
+
/** Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.
|
|
563
|
+
Use when embedding within another container such as a toolbar. */
|
|
564
|
+
container?: "flat";
|
|
565
|
+
/** Manage inline tag rendering for many-item select */
|
|
566
|
+
tagLayout?: "hidden" | "wrap";
|
|
567
|
+
/** Enable creation of new options when the input value doesn't match any existing option. Dispatches a `create` event with `{ value }` detail. */
|
|
568
|
+
behaviorCreate?: boolean;
|
|
569
|
+
/** Set current visual state for control. This overrides any validation states active. */
|
|
587
570
|
status?: "warning" | "error" | "success" | "disabled";
|
|
588
571
|
/** Controls the directional arrangement and spacing behavior of the element's content.
|
|
589
572
|
- `vertical` Arranges content in a vertical stack with block-level spacing.
|
|
@@ -595,15 +578,13 @@ export type ComboboxProps = {
|
|
|
595
578
|
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
596
579
|
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
597
580
|
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
598
|
-
|
|
581
|
+
fitText?: boolean;
|
|
599
582
|
/** Sets the input to match native default content block */
|
|
600
|
-
|
|
601
|
-
/** Enables
|
|
583
|
+
fitContent?: boolean;
|
|
584
|
+
/** Enables internal string values to update for internationalization. */
|
|
602
585
|
i18n?: string;
|
|
603
|
-
/**
|
|
604
|
-
- `muted` Reduces visual weight for supporting content that should remain subtle and unobtrusive. */
|
|
586
|
+
/** Set the visual prominence of the control */
|
|
605
587
|
prominence?: "muted";
|
|
606
|
-
|
|
607
588
|
/** Fires when the user confirms a value that doesn't match any existing option and the `behavior-create` attribute exists. `detail: { value }`. */
|
|
608
589
|
oncreate?: (e: CustomEvent<CustomEvent>) => void;
|
|
609
590
|
/** Fires when the user scrolls the dropdown option list. Throttled to one dispatch per animation frame. `detail: { scrollTop, scrollHeight, clientHeight }`. */
|
|
@@ -613,24 +594,38 @@ export type ComboboxProps = {
|
|
|
613
594
|
};
|
|
614
595
|
|
|
615
596
|
export type CopyButtonProps = {
|
|
616
|
-
/** Enables updating internal string values for internationalization. */
|
|
617
|
-
i18n?: string;
|
|
618
597
|
/** Determines if the copy button should auto write to clipboard by the trigger. */
|
|
619
598
|
"behavior-copy"?: boolean;
|
|
620
|
-
/**
|
|
599
|
+
/** Indicates whether the element is a noninteractive visual treatment instead of a button.
|
|
600
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly */
|
|
601
|
+
readonly?: boolean;
|
|
602
|
+
/** Establishes a relationship between a popover and its invoker button.
|
|
603
|
+
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetElement */
|
|
604
|
+
popovertarget?: string;
|
|
605
|
+
/** The popover target action to perform on the popover target element.
|
|
606
|
+
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetAction */
|
|
607
|
+
popovertargetaction?: "show" | "hide" | "toggle";
|
|
608
|
+
/** The element that receives the command.
|
|
609
|
+
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
610
|
+
commandfor?: string;
|
|
611
|
+
/** The element that receives the interest.
|
|
612
|
+
https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement */
|
|
613
|
+
interestfor?: string;
|
|
614
|
+
/** Enables internal string values to update for internationalization. */
|
|
615
|
+
i18n?: string;
|
|
616
|
+
/** Determines if the copy button should auto write to clipboard by the trigger. */
|
|
617
|
+
behaviorCopy?: boolean;
|
|
618
|
+
/** Defines the value that copies to the user clipboard. Use `aria-label` to set the tooltip hint. */
|
|
621
619
|
value?: string;
|
|
622
|
-
/**
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
- `inline` Element container reduces to fit within inline content such as a block of text. */
|
|
626
|
-
container?: "flat" | "inline" | "default";
|
|
620
|
+
/** Determines the container of the button. Flat suits nesting within other containers or more muted style. Inline suits inline content such as text. */
|
|
621
|
+
container?: "flat" | "inline" | undefined;
|
|
627
622
|
/** Controls the visual scale of an element to match its importance and available space.
|
|
628
623
|
- `sm` Compact size for dense layouts or secondary elements with less visual prominence.
|
|
629
624
|
|
|
630
625
|
- `md` Standard size that works well in most contexts and provides balanced visibility.
|
|
631
626
|
|
|
632
627
|
- `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts. */
|
|
633
|
-
size?: "sm" | "md" | "lg" |
|
|
628
|
+
size?: "sm" | "md" | "lg" | undefined;
|
|
634
629
|
/** The Interaction type provides a way to show the intent of an interactive element. This can help users quickly understand what each interaction does and reduce the potential for confusion or errors.
|
|
635
630
|
- `emphasis` Shows the interaction targets emphasis or highlighting primary actions.
|
|
636
631
|
|
|
@@ -646,14 +641,15 @@ export type CopyButtonProps = {
|
|
|
646
641
|
|
|
647
642
|
- `false` The associated content collapses and hides from the user. */
|
|
648
643
|
expanded?: boolean;
|
|
649
|
-
/**
|
|
644
|
+
/** Indicates whether the element is a noninteractive visual treatment instead of a button.
|
|
650
645
|
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly */
|
|
651
|
-
|
|
652
|
-
/**
|
|
653
|
-
|
|
646
|
+
readOnly?: boolean;
|
|
647
|
+
/** Associates the button with a form. Set the property to a form element or its ID. The HTML attribute accepts only
|
|
648
|
+
the form ID. Reading the property returns the associated form element or `null`.
|
|
654
649
|
https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/form */
|
|
655
650
|
form?: string | HTMLFormElement | null;
|
|
656
|
-
/** The name of the
|
|
651
|
+
/** The name of the button, submitted as a pair with the button value as part of the form data.
|
|
652
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-name */
|
|
657
653
|
name?: string;
|
|
658
654
|
/** Defines the button behavior when associated within a form element.
|
|
659
655
|
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type */
|
|
@@ -675,38 +671,30 @@ https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type */
|
|
|
675
671
|
current?: "page" | "step";
|
|
676
672
|
/** Establishes a relationship between a popover and its invoker button.
|
|
677
673
|
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetElement */
|
|
678
|
-
|
|
674
|
+
popoverTargetElement?: HTMLElement | null;
|
|
679
675
|
/** The popover target action to perform on the popover target element.
|
|
680
676
|
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetAction */
|
|
681
|
-
|
|
677
|
+
popoverTargetAction?: "show" | "hide" | "toggle";
|
|
682
678
|
/** The element that receives the command.
|
|
683
679
|
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
684
|
-
|
|
680
|
+
commandForElement?: HTMLElement | null;
|
|
685
681
|
/** The command to execute on the element.
|
|
686
682
|
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
687
683
|
command?: string;
|
|
688
684
|
/** The element that receives the interest.
|
|
689
|
-
https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement */
|
|
690
|
-
interestfor?: string;
|
|
691
|
-
/** Establishes a relationship between a popover and its invoker button.
|
|
692
|
-
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetElement */
|
|
693
|
-
popoverTargetElement?: HTMLElement | null;
|
|
694
|
-
/** The element that receives the command.
|
|
695
|
-
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
696
|
-
commandForElement?: HTMLElement | null;
|
|
697
|
-
/** The element that receives the interest.
|
|
698
685
|
https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement */
|
|
699
686
|
interestForElement?: HTMLElement | null;
|
|
700
687
|
};
|
|
701
688
|
|
|
702
689
|
export type DateProps = {
|
|
703
|
-
/**
|
|
704
|
-
-
|
|
705
|
-
|
|
706
|
-
|
|
707
|
-
|
|
708
|
-
|
|
709
|
-
|
|
690
|
+
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
691
|
+
"fit-text"?: boolean;
|
|
692
|
+
/** Sets the input to match native default content block */
|
|
693
|
+
"fit-content"?: boolean;
|
|
694
|
+
/** Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.
|
|
695
|
+
Use when embedding within another container such as a toolbar. */
|
|
696
|
+
container?: "flat" | undefined;
|
|
697
|
+
/** Set current visual state for control. This overrides any validation states active. */
|
|
710
698
|
status?: "warning" | "error" | "success" | "disabled";
|
|
711
699
|
/** Controls the directional arrangement and spacing behavior of the element's content.
|
|
712
700
|
- `vertical` Arranges content in a vertical stack with block-level spacing.
|
|
@@ -718,27 +706,26 @@ export type DateProps = {
|
|
|
718
706
|
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
719
707
|
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
720
708
|
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
721
|
-
|
|
709
|
+
fitText?: boolean;
|
|
722
710
|
/** Sets the input to match native default content block */
|
|
723
|
-
|
|
724
|
-
/** Enables
|
|
711
|
+
fitContent?: boolean;
|
|
712
|
+
/** Enables internal string values to update for internationalization. */
|
|
725
713
|
i18n?: string;
|
|
726
|
-
/**
|
|
727
|
-
- `muted` Reduces visual weight for supporting content that should remain subtle and unobtrusive. */
|
|
714
|
+
/** Set the visual prominence of the control */
|
|
728
715
|
prominence?: "muted";
|
|
729
|
-
|
|
730
716
|
/** */
|
|
731
717
|
onreset?: (e: CustomEvent<CustomEvent>) => void;
|
|
732
718
|
};
|
|
733
719
|
|
|
734
720
|
export type DatetimeProps = {
|
|
735
|
-
/**
|
|
736
|
-
-
|
|
737
|
-
|
|
738
|
-
|
|
739
|
-
|
|
740
|
-
|
|
741
|
-
|
|
721
|
+
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
722
|
+
"fit-text"?: boolean;
|
|
723
|
+
/** Sets the input to match native default content block */
|
|
724
|
+
"fit-content"?: boolean;
|
|
725
|
+
/** Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.
|
|
726
|
+
Use when embedding within another container such as a toolbar. */
|
|
727
|
+
container?: "flat" | undefined;
|
|
728
|
+
/** Set current visual state for control. This overrides any validation states active. */
|
|
742
729
|
status?: "warning" | "error" | "success" | "disabled";
|
|
743
730
|
/** Controls the directional arrangement and spacing behavior of the element's content.
|
|
744
731
|
- `vertical` Arranges content in a vertical stack with block-level spacing.
|
|
@@ -750,15 +737,13 @@ export type DatetimeProps = {
|
|
|
750
737
|
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
751
738
|
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
752
739
|
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
753
|
-
|
|
740
|
+
fitText?: boolean;
|
|
754
741
|
/** Sets the input to match native default content block */
|
|
755
|
-
|
|
756
|
-
/** Enables
|
|
742
|
+
fitContent?: boolean;
|
|
743
|
+
/** Enables internal string values to update for internationalization. */
|
|
757
744
|
i18n?: string;
|
|
758
|
-
/**
|
|
759
|
-
- `muted` Reduces visual weight for supporting content that should remain subtle and unobtrusive. */
|
|
745
|
+
/** Set the visual prominence of the control */
|
|
760
746
|
prominence?: "muted";
|
|
761
|
-
|
|
762
747
|
/** */
|
|
763
748
|
onreset?: (e: CustomEvent<CustomEvent>) => void;
|
|
764
749
|
};
|
|
@@ -768,7 +753,11 @@ export type DialogFooterProps = {};
|
|
|
768
753
|
export type DialogHeaderProps = {};
|
|
769
754
|
|
|
770
755
|
export type DialogProps = {
|
|
771
|
-
/**
|
|
756
|
+
/** @deprecated Use the popover API instead.
|
|
757
|
+
Determines if popover visibility behavior should be automatically controlled by the trigger. */
|
|
758
|
+
"behavior-trigger"?: boolean;
|
|
759
|
+
/** Sets the side position of the popover relative to the provided anchor element.
|
|
760
|
+
For dialog the anchor defaults to the document body.
|
|
772
761
|
- `center` Centers the popover directly over the anchor element.
|
|
773
762
|
|
|
774
763
|
- `top` Positions the popover above the anchor element.
|
|
@@ -792,7 +781,7 @@ export type DialogProps = {
|
|
|
792
781
|
- `md` Standard size that works well in most contexts and provides balanced visibility.
|
|
793
782
|
|
|
794
783
|
- `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts. */
|
|
795
|
-
size?: "sm" | "md" | "lg" |
|
|
784
|
+
size?: "sm" | "md" | "lg" | undefined;
|
|
796
785
|
/** Indicates whether the user can dismiss or close the element.
|
|
797
786
|
- `true` The element displays a close control and the user can dismiss it.
|
|
798
787
|
|
|
@@ -800,18 +789,17 @@ export type DialogProps = {
|
|
|
800
789
|
closable?: boolean;
|
|
801
790
|
/** Determines if a dialog should have a modal backdrop that visually overlays the UI. */
|
|
802
791
|
modal?: boolean;
|
|
803
|
-
/** Provides the element that the popover should position relative to.
|
|
792
|
+
/** Provides the element that the popover should position relative to. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. */
|
|
804
793
|
anchor?: string | HTMLElement;
|
|
805
794
|
/** @deprecated Use the popover API instead.
|
|
806
795
|
The trigger defines what element triggers an `open` interaction event.
|
|
807
|
-
A trigger can accept a idref string within the same render root or a HTMLElement DOM reference. - Defines
|
|
796
|
+
A trigger can accept a idref string within the same render root or a HTMLElement DOM reference. - Defines the element that triggers an `open` interaction event. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. */
|
|
808
797
|
trigger?: string | HTMLElement;
|
|
809
798
|
/** @deprecated Use the popover API instead.
|
|
810
799
|
Determines if popover visibility behavior should be automatically controlled by the trigger. */
|
|
811
|
-
|
|
812
|
-
/** Enables
|
|
800
|
+
behaviorTrigger?: boolean;
|
|
801
|
+
/** Enables internal string values to update for internationalization. */
|
|
813
802
|
i18n?: string;
|
|
814
|
-
|
|
815
803
|
/** Dispatched on a popover just before showing or hiding. [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/beforetoggle_event) */
|
|
816
804
|
onbeforetoggle?: (e: CustomEvent<never>) => void;
|
|
817
805
|
/** Dispatched on a popover element just after showing or hiding. [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/toggle_event) */
|
|
@@ -831,7 +819,7 @@ export type DividerProps = {
|
|
|
831
819
|
};
|
|
832
820
|
|
|
833
821
|
export type DotProps = {
|
|
834
|
-
/**
|
|
822
|
+
/** Defines visual treatment to represent a ongoing task or support status.
|
|
835
823
|
- `accent` Highlights important actions or draws attention to primary interactive elements.
|
|
836
824
|
|
|
837
825
|
- `warning` Indicates cautionary actions that require careful consideration before proceeding.
|
|
@@ -893,7 +881,11 @@ export type DrawerFooterProps = {};
|
|
|
893
881
|
export type DrawerHeaderProps = {};
|
|
894
882
|
|
|
895
883
|
export type DrawerProps = {
|
|
896
|
-
/**
|
|
884
|
+
/** @deprecated Use the popover API instead.
|
|
885
|
+
Determines if popover visibility behavior should be automatically controlled by the trigger. */
|
|
886
|
+
"behavior-trigger"?: boolean;
|
|
887
|
+
/** Sets the side position of the popover relative to the provided anchor element.
|
|
888
|
+
For drawer the anchor defaults to the document body. */
|
|
897
889
|
position?: "left" | "right" | "bottom" | "top";
|
|
898
890
|
/** Controls the visual scale of an element to match its importance and available space.
|
|
899
891
|
- `sm` Compact size for dense layouts or secondary elements with less visual prominence.
|
|
@@ -901,7 +893,7 @@ export type DrawerProps = {
|
|
|
901
893
|
- `md` Standard size that works well in most contexts and provides balanced visibility.
|
|
902
894
|
|
|
903
895
|
- `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts. */
|
|
904
|
-
size?: "sm" | "md" | "lg" |
|
|
896
|
+
size?: "sm" | "md" | "lg" | undefined;
|
|
905
897
|
/** Indicates whether the user can dismiss or close the element.
|
|
906
898
|
- `true` The element displays a close control and the user can dismiss it.
|
|
907
899
|
|
|
@@ -909,21 +901,20 @@ export type DrawerProps = {
|
|
|
909
901
|
closable?: boolean;
|
|
910
902
|
/** Determines if a drawer should have a modal backdrop that visually overlays the UI. */
|
|
911
903
|
modal?: boolean;
|
|
912
|
-
/** Provides the element that the popover should position relative to.
|
|
904
|
+
/** Provides the element that the popover should position relative to. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. */
|
|
913
905
|
anchor?: string | HTMLElement;
|
|
914
906
|
/** @deprecated Use the popover API instead.
|
|
915
907
|
The trigger defines what element triggers an `open` interaction event.
|
|
916
|
-
A trigger can accept a idref string within the same render root or a HTMLElement DOM reference. - Defines
|
|
908
|
+
A trigger can accept a idref string within the same render root or a HTMLElement DOM reference. - Defines the element that triggers an `open` interaction event. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. */
|
|
917
909
|
trigger?: string | HTMLElement;
|
|
918
910
|
/** Create a inline layout effect while retaining the a11y characteristics and top layer behavior (light dismiss, focus trap, non interactive background)
|
|
919
911
|
https://www.w3.org/WAI/ARIA/apg/patterns/dialog-modal/ */
|
|
920
912
|
inline?: boolean;
|
|
921
913
|
/** @deprecated Use the popover API instead.
|
|
922
914
|
Determines if popover visibility behavior should be automatically controlled by the trigger. */
|
|
923
|
-
|
|
924
|
-
/** Enables
|
|
915
|
+
behaviorTrigger?: boolean;
|
|
916
|
+
/** Enables internal string values to update for internationalization. */
|
|
925
917
|
i18n?: string;
|
|
926
|
-
|
|
927
918
|
/** Dispatched on a popover just before showing or hiding. [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/beforetoggle_event) */
|
|
928
919
|
onbeforetoggle?: (e: CustomEvent<never>) => void;
|
|
929
920
|
/** Dispatched on a popover element just after showing or hiding. [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/toggle_event) */
|
|
@@ -946,13 +937,16 @@ export type DropdownFooterProps = {};
|
|
|
946
937
|
export type DropdownHeaderProps = {};
|
|
947
938
|
|
|
948
939
|
export type DropdownProps = {
|
|
949
|
-
/**
|
|
940
|
+
/** @deprecated Use the popover API instead.
|
|
941
|
+
Determines if popover visibility behavior should be automatically controlled by the trigger. */
|
|
942
|
+
"behavior-trigger"?: boolean;
|
|
943
|
+
/** Provides the element that the popover should position relative to. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. */
|
|
950
944
|
anchor?: string | HTMLElement;
|
|
951
945
|
/** @deprecated Use the popover API instead.
|
|
952
946
|
The trigger defines what element triggers an `open` interaction event.
|
|
953
|
-
A trigger can accept a idref string within the same render root or a HTMLElement DOM reference. - Defines
|
|
947
|
+
A trigger can accept a idref string within the same render root or a HTMLElement DOM reference. - Defines the element that triggers an `open` interaction event. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. */
|
|
954
948
|
trigger?: string | HTMLElement;
|
|
955
|
-
/**
|
|
949
|
+
/** Sets the side position of the popover relative to the provided anchor element.
|
|
956
950
|
- `center` Centers the popover directly over the anchor element.
|
|
957
951
|
|
|
958
952
|
- `top` Positions the popover above the anchor element.
|
|
@@ -972,7 +966,7 @@ A trigger can accept a idref string within the same render root or a HTMLElement
|
|
|
972
966
|
alignment?: "start" | "end" | "center";
|
|
973
967
|
/** @deprecated Use the popover API instead.
|
|
974
968
|
Determines if popover visibility behavior should be automatically controlled by the trigger. */
|
|
975
|
-
|
|
969
|
+
behaviorTrigger?: boolean;
|
|
976
970
|
/** Indicates whether the user can dismiss or close the element.
|
|
977
971
|
- `true` The element displays a close control and the user can dismiss it.
|
|
978
972
|
|
|
@@ -980,14 +974,8 @@ Determines if popover visibility behavior should be automatically controlled by
|
|
|
980
974
|
closable?: boolean;
|
|
981
975
|
/** Determines if an arrow renders. */
|
|
982
976
|
arrow?: boolean;
|
|
983
|
-
/**
|
|
984
|
-
modal?: boolean;
|
|
985
|
-
/** */
|
|
986
|
-
"popover-type"?: "auto" | "manual" | "hint" | "inline";
|
|
987
|
-
/** Enables updating internal string values for internationalization. */
|
|
977
|
+
/** Enables internal string values to update for internationalization. */
|
|
988
978
|
i18n?: string;
|
|
989
|
-
/** */
|
|
990
|
-
popoverArrow?: HTMLElement;
|
|
991
979
|
/** Dispatched on a popover just before showing or hiding. [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/beforetoggle_event) */
|
|
992
980
|
onbeforetoggle?: (e: CustomEvent<never>) => void;
|
|
993
981
|
/** Dispatched on a popover element just after showing or hiding. [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/toggle_event) */
|
|
@@ -999,15 +987,35 @@ Determines if popover visibility behavior should be automatically controlled by
|
|
|
999
987
|
};
|
|
1000
988
|
|
|
1001
989
|
export type DropzoneProps = {
|
|
1002
|
-
/**
|
|
1003
|
-
accept?: string;
|
|
1004
|
-
/** */
|
|
990
|
+
/** File size limit in bytes. */
|
|
1005
991
|
"max-file-size"?: number;
|
|
1006
|
-
/** Enables updating internal string values for internationalization. */
|
|
1007
|
-
i18n?: string;
|
|
1008
992
|
/** Prevents the user from changing the control value.
|
|
1009
993
|
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly */
|
|
1010
994
|
readonly?: boolean;
|
|
995
|
+
/** Defines the minimum text length.
|
|
996
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/minlength */
|
|
997
|
+
minlength?: number;
|
|
998
|
+
/** Defines the maximum text length.
|
|
999
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/maxlength */
|
|
1000
|
+
maxlength?: number;
|
|
1001
|
+
/** Disables constraint validation for this control.
|
|
1002
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/novalidate */
|
|
1003
|
+
novalidate?: boolean;
|
|
1004
|
+
/** Comma-separated file extensions or MIME types accepted by the dropzone. */
|
|
1005
|
+
accept?: string;
|
|
1006
|
+
/** File size limit in bytes. */
|
|
1007
|
+
maxFileSize?: number;
|
|
1008
|
+
/** Enables internal string values to update for internationalization. */
|
|
1009
|
+
i18n?: string;
|
|
1010
|
+
/** Files selected or dropped by the user. Assign files through the JavaScript property; the HTML `value` attribute is not supported. */
|
|
1011
|
+
value?: File[];
|
|
1012
|
+
/** The initial value used when the parent form resets. */
|
|
1013
|
+
defaultValue?: string;
|
|
1014
|
+
/** Indicates whether the user can change the element's value while it remains visible and focusable. [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly)
|
|
1015
|
+
- `true` The element has a readonly state: the user cannot change its value, but can still focus and copy it.
|
|
1016
|
+
|
|
1017
|
+
- `false` The element allows editing and the user can change its value through interaction. */
|
|
1018
|
+
readOnly?: boolean;
|
|
1011
1019
|
/** This Boolean attribute prevents the user from interacting with the element: it cannot receive press or focus events. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-disabled)
|
|
1012
1020
|
- `true` The element has a disabled state and does not accept interaction.
|
|
1013
1021
|
|
|
@@ -1030,19 +1038,16 @@ https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/step */
|
|
|
1030
1038
|
step?: number | null;
|
|
1031
1039
|
/** Defines the minimum text length.
|
|
1032
1040
|
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/minlength */
|
|
1033
|
-
|
|
1041
|
+
minLength?: number;
|
|
1034
1042
|
/** Defines the maximum text length.
|
|
1035
1043
|
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/maxlength */
|
|
1036
|
-
|
|
1037
|
-
/** The name
|
|
1044
|
+
maxLength?: number;
|
|
1045
|
+
/** The name submitted with the control value as part of the form data.
|
|
1046
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/name */
|
|
1038
1047
|
name?: string;
|
|
1039
1048
|
/** Disables constraint validation for this control.
|
|
1040
1049
|
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/novalidate */
|
|
1041
|
-
|
|
1042
|
-
/** Defines the value associated with the element's name when submitting the form data. The server receives this value in params when the form submits through this button. [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#value) */
|
|
1043
|
-
value?: File[];
|
|
1044
|
-
/** The initial value used when the parent form resets. */
|
|
1045
|
-
defaultValue?: string;
|
|
1050
|
+
noValidate?: boolean;
|
|
1046
1051
|
/** The form associated with the control.
|
|
1047
1052
|
https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/form */
|
|
1048
1053
|
form?: HTMLFormElement | null;
|
|
@@ -1071,10 +1076,11 @@ https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/labels */
|
|
|
1071
1076
|
};
|
|
1072
1077
|
|
|
1073
1078
|
export type FileProps = {
|
|
1074
|
-
/**
|
|
1075
|
-
-
|
|
1076
|
-
|
|
1077
|
-
-
|
|
1079
|
+
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
1080
|
+
"fit-text"?: boolean;
|
|
1081
|
+
/** Sets the input to match native default content block */
|
|
1082
|
+
"fit-content"?: boolean;
|
|
1083
|
+
/** Set current visual state for control. This overrides any validation states active. */
|
|
1078
1084
|
status?: "warning" | "error" | "success" | "disabled";
|
|
1079
1085
|
/** Controls the directional arrangement and spacing behavior of the element's content.
|
|
1080
1086
|
- `vertical` Arranges content in a vertical stack with block-level spacing.
|
|
@@ -1086,98 +1092,128 @@ export type FileProps = {
|
|
|
1086
1092
|
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
1087
1093
|
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
1088
1094
|
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
1089
|
-
|
|
1095
|
+
fitText?: boolean;
|
|
1090
1096
|
/** Sets the input to match native default content block */
|
|
1091
|
-
|
|
1092
|
-
/** Enables
|
|
1097
|
+
fitContent?: boolean;
|
|
1098
|
+
/** Enables internal string values to update for internationalization. */
|
|
1093
1099
|
i18n?: string;
|
|
1094
|
-
/**
|
|
1095
|
-
- `muted` Reduces visual weight for supporting content that should remain subtle and unobtrusive. */
|
|
1100
|
+
/** Set the visual prominence of the control */
|
|
1096
1101
|
prominence?: "muted";
|
|
1097
|
-
|
|
1098
1102
|
/** */
|
|
1099
1103
|
onreset?: (e: CustomEvent<CustomEvent>) => void;
|
|
1100
1104
|
};
|
|
1101
1105
|
|
|
1102
1106
|
export type FormatDatetimeProps = {
|
|
1107
|
+
/** Preset date formatting style: 'full' | 'long' | 'medium' | 'short'.
|
|
1108
|
+
Preset styles take precedence over granular date and time part options. */
|
|
1109
|
+
"date-style"?: "full" | "long" | "medium" | "short" | undefined;
|
|
1110
|
+
/** Preset time formatting style: 'full' | 'long' | 'medium' | 'short'.
|
|
1111
|
+
Preset styles take precedence over granular date and time part options. */
|
|
1112
|
+
"time-style"?: "full" | "long" | "medium" | "short" | undefined;
|
|
1113
|
+
/** Time zone name display: 'long' | 'short'. Use it with granular options only; preset styles ignore it. */
|
|
1114
|
+
"time-zone-name"?: "long" | "short" | undefined;
|
|
1115
|
+
/** IANA time zone identifier (such as 'America/New_York', 'UTC'). */
|
|
1116
|
+
"time-zone"?: string | undefined;
|
|
1103
1117
|
/** Optional date string for values supplied by JavaScript or bound data.
|
|
1104
1118
|
By default, the component formats the element's text content, which also serves as the SSR fallback.
|
|
1105
1119
|
When both are present, this property takes precedence. */
|
|
1106
|
-
date?: string |
|
|
1120
|
+
date?: string | undefined;
|
|
1107
1121
|
/** Language tag (such as en-US, de-DE). Defaults to document.documentElement.lang or browser default. */
|
|
1108
|
-
locale?: string |
|
|
1122
|
+
locale?: string | undefined;
|
|
1109
1123
|
/** Weekday representation: 'long' | 'short' | 'narrow'. */
|
|
1110
|
-
weekday?: "long" | "short" | "narrow" |
|
|
1124
|
+
weekday?: "long" | "short" | "narrow" | undefined;
|
|
1111
1125
|
/** Year representation: 'numeric' | '2-digit'. */
|
|
1112
|
-
year?: "numeric" | "2-digit" |
|
|
1126
|
+
year?: "numeric" | "2-digit" | undefined;
|
|
1113
1127
|
/** Month representation: 'numeric' | '2-digit' | 'long' | 'short' | 'narrow'. */
|
|
1114
|
-
month?: "numeric" | "2-digit" | "long" | "short" | "narrow" |
|
|
1128
|
+
month?: "numeric" | "2-digit" | "long" | "short" | "narrow" | undefined;
|
|
1115
1129
|
/** Day representation: 'numeric' | '2-digit'. */
|
|
1116
|
-
day?: "numeric" | "2-digit" |
|
|
1130
|
+
day?: "numeric" | "2-digit" | undefined;
|
|
1117
1131
|
/** Hour representation: 'numeric' | '2-digit'. */
|
|
1118
|
-
hour?: "numeric" | "2-digit" |
|
|
1132
|
+
hour?: "numeric" | "2-digit" | undefined;
|
|
1119
1133
|
/** Minute representation: 'numeric' | '2-digit'. */
|
|
1120
|
-
minute?: "numeric" | "2-digit" |
|
|
1134
|
+
minute?: "numeric" | "2-digit" | undefined;
|
|
1121
1135
|
/** Second representation: 'numeric' | '2-digit'. */
|
|
1122
|
-
second?: "numeric" | "2-digit" |
|
|
1136
|
+
second?: "numeric" | "2-digit" | undefined;
|
|
1123
1137
|
/** Preset date formatting style: 'full' | 'long' | 'medium' | 'short'.
|
|
1124
1138
|
Preset styles take precedence over granular date and time part options. */
|
|
1125
|
-
|
|
1139
|
+
dateStyle?: "full" | "long" | "medium" | "short" | undefined;
|
|
1126
1140
|
/** Preset time formatting style: 'full' | 'long' | 'medium' | 'short'.
|
|
1127
1141
|
Preset styles take precedence over granular date and time part options. */
|
|
1128
|
-
|
|
1142
|
+
timeStyle?: "full" | "long" | "medium" | "short" | undefined;
|
|
1129
1143
|
/** Time zone name display: 'long' | 'short'. Use it with granular options only; preset styles ignore it. */
|
|
1130
|
-
|
|
1144
|
+
timeZoneName?: "long" | "short" | undefined;
|
|
1131
1145
|
/** IANA time zone identifier (such as 'America/New_York', 'UTC'). */
|
|
1132
|
-
|
|
1146
|
+
timeZone?: string | undefined;
|
|
1133
1147
|
};
|
|
1134
1148
|
|
|
1135
1149
|
export type FormatNumberProps = {
|
|
1150
|
+
/** Formatting style: 'decimal' | 'currency' | 'percent' | 'unit'. */
|
|
1151
|
+
"format-style"?: "decimal" | "currency" | "percent" | "unit";
|
|
1152
|
+
/** Currency sign style: 'standard' | 'accounting'. */
|
|
1153
|
+
"currency-sign"?: "standard" | "accounting" | undefined;
|
|
1154
|
+
/** Currency display style: 'symbol' | 'code' | 'name' | 'narrowSymbol'. */
|
|
1155
|
+
"currency-display"?: "symbol" | "code" | "name" | "narrowSymbol" | undefined;
|
|
1156
|
+
/** Unit display style: 'short' | 'long' | 'narrow'. */
|
|
1157
|
+
"unit-display"?: "short" | "long" | "narrow" | undefined;
|
|
1158
|
+
/** Compact notation display: 'short' | 'long'. Only applies when notation is compact. */
|
|
1159
|
+
"compact-display"?: "short" | "long" | undefined;
|
|
1160
|
+
/** Sign display: 'auto' | 'never' | 'always' | 'exceptZero'. */
|
|
1161
|
+
"sign-display"?: "auto" | "never" | "always" | "exceptZero" | undefined;
|
|
1162
|
+
/** Grouping separators: 'auto' | 'always' | 'min2' | 'true' | 'false'. */
|
|
1163
|
+
"use-grouping"?: "auto" | "always" | "min2" | "true" | "false" | boolean | undefined;
|
|
1164
|
+
/** Pad fraction output to at least this many digits (0-20). */
|
|
1165
|
+
"minimum-fraction-digits"?: number | undefined;
|
|
1166
|
+
/** Round fraction output to at most this many digits (0-20). */
|
|
1167
|
+
"maximum-fraction-digits"?: number | undefined;
|
|
1168
|
+
/** Pad integer output to at least this many digits (1-21). */
|
|
1169
|
+
"minimum-integer-digits"?: number | undefined;
|
|
1136
1170
|
/** Optional numeric string for values supplied by JavaScript or bound data.
|
|
1137
1171
|
By default, the component formats the element's text content, which also serves as the SSR fallback.
|
|
1138
1172
|
When both are present, this property takes precedence. */
|
|
1139
|
-
number?: string |
|
|
1173
|
+
number?: string | undefined;
|
|
1140
1174
|
/** Language tag (such as en-US, de-DE). Defaults to document.documentElement.lang or browser default. */
|
|
1141
|
-
locale?: string |
|
|
1175
|
+
locale?: string | undefined;
|
|
1142
1176
|
/** Formatting style: 'decimal' | 'currency' | 'percent' | 'unit'. */
|
|
1143
|
-
|
|
1177
|
+
formatStyle?: "decimal" | "currency" | "percent" | "unit";
|
|
1144
1178
|
/** ISO 4217 currency code (such as USD or EUR). Required when formatStyle is currency. */
|
|
1145
|
-
currency?: string |
|
|
1179
|
+
currency?: string | undefined;
|
|
1146
1180
|
/** Currency sign style: 'standard' | 'accounting'. */
|
|
1147
|
-
|
|
1181
|
+
currencySign?: "standard" | "accounting" | undefined;
|
|
1148
1182
|
/** Currency display style: 'symbol' | 'code' | 'name' | 'narrowSymbol'. */
|
|
1149
|
-
|
|
1183
|
+
currencyDisplay?: "symbol" | "code" | "name" | "narrowSymbol" | undefined;
|
|
1150
1184
|
/** Unit identifier (such as kilometer or byte). Required when formatStyle is unit. */
|
|
1151
|
-
unit?: string |
|
|
1185
|
+
unit?: string | undefined;
|
|
1152
1186
|
/** Unit display style: 'short' | 'long' | 'narrow'. */
|
|
1153
|
-
|
|
1187
|
+
unitDisplay?: "short" | "long" | "narrow" | undefined;
|
|
1154
1188
|
/** Number notation: 'standard' | 'scientific' | 'engineering' | 'compact'. */
|
|
1155
|
-
notation?: "standard" | "scientific" | "engineering" | "compact" |
|
|
1189
|
+
notation?: "standard" | "scientific" | "engineering" | "compact" | undefined;
|
|
1156
1190
|
/** Compact notation display: 'short' | 'long'. Only applies when notation is compact. */
|
|
1157
|
-
|
|
1191
|
+
compactDisplay?: "short" | "long" | undefined;
|
|
1158
1192
|
/** Sign display: 'auto' | 'never' | 'always' | 'exceptZero'. */
|
|
1159
|
-
|
|
1193
|
+
signDisplay?: "auto" | "never" | "always" | "exceptZero" | undefined;
|
|
1160
1194
|
/** Grouping separators: 'auto' | 'always' | 'min2' | 'true' | 'false'. */
|
|
1161
|
-
"
|
|
1195
|
+
useGrouping?: "auto" | "always" | "min2" | "true" | "false" | boolean | undefined;
|
|
1162
1196
|
/** Pad fraction output to at least this many digits (0-20). */
|
|
1163
|
-
|
|
1197
|
+
minimumFractionDigits?: number | undefined;
|
|
1164
1198
|
/** Round fraction output to at most this many digits (0-20). */
|
|
1165
|
-
|
|
1199
|
+
maximumFractionDigits?: number | undefined;
|
|
1166
1200
|
/** Pad integer output to at least this many digits (1-21). */
|
|
1167
|
-
|
|
1201
|
+
minimumIntegerDigits?: number | undefined;
|
|
1168
1202
|
};
|
|
1169
1203
|
|
|
1170
1204
|
export type FormatRelativeTimeProps = {
|
|
1205
|
+
/** Formatting length: 'long' | 'short' | 'narrow'. Controls verbosity (such as '3 days ago' vs '3d ago'). Maps to Intl.RelativeTimeFormat style option. */
|
|
1206
|
+
"format-style"?: "long" | "short" | "narrow";
|
|
1171
1207
|
/** Optional date string for values supplied by JavaScript or bound data.
|
|
1172
1208
|
By default, the component formats the element's text content, which also serves as the SSR fallback.
|
|
1173
1209
|
When both are present, this property takes precedence. */
|
|
1174
|
-
date?: string |
|
|
1210
|
+
date?: string | undefined;
|
|
1175
1211
|
/** Language tag (such as en-US, de-DE). Defaults to document.documentElement.lang or browser default. */
|
|
1176
|
-
locale?: string |
|
|
1212
|
+
locale?: string | undefined;
|
|
1177
1213
|
/** Numeric formatting: 'always' | 'auto'. When 'auto', enables natural language forms such as 'yesterday' instead of '1 day ago'. */
|
|
1178
1214
|
numeric?: "always" | "auto";
|
|
1179
1215
|
/** Formatting length: 'long' | 'short' | 'narrow'. Controls verbosity (such as '3 days ago' vs '3d ago'). Maps to Intl.RelativeTimeFormat style option. */
|
|
1180
|
-
|
|
1216
|
+
formatStyle?: "long" | "short" | "narrow";
|
|
1181
1217
|
/** Time unit: 'second' | 'minute' | 'hour' | 'day' | 'week' | 'month' | 'year' | 'auto'. Use 'auto' to let the component select the most appropriate unit based on the time difference. */
|
|
1182
1218
|
unit?: "second" | "minute" | "hour" | "day" | "week" | "month" | "year" | "auto";
|
|
1183
1219
|
/** When present, auto-updates the displayed relative time at appropriate intervals. */
|
|
@@ -1194,17 +1230,13 @@ export type ControlGroupProps = {
|
|
|
1194
1230
|
|
|
1195
1231
|
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
1196
1232
|
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
1197
|
-
/**
|
|
1198
|
-
- `muted` Reduces visual weight for supporting content that should remain subtle and unobtrusive. */
|
|
1233
|
+
/** Set the visual prominence of the control group */
|
|
1199
1234
|
prominence?: "muted";
|
|
1200
1235
|
};
|
|
1201
1236
|
|
|
1202
1237
|
export type ControlMessageProps = {
|
|
1203
|
-
/**
|
|
1204
|
-
|
|
1205
|
-
|
|
1206
|
-
- `success` Represents positive outcomes, confirmations, or constructive actions. */
|
|
1207
|
-
status?: "warning" | "error" | "success" | "disabled" | "default";
|
|
1238
|
+
/** Visual treatment for current form control validation status */
|
|
1239
|
+
status?: "warning" | "error" | "success" | "disabled" | undefined;
|
|
1208
1240
|
/** Validation error code for current form control
|
|
1209
1241
|
https://developer.mozilla.org/en-US/docs/Web/API/ValidityState */
|
|
1210
1242
|
error?:
|
|
@@ -1220,15 +1252,14 @@ https://developer.mozilla.org/en-US/docs/Web/API/ValidityState */
|
|
|
1220
1252
|
| "valid"
|
|
1221
1253
|
| "valueMissing"
|
|
1222
1254
|
| null;
|
|
1223
|
-
/** */
|
|
1224
|
-
slot?: string;
|
|
1225
1255
|
};
|
|
1226
1256
|
|
|
1227
1257
|
export type ControlProps = {
|
|
1228
|
-
/**
|
|
1229
|
-
-
|
|
1230
|
-
|
|
1231
|
-
-
|
|
1258
|
+
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
1259
|
+
"fit-text"?: boolean;
|
|
1260
|
+
/** Sets the input to match native default content block */
|
|
1261
|
+
"fit-content"?: boolean;
|
|
1262
|
+
/** Set current visual state for control. This overrides any validation states active. */
|
|
1232
1263
|
status?: "warning" | "error" | "success" | "disabled";
|
|
1233
1264
|
/** Controls the directional arrangement and spacing behavior of the element's content.
|
|
1234
1265
|
- `vertical` Arranges content in a vertical stack with block-level spacing.
|
|
@@ -1240,25 +1271,23 @@ export type ControlProps = {
|
|
|
1240
1271
|
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
1241
1272
|
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
1242
1273
|
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
1243
|
-
|
|
1274
|
+
fitText?: boolean;
|
|
1244
1275
|
/** Sets the input to match native default content block */
|
|
1245
|
-
|
|
1246
|
-
/** Enables
|
|
1276
|
+
fitContent?: boolean;
|
|
1277
|
+
/** Enables internal string values to update for internationalization. */
|
|
1247
1278
|
i18n?: string;
|
|
1248
|
-
/**
|
|
1249
|
-
- `muted` Reduces visual weight for supporting content that should remain subtle and unobtrusive. */
|
|
1279
|
+
/** Set the visual prominence of the control */
|
|
1250
1280
|
prominence?: "muted";
|
|
1251
|
-
|
|
1252
1281
|
/** */
|
|
1253
1282
|
onreset?: (e: CustomEvent<CustomEvent>) => void;
|
|
1254
1283
|
};
|
|
1255
1284
|
|
|
1256
1285
|
export type GaugeProps = {
|
|
1257
|
-
/**
|
|
1286
|
+
/** The current `value` of the gauge. */
|
|
1258
1287
|
value?: number;
|
|
1259
1288
|
/** The `max` value of the gauge that the `value` is proportionally scaled to. */
|
|
1260
1289
|
max?: number;
|
|
1261
|
-
/**
|
|
1290
|
+
/** Four visual treatments represent the `status` of tasks.
|
|
1262
1291
|
- `accent` Highlights important actions or draws attention to primary interactive elements.
|
|
1263
1292
|
|
|
1264
1293
|
- `warning` Indicates cautionary actions that require careful consideration before proceeding.
|
|
@@ -1266,9 +1295,9 @@ export type GaugeProps = {
|
|
|
1266
1295
|
- `success` Represents positive outcomes, confirmations, or constructive actions.
|
|
1267
1296
|
|
|
1268
1297
|
- `danger` Signals destructive or irreversible actions that need extra attention and confirmation. */
|
|
1269
|
-
status?: "accent" | "warning" | "success" | "danger" | "neutral" |
|
|
1298
|
+
status?: "accent" | "warning" | "success" | "danger" | "neutral" | undefined;
|
|
1270
1299
|
/** Determines the gauge shape. Set `half` for a compact semi-circular arc. */
|
|
1271
|
-
shape?: "half" |
|
|
1300
|
+
shape?: "half" | undefined;
|
|
1272
1301
|
/** Controls the value indicator. Set `dot` for only the end dot or `needle` for a pointer. */
|
|
1273
1302
|
thumb?: "fill" | "dot" | "needle";
|
|
1274
1303
|
/** Controls the visual scale of an element to match its importance and available space.
|
|
@@ -1277,7 +1306,7 @@ export type GaugeProps = {
|
|
|
1277
1306
|
- `md` Standard size that works well in most contexts and provides balanced visibility.
|
|
1278
1307
|
|
|
1279
1308
|
- `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts. */
|
|
1280
|
-
size?: "sm" | "md" | "lg" |
|
|
1309
|
+
size?: "sm" | "md" | "lg" | undefined;
|
|
1281
1310
|
/** Enables updating internal string values for internationalization. */
|
|
1282
1311
|
i18n?: string;
|
|
1283
1312
|
};
|
|
@@ -1285,32 +1314,27 @@ export type GaugeProps = {
|
|
|
1285
1314
|
export type GridCellProps = {};
|
|
1286
1315
|
|
|
1287
1316
|
export type GridColumnProps = {
|
|
1317
|
+
/** Control the content alignment within a given column. */
|
|
1318
|
+
"column-align"?: "start" | "center" | "end";
|
|
1288
1319
|
/** Only set a fixed px width when you know the grid width. Most cases this should remain unset.
|
|
1289
1320
|
If the total width of all columns is less than the grid width then the last column fills the remaining space.
|
|
1290
1321
|
By default column widths are evenly divided unless width is explicitly provided. */
|
|
1291
1322
|
width?: string;
|
|
1292
|
-
/**
|
|
1323
|
+
/** Set the `position` property or attribute to `fixed` or `sticky` to make the column fixed or sticky.
|
|
1324
|
+
Fixed columns do not scroll horizontally with the grid. Sticky columns scroll horizontally with the grid
|
|
1325
|
+
until the column reaches the edge of the grid. */
|
|
1293
1326
|
position?: "fixed" | "sticky" | "";
|
|
1294
1327
|
/** Control the content alignment within a given column. */
|
|
1295
|
-
|
|
1296
|
-
/** */
|
|
1297
|
-
"aria-colindex"?: string;
|
|
1298
|
-
|
|
1328
|
+
columnAlign?: "start" | "center" | "end";
|
|
1299
1329
|
/** */
|
|
1300
1330
|
"onnve-grid-column-resize"?: (e: CustomEvent<CustomEvent>) => void;
|
|
1301
1331
|
};
|
|
1302
1332
|
|
|
1303
|
-
export type GridFooterProps = {
|
|
1304
|
-
/** */
|
|
1305
|
-
slot?: string;
|
|
1306
|
-
};
|
|
1333
|
+
export type GridFooterProps = {};
|
|
1307
1334
|
|
|
1308
1335
|
export type GridProps = {
|
|
1309
|
-
/**
|
|
1310
|
-
|
|
1311
|
-
|
|
1312
|
-
- `full` Element container optimizes for filling its container bounds. */
|
|
1313
|
-
container?: "flat" | "full" | "default";
|
|
1336
|
+
/** Determines the container styles of component. Flat nests the grid within other containers. Full spans the full edge-to-edge viewport width. */
|
|
1337
|
+
container?: "flat" | "full" | undefined;
|
|
1314
1338
|
/** Determine style variant stripe rows */
|
|
1315
1339
|
stripe?: boolean;
|
|
1316
1340
|
};
|
|
@@ -1605,65 +1629,9 @@ export type IconButtonProps = {
|
|
|
1605
1629
|
| "x-circle"
|
|
1606
1630
|
| "zoom-in"
|
|
1607
1631
|
| "zoom-out";
|
|
1608
|
-
/**
|
|
1609
|
-
Only supported by expand-panel/collapse-panel (horizontal axis) and arrow/caret/chevron icons (4-directions) */
|
|
1610
|
-
direction?: "up" | "down" | "left" | "right";
|
|
1611
|
-
/** Controls the visual scale of an element to match its importance and available space.
|
|
1612
|
-
- `sm` Compact size for dense layouts or secondary elements with less visual prominence.
|
|
1613
|
-
|
|
1614
|
-
- `md` Standard size that works well in most contexts and provides balanced visibility.
|
|
1615
|
-
|
|
1616
|
-
- `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts. */
|
|
1617
|
-
size?: "sm" | "md" | "lg" | "default";
|
|
1618
|
-
/** Demonstrates different container styles to accommodate visual weight and context.
|
|
1619
|
-
- `flat` Element has white space bounds but reduced visual container.
|
|
1620
|
-
|
|
1621
|
-
- `inline` Element container reduces to fit within inline content such as a block of text. */
|
|
1622
|
-
container?: "flat" | "inline" | "default";
|
|
1623
|
-
/** The Interaction type provides a way to show the intent of an interactive element. This can help users quickly understand what each interaction does and reduce the potential for confusion or errors.
|
|
1624
|
-
- `emphasis` Shows the interaction targets emphasis or highlighting primary actions.
|
|
1625
|
-
|
|
1626
|
-
- `destructive` Shows the interaction targets destructive actions such as deleting or removing. */
|
|
1627
|
-
interaction?: "emphasis" | "destructive";
|
|
1628
|
-
/** Indicates the current state of a toggle button that switches on or off. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-pressed)
|
|
1629
|
-
- `true` The button is in the pressed (on) state and the associated action or setting is active.
|
|
1630
|
-
|
|
1631
|
-
- `false` The button is in the unpressed (off) state and the associated action or setting is inactive. */
|
|
1632
|
-
pressed?: boolean;
|
|
1633
|
-
/** Indicates whether collapsible content is currently visible or hidden from the user. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)
|
|
1634
|
-
- `true` The associated content expands and becomes visible to the user.
|
|
1635
|
-
|
|
1636
|
-
- `false` The associated content collapses and hides from the user. */
|
|
1637
|
-
expanded?: boolean;
|
|
1638
|
-
/** Like input readonly, sets a button semantically as visual treatment only.
|
|
1632
|
+
/** Indicates whether the element is a noninteractive visual treatment instead of a button.
|
|
1639
1633
|
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly */
|
|
1640
1634
|
readonly?: boolean;
|
|
1641
|
-
/** Like input form, sets a button to submit a form outside its parent form.
|
|
1642
|
-
Returns a reference to the form element if available.
|
|
1643
|
-
https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/form */
|
|
1644
|
-
form?: string | HTMLFormElement | null;
|
|
1645
|
-
/** The name of the element, submitted as a pair with the element value as part of the form data. [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-name) */
|
|
1646
|
-
name?: string;
|
|
1647
|
-
/** Defines the value associated with the element's name when submitting the form data. The server receives this value in params when the form submits through this button. [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#value) */
|
|
1648
|
-
value?: string;
|
|
1649
|
-
/** Defines the button behavior when associated within a form element.
|
|
1650
|
-
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type */
|
|
1651
|
-
type?: "button" | "submit" | "reset";
|
|
1652
|
-
/** This Boolean attribute prevents the user from interacting with the element: it cannot receive press or focus events. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-disabled)
|
|
1653
|
-
- `true` The element has a disabled state and does not accept interaction.
|
|
1654
|
-
|
|
1655
|
-
- `false` The element has an enabled state and accepts interaction. */
|
|
1656
|
-
disabled?: boolean;
|
|
1657
|
-
/** Indicates whether an element currently holds selection within a multi-option selection group. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)
|
|
1658
|
-
- `true` The element holds selection and represents the user's current choice within the group.
|
|
1659
|
-
|
|
1660
|
-
- `false` The element does not hold selection and the user can choose it. */
|
|
1661
|
-
selected?: boolean;
|
|
1662
|
-
/** Indicates the element that represents the user's current location or position within a set. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current)
|
|
1663
|
-
- `page` Marks the current page within a set of navigation links.
|
|
1664
|
-
|
|
1665
|
-
- `step` Marks the current step within a multi-step process or workflow. */
|
|
1666
|
-
current?: "page" | "step";
|
|
1667
1635
|
/** Establishes a relationship between a popover and its invoker button.
|
|
1668
1636
|
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetElement */
|
|
1669
1637
|
popovertarget?: string;
|
|
@@ -1673,44 +1641,11 @@ https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetA
|
|
|
1673
1641
|
/** The element that receives the command.
|
|
1674
1642
|
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
1675
1643
|
commandfor?: string;
|
|
1676
|
-
/** The command to execute on the element.
|
|
1677
|
-
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
1678
|
-
command?: string;
|
|
1679
1644
|
/** The element that receives the interest.
|
|
1680
1645
|
https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement */
|
|
1681
1646
|
interestfor?: string;
|
|
1682
|
-
/**
|
|
1683
|
-
|
|
1684
|
-
popoverTargetElement?: HTMLElement | null;
|
|
1685
|
-
/** The element that receives the command.
|
|
1686
|
-
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
1687
|
-
commandForElement?: HTMLElement | null;
|
|
1688
|
-
/** The element that receives the interest.
|
|
1689
|
-
https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement */
|
|
1690
|
-
interestForElement?: HTMLElement | null;
|
|
1691
|
-
};
|
|
1692
|
-
|
|
1693
|
-
export type IconProps = {
|
|
1694
|
-
/** Communicates the intent and semantic meaning of an element to help users understand the outcome of their actions.
|
|
1695
|
-
- `warning` Indicates cautionary actions that require careful consideration before proceeding.
|
|
1696
|
-
|
|
1697
|
-
- `danger` Signals destructive or irreversible actions that need extra attention and confirmation.
|
|
1698
|
-
|
|
1699
|
-
- `success` Represents positive outcomes, confirmations, or constructive actions.
|
|
1700
|
-
|
|
1701
|
-
- `accent` Highlights important actions or draws attention to primary interactive elements. */
|
|
1702
|
-
status?: "warning" | "danger" | "success" | "accent" | "default";
|
|
1703
|
-
/** Controls the visual scale of an element to match its importance and available space.
|
|
1704
|
-
- `sm` Compact size for dense layouts or secondary elements with less visual prominence.
|
|
1705
|
-
|
|
1706
|
-
- `md` Standard size that works well in most contexts and provides balanced visibility.
|
|
1707
|
-
|
|
1708
|
-
- `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts. */
|
|
1709
|
-
size?: "sm" | "md" | "lg" | "xs" | "xl" | "default";
|
|
1710
|
-
/** Sets the direction of the icon. Only supported by expand-panel/collapse-panel (horizontal axis) and arrow/caret/chevron icons (4-directions) */
|
|
1711
|
-
direction?: "up" | "down" | "left" | "right" | "default";
|
|
1712
|
-
/** The name of the element, submitted as a pair with the element value as part of the form data. [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-name) */
|
|
1713
|
-
name?:
|
|
1647
|
+
/** Sets the icon name, which determines which icon to display. */
|
|
1648
|
+
iconName?:
|
|
1714
1649
|
| "placeholder"
|
|
1715
1650
|
| "caret"
|
|
1716
1651
|
| "person"
|
|
@@ -1985,97 +1920,24 @@ export type IconProps = {
|
|
|
1985
1920
|
| "wrench"
|
|
1986
1921
|
| "x-circle"
|
|
1987
1922
|
| "zoom-in"
|
|
1988
|
-
| "zoom-out"
|
|
1989
|
-
|
|
1990
|
-
|
|
1991
|
-
|
|
1992
|
-
export type InputGroupProps = {
|
|
1993
|
-
/** Controls the directional arrangement and spacing behavior of the element's content.
|
|
1994
|
-
- `vertical` Arranges content in a vertical stack with block-level spacing.
|
|
1995
|
-
|
|
1996
|
-
- `vertical-inline` Arranges content vertically with compact inline spacing for dense layouts.
|
|
1997
|
-
|
|
1998
|
-
- `horizontal` Arranges content in a horizontal row with block-level spacing.
|
|
1999
|
-
|
|
2000
|
-
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
2001
|
-
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
2002
|
-
/** Controls the visual prominence to establish hierarchy and guide user attention.
|
|
2003
|
-
- `muted` Reduces visual weight for supporting content that should remain subtle and unobtrusive. */
|
|
2004
|
-
prominence?: "muted";
|
|
2005
|
-
};
|
|
2006
|
-
|
|
2007
|
-
export type InputProps = {
|
|
2008
|
-
/** Demonstrates different container styles to accommodate visual weight and context.
|
|
2009
|
-
- `flat` Element has white space bounds but reduced visual container. */
|
|
2010
|
-
container?: "flat" | "default";
|
|
2011
|
-
/** Sets the rounded visual style of the input. */
|
|
2012
|
-
rounded?: boolean;
|
|
2013
|
-
/** Communicates the intent and semantic meaning of an element to help users understand the outcome of their actions.
|
|
2014
|
-
- `warning` Indicates cautionary actions that require careful consideration before proceeding.
|
|
2015
|
-
|
|
2016
|
-
- `success` Represents positive outcomes, confirmations, or constructive actions. */
|
|
2017
|
-
status?: "warning" | "error" | "success" | "disabled";
|
|
2018
|
-
/** Controls the directional arrangement and spacing behavior of the element's content.
|
|
2019
|
-
- `vertical` Arranges content in a vertical stack with block-level spacing.
|
|
2020
|
-
|
|
2021
|
-
- `vertical-inline` Arranges content vertically with compact inline spacing for dense layouts.
|
|
2022
|
-
|
|
2023
|
-
- `horizontal` Arranges content in a horizontal row with block-level spacing.
|
|
2024
|
-
|
|
2025
|
-
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
2026
|
-
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
2027
|
-
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
2028
|
-
"fit-text"?: boolean;
|
|
2029
|
-
/** Sets the input to match native default content block */
|
|
2030
|
-
"fit-content"?: boolean;
|
|
2031
|
-
/** Enables updating internal string values for internationalization. */
|
|
2032
|
-
i18n?: string;
|
|
2033
|
-
/** Controls the visual prominence to establish hierarchy and guide user attention.
|
|
2034
|
-
- `muted` Reduces visual weight for supporting content that should remain subtle and unobtrusive. */
|
|
2035
|
-
prominence?: "muted";
|
|
2036
|
-
|
|
2037
|
-
/** */
|
|
2038
|
-
onreset?: (e: CustomEvent<CustomEvent>) => void;
|
|
2039
|
-
};
|
|
2040
|
-
|
|
2041
|
-
export type LogoProps = {
|
|
2042
|
-
/** Defines a base color from the theme color palette */
|
|
2043
|
-
color?:
|
|
2044
|
-
| "red-cardinal"
|
|
2045
|
-
| "gray-slate"
|
|
2046
|
-
| "gray-denim"
|
|
2047
|
-
| "blue-indigo"
|
|
2048
|
-
| "blue-cobalt"
|
|
2049
|
-
| "blue-sky"
|
|
2050
|
-
| "teal-cyan"
|
|
2051
|
-
| "green-mint"
|
|
2052
|
-
| "teal-seafoam"
|
|
2053
|
-
| "green-grass"
|
|
2054
|
-
| "yellow-amber"
|
|
2055
|
-
| "orange-pumpkin"
|
|
2056
|
-
| "red-tomato"
|
|
2057
|
-
| "pink-magenta"
|
|
2058
|
-
| "purple-plum"
|
|
2059
|
-
| "purple-violet"
|
|
2060
|
-
| "purple-lavender"
|
|
2061
|
-
| "pink-rose"
|
|
2062
|
-
| "green-jade"
|
|
2063
|
-
| "lime-pear"
|
|
2064
|
-
| "yellow-nova"
|
|
2065
|
-
| "brand-green";
|
|
1923
|
+
| "zoom-out";
|
|
1924
|
+
/** Sets the direction of the icon.
|
|
1925
|
+
Only supported by expand-panel/collapse-panel (horizontal axis) and arrow/caret/chevron icons (4-directions) */
|
|
1926
|
+
direction?: "up" | "down" | "left" | "right";
|
|
2066
1927
|
/** Controls the visual scale of an element to match its importance and available space.
|
|
2067
1928
|
- `sm` Compact size for dense layouts or secondary elements with less visual prominence.
|
|
2068
1929
|
|
|
2069
1930
|
- `md` Standard size that works well in most contexts and provides balanced visibility.
|
|
2070
1931
|
|
|
2071
1932
|
- `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts. */
|
|
2072
|
-
size?: "sm" | "md" | "lg" |
|
|
2073
|
-
|
|
1933
|
+
size?: "sm" | "md" | "lg" | undefined;
|
|
1934
|
+
/** Determines the container of the button. Flat suits nesting within other containers or more muted style. Inline suits inline content such as text. */
|
|
1935
|
+
container?: "flat" | "inline" | undefined;
|
|
1936
|
+
/** The Interaction type provides a way to show the intent of an interactive element. This can help users quickly understand what each interaction does and reduce the potential for confusion or errors.
|
|
1937
|
+
- `emphasis` Shows the interaction targets emphasis or highlighting primary actions.
|
|
2074
1938
|
|
|
2075
|
-
|
|
2076
|
-
|
|
2077
|
-
- `danger` Signals destructive or irreversible actions that need extra attention and confirmation. */
|
|
2078
|
-
status?: "danger";
|
|
1939
|
+
- `destructive` Shows the interaction targets destructive actions such as deleting or removing. */
|
|
1940
|
+
interaction?: "emphasis" | "destructive";
|
|
2079
1941
|
/** Indicates the current state of a toggle button that switches on or off. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-pressed)
|
|
2080
1942
|
- `true` The button is in the pressed (on) state and the associated action or setting is active.
|
|
2081
1943
|
|
|
@@ -2086,14 +1948,15 @@ export type MenuItemProps = {
|
|
|
2086
1948
|
|
|
2087
1949
|
- `false` The associated content collapses and hides from the user. */
|
|
2088
1950
|
expanded?: boolean;
|
|
2089
|
-
/**
|
|
1951
|
+
/** Indicates whether the element is a noninteractive visual treatment instead of a button.
|
|
2090
1952
|
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly */
|
|
2091
|
-
|
|
2092
|
-
/**
|
|
2093
|
-
|
|
1953
|
+
readOnly?: boolean;
|
|
1954
|
+
/** Associates the button with a form. Set the property to a form element or its ID. The HTML attribute accepts only
|
|
1955
|
+
the form ID. Reading the property returns the associated form element or `null`.
|
|
2094
1956
|
https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/form */
|
|
2095
1957
|
form?: string | HTMLFormElement | null;
|
|
2096
|
-
/** The name of the
|
|
1958
|
+
/** The name of the button, submitted as a pair with the button value as part of the form data.
|
|
1959
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-name */
|
|
2097
1960
|
name?: string;
|
|
2098
1961
|
/** Defines the value associated with the element's name when submitting the form data. The server receives this value in params when the form submits through this button. [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#value) */
|
|
2099
1962
|
value?: string;
|
|
@@ -2117,125 +1980,582 @@ https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type */
|
|
|
2117
1980
|
current?: "page" | "step";
|
|
2118
1981
|
/** Establishes a relationship between a popover and its invoker button.
|
|
2119
1982
|
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetElement */
|
|
2120
|
-
|
|
1983
|
+
popoverTargetElement?: HTMLElement | null;
|
|
2121
1984
|
/** The popover target action to perform on the popover target element.
|
|
2122
1985
|
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetAction */
|
|
2123
|
-
|
|
1986
|
+
popoverTargetAction?: "show" | "hide" | "toggle";
|
|
2124
1987
|
/** The element that receives the command.
|
|
2125
1988
|
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
2126
|
-
|
|
1989
|
+
commandForElement?: HTMLElement | null;
|
|
2127
1990
|
/** The command to execute on the element.
|
|
2128
1991
|
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
2129
1992
|
command?: string;
|
|
2130
1993
|
/** The element that receives the interest.
|
|
2131
|
-
https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement */
|
|
2132
|
-
interestfor?: string;
|
|
2133
|
-
/** Establishes a relationship between a popover and its invoker button.
|
|
2134
|
-
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetElement */
|
|
2135
|
-
popoverTargetElement?: HTMLElement | null;
|
|
2136
|
-
/** The element that receives the command.
|
|
2137
|
-
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
2138
|
-
commandForElement?: HTMLElement | null;
|
|
2139
|
-
/** The element that receives the interest.
|
|
2140
1994
|
https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement */
|
|
2141
1995
|
interestForElement?: HTMLElement | null;
|
|
2142
1996
|
};
|
|
2143
1997
|
|
|
2144
|
-
export type
|
|
2145
|
-
/** Fires when the user scrolls the menu list. Throttled to one dispatch per animation frame. `detail: { scrollTop, scrollHeight, clientHeight }`. */
|
|
2146
|
-
onscroll?: (e: CustomEvent<never>) => void;
|
|
2147
|
-
};
|
|
2148
|
-
|
|
2149
|
-
export type MonthProps = {
|
|
2150
|
-
/** Demonstrates different container styles to accommodate visual weight and context.
|
|
2151
|
-
- `flat` Element has white space bounds but reduced visual container. */
|
|
2152
|
-
container?: "flat" | "default";
|
|
1998
|
+
export type IconProps = {
|
|
2153
1999
|
/** Communicates the intent and semantic meaning of an element to help users understand the outcome of their actions.
|
|
2154
2000
|
- `warning` Indicates cautionary actions that require careful consideration before proceeding.
|
|
2155
2001
|
|
|
2156
|
-
- `
|
|
2157
|
-
status?: "warning" | "error" | "success" | "disabled";
|
|
2158
|
-
/** Controls the directional arrangement and spacing behavior of the element's content.
|
|
2159
|
-
- `vertical` Arranges content in a vertical stack with block-level spacing.
|
|
2160
|
-
|
|
2161
|
-
- `vertical-inline` Arranges content vertically with compact inline spacing for dense layouts.
|
|
2162
|
-
|
|
2163
|
-
- `horizontal` Arranges content in a horizontal row with block-level spacing.
|
|
2164
|
-
|
|
2165
|
-
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
2166
|
-
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
2167
|
-
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
2168
|
-
"fit-text"?: boolean;
|
|
2169
|
-
/** Sets the input to match native default content block */
|
|
2170
|
-
"fit-content"?: boolean;
|
|
2171
|
-
/** Enables updating internal string values for internationalization. */
|
|
2172
|
-
i18n?: string;
|
|
2173
|
-
/** Controls the visual prominence to establish hierarchy and guide user attention.
|
|
2174
|
-
- `muted` Reduces visual weight for supporting content that should remain subtle and unobtrusive. */
|
|
2175
|
-
prominence?: "muted";
|
|
2176
|
-
|
|
2177
|
-
/** */
|
|
2178
|
-
onreset?: (e: CustomEvent<CustomEvent>) => void;
|
|
2179
|
-
};
|
|
2180
|
-
|
|
2181
|
-
export type NotificationGroupProps = {
|
|
2182
|
-
/** Provides the element that the popover should position relative to. Anchor can accept a idref string within the same render root or a HTMLElement DOM reference. */
|
|
2183
|
-
anchor?: string | HTMLElement;
|
|
2184
|
-
/** Determines the position of an element along both inline and block axis. [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Box_alignment_in_grid_layout#the_two_axes_of_a_grid_layout)
|
|
2185
|
-
- `center` Centers the popover directly over the anchor element.
|
|
2186
|
-
|
|
2187
|
-
- `top` Positions the popover above the anchor element.
|
|
2188
|
-
|
|
2189
|
-
- `bottom` Positions the popover below the anchor element.
|
|
2190
|
-
|
|
2191
|
-
- `left` Positions the popover to the left side of the anchor element.
|
|
2192
|
-
|
|
2193
|
-
- `right` Positions the popover to the right side of the anchor element. */
|
|
2194
|
-
position?: "center" | "top" | "bottom" | "left" | "right";
|
|
2195
|
-
/** Determines the alignment of the popover relative to the provided anchor element.
|
|
2196
|
-
- `start` Aligns the popover to the beginning edge of the anchor for left or top alignment.
|
|
2197
|
-
|
|
2198
|
-
- `end` Aligns the popover to the ending edge of the anchor for right or bottom alignment.
|
|
2199
|
-
|
|
2200
|
-
- `center` Centers the popover along the anchor's edge for balanced positioning. */
|
|
2201
|
-
alignment?: "start" | "end" | "center";
|
|
2202
|
-
};
|
|
2203
|
-
|
|
2204
|
-
export type NotificationProps = {
|
|
2205
|
-
/** Provides the element that the popover should position relative to. Anchor can accept a idref string within the same render root or a HTMLElement DOM reference. */
|
|
2206
|
-
anchor?: string | HTMLElement;
|
|
2207
|
-
/** @deprecated Use the popover API instead.
|
|
2208
|
-
The trigger defines what element triggers an `open` interaction event.
|
|
2209
|
-
A trigger can accept a idref string within the same render root or a HTMLElement DOM reference. - Defines what element triggers an `open` interaction event. A trigger can accept a idref string within the same render root or a HTMLElement DOM reference. */
|
|
2210
|
-
trigger?: string | HTMLElement;
|
|
2211
|
-
/** Determines the position of an element along both inline and block axis. [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Box_alignment_in_grid_layout#the_two_axes_of_a_grid_layout)
|
|
2212
|
-
- `center` Centers the popover directly over the anchor element.
|
|
2213
|
-
|
|
2214
|
-
- `top` Positions the popover above the anchor element.
|
|
2215
|
-
|
|
2216
|
-
- `bottom` Positions the popover below the anchor element.
|
|
2002
|
+
- `danger` Signals destructive or irreversible actions that need extra attention and confirmation.
|
|
2217
2003
|
|
|
2218
|
-
- `
|
|
2004
|
+
- `success` Represents positive outcomes, confirmations, or constructive actions.
|
|
2219
2005
|
|
|
2220
|
-
- `
|
|
2221
|
-
|
|
2222
|
-
/**
|
|
2223
|
-
- `
|
|
2006
|
+
- `accent` Highlights important actions or draws attention to primary interactive elements. */
|
|
2007
|
+
status?: "warning" | "danger" | "success" | "accent" | undefined;
|
|
2008
|
+
/** Controls the bounding box size of the icon given a t-shirt style value.
|
|
2009
|
+
- `sm` Compact size for dense layouts or secondary elements with less visual prominence.
|
|
2224
2010
|
|
|
2225
|
-
- `
|
|
2011
|
+
- `md` Standard size that works well in most contexts and provides balanced visibility.
|
|
2226
2012
|
|
|
2227
|
-
- `
|
|
2228
|
-
|
|
2229
|
-
/**
|
|
2230
|
-
|
|
2231
|
-
|
|
2232
|
-
|
|
2233
|
-
|
|
2013
|
+
- `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts. */
|
|
2014
|
+
size?: "sm" | "md" | "lg" | "xs" | "xl" | undefined;
|
|
2015
|
+
/** Sets the direction of the icon. Only supported by expand-panel/collapse-panel (horizontal axis) and arrow/caret/chevron icons (4-directions) */
|
|
2016
|
+
direction?: "up" | "down" | "left" | "right" | undefined;
|
|
2017
|
+
/** The name of the icon SVG sprite to render. */
|
|
2018
|
+
name?:
|
|
2019
|
+
| "placeholder"
|
|
2020
|
+
| "caret"
|
|
2021
|
+
| "person"
|
|
2022
|
+
| "menu"
|
|
2023
|
+
| "cancel"
|
|
2024
|
+
| "gear"
|
|
2025
|
+
| "chevron"
|
|
2026
|
+
| "logout"
|
|
2027
|
+
| "copy"
|
|
2028
|
+
| "more-actions"
|
|
2029
|
+
| "add"
|
|
2030
|
+
| "arrow"
|
|
2031
|
+
| "delete"
|
|
2032
|
+
| "download"
|
|
2033
|
+
| "search"
|
|
2034
|
+
| "split-vertical"
|
|
2035
|
+
| "sparkles"
|
|
2036
|
+
| "branch"
|
|
2037
|
+
| "refresh"
|
|
2038
|
+
| "double-chevron"
|
|
2039
|
+
| "academic-cap"
|
|
2040
|
+
| "add-asset"
|
|
2041
|
+
| "add-comment"
|
|
2042
|
+
| "add-grid"
|
|
2043
|
+
| "add-user"
|
|
2044
|
+
| "ancestors"
|
|
2045
|
+
| "archive"
|
|
2046
|
+
| "arrow-angle"
|
|
2047
|
+
| "arrow-both"
|
|
2048
|
+
| "arrow-cycle"
|
|
2049
|
+
| "arrow-path-rounded-square"
|
|
2050
|
+
| "arrow-stop"
|
|
2051
|
+
| "at-symbol"
|
|
2052
|
+
| "backspace"
|
|
2053
|
+
| "bar-pill-stack"
|
|
2054
|
+
| "bars-3"
|
|
2055
|
+
| "bars-3-bottom-left"
|
|
2056
|
+
| "bars-3-bottom-right"
|
|
2057
|
+
| "bars-3-center-left"
|
|
2058
|
+
| "bars-4"
|
|
2059
|
+
| "beaker"
|
|
2060
|
+
| "bell"
|
|
2061
|
+
| "bell-slash"
|
|
2062
|
+
| "bell-stroke"
|
|
2063
|
+
| "bold"
|
|
2064
|
+
| "book"
|
|
2065
|
+
| "bookmark"
|
|
2066
|
+
| "bookmark-stroke"
|
|
2067
|
+
| "bounding-box"
|
|
2068
|
+
| "briefcase"
|
|
2069
|
+
| "broadcast"
|
|
2070
|
+
| "browser"
|
|
2071
|
+
| "bug"
|
|
2072
|
+
| "calendar"
|
|
2073
|
+
| "camera"
|
|
2074
|
+
| "carets-closed-square"
|
|
2075
|
+
| "carousel"
|
|
2076
|
+
| "category-list"
|
|
2077
|
+
| "chart-bar"
|
|
2078
|
+
| "chat-bubble"
|
|
2079
|
+
| "chat-bubbles"
|
|
2080
|
+
| "check"
|
|
2081
|
+
| "check-badge"
|
|
2082
|
+
| "checklist"
|
|
2083
|
+
| "checkmark-circle"
|
|
2084
|
+
| "chip"
|
|
2085
|
+
| "circle"
|
|
2086
|
+
| "circle-angled-line"
|
|
2087
|
+
| "circle-dash"
|
|
2088
|
+
| "circle-dot"
|
|
2089
|
+
| "circle-dot-arrows"
|
|
2090
|
+
| "circle-half"
|
|
2091
|
+
| "circle-rule"
|
|
2092
|
+
| "circle-tick"
|
|
2093
|
+
| "clipboard"
|
|
2094
|
+
| "clock"
|
|
2095
|
+
| "clock-circle-arrow"
|
|
2096
|
+
| "cloud"
|
|
2097
|
+
| "cloud-download"
|
|
2098
|
+
| "cloud-upload"
|
|
2099
|
+
| "code"
|
|
2100
|
+
| "collapse-all"
|
|
2101
|
+
| "collapse-details"
|
|
2102
|
+
| "color-palette"
|
|
2103
|
+
| "columns"
|
|
2104
|
+
| "compare"
|
|
2105
|
+
| "computer"
|
|
2106
|
+
| "connect-node"
|
|
2107
|
+
| "connected-blocks"
|
|
2108
|
+
| "cross-hairs"
|
|
2109
|
+
| "cursor-rays"
|
|
2110
|
+
| "cursor-ripples"
|
|
2111
|
+
| "data-management"
|
|
2112
|
+
| "delete-node"
|
|
2113
|
+
| "doc-checkmark"
|
|
2114
|
+
| "dock-bottom"
|
|
2115
|
+
| "dock-none"
|
|
2116
|
+
| "dock-side"
|
|
2117
|
+
| "document"
|
|
2118
|
+
| "document-clipboard"
|
|
2119
|
+
| "dot"
|
|
2120
|
+
| "dot-stroke"
|
|
2121
|
+
| "drag"
|
|
2122
|
+
| "dropper"
|
|
2123
|
+
| "duplicate"
|
|
2124
|
+
| "edit"
|
|
2125
|
+
| "ellipses"
|
|
2126
|
+
| "envelope"
|
|
2127
|
+
| "exclamation-circle"
|
|
2128
|
+
| "exclamation-mark"
|
|
2129
|
+
| "exclamation-triangle"
|
|
2130
|
+
| "expand-all"
|
|
2131
|
+
| "expand-details"
|
|
2132
|
+
| "expression"
|
|
2133
|
+
| "eye"
|
|
2134
|
+
| "eye-hidden"
|
|
2135
|
+
| "face-frown"
|
|
2136
|
+
| "face-smile"
|
|
2137
|
+
| "fast-forward"
|
|
2138
|
+
| "fast-forward-10"
|
|
2139
|
+
| "film"
|
|
2140
|
+
| "filter"
|
|
2141
|
+
| "filter-stroke"
|
|
2142
|
+
| "flag"
|
|
2143
|
+
| "flag-stroke"
|
|
2144
|
+
| "fold"
|
|
2145
|
+
| "folder"
|
|
2146
|
+
| "fork"
|
|
2147
|
+
| "globe"
|
|
2148
|
+
| "globe-alt-stroke"
|
|
2149
|
+
| "group"
|
|
2150
|
+
| "group-boxes"
|
|
2151
|
+
| "hand"
|
|
2152
|
+
| "hash"
|
|
2153
|
+
| "heading"
|
|
2154
|
+
| "home"
|
|
2155
|
+
| "horizontal-rule"
|
|
2156
|
+
| "hourglass"
|
|
2157
|
+
| "hourglass-end"
|
|
2158
|
+
| "hourglass-mid"
|
|
2159
|
+
| "hourglass-start"
|
|
2160
|
+
| "identification"
|
|
2161
|
+
| "image"
|
|
2162
|
+
| "inbox"
|
|
2163
|
+
| "infinity"
|
|
2164
|
+
| "information-circle-stroke"
|
|
2165
|
+
| "inspect"
|
|
2166
|
+
| "italic"
|
|
2167
|
+
| "key"
|
|
2168
|
+
| "keyboard"
|
|
2169
|
+
| "laptop-phone"
|
|
2170
|
+
| "layers"
|
|
2171
|
+
| "lifebuoy"
|
|
2172
|
+
| "lightbulb"
|
|
2173
|
+
| "lightning-bolt"
|
|
2174
|
+
| "link"
|
|
2175
|
+
| "list-ordered"
|
|
2176
|
+
| "list-unordered"
|
|
2177
|
+
| "lock"
|
|
2178
|
+
| "login"
|
|
2179
|
+
| "looping"
|
|
2180
|
+
| "looping-off"
|
|
2181
|
+
| "map"
|
|
2182
|
+
| "map-drives"
|
|
2183
|
+
| "map-pin"
|
|
2184
|
+
| "markdown"
|
|
2185
|
+
| "maximize"
|
|
2186
|
+
| "megaphone"
|
|
2187
|
+
| "merge"
|
|
2188
|
+
| "meter"
|
|
2189
|
+
| "minimize"
|
|
2190
|
+
| "minus"
|
|
2191
|
+
| "minus-circle"
|
|
2192
|
+
| "moon"
|
|
2193
|
+
| "multiselect"
|
|
2194
|
+
| "music-note"
|
|
2195
|
+
| "newspaper"
|
|
2196
|
+
| "not-allowed"
|
|
2197
|
+
| "numbers"
|
|
2198
|
+
| "office-building"
|
|
2199
|
+
| "outline"
|
|
2200
|
+
| "paper-airplane"
|
|
2201
|
+
| "paper-clip"
|
|
2202
|
+
| "pause"
|
|
2203
|
+
| "pencil-square"
|
|
2204
|
+
| "person-2"
|
|
2205
|
+
| "person-3"
|
|
2206
|
+
| "person-circle"
|
|
2207
|
+
| "phone"
|
|
2208
|
+
| "picture-in-picture"
|
|
2209
|
+
| "pie-chart"
|
|
2210
|
+
| "pin"
|
|
2211
|
+
| "pizza-slice"
|
|
2212
|
+
| "play"
|
|
2213
|
+
| "plug"
|
|
2214
|
+
| "plus-circle"
|
|
2215
|
+
| "plus-minus"
|
|
2216
|
+
| "pointer"
|
|
2217
|
+
| "pointer-stroke"
|
|
2218
|
+
| "priority-high"
|
|
2219
|
+
| "priority-low"
|
|
2220
|
+
| "priority-medium"
|
|
2221
|
+
| "projector"
|
|
2222
|
+
| "pull-close"
|
|
2223
|
+
| "pull-draft"
|
|
2224
|
+
| "pull-open"
|
|
2225
|
+
| "pulse"
|
|
2226
|
+
| "puzzle-piece"
|
|
2227
|
+
| "question-mark-circle"
|
|
2228
|
+
| "question-mark-circle-stroke"
|
|
2229
|
+
| "rectangle-group"
|
|
2230
|
+
| "rectangle-stack-horizontal"
|
|
2231
|
+
| "rectangle-stack-vertical"
|
|
2232
|
+
| "redo"
|
|
2233
|
+
| "reply"
|
|
2234
|
+
| "rewind"
|
|
2235
|
+
| "rewind-10"
|
|
2236
|
+
| "rocketship"
|
|
2237
|
+
| "running"
|
|
2238
|
+
| "scale"
|
|
2239
|
+
| "scissors"
|
|
2240
|
+
| "sensor"
|
|
2241
|
+
| "server"
|
|
2242
|
+
| "server-stack"
|
|
2243
|
+
| "shapes"
|
|
2244
|
+
| "share"
|
|
2245
|
+
| "signal"
|
|
2246
|
+
| "signal-slash"
|
|
2247
|
+
| "signpost"
|
|
2248
|
+
| "sort-ascending"
|
|
2249
|
+
| "sort-descending"
|
|
2250
|
+
| "soundwave"
|
|
2251
|
+
| "split-horizontal"
|
|
2252
|
+
| "split-none"
|
|
2253
|
+
| "star"
|
|
2254
|
+
| "star-half"
|
|
2255
|
+
| "star-stroke"
|
|
2256
|
+
| "start"
|
|
2257
|
+
| "status-offline"
|
|
2258
|
+
| "status-online"
|
|
2259
|
+
| "stop"
|
|
2260
|
+
| "stop-sign"
|
|
2261
|
+
| "stopwatch"
|
|
2262
|
+
| "strikethrough"
|
|
2263
|
+
| "sun"
|
|
2264
|
+
| "swatch"
|
|
2265
|
+
| "switch"
|
|
2266
|
+
| "switch-apps"
|
|
2267
|
+
| "table"
|
|
2268
|
+
| "tag"
|
|
2269
|
+
| "task"
|
|
2270
|
+
| "telescope"
|
|
2271
|
+
| "template"
|
|
2272
|
+
| "terminal"
|
|
2273
|
+
| "thumb"
|
|
2274
|
+
| "thumb-stroke"
|
|
2275
|
+
| "traffic-cone"
|
|
2276
|
+
| "transparent-box"
|
|
2277
|
+
| "trend-down"
|
|
2278
|
+
| "trend-up"
|
|
2279
|
+
| "trophy"
|
|
2280
|
+
| "truck"
|
|
2281
|
+
| "typography"
|
|
2282
|
+
| "undo"
|
|
2283
|
+
| "unlock"
|
|
2284
|
+
| "upload"
|
|
2285
|
+
| "video-camera"
|
|
2286
|
+
| "view-as-grid"
|
|
2287
|
+
| "volume"
|
|
2288
|
+
| "volume-muted"
|
|
2289
|
+
| "wifi"
|
|
2290
|
+
| "wrench"
|
|
2291
|
+
| "x-circle"
|
|
2292
|
+
| "zoom-in"
|
|
2293
|
+
| "zoom-out"
|
|
2294
|
+
| undefined;
|
|
2295
|
+
};
|
|
2296
|
+
|
|
2297
|
+
export type InputGroupProps = {
|
|
2298
|
+
/** Controls the directional arrangement and spacing behavior of the element's content.
|
|
2299
|
+
- `vertical` Arranges content in a vertical stack with block-level spacing.
|
|
2300
|
+
|
|
2301
|
+
- `vertical-inline` Arranges content vertically with compact inline spacing for dense layouts.
|
|
2302
|
+
|
|
2303
|
+
- `horizontal` Arranges content in a horizontal row with block-level spacing.
|
|
2304
|
+
|
|
2305
|
+
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
2306
|
+
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
2307
|
+
/** Set the visual prominence of the control group */
|
|
2308
|
+
prominence?: "muted";
|
|
2309
|
+
};
|
|
2310
|
+
|
|
2311
|
+
export type InputProps = {
|
|
2312
|
+
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
2313
|
+
"fit-text"?: boolean;
|
|
2314
|
+
/** Sets the input to match native default content block */
|
|
2315
|
+
"fit-content"?: boolean;
|
|
2316
|
+
/** Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.
|
|
2317
|
+
Use when embedding within another container such as a toolbar. */
|
|
2318
|
+
container?: "flat" | undefined;
|
|
2319
|
+
/** Sets the rounded visual style of the input. */
|
|
2320
|
+
rounded?: boolean;
|
|
2321
|
+
/** Set current visual state for control. This overrides any validation states active. */
|
|
2322
|
+
status?: "warning" | "error" | "success" | "disabled";
|
|
2323
|
+
/** Controls the directional arrangement and spacing behavior of the element's content.
|
|
2324
|
+
- `vertical` Arranges content in a vertical stack with block-level spacing.
|
|
2325
|
+
|
|
2326
|
+
- `vertical-inline` Arranges content vertically with compact inline spacing for dense layouts.
|
|
2327
|
+
|
|
2328
|
+
- `horizontal` Arranges content in a horizontal row with block-level spacing.
|
|
2329
|
+
|
|
2330
|
+
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
2331
|
+
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
2332
|
+
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
2333
|
+
fitText?: boolean;
|
|
2334
|
+
/** Sets the input to match native default content block */
|
|
2335
|
+
fitContent?: boolean;
|
|
2336
|
+
/** Enables internal string values to update for internationalization. */
|
|
2337
|
+
i18n?: string;
|
|
2338
|
+
/** Set the visual prominence of the control */
|
|
2339
|
+
prominence?: "muted";
|
|
2340
|
+
/** */
|
|
2341
|
+
onreset?: (e: CustomEvent<CustomEvent>) => void;
|
|
2342
|
+
};
|
|
2343
|
+
|
|
2344
|
+
export type LogoProps = {
|
|
2345
|
+
/** Defines a base color from the theme color palette */
|
|
2346
|
+
color?:
|
|
2347
|
+
| "red-cardinal"
|
|
2348
|
+
| "gray-slate"
|
|
2349
|
+
| "gray-denim"
|
|
2350
|
+
| "blue-indigo"
|
|
2351
|
+
| "blue-cobalt"
|
|
2352
|
+
| "blue-sky"
|
|
2353
|
+
| "teal-cyan"
|
|
2354
|
+
| "green-mint"
|
|
2355
|
+
| "teal-seafoam"
|
|
2356
|
+
| "green-grass"
|
|
2357
|
+
| "yellow-amber"
|
|
2358
|
+
| "orange-pumpkin"
|
|
2359
|
+
| "red-tomato"
|
|
2360
|
+
| "pink-magenta"
|
|
2361
|
+
| "purple-plum"
|
|
2362
|
+
| "purple-violet"
|
|
2363
|
+
| "purple-lavender"
|
|
2364
|
+
| "pink-rose"
|
|
2365
|
+
| "green-jade"
|
|
2366
|
+
| "lime-pear"
|
|
2367
|
+
| "yellow-nova"
|
|
2368
|
+
| "brand-green";
|
|
2369
|
+
/** Controls the visual scale of an element to match its importance and available space.
|
|
2370
|
+
- `sm` Compact size for dense layouts or secondary elements with less visual prominence.
|
|
2371
|
+
|
|
2372
|
+
- `md` Standard size that works well in most contexts and provides balanced visibility.
|
|
2373
|
+
|
|
2374
|
+
- `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts. */
|
|
2375
|
+
size?: "sm" | "md" | "lg" | undefined;
|
|
2376
|
+
};
|
|
2377
|
+
|
|
2378
|
+
export type MenuItemProps = {
|
|
2379
|
+
/** Indicates whether the element is a noninteractive visual treatment instead of a button.
|
|
2380
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly */
|
|
2381
|
+
readonly?: boolean;
|
|
2382
|
+
/** Establishes a relationship between a popover and its invoker button.
|
|
2383
|
+
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetElement */
|
|
2384
|
+
popovertarget?: string;
|
|
2385
|
+
/** The popover target action to perform on the popover target element.
|
|
2386
|
+
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetAction */
|
|
2387
|
+
popovertargetaction?: "show" | "hide" | "toggle";
|
|
2388
|
+
/** The element that receives the command.
|
|
2389
|
+
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
2390
|
+
commandfor?: string;
|
|
2391
|
+
/** The element that receives the interest.
|
|
2392
|
+
https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement */
|
|
2393
|
+
interestfor?: string;
|
|
2394
|
+
/** Applies danger styling to destructive or high-risk menu actions. */
|
|
2395
|
+
status?: "danger";
|
|
2396
|
+
/** Defines the button behavior when associated within a form element.
|
|
2397
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type */
|
|
2398
|
+
type?: "button" | "submit" | "reset";
|
|
2399
|
+
/** Indicates the current state of a toggle button that switches on or off. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-pressed)
|
|
2400
|
+
- `true` The button is in the pressed (on) state and the associated action or setting is active.
|
|
2401
|
+
|
|
2402
|
+
- `false` The button is in the unpressed (off) state and the associated action or setting is inactive. */
|
|
2403
|
+
pressed?: boolean;
|
|
2404
|
+
/** Indicates whether collapsible content is currently visible or hidden from the user. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)
|
|
2405
|
+
- `true` The associated content expands and becomes visible to the user.
|
|
2406
|
+
|
|
2407
|
+
- `false` The associated content collapses and hides from the user. */
|
|
2408
|
+
expanded?: boolean;
|
|
2409
|
+
/** Indicates whether the element is a noninteractive visual treatment instead of a button.
|
|
2410
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly */
|
|
2411
|
+
readOnly?: boolean;
|
|
2412
|
+
/** Associates the button with a form. Set the property to a form element or its ID. The HTML attribute accepts only
|
|
2413
|
+
the form ID. Reading the property returns the associated form element or `null`.
|
|
2414
|
+
https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/form */
|
|
2415
|
+
form?: string | HTMLFormElement | null;
|
|
2416
|
+
/** The name of the button, submitted as a pair with the button value as part of the form data.
|
|
2417
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-name */
|
|
2418
|
+
name?: string;
|
|
2419
|
+
/** Defines the value associated with the element's name when submitting the form data. The server receives this value in params when the form submits through this button. [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#value) */
|
|
2420
|
+
value?: string;
|
|
2421
|
+
/** This Boolean attribute prevents the user from interacting with the element: it cannot receive press or focus events. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-disabled)
|
|
2422
|
+
- `true` The element has a disabled state and does not accept interaction.
|
|
2423
|
+
|
|
2424
|
+
- `false` The element has an enabled state and accepts interaction. */
|
|
2425
|
+
disabled?: boolean;
|
|
2426
|
+
/** Indicates whether an element currently holds selection within a multi-option selection group. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)
|
|
2427
|
+
- `true` The element holds selection and represents the user's current choice within the group.
|
|
2428
|
+
|
|
2429
|
+
- `false` The element does not hold selection and the user can choose it. */
|
|
2430
|
+
selected?: boolean;
|
|
2431
|
+
/** Indicates the element that represents the user's current location or position within a set. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current)
|
|
2432
|
+
- `page` Marks the current page within a set of navigation links.
|
|
2433
|
+
|
|
2434
|
+
- `step` Marks the current step within a multi-step process or workflow. */
|
|
2435
|
+
current?: "page" | "step";
|
|
2436
|
+
/** Establishes a relationship between a popover and its invoker button.
|
|
2437
|
+
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetElement */
|
|
2438
|
+
popoverTargetElement?: HTMLElement | null;
|
|
2439
|
+
/** The popover target action to perform on the popover target element.
|
|
2440
|
+
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetAction */
|
|
2441
|
+
popoverTargetAction?: "show" | "hide" | "toggle";
|
|
2442
|
+
/** The element that receives the command.
|
|
2443
|
+
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
2444
|
+
commandForElement?: HTMLElement | null;
|
|
2445
|
+
/** The command to execute on the element.
|
|
2446
|
+
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
2447
|
+
command?: string;
|
|
2448
|
+
/** The element that receives the interest.
|
|
2449
|
+
https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement */
|
|
2450
|
+
interestForElement?: HTMLElement | null;
|
|
2451
|
+
};
|
|
2452
|
+
|
|
2453
|
+
export type MenuProps = {
|
|
2454
|
+
/** Fires when the user scrolls the menu list. Throttled to one dispatch per animation frame. `detail: { scrollTop, scrollHeight, clientHeight }`. */
|
|
2455
|
+
onscroll?: (e: CustomEvent<never>) => void;
|
|
2456
|
+
};
|
|
2457
|
+
|
|
2458
|
+
export type MonthProps = {
|
|
2459
|
+
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
2460
|
+
"fit-text"?: boolean;
|
|
2461
|
+
/** Sets the input to match native default content block */
|
|
2462
|
+
"fit-content"?: boolean;
|
|
2463
|
+
/** Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.
|
|
2464
|
+
Use when embedding within another container such as a toolbar. */
|
|
2465
|
+
container?: "flat" | undefined;
|
|
2466
|
+
/** Set current visual state for control. This overrides any validation states active. */
|
|
2467
|
+
status?: "warning" | "error" | "success" | "disabled";
|
|
2468
|
+
/** Controls the directional arrangement and spacing behavior of the element's content.
|
|
2469
|
+
- `vertical` Arranges content in a vertical stack with block-level spacing.
|
|
2470
|
+
|
|
2471
|
+
- `vertical-inline` Arranges content vertically with compact inline spacing for dense layouts.
|
|
2472
|
+
|
|
2473
|
+
- `horizontal` Arranges content in a horizontal row with block-level spacing.
|
|
2474
|
+
|
|
2475
|
+
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
2476
|
+
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
2477
|
+
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
2478
|
+
fitText?: boolean;
|
|
2479
|
+
/** Sets the input to match native default content block */
|
|
2480
|
+
fitContent?: boolean;
|
|
2481
|
+
/** Enables internal string values to update for internationalization. */
|
|
2482
|
+
i18n?: string;
|
|
2483
|
+
/** Set the visual prominence of the control */
|
|
2484
|
+
prominence?: "muted";
|
|
2485
|
+
/** */
|
|
2486
|
+
onreset?: (e: CustomEvent<CustomEvent>) => void;
|
|
2487
|
+
};
|
|
2488
|
+
|
|
2489
|
+
export type NotificationGroupProps = {
|
|
2490
|
+
/** Provides the element that the popover should position relative to. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. */
|
|
2491
|
+
anchor?: string | HTMLElement;
|
|
2492
|
+
/** Sets the position of the popover relative to the anchor element.
|
|
2493
|
+
- `center` Centers the popover directly over the anchor element.
|
|
2234
2494
|
|
|
2235
|
-
- `
|
|
2236
|
-
|
|
2495
|
+
- `top` Positions the popover above the anchor element.
|
|
2496
|
+
|
|
2497
|
+
- `bottom` Positions the popover below the anchor element.
|
|
2498
|
+
|
|
2499
|
+
- `left` Positions the popover to the left side of the anchor element.
|
|
2500
|
+
|
|
2501
|
+
- `right` Positions the popover to the right side of the anchor element. */
|
|
2502
|
+
position?: "center" | "top" | "bottom" | "left" | "right";
|
|
2503
|
+
/** Determines the alignment of the popover relative to the provided anchor element.
|
|
2504
|
+
- `start` Aligns the popover to the beginning edge of the anchor for left or top alignment.
|
|
2505
|
+
|
|
2506
|
+
- `end` Aligns the popover to the ending edge of the anchor for right or bottom alignment.
|
|
2507
|
+
|
|
2508
|
+
- `center` Centers the popover along the anchor's edge for balanced positioning. */
|
|
2509
|
+
alignment?: "start" | "end" | "center";
|
|
2510
|
+
};
|
|
2511
|
+
|
|
2512
|
+
export type NotificationProps = {
|
|
2513
|
+
/** @deprecated Use the popover API instead.
|
|
2514
|
+
Determines if popover visibility behavior should be automatically controlled by the trigger. */
|
|
2515
|
+
"behavior-trigger"?: boolean;
|
|
2237
2516
|
/** A delayed `close` event will occur determined from the provided millisecond value. */
|
|
2238
2517
|
"close-timeout"?: number;
|
|
2518
|
+
/** Provides the element that the popover should position relative to. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. */
|
|
2519
|
+
anchor?: string | HTMLElement;
|
|
2520
|
+
/** @deprecated Use the popover API instead.
|
|
2521
|
+
The trigger defines what element triggers an `open` interaction event.
|
|
2522
|
+
A trigger can accept a idref string within the same render root or a HTMLElement DOM reference. - Defines the element that triggers an `open` interaction event. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. */
|
|
2523
|
+
trigger?: string | HTMLElement;
|
|
2524
|
+
/** Sets the side position of the popover relative to the provided anchor element.
|
|
2525
|
+
- `center` Centers the popover directly over the anchor element.
|
|
2526
|
+
|
|
2527
|
+
- `top` Positions the popover above the anchor element.
|
|
2528
|
+
|
|
2529
|
+
- `bottom` Positions the popover below the anchor element.
|
|
2530
|
+
|
|
2531
|
+
- `left` Positions the popover to the left side of the anchor element.
|
|
2532
|
+
|
|
2533
|
+
- `right` Positions the popover to the right side of the anchor element. */
|
|
2534
|
+
position?: "center" | "top" | "bottom" | "left" | "right";
|
|
2535
|
+
/** Determines the alignment of the popover relative to the provided anchor element.
|
|
2536
|
+
- `start` Aligns the popover to the beginning edge of the anchor for left or top alignment.
|
|
2537
|
+
|
|
2538
|
+
- `end` Aligns the popover to the ending edge of the anchor for right or bottom alignment.
|
|
2539
|
+
|
|
2540
|
+
- `center` Centers the popover along the anchor's edge for balanced positioning. */
|
|
2541
|
+
alignment?: "start" | "end" | "center";
|
|
2542
|
+
/** @deprecated Use the popover API instead.
|
|
2543
|
+
Determines if popover visibility behavior should be automatically controlled by the trigger. */
|
|
2544
|
+
behaviorTrigger?: boolean;
|
|
2545
|
+
/** Indicates whether the user can dismiss or close the element.
|
|
2546
|
+
- `true` The element displays a close control and the user can dismiss it.
|
|
2547
|
+
|
|
2548
|
+
- `false` The user cannot close the element and must dismiss it programmatically. */
|
|
2549
|
+
closable?: boolean;
|
|
2550
|
+
/** Sets the automatic dismissal time in milliseconds before the element emits a `close` event. Allow ~200-250ms per word for comfortable reading.
|
|
2551
|
+
- `0` Warning or error messages requiring immediate acknowledgment.
|
|
2552
|
+
|
|
2553
|
+
- `3000` Brief success or confirmation messages.
|
|
2554
|
+
|
|
2555
|
+
- `7000` Standard informational messages.
|
|
2556
|
+
|
|
2557
|
+
- `10000` Messages with actions or requiring user decision. */
|
|
2558
|
+
closeTimeout?: number;
|
|
2239
2559
|
/** Communicates the intent and semantic meaning of an element to help users understand the outcome of their actions.
|
|
2240
2560
|
- `accent` Highlights important actions or draws attention to primary interactive elements.
|
|
2241
2561
|
|
|
@@ -2245,14 +2565,10 @@ Determines if popover visibility behavior should be automatically controlled by
|
|
|
2245
2565
|
|
|
2246
2566
|
- `danger` Signals destructive or irreversible actions that need extra attention and confirmation. */
|
|
2247
2567
|
status?: "accent" | "warning" | "success" | "danger";
|
|
2248
|
-
/**
|
|
2249
|
-
|
|
2250
|
-
container?: "flat" | "default";
|
|
2568
|
+
/** Flat container option applies when embedding within another containing element such as a drawer. */
|
|
2569
|
+
container?: "flat" | undefined;
|
|
2251
2570
|
/** Enables updating internal string values for internationalization. */
|
|
2252
2571
|
i18n?: string;
|
|
2253
|
-
/** */
|
|
2254
|
-
inline?: boolean;
|
|
2255
|
-
|
|
2256
2572
|
/** Dispatched when the notification closes. */
|
|
2257
2573
|
onclose?: (e: CustomEvent<CustomEvent>) => void;
|
|
2258
2574
|
/** Dispatched on a popover just before showing or hiding. [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/beforetoggle_event) */
|
|
@@ -2269,15 +2585,9 @@ export type PageLoaderProps = {};
|
|
|
2269
2585
|
|
|
2270
2586
|
export type PagePanelContentProps = {};
|
|
2271
2587
|
|
|
2272
|
-
export type PagePanelFooterProps = {
|
|
2273
|
-
/** */
|
|
2274
|
-
slot?: string;
|
|
2275
|
-
};
|
|
2588
|
+
export type PagePanelFooterProps = {};
|
|
2276
2589
|
|
|
2277
|
-
export type PagePanelHeaderProps = {
|
|
2278
|
-
/** */
|
|
2279
|
-
slot?: string;
|
|
2280
|
-
};
|
|
2590
|
+
export type PagePanelHeaderProps = {};
|
|
2281
2591
|
|
|
2282
2592
|
export type PagePanelProps = {
|
|
2283
2593
|
/** Controls the visual scale of an element to match its importance and available space.
|
|
@@ -2286,10 +2596,9 @@ export type PagePanelProps = {
|
|
|
2286
2596
|
- `md` Standard size that works well in most contexts and provides balanced visibility.
|
|
2287
2597
|
|
|
2288
2598
|
- `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts. */
|
|
2289
|
-
size?: "sm" | "md" | "lg" |
|
|
2599
|
+
size?: "sm" | "md" | "lg" | undefined;
|
|
2290
2600
|
/** Enables updating internal string values for internationalization. */
|
|
2291
2601
|
i18n?: string;
|
|
2292
|
-
|
|
2293
2602
|
/** Dispatched after an invoker command removes `hidden` and opens the panel. */
|
|
2294
2603
|
onopen?: (e: CustomEvent<never>) => void;
|
|
2295
2604
|
/** Dispatched after an invoker command sets `hidden` and closes the panel. */
|
|
@@ -2299,29 +2608,50 @@ export type PagePanelProps = {
|
|
|
2299
2608
|
export type PageProps = {
|
|
2300
2609
|
/** Enables the page to use the document content scroll rather than its internal fixed scroll. */
|
|
2301
2610
|
"document-scroll"?: boolean;
|
|
2611
|
+
/** Enables the page to use the document content scroll rather than its internal fixed scroll. */
|
|
2612
|
+
documentScroll?: boolean;
|
|
2302
2613
|
};
|
|
2303
2614
|
|
|
2304
2615
|
export type PaginationProps = {
|
|
2616
|
+
/** A JSON-serialized array of page-size options available in the selector. */
|
|
2617
|
+
"step-sizes"?: string;
|
|
2618
|
+
/** Whether the step selector has a disabled state. */
|
|
2619
|
+
"disable-step"?: boolean;
|
|
2620
|
+
/** Prevents the user from changing the control value.
|
|
2621
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly */
|
|
2622
|
+
readonly?: boolean;
|
|
2623
|
+
/** Defines the minimum text length.
|
|
2624
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/minlength */
|
|
2625
|
+
minlength?: number;
|
|
2626
|
+
/** Defines the maximum text length.
|
|
2627
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/maxlength */
|
|
2628
|
+
maxlength?: number;
|
|
2629
|
+
/** Disables constraint validation for this control.
|
|
2630
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/novalidate */
|
|
2631
|
+
novalidate?: boolean;
|
|
2305
2632
|
/** The number of items per page. */
|
|
2306
2633
|
step?: number;
|
|
2307
|
-
/**
|
|
2634
|
+
/** Page-size options available in the selector. */
|
|
2308
2635
|
stepSizes?: number[];
|
|
2309
2636
|
/** The total number of items. */
|
|
2310
2637
|
items?: number;
|
|
2311
2638
|
/** Whether the pagination is skippable to start/end. */
|
|
2312
2639
|
skippable?: boolean;
|
|
2313
2640
|
/** Whether the step selector has a disabled state. */
|
|
2314
|
-
|
|
2315
|
-
/**
|
|
2316
|
-
|
|
2317
|
-
|
|
2318
|
-
- `inline` Element container reduces to fit within inline content such as a block of text. */
|
|
2319
|
-
container?: "flat" | "inline" | "default";
|
|
2641
|
+
disableStep?: boolean;
|
|
2642
|
+
/** Determines the container styles of component. Flat applies when nesting within other containers. Inline applies when placing within other inline content. */
|
|
2643
|
+
container?: "flat" | "inline" | undefined;
|
|
2320
2644
|
/** Enables updating internal string values for internationalization. */
|
|
2321
2645
|
i18n?: string;
|
|
2322
|
-
/**
|
|
2323
|
-
|
|
2324
|
-
|
|
2646
|
+
/** value the current page number */
|
|
2647
|
+
value?: number;
|
|
2648
|
+
/** The initial value used when the parent form resets. */
|
|
2649
|
+
defaultValue?: string;
|
|
2650
|
+
/** Indicates whether the user can change the element's value while it remains visible and focusable. [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly)
|
|
2651
|
+
- `true` The element has a readonly state: the user cannot change its value, but can still focus and copy it.
|
|
2652
|
+
|
|
2653
|
+
- `false` The element allows editing and the user can change its value through interaction. */
|
|
2654
|
+
readOnly?: boolean;
|
|
2325
2655
|
/** This Boolean attribute prevents the user from interacting with the element: it cannot receive press or focus events. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-disabled)
|
|
2326
2656
|
- `true` The element has a disabled state and does not accept interaction.
|
|
2327
2657
|
|
|
@@ -2341,19 +2671,16 @@ https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/max */
|
|
|
2341
2671
|
max?: number | null;
|
|
2342
2672
|
/** Defines the minimum text length.
|
|
2343
2673
|
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/minlength */
|
|
2344
|
-
|
|
2674
|
+
minLength?: number;
|
|
2345
2675
|
/** Defines the maximum text length.
|
|
2346
2676
|
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/maxlength */
|
|
2347
|
-
|
|
2348
|
-
/** The name
|
|
2677
|
+
maxLength?: number;
|
|
2678
|
+
/** The name submitted with the control value as part of the form data.
|
|
2679
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/name */
|
|
2349
2680
|
name?: string;
|
|
2350
2681
|
/** Disables constraint validation for this control.
|
|
2351
2682
|
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/novalidate */
|
|
2352
|
-
|
|
2353
|
-
/** Defines the value associated with the element's name when submitting the form data. The server receives this value in params when the form submits through this button. [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#value) */
|
|
2354
|
-
value?: number;
|
|
2355
|
-
/** The initial value used when the parent form resets. */
|
|
2356
|
-
defaultValue?: string;
|
|
2683
|
+
noValidate?: boolean;
|
|
2357
2684
|
/** The form associated with the control.
|
|
2358
2685
|
https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/form */
|
|
2359
2686
|
form?: HTMLFormElement | null;
|
|
@@ -2377,7 +2704,7 @@ https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/labels */
|
|
|
2377
2704
|
labels?: NodeList;
|
|
2378
2705
|
/** Text content from labels associated with the control. */
|
|
2379
2706
|
composedLabel?: string;
|
|
2380
|
-
/**
|
|
2707
|
+
/** Dispatched after the page size changes with the current page size in `detail`. The event bubbles and crosses shadow boundaries. */
|
|
2381
2708
|
"onstep-change"?: (e: CustomEvent<CustomEvent>) => void;
|
|
2382
2709
|
/** Dispatched when the last page is active */
|
|
2383
2710
|
"onlast-page"?: (e: CustomEvent<CustomEvent>) => void;
|
|
@@ -2396,6 +2723,8 @@ export type PanelContentProps = {};
|
|
|
2396
2723
|
export type PanelFooterProps = {};
|
|
2397
2724
|
|
|
2398
2725
|
export type PanelProps = {
|
|
2726
|
+
/** Determines whether the panel should handle auto-closing behavior vs. defaults to off. */
|
|
2727
|
+
"behavior-expand"?: boolean;
|
|
2399
2728
|
/** Indicates whether collapsible content is currently visible or hidden from the user. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)
|
|
2400
2729
|
- `true` The associated content expands and becomes visible to the user.
|
|
2401
2730
|
|
|
@@ -2407,12 +2736,11 @@ export type PanelProps = {
|
|
|
2407
2736
|
- `false` The user cannot close the element and must dismiss it programmatically. */
|
|
2408
2737
|
closable?: boolean;
|
|
2409
2738
|
/** Determines whether the panel should handle auto-closing behavior vs. defaults to off. */
|
|
2410
|
-
|
|
2739
|
+
behaviorExpand?: boolean;
|
|
2411
2740
|
/** Sets the proper collapse icon and collapse animation, based on which side of the page the panel occupies. */
|
|
2412
2741
|
side?: "left" | "right";
|
|
2413
2742
|
/** Enables updating internal string values for internationalization. */
|
|
2414
2743
|
i18n?: string;
|
|
2415
|
-
|
|
2416
2744
|
/** Dispatched when the panel opens. */
|
|
2417
2745
|
onopen?: (e: CustomEvent<never>) => void;
|
|
2418
2746
|
/** Dispatched when the panel closes. */
|
|
@@ -2420,13 +2748,14 @@ export type PanelProps = {
|
|
|
2420
2748
|
};
|
|
2421
2749
|
|
|
2422
2750
|
export type PasswordProps = {
|
|
2423
|
-
/**
|
|
2424
|
-
-
|
|
2425
|
-
|
|
2426
|
-
|
|
2427
|
-
|
|
2428
|
-
|
|
2429
|
-
|
|
2751
|
+
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
2752
|
+
"fit-text"?: boolean;
|
|
2753
|
+
/** Sets the input to match native default content block */
|
|
2754
|
+
"fit-content"?: boolean;
|
|
2755
|
+
/** Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.
|
|
2756
|
+
Use when embedding within another container such as a toolbar. */
|
|
2757
|
+
container?: "flat" | undefined;
|
|
2758
|
+
/** Set current visual state for control. This overrides any validation states active. */
|
|
2430
2759
|
status?: "warning" | "error" | "success" | "disabled";
|
|
2431
2760
|
/** Controls the directional arrangement and spacing behavior of the element's content.
|
|
2432
2761
|
- `vertical` Arranges content in a vertical stack with block-level spacing.
|
|
@@ -2438,25 +2767,41 @@ export type PasswordProps = {
|
|
|
2438
2767
|
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
2439
2768
|
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
2440
2769
|
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
2441
|
-
|
|
2770
|
+
fitText?: boolean;
|
|
2442
2771
|
/** Sets the input to match native default content block */
|
|
2443
|
-
|
|
2444
|
-
/** Enables
|
|
2772
|
+
fitContent?: boolean;
|
|
2773
|
+
/** Enables internal string values to update for internationalization. */
|
|
2445
2774
|
i18n?: string;
|
|
2446
|
-
/**
|
|
2447
|
-
- `muted` Reduces visual weight for supporting content that should remain subtle and unobtrusive. */
|
|
2775
|
+
/** Set the visual prominence of the control */
|
|
2448
2776
|
prominence?: "muted";
|
|
2449
|
-
|
|
2450
2777
|
/** */
|
|
2451
2778
|
onreset?: (e: CustomEvent<CustomEvent>) => void;
|
|
2452
2779
|
};
|
|
2453
2780
|
|
|
2454
2781
|
export type PreferencesInputProps = {
|
|
2455
|
-
/** Enables updating internal string values for internationalization. */
|
|
2456
|
-
i18n?: string;
|
|
2457
2782
|
/** Prevents the user from changing the control value.
|
|
2458
2783
|
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly */
|
|
2459
2784
|
readonly?: boolean;
|
|
2785
|
+
/** Defines the minimum text length.
|
|
2786
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/minlength */
|
|
2787
|
+
minlength?: number;
|
|
2788
|
+
/** Defines the maximum text length.
|
|
2789
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/maxlength */
|
|
2790
|
+
maxlength?: number;
|
|
2791
|
+
/** Disables constraint validation for this control.
|
|
2792
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/novalidate */
|
|
2793
|
+
novalidate?: boolean;
|
|
2794
|
+
/** Enables updating internal string values for internationalization. */
|
|
2795
|
+
i18n?: string;
|
|
2796
|
+
/** Contains the current color scheme, scale, and reduced motion preferences. Assign an object through JavaScript or provide its JSON serialization in the HTML `value` attribute. */
|
|
2797
|
+
value?: { "color-scheme"?: string; scale?: string; "reduced-motion"?: boolean };
|
|
2798
|
+
/** The initial value used when the parent form resets. */
|
|
2799
|
+
defaultValue?: string;
|
|
2800
|
+
/** Indicates whether the user can change the element's value while it remains visible and focusable. [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly)
|
|
2801
|
+
- `true` The element has a readonly state: the user cannot change its value, but can still focus and copy it.
|
|
2802
|
+
|
|
2803
|
+
- `false` The element allows editing and the user can change its value through interaction. */
|
|
2804
|
+
readOnly?: boolean;
|
|
2460
2805
|
/** This Boolean attribute prevents the user from interacting with the element: it cannot receive press or focus events. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-disabled)
|
|
2461
2806
|
- `true` The element has a disabled state and does not accept interaction.
|
|
2462
2807
|
|
|
@@ -2479,19 +2824,16 @@ https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/step */
|
|
|
2479
2824
|
step?: number | null;
|
|
2480
2825
|
/** Defines the minimum text length.
|
|
2481
2826
|
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/minlength */
|
|
2482
|
-
|
|
2827
|
+
minLength?: number;
|
|
2483
2828
|
/** Defines the maximum text length.
|
|
2484
2829
|
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/maxlength */
|
|
2485
|
-
|
|
2486
|
-
/** The name
|
|
2830
|
+
maxLength?: number;
|
|
2831
|
+
/** The name submitted with the control value as part of the form data.
|
|
2832
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/name */
|
|
2487
2833
|
name?: string;
|
|
2488
2834
|
/** Disables constraint validation for this control.
|
|
2489
2835
|
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/novalidate */
|
|
2490
|
-
|
|
2491
|
-
/** Defines the value associated with the element's name when submitting the form data. The server receives this value in params when the form submits through this button. [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#value) */
|
|
2492
|
-
value?: { "color-scheme"?: string; scale?: string; "reduced-motion"?: boolean };
|
|
2493
|
-
/** The initial value used when the parent form resets. */
|
|
2494
|
-
defaultValue?: string;
|
|
2836
|
+
noValidate?: boolean;
|
|
2495
2837
|
/** The form associated with the control.
|
|
2496
2838
|
https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/form */
|
|
2497
2839
|
form?: HTMLFormElement | null;
|
|
@@ -2522,8 +2864,8 @@ https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/labels */
|
|
|
2522
2864
|
};
|
|
2523
2865
|
|
|
2524
2866
|
export type ProgressBarProps = {
|
|
2525
|
-
/**
|
|
2526
|
-
value?: number |
|
|
2867
|
+
/** The current `value` of the progress indicator, set to the native HTML progress element. */
|
|
2868
|
+
value?: number | undefined;
|
|
2527
2869
|
/** The `max` property sets the highest value that `value` scales to. */
|
|
2528
2870
|
max?: number;
|
|
2529
2871
|
/** Communicates the intent and semantic meaning of an element to help users understand the outcome of their actions.
|
|
@@ -2538,11 +2880,11 @@ export type ProgressBarProps = {
|
|
|
2538
2880
|
};
|
|
2539
2881
|
|
|
2540
2882
|
export type ProgressRingProps = {
|
|
2541
|
-
/**
|
|
2542
|
-
value?: number |
|
|
2883
|
+
/** The current `value` of the progress ring. When not set, an indeterminate animation will show. */
|
|
2884
|
+
value?: number | undefined;
|
|
2543
2885
|
/** The `max` value of the progress ring that the `value` is proportionally scaled to. */
|
|
2544
2886
|
max?: number;
|
|
2545
|
-
/**
|
|
2887
|
+
/** Four visual treatments represent the `status` of tasks. When `status` changes to `warning`, `success`, or `danger`, the component embeds appropriate icons.
|
|
2546
2888
|
- `accent` Highlights important actions or draws attention to primary interactive elements.
|
|
2547
2889
|
|
|
2548
2890
|
- `warning` Indicates cautionary actions that require careful consideration before proceeding.
|
|
@@ -2550,14 +2892,14 @@ export type ProgressRingProps = {
|
|
|
2550
2892
|
- `success` Represents positive outcomes, confirmations, or constructive actions.
|
|
2551
2893
|
|
|
2552
2894
|
- `danger` Signals destructive or irreversible actions that need extra attention and confirmation. */
|
|
2553
|
-
status?: "accent" | "warning" | "success" | "danger" | "neutral" |
|
|
2554
|
-
/**
|
|
2895
|
+
status?: "accent" | "warning" | "success" | "danger" | "neutral" | undefined;
|
|
2896
|
+
/** T-shirt `size` of the progress indicator, used to scale the ring.
|
|
2555
2897
|
- `sm` Compact size for dense layouts or secondary elements with less visual prominence.
|
|
2556
2898
|
|
|
2557
2899
|
- `md` Standard size that works well in most contexts and provides balanced visibility.
|
|
2558
2900
|
|
|
2559
2901
|
- `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts. */
|
|
2560
|
-
size?: "sm" | "md" | "lg" | "xxs" | "xs" | "xl" |
|
|
2902
|
+
size?: "sm" | "md" | "lg" | "xxs" | "xs" | "xl" | undefined;
|
|
2561
2903
|
/** Enables updating internal string values for internationalization. */
|
|
2562
2904
|
i18n?: string;
|
|
2563
2905
|
};
|
|
@@ -2570,26 +2912,20 @@ export type ProgressiveFilterChipProps = {
|
|
|
2570
2912
|
closable?: boolean;
|
|
2571
2913
|
/** Enables updating internal string values for internationalization. */
|
|
2572
2914
|
i18n?: string;
|
|
2573
|
-
|
|
2574
2915
|
/** Dispatched when the filter chip closes. */
|
|
2575
2916
|
onclose?: (e: CustomEvent<never>) => void;
|
|
2576
2917
|
};
|
|
2577
2918
|
|
|
2578
2919
|
export type PulseProps = {
|
|
2579
|
-
/**
|
|
2920
|
+
/** Sets size of the pulse component. You can also update size using the `width + height` css props.
|
|
2580
2921
|
- `sm` Compact size for dense layouts or secondary elements with less visual prominence.
|
|
2581
2922
|
|
|
2582
2923
|
- `md` Standard size that works well in most contexts and provides balanced visibility.
|
|
2583
2924
|
|
|
2584
2925
|
- `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts. */
|
|
2585
|
-
size?: "sm" | "md" | "lg" | "xs" |
|
|
2586
|
-
/**
|
|
2587
|
-
|
|
2588
|
-
|
|
2589
|
-
- `warning` Indicates cautionary actions that require careful consideration before proceeding.
|
|
2590
|
-
|
|
2591
|
-
- `danger` Signals destructive or irreversible actions that need extra attention and confirmation. */
|
|
2592
|
-
status?: "accent" | "warning" | "danger" | "default";
|
|
2926
|
+
size?: "sm" | "md" | "lg" | "xs" | undefined;
|
|
2927
|
+
/** These visual treatments represent the `status` of different tasks. When `status` changes to `accent`, `warning` or `danger`, the component embeds appropriate colors. */
|
|
2928
|
+
status?: "accent" | "warning" | "danger" | undefined;
|
|
2593
2929
|
};
|
|
2594
2930
|
|
|
2595
2931
|
export type RadioGroupProps = {
|
|
@@ -2602,16 +2938,12 @@ export type RadioGroupProps = {
|
|
|
2602
2938
|
|
|
2603
2939
|
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
2604
2940
|
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
2605
|
-
/**
|
|
2606
|
-
- `muted` Reduces visual weight for supporting content that should remain subtle and unobtrusive. */
|
|
2941
|
+
/** Set the visual prominence of the control group */
|
|
2607
2942
|
prominence?: "muted";
|
|
2608
2943
|
};
|
|
2609
2944
|
|
|
2610
2945
|
export type RadioProps = {
|
|
2611
|
-
/**
|
|
2612
|
-
- `warning` Indicates cautionary actions that require careful consideration before proceeding.
|
|
2613
|
-
|
|
2614
|
-
- `success` Represents positive outcomes, confirmations, or constructive actions. */
|
|
2946
|
+
/** Set current visual state for control. This overrides any validation states active. */
|
|
2615
2947
|
status?: "warning" | "error" | "success" | "disabled";
|
|
2616
2948
|
/** Controls the directional arrangement and spacing behavior of the element's content.
|
|
2617
2949
|
- `vertical` Arranges content in a vertical stack with block-level spacing.
|
|
@@ -2622,30 +2954,25 @@ export type RadioProps = {
|
|
|
2622
2954
|
|
|
2623
2955
|
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
2624
2956
|
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
2625
|
-
/**
|
|
2626
|
-
"fit-text"?: boolean;
|
|
2627
|
-
/** Sets the input to match native default content block */
|
|
2628
|
-
"fit-content"?: boolean;
|
|
2629
|
-
/** Enables updating internal string values for internationalization. */
|
|
2957
|
+
/** Enables internal string values to update for internationalization. */
|
|
2630
2958
|
i18n?: string;
|
|
2631
|
-
/**
|
|
2632
|
-
- `muted` Reduces visual weight for supporting content that should remain subtle and unobtrusive. */
|
|
2959
|
+
/** Set the visual prominence of the control */
|
|
2633
2960
|
prominence?: "muted";
|
|
2634
|
-
|
|
2635
2961
|
/** */
|
|
2636
2962
|
onreset?: (e: CustomEvent<CustomEvent>) => void;
|
|
2637
2963
|
};
|
|
2638
2964
|
|
|
2639
2965
|
export type RangeProps = {
|
|
2966
|
+
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
2967
|
+
"fit-text"?: boolean;
|
|
2968
|
+
/** Sets the input to match native default content block */
|
|
2969
|
+
"fit-content"?: boolean;
|
|
2640
2970
|
/** Controls the directional flow of the element's layout and interaction pattern.
|
|
2641
2971
|
- `vertical` Element orients vertically with top-to-bottom flow.
|
|
2642
2972
|
|
|
2643
2973
|
- `horizontal` Element orients horizontally with left-to-right flow. */
|
|
2644
2974
|
orientation?: "vertical" | "horizontal";
|
|
2645
|
-
/**
|
|
2646
|
-
- `warning` Indicates cautionary actions that require careful consideration before proceeding.
|
|
2647
|
-
|
|
2648
|
-
- `success` Represents positive outcomes, confirmations, or constructive actions. */
|
|
2975
|
+
/** Set current visual state for control. This overrides any validation states active. */
|
|
2649
2976
|
status?: "warning" | "error" | "success" | "disabled";
|
|
2650
2977
|
/** Controls the directional arrangement and spacing behavior of the element's content.
|
|
2651
2978
|
- `vertical` Arranges content in a vertical stack with block-level spacing.
|
|
@@ -2657,36 +2984,53 @@ export type RangeProps = {
|
|
|
2657
2984
|
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
2658
2985
|
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
2659
2986
|
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
2660
|
-
|
|
2987
|
+
fitText?: boolean;
|
|
2661
2988
|
/** Sets the input to match native default content block */
|
|
2662
|
-
|
|
2663
|
-
/** Enables
|
|
2989
|
+
fitContent?: boolean;
|
|
2990
|
+
/** Enables internal string values to update for internationalization. */
|
|
2664
2991
|
i18n?: string;
|
|
2665
|
-
/**
|
|
2666
|
-
- `muted` Reduces visual weight for supporting content that should remain subtle and unobtrusive. */
|
|
2992
|
+
/** Set the visual prominence of the control */
|
|
2667
2993
|
prominence?: "muted";
|
|
2668
|
-
|
|
2669
2994
|
/** */
|
|
2670
2995
|
onreset?: (e: CustomEvent<CustomEvent>) => void;
|
|
2671
2996
|
};
|
|
2672
2997
|
|
|
2673
2998
|
export type ResizeHandleProps = {
|
|
2999
|
+
/** Prevents the user from changing the control value.
|
|
3000
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly */
|
|
3001
|
+
readonly?: boolean;
|
|
3002
|
+
/** Defines the minimum text length.
|
|
3003
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/minlength */
|
|
3004
|
+
minlength?: number;
|
|
3005
|
+
/** Defines the maximum text length.
|
|
3006
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/maxlength */
|
|
3007
|
+
maxlength?: number;
|
|
3008
|
+
/** Disables constraint validation for this control.
|
|
3009
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/novalidate */
|
|
3010
|
+
novalidate?: boolean;
|
|
2674
3011
|
/** Controls the directional flow of the element's layout and interaction pattern.
|
|
2675
3012
|
- `horizontal` Element orients horizontally with left-to-right flow.
|
|
2676
3013
|
|
|
2677
3014
|
- `vertical` Element orients vertically with top-to-bottom flow. */
|
|
2678
|
-
orientation?: "horizontal" | "vertical" |
|
|
3015
|
+
orientation?: "horizontal" | "vertical" | undefined;
|
|
2679
3016
|
/** Determines the min resize value. */
|
|
2680
3017
|
min?: number;
|
|
2681
3018
|
/** Determines the max resize value. */
|
|
2682
3019
|
max?: number;
|
|
2683
3020
|
/** Determines the value step change. */
|
|
2684
3021
|
step?: number;
|
|
2685
|
-
/**
|
|
3022
|
+
/** Updates internal string values for internationalization. */
|
|
2686
3023
|
i18n?: string;
|
|
2687
|
-
/**
|
|
2688
|
-
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/
|
|
2689
|
-
|
|
3024
|
+
/** The current form control value.
|
|
3025
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/value */
|
|
3026
|
+
value?: string;
|
|
3027
|
+
/** The initial value used when the parent form resets. */
|
|
3028
|
+
defaultValue?: string;
|
|
3029
|
+
/** Indicates whether the user can change the element's value while it remains visible and focusable. [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly)
|
|
3030
|
+
- `true` The element has a readonly state: the user cannot change its value, but can still focus and copy it.
|
|
3031
|
+
|
|
3032
|
+
- `false` The element allows editing and the user can change its value through interaction. */
|
|
3033
|
+
readOnly?: boolean;
|
|
2690
3034
|
/** This Boolean attribute prevents the user from interacting with the element: it cannot receive press or focus events. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-disabled)
|
|
2691
3035
|
- `true` The element has a disabled state and does not accept interaction.
|
|
2692
3036
|
|
|
@@ -2700,19 +3044,16 @@ https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/pattern */
|
|
|
2700
3044
|
pattern?: string;
|
|
2701
3045
|
/** Defines the minimum text length.
|
|
2702
3046
|
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/minlength */
|
|
2703
|
-
|
|
3047
|
+
minLength?: number;
|
|
2704
3048
|
/** Defines the maximum text length.
|
|
2705
3049
|
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/maxlength */
|
|
2706
|
-
|
|
2707
|
-
/** The name
|
|
3050
|
+
maxLength?: number;
|
|
3051
|
+
/** The name submitted with the control value as part of the form data.
|
|
3052
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/name */
|
|
2708
3053
|
name?: string;
|
|
2709
3054
|
/** Disables constraint validation for this control.
|
|
2710
3055
|
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/novalidate */
|
|
2711
|
-
|
|
2712
|
-
/** Defines the value associated with the element's name when submitting the form data. The server receives this value in params when the form submits through this button. [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#value) */
|
|
2713
|
-
value?: number;
|
|
2714
|
-
/** The initial value used when the parent form resets. */
|
|
2715
|
-
defaultValue?: string;
|
|
3056
|
+
noValidate?: boolean;
|
|
2716
3057
|
/** The form associated with the control.
|
|
2717
3058
|
https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/form */
|
|
2718
3059
|
form?: HTMLFormElement | null;
|
|
@@ -2741,15 +3082,16 @@ https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/labels */
|
|
|
2741
3082
|
};
|
|
2742
3083
|
|
|
2743
3084
|
export type SearchProps = {
|
|
2744
|
-
/**
|
|
2745
|
-
-
|
|
2746
|
-
|
|
3085
|
+
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
3086
|
+
"fit-text"?: boolean;
|
|
3087
|
+
/** Sets the input to match native default content block */
|
|
3088
|
+
"fit-content"?: boolean;
|
|
3089
|
+
/** Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.
|
|
3090
|
+
Use when embedding within another container such as a toolbar. */
|
|
3091
|
+
container?: "flat" | undefined;
|
|
2747
3092
|
/** Sets the rounded visual style of the input. */
|
|
2748
3093
|
rounded?: boolean;
|
|
2749
|
-
/**
|
|
2750
|
-
- `warning` Indicates cautionary actions that require careful consideration before proceeding.
|
|
2751
|
-
|
|
2752
|
-
- `success` Represents positive outcomes, confirmations, or constructive actions. */
|
|
3094
|
+
/** Set current visual state for control. This overrides any validation states active. */
|
|
2753
3095
|
status?: "warning" | "error" | "success" | "disabled";
|
|
2754
3096
|
/** Controls the directional arrangement and spacing behavior of the element's content.
|
|
2755
3097
|
- `vertical` Arranges content in a vertical stack with block-level spacing.
|
|
@@ -2761,31 +3103,27 @@ export type SearchProps = {
|
|
|
2761
3103
|
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
2762
3104
|
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
2763
3105
|
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
2764
|
-
|
|
3106
|
+
fitText?: boolean;
|
|
2765
3107
|
/** Sets the input to match native default content block */
|
|
2766
|
-
|
|
2767
|
-
/** Enables
|
|
3108
|
+
fitContent?: boolean;
|
|
3109
|
+
/** Enables internal string values to update for internationalization. */
|
|
2768
3110
|
i18n?: string;
|
|
2769
|
-
/**
|
|
2770
|
-
- `muted` Reduces visual weight for supporting content that should remain subtle and unobtrusive. */
|
|
3111
|
+
/** Set the visual prominence of the control */
|
|
2771
3112
|
prominence?: "muted";
|
|
2772
|
-
|
|
2773
3113
|
/** */
|
|
2774
3114
|
onreset?: (e: CustomEvent<CustomEvent>) => void;
|
|
2775
3115
|
};
|
|
2776
3116
|
|
|
2777
3117
|
export type SelectProps = {
|
|
2778
|
-
/**
|
|
2779
|
-
-
|
|
2780
|
-
|
|
2781
|
-
-
|
|
2782
|
-
container
|
|
2783
|
-
|
|
3118
|
+
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
3119
|
+
"fit-text"?: boolean;
|
|
3120
|
+
/** Sets the input to match native default content block */
|
|
3121
|
+
"fit-content"?: boolean;
|
|
3122
|
+
/** Flat container option applies when embedding the component within another containing element */
|
|
3123
|
+
container?: "flat" | "inline" | undefined;
|
|
3124
|
+
/** Updates internal string values for internationalization. */
|
|
2784
3125
|
i18n?: string;
|
|
2785
|
-
/**
|
|
2786
|
-
- `warning` Indicates cautionary actions that require careful consideration before proceeding.
|
|
2787
|
-
|
|
2788
|
-
- `success` Represents positive outcomes, confirmations, or constructive actions. */
|
|
3126
|
+
/** Set current visual state for control. This overrides any validation states active. */
|
|
2789
3127
|
status?: "warning" | "error" | "success" | "disabled";
|
|
2790
3128
|
/** Controls the directional arrangement and spacing behavior of the element's content.
|
|
2791
3129
|
- `vertical` Arranges content in a vertical stack with block-level spacing.
|
|
@@ -2797,13 +3135,11 @@ export type SelectProps = {
|
|
|
2797
3135
|
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
2798
3136
|
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
2799
3137
|
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
2800
|
-
|
|
3138
|
+
fitText?: boolean;
|
|
2801
3139
|
/** Sets the input to match native default content block */
|
|
2802
|
-
|
|
2803
|
-
/**
|
|
2804
|
-
- `muted` Reduces visual weight for supporting content that should remain subtle and unobtrusive. */
|
|
3140
|
+
fitContent?: boolean;
|
|
3141
|
+
/** Set the visual prominence of the control */
|
|
2805
3142
|
prominence?: "muted";
|
|
2806
|
-
|
|
2807
3143
|
/** */
|
|
2808
3144
|
onreset?: (e: CustomEvent<CustomEvent>) => void;
|
|
2809
3145
|
};
|
|
@@ -2813,15 +3149,33 @@ export type SkeletonProps = {
|
|
|
2813
3149
|
effect?: "shimmer" | "pulse";
|
|
2814
3150
|
/** Geometry of the placeholder — rounded corners or a full pill outline. */
|
|
2815
3151
|
shape?: "round" | "pill";
|
|
2816
|
-
/**
|
|
3152
|
+
/** Hides the skeleton host when `true` and sets `aria-busy` to the inverse visibility state. */
|
|
2817
3153
|
hidden?: boolean;
|
|
2818
3154
|
};
|
|
2819
3155
|
|
|
2820
3156
|
export type SortButtonProps = {
|
|
3157
|
+
/** Indicates whether the element is a noninteractive visual treatment instead of a button.
|
|
3158
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly */
|
|
3159
|
+
readonly?: boolean;
|
|
3160
|
+
/** Establishes a relationship between a popover and its invoker button.
|
|
3161
|
+
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetElement */
|
|
3162
|
+
popovertarget?: string;
|
|
3163
|
+
/** The popover target action to perform on the popover target element.
|
|
3164
|
+
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetAction */
|
|
3165
|
+
popovertargetaction?: "show" | "hide" | "toggle";
|
|
3166
|
+
/** The element that receives the command.
|
|
3167
|
+
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
3168
|
+
commandfor?: string;
|
|
3169
|
+
/** The element that receives the interest.
|
|
3170
|
+
https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement */
|
|
3171
|
+
interestfor?: string;
|
|
2821
3172
|
/** The current sort value, can be ascending, descending, or none. */
|
|
2822
3173
|
sort?: "ascending" | "descending" | "none";
|
|
2823
|
-
/**
|
|
3174
|
+
/** Updates internal string values for internationalization. */
|
|
2824
3175
|
i18n?: string;
|
|
3176
|
+
/** Defines the button behavior when associated within a form element.
|
|
3177
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type */
|
|
3178
|
+
type?: "button" | "submit" | "reset";
|
|
2825
3179
|
/** Indicates the current state of a toggle button that switches on or off. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-pressed)
|
|
2826
3180
|
- `true` The button is in the pressed (on) state and the associated action or setting is active.
|
|
2827
3181
|
|
|
@@ -2832,20 +3186,18 @@ export type SortButtonProps = {
|
|
|
2832
3186
|
|
|
2833
3187
|
- `false` The associated content collapses and hides from the user. */
|
|
2834
3188
|
expanded?: boolean;
|
|
2835
|
-
/**
|
|
3189
|
+
/** Indicates whether the element is a noninteractive visual treatment instead of a button.
|
|
2836
3190
|
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly */
|
|
2837
|
-
|
|
2838
|
-
/**
|
|
2839
|
-
|
|
3191
|
+
readOnly?: boolean;
|
|
3192
|
+
/** Associates the button with a form. Set the property to a form element or its ID. The HTML attribute accepts only
|
|
3193
|
+
the form ID. Reading the property returns the associated form element or `null`.
|
|
2840
3194
|
https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/form */
|
|
2841
3195
|
form?: string | HTMLFormElement | null;
|
|
2842
|
-
/** The name of the
|
|
3196
|
+
/** The name of the button, submitted as a pair with the button value as part of the form data.
|
|
3197
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-name */
|
|
2843
3198
|
name?: string;
|
|
2844
3199
|
/** Defines the value associated with the element's name when submitting the form data. The server receives this value in params when the form submits through this button. [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#value) */
|
|
2845
3200
|
value?: string;
|
|
2846
|
-
/** Defines the button behavior when associated within a form element.
|
|
2847
|
-
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type */
|
|
2848
|
-
type?: "button" | "submit" | "reset";
|
|
2849
3201
|
/** This Boolean attribute prevents the user from interacting with the element: it cannot receive press or focus events. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-disabled)
|
|
2850
3202
|
- `true` The element has a disabled state and does not accept interaction.
|
|
2851
3203
|
|
|
@@ -2863,25 +3215,16 @@ https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type */
|
|
|
2863
3215
|
current?: "page" | "step";
|
|
2864
3216
|
/** Establishes a relationship between a popover and its invoker button.
|
|
2865
3217
|
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetElement */
|
|
2866
|
-
|
|
3218
|
+
popoverTargetElement?: HTMLElement | null;
|
|
2867
3219
|
/** The popover target action to perform on the popover target element.
|
|
2868
3220
|
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetAction */
|
|
2869
|
-
|
|
2870
|
-
/** The element that receives the command.
|
|
2871
|
-
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
2872
|
-
commandfor?: string;
|
|
2873
|
-
/** The command to execute on the element.
|
|
2874
|
-
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
2875
|
-
command?: string;
|
|
2876
|
-
/** The element that receives the interest.
|
|
2877
|
-
https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement */
|
|
2878
|
-
interestfor?: string;
|
|
2879
|
-
/** Establishes a relationship between a popover and its invoker button.
|
|
2880
|
-
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetElement */
|
|
2881
|
-
popoverTargetElement?: HTMLElement | null;
|
|
3221
|
+
popoverTargetAction?: "show" | "hide" | "toggle";
|
|
2882
3222
|
/** The element that receives the command.
|
|
2883
3223
|
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
2884
3224
|
commandForElement?: HTMLElement | null;
|
|
3225
|
+
/** The command to execute on the element.
|
|
3226
|
+
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
3227
|
+
command?: string;
|
|
2885
3228
|
/** The element that receives the interest.
|
|
2886
3229
|
https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement */
|
|
2887
3230
|
interestForElement?: HTMLElement | null;
|
|
@@ -2890,6 +3233,16 @@ https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForEl
|
|
|
2890
3233
|
};
|
|
2891
3234
|
|
|
2892
3235
|
export type SparklineProps = {
|
|
3236
|
+
/** Denotes the first data point by rendering a symbol at its position. */
|
|
3237
|
+
"denote-first"?: boolean;
|
|
3238
|
+
/** Denotes the last data point by rendering a symbol at its position. */
|
|
3239
|
+
"denote-last"?: boolean;
|
|
3240
|
+
/** Denotes all minimum-value data points by rendering symbols at their positions. */
|
|
3241
|
+
"denote-min"?: boolean;
|
|
3242
|
+
/** Denotes all maximum-value data points by rendering symbols at their positions. */
|
|
3243
|
+
"denote-max"?: boolean;
|
|
3244
|
+
/** Controls spacing between points in a line, in em (1 = chart height). Defaults to `0.6`. */
|
|
3245
|
+
"interval-length"?: number;
|
|
2893
3246
|
/** Numeric values representing a data series. */
|
|
2894
3247
|
data?: number[];
|
|
2895
3248
|
/** Controls the visual representation of data points.
|
|
@@ -2910,7 +3263,7 @@ export type SparklineProps = {
|
|
|
2910
3263
|
|
|
2911
3264
|
- `step` Connects points with horizontal and vertical step segments. */
|
|
2912
3265
|
interpolation?: "linear" | "smooth" | "step";
|
|
2913
|
-
/**
|
|
3266
|
+
/** Applies semantic status colors used across Elements status patterns.
|
|
2914
3267
|
- `accent` Highlights important actions or draws attention to primary interactive elements.
|
|
2915
3268
|
|
|
2916
3269
|
- `warning` Indicates cautionary actions that require careful consideration before proceeding.
|
|
@@ -2956,8 +3309,8 @@ export type SparklineProps = {
|
|
|
2956
3309
|
| "warning"
|
|
2957
3310
|
| "success"
|
|
2958
3311
|
| "danger"
|
|
2959
|
-
|
|
|
2960
|
-
/** Controls the
|
|
3312
|
+
| undefined;
|
|
3313
|
+
/** Controls the sparkline size with explicit font-size tokens. Omit to auto-scale with parent font-size (1em).
|
|
2961
3314
|
- `xs` Extra small size for minimal elements or highly dense layouts.
|
|
2962
3315
|
|
|
2963
3316
|
- `sm` Compact size for dense layouts or secondary elements with less visual prominence.
|
|
@@ -2967,28 +3320,29 @@ export type SparklineProps = {
|
|
|
2967
3320
|
- `lg` Larger size for emphasizing important elements or improving touch targets in spacious layouts.
|
|
2968
3321
|
|
|
2969
3322
|
- `xl` Extra large size for emphasizing elements or sparse layouts. */
|
|
2970
|
-
size?: "xs" | "sm" | "md" | "lg" | "xl" |
|
|
3323
|
+
size?: "xs" | "sm" | "md" | "lg" | "xl" | undefined;
|
|
2971
3324
|
/** Denotes the first data point by rendering a symbol at its position. */
|
|
2972
|
-
|
|
3325
|
+
denoteFirst?: boolean;
|
|
2973
3326
|
/** Denotes the last data point by rendering a symbol at its position. */
|
|
2974
|
-
|
|
3327
|
+
denoteLast?: boolean;
|
|
2975
3328
|
/** Denotes all minimum-value data points by rendering symbols at their positions. */
|
|
2976
|
-
|
|
3329
|
+
denoteMin?: boolean;
|
|
2977
3330
|
/** Denotes all maximum-value data points by rendering symbols at their positions. */
|
|
2978
|
-
|
|
3331
|
+
denoteMax?: boolean;
|
|
2979
3332
|
/** Controls spacing between points in a line, in em (1 = chart height). Defaults to `0.6`. */
|
|
2980
|
-
|
|
3333
|
+
intervalLength?: number;
|
|
2981
3334
|
/** Lower bound for the y-axis domain. When undefined, derives the bound from data. */
|
|
2982
|
-
min?: number |
|
|
3335
|
+
min?: number | undefined;
|
|
2983
3336
|
/** Upper bound for the y-axis domain. When undefined, derives the bound from data. */
|
|
2984
|
-
max?: number |
|
|
3337
|
+
max?: number | undefined;
|
|
2985
3338
|
};
|
|
2986
3339
|
|
|
2987
3340
|
export type StarRatingProps = {
|
|
2988
|
-
/**
|
|
2989
|
-
-
|
|
2990
|
-
|
|
2991
|
-
-
|
|
3341
|
+
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
3342
|
+
"fit-text"?: boolean;
|
|
3343
|
+
/** Sets the input to match native default content block */
|
|
3344
|
+
"fit-content"?: boolean;
|
|
3345
|
+
/** Set current visual state for control. This overrides any validation states active. */
|
|
2992
3346
|
status?: "warning" | "error" | "success" | "disabled";
|
|
2993
3347
|
/** Controls the directional arrangement and spacing behavior of the element's content.
|
|
2994
3348
|
- `vertical` Arranges content in a vertical stack with block-level spacing.
|
|
@@ -3000,39 +3354,45 @@ export type StarRatingProps = {
|
|
|
3000
3354
|
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
3001
3355
|
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
3002
3356
|
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
3003
|
-
|
|
3357
|
+
fitText?: boolean;
|
|
3004
3358
|
/** Sets the input to match native default content block */
|
|
3005
|
-
|
|
3006
|
-
/** Enables
|
|
3359
|
+
fitContent?: boolean;
|
|
3360
|
+
/** Enables internal string values to update for internationalization. */
|
|
3007
3361
|
i18n?: string;
|
|
3008
|
-
/**
|
|
3009
|
-
- `muted` Reduces visual weight for supporting content that should remain subtle and unobtrusive. */
|
|
3362
|
+
/** Set the visual prominence of the control */
|
|
3010
3363
|
prominence?: "muted";
|
|
3011
|
-
|
|
3012
3364
|
/** */
|
|
3013
3365
|
onreset?: (e: CustomEvent<CustomEvent>) => void;
|
|
3014
3366
|
};
|
|
3015
3367
|
|
|
3016
3368
|
export type StepsItemProps = {
|
|
3369
|
+
/** Indicates whether the element is a noninteractive visual treatment instead of a button.
|
|
3370
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly */
|
|
3371
|
+
readonly?: boolean;
|
|
3372
|
+
/** Establishes a relationship between a popover and its invoker button.
|
|
3373
|
+
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetElement */
|
|
3374
|
+
popovertarget?: string;
|
|
3375
|
+
/** The popover target action to perform on the popover target element.
|
|
3376
|
+
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetAction */
|
|
3377
|
+
popovertargetaction?: "show" | "hide" | "toggle";
|
|
3378
|
+
/** The element that receives the command.
|
|
3379
|
+
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
3380
|
+
commandfor?: string;
|
|
3381
|
+
/** The element that receives the interest.
|
|
3382
|
+
https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement */
|
|
3383
|
+
interestfor?: string;
|
|
3017
3384
|
/** Indicates whether an element currently holds selection within a multi-option selection group. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)
|
|
3018
3385
|
- `true` The element holds selection and represents the user's current choice within the group.
|
|
3019
3386
|
|
|
3020
3387
|
- `false` The element does not hold selection and the user can choose it. */
|
|
3021
3388
|
selected?: boolean;
|
|
3022
|
-
/**
|
|
3023
|
-
|
|
3024
|
-
|
|
3025
|
-
|
|
3026
|
-
|
|
3027
|
-
-
|
|
3028
|
-
|
|
3029
|
-
/**
|
|
3030
|
-
Demonstrates different container styles to accommodate visual weight and context.
|
|
3031
|
-
- `flat` Element has white space bounds but reduced visual container.
|
|
3032
|
-
- `inline` Element container reduces to fit within inline content such as a block of text.
|
|
3033
|
-
- `inset` Element container optimizes for embedding or inset placement inside another containing element.
|
|
3034
|
-
- `full` Element container optimizes for filling its container bounds. */
|
|
3035
|
-
container?: "condensed" | "default";
|
|
3389
|
+
/** Controls the step status. `accent` has no default status icon, `danger` displays an alert icon, `success` displays a check icon, and `pending` displays a progress indicator. Omit the property to display the step number. */
|
|
3390
|
+
status?: "accent" | "danger" | "success" | "pending" | undefined;
|
|
3391
|
+
/** Determines whether the steps should display in condensed format with no text labels. */
|
|
3392
|
+
container?: "condensed" | undefined;
|
|
3393
|
+
/** Defines the button behavior when associated within a form element.
|
|
3394
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type */
|
|
3395
|
+
type?: "button" | "submit" | "reset";
|
|
3036
3396
|
/** Indicates the current state of a toggle button that switches on or off. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-pressed)
|
|
3037
3397
|
- `true` The button is in the pressed (on) state and the associated action or setting is active.
|
|
3038
3398
|
|
|
@@ -3043,20 +3403,18 @@ Demonstrates different container styles to accommodate visual weight and context
|
|
|
3043
3403
|
|
|
3044
3404
|
- `false` The associated content collapses and hides from the user. */
|
|
3045
3405
|
expanded?: boolean;
|
|
3046
|
-
/**
|
|
3406
|
+
/** Indicates whether the element is a noninteractive visual treatment instead of a button.
|
|
3047
3407
|
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly */
|
|
3048
|
-
|
|
3049
|
-
/**
|
|
3050
|
-
|
|
3408
|
+
readOnly?: boolean;
|
|
3409
|
+
/** Associates the button with a form. Set the property to a form element or its ID. The HTML attribute accepts only
|
|
3410
|
+
the form ID. Reading the property returns the associated form element or `null`.
|
|
3051
3411
|
https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/form */
|
|
3052
3412
|
form?: string | HTMLFormElement | null;
|
|
3053
|
-
/** The name of the
|
|
3413
|
+
/** The name of the button, submitted as a pair with the button value as part of the form data.
|
|
3414
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-name */
|
|
3054
3415
|
name?: string;
|
|
3055
3416
|
/** Defines the value associated with the element's name when submitting the form data. The server receives this value in params when the form submits through this button. [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#value) */
|
|
3056
3417
|
value?: string;
|
|
3057
|
-
/** Defines the button behavior when associated within a form element.
|
|
3058
|
-
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type */
|
|
3059
|
-
type?: "button" | "submit" | "reset";
|
|
3060
3418
|
/** This Boolean attribute prevents the user from interacting with the element: it cannot receive press or focus events. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-disabled)
|
|
3061
3419
|
- `true` The element has a disabled state and does not accept interaction.
|
|
3062
3420
|
|
|
@@ -3069,42 +3427,30 @@ https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type */
|
|
|
3069
3427
|
current?: "page" | "step";
|
|
3070
3428
|
/** Establishes a relationship between a popover and its invoker button.
|
|
3071
3429
|
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetElement */
|
|
3072
|
-
|
|
3430
|
+
popoverTargetElement?: HTMLElement | null;
|
|
3073
3431
|
/** The popover target action to perform on the popover target element.
|
|
3074
3432
|
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetAction */
|
|
3075
|
-
|
|
3433
|
+
popoverTargetAction?: "show" | "hide" | "toggle";
|
|
3076
3434
|
/** The element that receives the command.
|
|
3077
3435
|
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
3078
|
-
|
|
3436
|
+
commandForElement?: HTMLElement | null;
|
|
3079
3437
|
/** The command to execute on the element.
|
|
3080
3438
|
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
3081
3439
|
command?: string;
|
|
3082
3440
|
/** The element that receives the interest.
|
|
3083
|
-
https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement */
|
|
3084
|
-
interestfor?: string;
|
|
3085
|
-
/** Establishes a relationship between a popover and its invoker button.
|
|
3086
|
-
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetElement */
|
|
3087
|
-
popoverTargetElement?: HTMLElement | null;
|
|
3088
|
-
/** The element that receives the command.
|
|
3089
|
-
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
3090
|
-
commandForElement?: HTMLElement | null;
|
|
3091
|
-
/** The element that receives the interest.
|
|
3092
3441
|
https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement */
|
|
3093
3442
|
interestForElement?: HTMLElement | null;
|
|
3094
3443
|
};
|
|
3095
3444
|
|
|
3096
3445
|
export type StepsProps = {
|
|
3446
|
+
/** Determines whether the steps should handle selection behavior vs. defaults to off. */
|
|
3447
|
+
"behavior-select"?: boolean;
|
|
3097
3448
|
/** Determines whether the steps should display in a vertical layout vs. defaulting to horizontal. */
|
|
3098
3449
|
vertical?: boolean;
|
|
3099
|
-
/**
|
|
3100
|
-
|
|
3101
|
-
- `flat` Element has white space bounds but reduced visual container.
|
|
3102
|
-
- `inline` Element container reduces to fit within inline content such as a block of text.
|
|
3103
|
-
- `inset` Element container optimizes for embedding or inset placement inside another containing element.
|
|
3104
|
-
- `full` Element container optimizes for filling its container bounds. */
|
|
3105
|
-
container?: "condensed" | "default";
|
|
3450
|
+
/** Determines whether the steps should display in condensed format with no text labels. */
|
|
3451
|
+
container?: "condensed" | undefined;
|
|
3106
3452
|
/** Determines whether the steps should handle selection behavior vs. defaults to off. */
|
|
3107
|
-
|
|
3453
|
+
behaviorSelect?: boolean;
|
|
3108
3454
|
};
|
|
3109
3455
|
|
|
3110
3456
|
export type SwitchGroupProps = {
|
|
@@ -3117,16 +3463,16 @@ export type SwitchGroupProps = {
|
|
|
3117
3463
|
|
|
3118
3464
|
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
3119
3465
|
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
3120
|
-
/**
|
|
3121
|
-
- `muted` Reduces visual weight for supporting content that should remain subtle and unobtrusive. */
|
|
3466
|
+
/** Set the visual prominence of the control group */
|
|
3122
3467
|
prominence?: "muted";
|
|
3123
3468
|
};
|
|
3124
3469
|
|
|
3125
3470
|
export type SwitchProps = {
|
|
3126
|
-
/**
|
|
3127
|
-
-
|
|
3128
|
-
|
|
3129
|
-
-
|
|
3471
|
+
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
3472
|
+
"fit-text"?: boolean;
|
|
3473
|
+
/** Sets the input to match native default content block */
|
|
3474
|
+
"fit-content"?: boolean;
|
|
3475
|
+
/** Set current visual state for control. This overrides any validation states active. */
|
|
3130
3476
|
status?: "warning" | "error" | "success" | "disabled";
|
|
3131
3477
|
/** Controls the directional arrangement and spacing behavior of the element's content.
|
|
3132
3478
|
- `vertical` Arranges content in a vertical stack with block-level spacing.
|
|
@@ -3138,33 +3484,49 @@ export type SwitchProps = {
|
|
|
3138
3484
|
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
3139
3485
|
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
3140
3486
|
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
3141
|
-
|
|
3487
|
+
fitText?: boolean;
|
|
3142
3488
|
/** Sets the input to match native default content block */
|
|
3143
|
-
|
|
3144
|
-
/** Enables
|
|
3489
|
+
fitContent?: boolean;
|
|
3490
|
+
/** Enables internal string values to update for internationalization. */
|
|
3145
3491
|
i18n?: string;
|
|
3146
|
-
/**
|
|
3147
|
-
- `muted` Reduces visual weight for supporting content that should remain subtle and unobtrusive. */
|
|
3492
|
+
/** Set the visual prominence of the control */
|
|
3148
3493
|
prominence?: "muted";
|
|
3149
|
-
|
|
3150
3494
|
/** */
|
|
3151
3495
|
onreset?: (e: CustomEvent<CustomEvent>) => void;
|
|
3152
3496
|
};
|
|
3153
3497
|
|
|
3154
3498
|
export type TabsGroupProps = {
|
|
3155
|
-
/**
|
|
3499
|
+
/** Arranges the tab strip relative to slot-matched panels: stacked column (`top`), or sidebar row with tabs at
|
|
3500
|
+
inline-start (`start`) or inline-end (`end`) beside the panel region. */
|
|
3156
3501
|
alignment?: "top" | "start" | "end";
|
|
3157
|
-
|
|
3158
3502
|
/** Dispatched when the selected tab value changes after an invoker `--toggle` updates selection */
|
|
3159
3503
|
onselect?: (e: CustomEvent<CustomEvent>) => void;
|
|
3160
3504
|
};
|
|
3161
3505
|
|
|
3162
3506
|
export type TabsItemProps = {
|
|
3507
|
+
/** Indicates whether the element is a noninteractive visual treatment instead of a button.
|
|
3508
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly */
|
|
3509
|
+
readonly?: boolean;
|
|
3510
|
+
/** Establishes a relationship between a popover and its invoker button.
|
|
3511
|
+
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetElement */
|
|
3512
|
+
popovertarget?: string;
|
|
3513
|
+
/** The popover target action to perform on the popover target element.
|
|
3514
|
+
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetAction */
|
|
3515
|
+
popovertargetaction?: "show" | "hide" | "toggle";
|
|
3516
|
+
/** The element that receives the command.
|
|
3517
|
+
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
3518
|
+
commandfor?: string;
|
|
3519
|
+
/** The element that receives the interest.
|
|
3520
|
+
https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement */
|
|
3521
|
+
interestfor?: string;
|
|
3163
3522
|
/** Indicates whether an element currently holds selection within a multi-option selection group. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)
|
|
3164
3523
|
- `true` The element holds selection and represents the user's current choice within the group.
|
|
3165
3524
|
|
|
3166
3525
|
- `false` The element does not hold selection and the user can choose it. */
|
|
3167
3526
|
selected?: boolean;
|
|
3527
|
+
/** Defines the button behavior when associated within a form element.
|
|
3528
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type */
|
|
3529
|
+
type?: "button" | "submit" | "reset";
|
|
3168
3530
|
/** Indicates the current state of a toggle button that switches on or off. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-pressed)
|
|
3169
3531
|
- `true` The button is in the pressed (on) state and the associated action or setting is active.
|
|
3170
3532
|
|
|
@@ -3175,20 +3537,18 @@ export type TabsItemProps = {
|
|
|
3175
3537
|
|
|
3176
3538
|
- `false` The associated content collapses and hides from the user. */
|
|
3177
3539
|
expanded?: boolean;
|
|
3178
|
-
/**
|
|
3540
|
+
/** Indicates whether the element is a noninteractive visual treatment instead of a button.
|
|
3179
3541
|
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly */
|
|
3180
|
-
|
|
3181
|
-
/**
|
|
3182
|
-
|
|
3542
|
+
readOnly?: boolean;
|
|
3543
|
+
/** Associates the button with a form. Set the property to a form element or its ID. The HTML attribute accepts only
|
|
3544
|
+
the form ID. Reading the property returns the associated form element or `null`.
|
|
3183
3545
|
https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/form */
|
|
3184
3546
|
form?: string | HTMLFormElement | null;
|
|
3185
|
-
/** The name of the
|
|
3547
|
+
/** The name of the button, submitted as a pair with the button value as part of the form data.
|
|
3548
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-name */
|
|
3186
3549
|
name?: string;
|
|
3187
3550
|
/** Defines the value associated with the element's name when submitting the form data. The server receives this value in params when the form submits through this button. [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#value) */
|
|
3188
3551
|
value?: string;
|
|
3189
|
-
/** Defines the button behavior when associated within a form element.
|
|
3190
|
-
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type */
|
|
3191
|
-
type?: "button" | "submit" | "reset";
|
|
3192
3552
|
/** This Boolean attribute prevents the user from interacting with the element: it cannot receive press or focus events. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-disabled)
|
|
3193
3553
|
- `true` The element has a disabled state and does not accept interaction.
|
|
3194
3554
|
|
|
@@ -3201,40 +3561,48 @@ https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type */
|
|
|
3201
3561
|
current?: "page" | "step";
|
|
3202
3562
|
/** Establishes a relationship between a popover and its invoker button.
|
|
3203
3563
|
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetElement */
|
|
3204
|
-
|
|
3564
|
+
popoverTargetElement?: HTMLElement | null;
|
|
3205
3565
|
/** The popover target action to perform on the popover target element.
|
|
3206
3566
|
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetAction */
|
|
3207
|
-
|
|
3567
|
+
popoverTargetAction?: "show" | "hide" | "toggle";
|
|
3208
3568
|
/** The element that receives the command.
|
|
3209
3569
|
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
3210
|
-
|
|
3570
|
+
commandForElement?: HTMLElement | null;
|
|
3211
3571
|
/** The command to execute on the element.
|
|
3212
3572
|
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
3213
3573
|
command?: string;
|
|
3214
3574
|
/** The element that receives the interest.
|
|
3215
|
-
https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement */
|
|
3216
|
-
interestfor?: string;
|
|
3217
|
-
/** Establishes a relationship between a popover and its invoker button.
|
|
3218
|
-
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetElement */
|
|
3219
|
-
popoverTargetElement?: HTMLElement | null;
|
|
3220
|
-
/** The element that receives the command.
|
|
3221
|
-
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
3222
|
-
commandForElement?: HTMLElement | null;
|
|
3223
|
-
/** The element that receives the interest.
|
|
3224
3575
|
https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement */
|
|
3225
3576
|
interestForElement?: HTMLElement | null;
|
|
3226
3577
|
};
|
|
3227
3578
|
|
|
3228
3579
|
export type TabsProps = {
|
|
3580
|
+
/** Determines whether the tabs should handle selection behavior vs. defaults to off. */
|
|
3581
|
+
"behavior-select"?: boolean;
|
|
3229
3582
|
/** Determines whether the tabs should display in a vertical layout vs. defaulting to horizontal. */
|
|
3230
3583
|
vertical?: boolean;
|
|
3231
3584
|
/** Determines whether the tabs should display a border on selected items vs. defaults to show border. */
|
|
3232
3585
|
borderless?: boolean;
|
|
3233
3586
|
/** Determines whether the tabs should handle selection behavior vs. defaults to off. */
|
|
3234
|
-
|
|
3587
|
+
behaviorSelect?: boolean;
|
|
3235
3588
|
};
|
|
3236
3589
|
|
|
3237
3590
|
export type TagProps = {
|
|
3591
|
+
/** Indicates whether the element is a noninteractive visual treatment instead of a button.
|
|
3592
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly */
|
|
3593
|
+
readonly?: boolean;
|
|
3594
|
+
/** Establishes a relationship between a popover and its invoker button.
|
|
3595
|
+
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetElement */
|
|
3596
|
+
popovertarget?: string;
|
|
3597
|
+
/** The popover target action to perform on the popover target element.
|
|
3598
|
+
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetAction */
|
|
3599
|
+
popovertargetaction?: "show" | "hide" | "toggle";
|
|
3600
|
+
/** The element that receives the command.
|
|
3601
|
+
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
3602
|
+
commandfor?: string;
|
|
3603
|
+
/** The element that receives the interest.
|
|
3604
|
+
https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement */
|
|
3605
|
+
interestfor?: string;
|
|
3238
3606
|
/** Indicates whether the user can dismiss or close the element.
|
|
3239
3607
|
- `true` The element displays a close control and the user can dismiss it.
|
|
3240
3608
|
|
|
@@ -3264,11 +3632,13 @@ export type TagProps = {
|
|
|
3264
3632
|
| "lime-pear"
|
|
3265
3633
|
| "yellow-nova"
|
|
3266
3634
|
| "brand-green";
|
|
3267
|
-
/**
|
|
3268
|
-
|
|
3269
|
-
|
|
3270
|
-
/** Enables updating internal string values for internationalization. */
|
|
3635
|
+
/** Determines the visual prominence or weight */
|
|
3636
|
+
prominence?: "emphasis" | undefined;
|
|
3637
|
+
/** Updates internal string values for internationalization. */
|
|
3271
3638
|
i18n?: string;
|
|
3639
|
+
/** Defines the button behavior when associated within a form element.
|
|
3640
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type */
|
|
3641
|
+
type?: "button" | "submit" | "reset";
|
|
3272
3642
|
/** Indicates the current state of a toggle button that switches on or off. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-pressed)
|
|
3273
3643
|
- `true` The button is in the pressed (on) state and the associated action or setting is active.
|
|
3274
3644
|
|
|
@@ -3279,20 +3649,18 @@ export type TagProps = {
|
|
|
3279
3649
|
|
|
3280
3650
|
- `false` The associated content collapses and hides from the user. */
|
|
3281
3651
|
expanded?: boolean;
|
|
3282
|
-
/**
|
|
3652
|
+
/** Indicates whether the element is a noninteractive visual treatment instead of a button.
|
|
3283
3653
|
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly */
|
|
3284
|
-
|
|
3285
|
-
/**
|
|
3286
|
-
|
|
3654
|
+
readOnly?: boolean;
|
|
3655
|
+
/** Associates the button with a form. Set the property to a form element or its ID. The HTML attribute accepts only
|
|
3656
|
+
the form ID. Reading the property returns the associated form element or `null`.
|
|
3287
3657
|
https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/form */
|
|
3288
3658
|
form?: string | HTMLFormElement | null;
|
|
3289
|
-
/** The name of the
|
|
3659
|
+
/** The name of the button, submitted as a pair with the button value as part of the form data.
|
|
3660
|
+
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-name */
|
|
3290
3661
|
name?: string;
|
|
3291
3662
|
/** Defines the value associated with the element's name when submitting the form data. The server receives this value in params when the form submits through this button. [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#value) */
|
|
3292
3663
|
value?: string;
|
|
3293
|
-
/** Defines the button behavior when associated within a form element.
|
|
3294
|
-
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type */
|
|
3295
|
-
type?: "button" | "submit" | "reset";
|
|
3296
3664
|
/** This Boolean attribute prevents the user from interacting with the element: it cannot receive press or focus events. [MDN](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-disabled)
|
|
3297
3665
|
- `true` The element has a disabled state and does not accept interaction.
|
|
3298
3666
|
|
|
@@ -3310,35 +3678,27 @@ https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type */
|
|
|
3310
3678
|
current?: "page" | "step";
|
|
3311
3679
|
/** Establishes a relationship between a popover and its invoker button.
|
|
3312
3680
|
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetElement */
|
|
3313
|
-
|
|
3681
|
+
popoverTargetElement?: HTMLElement | null;
|
|
3314
3682
|
/** The popover target action to perform on the popover target element.
|
|
3315
3683
|
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetAction */
|
|
3316
|
-
|
|
3684
|
+
popoverTargetAction?: "show" | "hide" | "toggle";
|
|
3317
3685
|
/** The element that receives the command.
|
|
3318
3686
|
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
3319
|
-
|
|
3687
|
+
commandForElement?: HTMLElement | null;
|
|
3320
3688
|
/** The command to execute on the element.
|
|
3321
3689
|
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
3322
3690
|
command?: string;
|
|
3323
3691
|
/** The element that receives the interest.
|
|
3324
|
-
https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement */
|
|
3325
|
-
interestfor?: string;
|
|
3326
|
-
/** Establishes a relationship between a popover and its invoker button.
|
|
3327
|
-
https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/popoverTargetElement */
|
|
3328
|
-
popoverTargetElement?: HTMLElement | null;
|
|
3329
|
-
/** The element that receives the command.
|
|
3330
|
-
https://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_API */
|
|
3331
|
-
commandForElement?: HTMLElement | null;
|
|
3332
|
-
/** The element that receives the interest.
|
|
3333
3692
|
https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/interestForElement */
|
|
3334
3693
|
interestForElement?: HTMLElement | null;
|
|
3335
3694
|
};
|
|
3336
3695
|
|
|
3337
3696
|
export type TextareaProps = {
|
|
3338
|
-
/**
|
|
3339
|
-
-
|
|
3340
|
-
|
|
3341
|
-
-
|
|
3697
|
+
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
3698
|
+
"fit-text"?: boolean;
|
|
3699
|
+
/** Sets the input to match native default content block */
|
|
3700
|
+
"fit-content"?: boolean;
|
|
3701
|
+
/** Set current visual state for control. This overrides any validation states active. */
|
|
3342
3702
|
status?: "warning" | "error" | "success" | "disabled";
|
|
3343
3703
|
/** Controls the directional arrangement and spacing behavior of the element's content.
|
|
3344
3704
|
- `vertical` Arranges content in a vertical stack with block-level spacing.
|
|
@@ -3350,27 +3710,26 @@ export type TextareaProps = {
|
|
|
3350
3710
|
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
3351
3711
|
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
3352
3712
|
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
3353
|
-
|
|
3713
|
+
fitText?: boolean;
|
|
3354
3714
|
/** Sets the input to match native default content block */
|
|
3355
|
-
|
|
3356
|
-
/** Enables
|
|
3715
|
+
fitContent?: boolean;
|
|
3716
|
+
/** Enables internal string values to update for internationalization. */
|
|
3357
3717
|
i18n?: string;
|
|
3358
|
-
/**
|
|
3359
|
-
- `muted` Reduces visual weight for supporting content that should remain subtle and unobtrusive. */
|
|
3718
|
+
/** Set the visual prominence of the control */
|
|
3360
3719
|
prominence?: "muted";
|
|
3361
|
-
|
|
3362
3720
|
/** */
|
|
3363
3721
|
onreset?: (e: CustomEvent<CustomEvent>) => void;
|
|
3364
3722
|
};
|
|
3365
3723
|
|
|
3366
3724
|
export type TimeProps = {
|
|
3367
|
-
/**
|
|
3368
|
-
-
|
|
3369
|
-
|
|
3370
|
-
|
|
3371
|
-
|
|
3372
|
-
|
|
3373
|
-
|
|
3725
|
+
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
3726
|
+
"fit-text"?: boolean;
|
|
3727
|
+
/** Sets the input to match native default content block */
|
|
3728
|
+
"fit-content"?: boolean;
|
|
3729
|
+
/** Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.
|
|
3730
|
+
Use when embedding within another container such as a toolbar. */
|
|
3731
|
+
container?: "flat" | undefined;
|
|
3732
|
+
/** Set current visual state for control. This overrides any validation states active. */
|
|
3374
3733
|
status?: "warning" | "error" | "success" | "disabled";
|
|
3375
3734
|
/** Controls the directional arrangement and spacing behavior of the element's content.
|
|
3376
3735
|
- `vertical` Arranges content in a vertical stack with block-level spacing.
|
|
@@ -3382,27 +3741,30 @@ export type TimeProps = {
|
|
|
3382
3741
|
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
3383
3742
|
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
3384
3743
|
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
3385
|
-
|
|
3744
|
+
fitText?: boolean;
|
|
3386
3745
|
/** Sets the input to match native default content block */
|
|
3387
|
-
|
|
3388
|
-
/** Enables
|
|
3746
|
+
fitContent?: boolean;
|
|
3747
|
+
/** Enables internal string values to update for internationalization. */
|
|
3389
3748
|
i18n?: string;
|
|
3390
|
-
/**
|
|
3391
|
-
- `muted` Reduces visual weight for supporting content that should remain subtle and unobtrusive. */
|
|
3749
|
+
/** Set the visual prominence of the control */
|
|
3392
3750
|
prominence?: "muted";
|
|
3393
|
-
|
|
3394
3751
|
/** */
|
|
3395
3752
|
onreset?: (e: CustomEvent<CustomEvent>) => void;
|
|
3396
3753
|
};
|
|
3397
3754
|
|
|
3398
3755
|
export type ToastProps = {
|
|
3399
|
-
/**
|
|
3756
|
+
/** @deprecated Use the popover API instead.
|
|
3757
|
+
Determines if popover visibility behavior should be automatically controlled by the trigger. */
|
|
3758
|
+
"behavior-trigger"?: boolean;
|
|
3759
|
+
/** A delayed `close` event occurs after the provided millisecond value elapses. */
|
|
3760
|
+
"close-timeout"?: number;
|
|
3761
|
+
/** Provides the element that the popover should position relative to. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. */
|
|
3400
3762
|
anchor?: string | HTMLElement;
|
|
3401
3763
|
/** @deprecated Use the popover API instead.
|
|
3402
3764
|
The trigger defines what element triggers an `open` interaction event.
|
|
3403
|
-
A trigger can accept a idref string within the same render root or a HTMLElement DOM reference. - Defines
|
|
3765
|
+
A trigger can accept a idref string within the same render root or a HTMLElement DOM reference. - Defines the element that triggers an `open` interaction event. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. */
|
|
3404
3766
|
trigger?: string | HTMLElement;
|
|
3405
|
-
/**
|
|
3767
|
+
/** Sets the side position of the popover relative to the provided anchor element.
|
|
3406
3768
|
- `center` Centers the popover directly over the anchor element.
|
|
3407
3769
|
|
|
3408
3770
|
- `top` Positions the popover above the anchor element.
|
|
@@ -3420,19 +3782,25 @@ A trigger can accept a idref string within the same render root or a HTMLElement
|
|
|
3420
3782
|
|
|
3421
3783
|
- `center` Centers the popover along the anchor's edge for balanced positioning. */
|
|
3422
3784
|
alignment?: "start" | "end" | "center";
|
|
3423
|
-
/**
|
|
3424
|
-
- `muted` Reduces visual weight for supporting content that should remain subtle and unobtrusive. */
|
|
3785
|
+
/** Sets the visual prominence of the toast. */
|
|
3425
3786
|
prominence?: "muted";
|
|
3426
3787
|
/** @deprecated Use the popover API instead.
|
|
3427
3788
|
Determines if popover visibility behavior should be automatically controlled by the trigger. */
|
|
3428
|
-
|
|
3789
|
+
behaviorTrigger?: boolean;
|
|
3429
3790
|
/** Indicates whether the user can dismiss or close the element.
|
|
3430
3791
|
- `true` The element displays a close control and the user can dismiss it.
|
|
3431
3792
|
|
|
3432
3793
|
- `false` The user cannot close the element and must dismiss it programmatically. */
|
|
3433
3794
|
closable?: boolean;
|
|
3434
|
-
/**
|
|
3435
|
-
|
|
3795
|
+
/** Sets the automatic dismissal time in milliseconds before the element emits a `close` event. Allow ~200-250ms per word for comfortable reading.
|
|
3796
|
+
- `0` Warning or error messages requiring immediate acknowledgment.
|
|
3797
|
+
|
|
3798
|
+
- `3000` Brief success or confirmation messages.
|
|
3799
|
+
|
|
3800
|
+
- `7000` Standard informational messages.
|
|
3801
|
+
|
|
3802
|
+
- `10000` Messages with actions or requiring user decision. */
|
|
3803
|
+
closeTimeout?: number;
|
|
3436
3804
|
/** Communicates the intent and semantic meaning of an element to help users understand the outcome of their actions.
|
|
3437
3805
|
- `accent` Highlights important actions or draws attention to primary interactive elements.
|
|
3438
3806
|
|
|
@@ -3442,9 +3810,8 @@ Determines if popover visibility behavior should be automatically controlled by
|
|
|
3442
3810
|
|
|
3443
3811
|
- `danger` Signals destructive or irreversible actions that need extra attention and confirmation. */
|
|
3444
3812
|
status?: "accent" | "warning" | "success" | "danger";
|
|
3445
|
-
/**
|
|
3813
|
+
/** Updates internal string values for internationalization. */
|
|
3446
3814
|
i18n?: string;
|
|
3447
|
-
|
|
3448
3815
|
/** Dispatched on a popover just before showing or hiding. [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/beforetoggle_event) */
|
|
3449
3816
|
onbeforetoggle?: (e: CustomEvent<never>) => void;
|
|
3450
3817
|
/** Dispatched on a popover element just after showing or hiding. [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/toggle_event) */
|
|
@@ -3460,13 +3827,16 @@ export type ToggletipFooterProps = {};
|
|
|
3460
3827
|
export type ToggletipHeaderProps = {};
|
|
3461
3828
|
|
|
3462
3829
|
export type ToggletipProps = {
|
|
3463
|
-
/**
|
|
3830
|
+
/** @deprecated Use the popover API instead.
|
|
3831
|
+
Determines if popover visibility behavior should be automatically controlled by the trigger. */
|
|
3832
|
+
"behavior-trigger"?: boolean;
|
|
3833
|
+
/** Provides the element that the popover should position relative to. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. */
|
|
3464
3834
|
anchor?: string | HTMLElement;
|
|
3465
3835
|
/** @deprecated Use the popover API instead.
|
|
3466
3836
|
The trigger defines what element triggers an `open` interaction event.
|
|
3467
|
-
A trigger can accept a idref string within the same render root or a HTMLElement DOM reference. - Defines
|
|
3837
|
+
A trigger can accept a idref string within the same render root or a HTMLElement DOM reference. - Defines the element that triggers an `open` interaction event. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. */
|
|
3468
3838
|
trigger?: string | HTMLElement;
|
|
3469
|
-
/**
|
|
3839
|
+
/** Sets the side position of the popover relative to the provided anchor element.
|
|
3470
3840
|
- `center` Centers the popover directly over the anchor element.
|
|
3471
3841
|
|
|
3472
3842
|
- `top` Positions the popover above the anchor element.
|
|
@@ -3486,7 +3856,7 @@ A trigger can accept a idref string within the same render root or a HTMLElement
|
|
|
3486
3856
|
alignment?: "start" | "end" | "center";
|
|
3487
3857
|
/** @deprecated Use the popover API instead.
|
|
3488
3858
|
Determines if popover visibility behavior should be automatically controlled by the trigger. */
|
|
3489
|
-
|
|
3859
|
+
behaviorTrigger?: boolean;
|
|
3490
3860
|
/** Indicates whether the user can dismiss or close the element.
|
|
3491
3861
|
- `true` The element displays a close control and the user can dismiss it.
|
|
3492
3862
|
|
|
@@ -3494,10 +3864,8 @@ Determines if popover visibility behavior should be automatically controlled by
|
|
|
3494
3864
|
closable?: boolean;
|
|
3495
3865
|
/** Determines if the component renders an arrow. */
|
|
3496
3866
|
arrow?: boolean;
|
|
3497
|
-
/**
|
|
3867
|
+
/** Updates internal string values for internationalization. */
|
|
3498
3868
|
i18n?: string;
|
|
3499
|
-
/** */
|
|
3500
|
-
popoverArrow?: HTMLElement;
|
|
3501
3869
|
/** Dispatched on a popover just before showing or hiding. [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/beforetoggle_event) */
|
|
3502
3870
|
onbeforetoggle?: (e: CustomEvent<never>) => void;
|
|
3503
3871
|
/** Dispatched on a popover element just after showing or hiding. [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/toggle_event) */
|
|
@@ -3509,33 +3877,32 @@ Determines if popover visibility behavior should be automatically controlled by
|
|
|
3509
3877
|
};
|
|
3510
3878
|
|
|
3511
3879
|
export type ToolbarProps = {
|
|
3512
|
-
/**
|
|
3513
|
-
|
|
3514
|
-
|
|
3515
|
-
- `inset` Element container optimizes for embedding or inset placement inside another containing element.
|
|
3516
|
-
|
|
3517
|
-
- `full` Element container optimizes for filling its container bounds. */
|
|
3518
|
-
container?: "flat" | "inset" | "full" | "default";
|
|
3880
|
+
/** Determines the container styles of component. Flat applies when nesting elements within other containers or for a more muted style. Full applies when the element expands the full width of the viewport. */
|
|
3881
|
+
container?: "flat" | "inset" | "full" | undefined;
|
|
3519
3882
|
/** Determines the primary content overflow behavior. */
|
|
3520
|
-
content?: "scroll" | "wrap" |
|
|
3883
|
+
content?: "scroll" | "wrap" | undefined;
|
|
3521
3884
|
/** Controls the directional flow of the element's layout and interaction pattern.
|
|
3522
3885
|
- `horizontal` Element orients horizontally with left-to-right flow.
|
|
3523
3886
|
|
|
3524
3887
|
- `vertical` Element orients vertically with top-to-bottom flow. */
|
|
3525
|
-
orientation?: "horizontal" | "vertical" |
|
|
3526
|
-
/**
|
|
3527
|
-
- `accent` Highlights important actions or draws attention to primary interactive elements. */
|
|
3888
|
+
orientation?: "horizontal" | "vertical" | undefined;
|
|
3889
|
+
/** Visual treatment to represent accent color for interactive selections */
|
|
3528
3890
|
status?: "accent";
|
|
3529
3891
|
};
|
|
3530
3892
|
|
|
3531
3893
|
export type TooltipProps = {
|
|
3532
|
-
/**
|
|
3894
|
+
/** @deprecated Use the popover API instead.
|
|
3895
|
+
Determines if popover visibility behavior should be automatically controlled by the trigger. */
|
|
3896
|
+
"behavior-trigger"?: boolean;
|
|
3897
|
+
/** @deprecated Use interest-delay-start css property instead */
|
|
3898
|
+
"open-delay"?: number;
|
|
3899
|
+
/** Provides the element that the popover should position relative to. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. */
|
|
3533
3900
|
anchor?: string | HTMLElement;
|
|
3534
3901
|
/** @deprecated Use the popover API instead.
|
|
3535
3902
|
The trigger defines what element triggers an `open` interaction event.
|
|
3536
|
-
A trigger can accept a idref string within the same render root or a HTMLElement DOM reference. - Defines
|
|
3903
|
+
A trigger can accept a idref string within the same render root or a HTMLElement DOM reference. - Defines the element that triggers an `open` interaction event. Set the property to an element or its ID within the same render root. The HTML attribute accepts only the element ID. */
|
|
3537
3904
|
trigger?: string | HTMLElement;
|
|
3538
|
-
/**
|
|
3905
|
+
/** Sets the side position of the popover relative to the provided anchor element.
|
|
3539
3906
|
- `center` Centers the popover directly over the anchor element.
|
|
3540
3907
|
|
|
3541
3908
|
- `top` Positions the popover above the anchor element.
|
|
@@ -3555,17 +3922,14 @@ A trigger can accept a idref string within the same render root or a HTMLElement
|
|
|
3555
3922
|
alignment?: "start" | "end" | "center";
|
|
3556
3923
|
/** @deprecated Use the popover API instead.
|
|
3557
3924
|
Determines if popover visibility behavior should be automatically controlled by the trigger. */
|
|
3558
|
-
|
|
3559
|
-
/**
|
|
3560
|
-
- `accent` - Highlights important actions or draws attention to primary interactive elements.
|
|
3561
|
-
- `warning` - Indicates cautionary actions that require careful consideration before proceeding.
|
|
3562
|
-
- `success` - Represents positive outcomes, confirmations, or constructive actions.
|
|
3563
|
-
- `danger` - Signals destructive or irreversible actions that need extra attention and confirmation. */
|
|
3925
|
+
behaviorTrigger?: boolean;
|
|
3926
|
+
/** visual treatment to represent a ongoing task or support status */
|
|
3564
3927
|
status?: "muted";
|
|
3565
|
-
/** @deprecated Use interest-delay-start css property instead
|
|
3566
|
-
|
|
3567
|
-
|
|
3568
|
-
|
|
3928
|
+
/** @deprecated Use interest-delay-start css property instead - Sets the delay in milliseconds before the element emits an `open` event.
|
|
3929
|
+
- `0` Keyboard focus interactions (always immediate for accessibility).
|
|
3930
|
+
|
|
3931
|
+
- `500` Dense interfaces with many tooltips to reduce visual noise and prevent accidental triggers. */
|
|
3932
|
+
openDelay?: number;
|
|
3569
3933
|
/** Dispatched on a popover just before showing or hiding. [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/beforetoggle_event) */
|
|
3570
3934
|
onbeforetoggle?: (e: CustomEvent<never>) => void;
|
|
3571
3935
|
/** Dispatched on a popover element just after showing or hiding. [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/toggle_event) */
|
|
@@ -3593,14 +3957,8 @@ export type TreeNodeProps = {
|
|
|
3593
3957
|
selectable?: "single" | "multi";
|
|
3594
3958
|
/** Determines the highlighted state of the element. Highlighted states serve non-interactive selections where nodes may relate to other selected portions of the UI. */
|
|
3595
3959
|
highlighted?: boolean;
|
|
3596
|
-
/**
|
|
3960
|
+
/** Updates internal string values for internationalization. */
|
|
3597
3961
|
i18n?: string;
|
|
3598
|
-
/** */
|
|
3599
|
-
indeterminate?: boolean;
|
|
3600
|
-
/** */
|
|
3601
|
-
behaviorExpand?: boolean;
|
|
3602
|
-
/** */
|
|
3603
|
-
behaviorSelect?: boolean;
|
|
3604
3962
|
/** Dispatched when the node opens. */
|
|
3605
3963
|
onopen?: (e: CustomEvent<never>) => void;
|
|
3606
3964
|
/** Dispatched when the node closes. */
|
|
@@ -3610,15 +3968,18 @@ export type TreeNodeProps = {
|
|
|
3610
3968
|
};
|
|
3611
3969
|
|
|
3612
3970
|
export type TreeProps = {
|
|
3613
|
-
/** Determines whether all nodes can be in a selected state. Nodes can be in a single or multi select state. */
|
|
3614
|
-
selectable?: "single" | "multi";
|
|
3615
3971
|
/** Determines whether the tree nodes should handle auto-expanding behavior. */
|
|
3616
3972
|
"behavior-expand"?: boolean;
|
|
3617
3973
|
/** Determines whether the tree nodes should handle auto-select behavior. */
|
|
3618
3974
|
"behavior-select"?: boolean;
|
|
3975
|
+
/** Determines whether all nodes can be in a selected state. Nodes can be in a single or multi select state. */
|
|
3976
|
+
selectable?: "single" | "multi";
|
|
3977
|
+
/** Determines whether the tree nodes should handle auto-expanding behavior. */
|
|
3978
|
+
behaviorExpand?: boolean;
|
|
3979
|
+
/** Determines whether the tree nodes should handle auto-select behavior. */
|
|
3980
|
+
behaviorSelect?: boolean;
|
|
3619
3981
|
/** Determines if the node depth border renders. */
|
|
3620
3982
|
border?: boolean;
|
|
3621
|
-
|
|
3622
3983
|
/** Dispatched from a child nve-tree-node when opened. */
|
|
3623
3984
|
onopen?: (e: CustomEvent<never>) => void;
|
|
3624
3985
|
/** Dispatched from a child nve-tree-node when closed. */
|
|
@@ -3628,13 +3989,14 @@ export type TreeProps = {
|
|
|
3628
3989
|
};
|
|
3629
3990
|
|
|
3630
3991
|
export type WeekProps = {
|
|
3631
|
-
/**
|
|
3632
|
-
-
|
|
3633
|
-
|
|
3634
|
-
|
|
3635
|
-
|
|
3636
|
-
|
|
3637
|
-
|
|
3992
|
+
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
3993
|
+
"fit-text"?: boolean;
|
|
3994
|
+
/** Sets the input to match native default content block */
|
|
3995
|
+
"fit-content"?: boolean;
|
|
3996
|
+
/** Reduces the visual container for a minimal borderless appearance while preserving whitespace bounds.
|
|
3997
|
+
Use when embedding within another container such as a toolbar. */
|
|
3998
|
+
container?: "flat" | undefined;
|
|
3999
|
+
/** Set current visual state for control. This overrides any validation states active. */
|
|
3638
4000
|
status?: "warning" | "error" | "success" | "disabled";
|
|
3639
4001
|
/** Controls the directional arrangement and spacing behavior of the element's content.
|
|
3640
4002
|
- `vertical` Arranges content in a vertical stack with block-level spacing.
|
|
@@ -3646,15 +4008,13 @@ export type WeekProps = {
|
|
|
3646
4008
|
- `horizontal-inline` Arranges content horizontally with compact inline spacing. */
|
|
3647
4009
|
layout?: "vertical" | "vertical-inline" | "horizontal" | "horizontal-inline";
|
|
3648
4010
|
/** Sets the input to match the width of the active text content of the control value. Only applicable to vertical input box type controls (input, select) */
|
|
3649
|
-
|
|
4011
|
+
fitText?: boolean;
|
|
3650
4012
|
/** Sets the input to match native default content block */
|
|
3651
|
-
|
|
3652
|
-
/** Enables
|
|
4013
|
+
fitContent?: boolean;
|
|
4014
|
+
/** Enables internal string values to update for internationalization. */
|
|
3653
4015
|
i18n?: string;
|
|
3654
|
-
/**
|
|
3655
|
-
- `muted` Reduces visual weight for supporting content that should remain subtle and unobtrusive. */
|
|
4016
|
+
/** Set the visual prominence of the control */
|
|
3656
4017
|
prominence?: "muted";
|
|
3657
|
-
|
|
3658
4018
|
/** */
|
|
3659
4019
|
onreset?: (e: CustomEvent<CustomEvent>) => void;
|
|
3660
4020
|
};
|
|
@@ -3666,7 +4026,7 @@ export type CustomElements = {
|
|
|
3666
4026
|
*
|
|
3667
4027
|
*
|
|
3668
4028
|
* ### **Slots:**
|
|
3669
|
-
* - _default_ -
|
|
4029
|
+
* - _default_ - Heading text and supporting content that labels the accordion section.
|
|
3670
4030
|
* - **prefix** - slot for prefix content
|
|
3671
4031
|
* - **suffix** - slot for suffix content
|
|
3672
4032
|
*
|
|
@@ -3694,16 +4054,15 @@ export type CustomElements = {
|
|
|
3694
4054
|
*
|
|
3695
4055
|
*
|
|
3696
4056
|
* ### **Slots:**
|
|
3697
|
-
* - _default_ -
|
|
4057
|
+
* - _default_ - Content displayed in the collapsible region, typically an `nve-accordion-content` element.
|
|
3698
4058
|
* - **icon-button** - icon elements to display for expand/collapse
|
|
3699
4059
|
* - **header** - header element (Use `accordion-header` or custom content)
|
|
3700
|
-
* - **content** - content element (Use `accordion-content` or custom content)
|
|
3701
4060
|
*
|
|
3702
4061
|
* ### **CSS Properties:**
|
|
3703
4062
|
* - **--background** - undefined _(default: undefined)_
|
|
3704
4063
|
* - **--color** - undefined _(default: undefined)_
|
|
3705
4064
|
* - **--border-radius** - undefined _(default: undefined)_
|
|
3706
|
-
* - **--header-padding** -
|
|
4065
|
+
* - **--header-padding** - Padding around the header content. _(default: undefined)_
|
|
3707
4066
|
* - **--cursor** - undefined _(default: undefined)_
|
|
3708
4067
|
* - **--transition** - undefined _(default: undefined)_
|
|
3709
4068
|
*
|
|
@@ -3781,7 +4140,7 @@ export type CustomElements = {
|
|
|
3781
4140
|
*
|
|
3782
4141
|
*
|
|
3783
4142
|
* ### **Slots:**
|
|
3784
|
-
* - _default_ -
|
|
4143
|
+
* - _default_ - `nve-avatar` elements that represent the group members.
|
|
3785
4144
|
*/
|
|
3786
4145
|
"nve-avatar-group": Partial<AvatarGroupProps & BaseProps & BaseEvents>;
|
|
3787
4146
|
|
|
@@ -3791,7 +4150,7 @@ export type CustomElements = {
|
|
|
3791
4150
|
*
|
|
3792
4151
|
*
|
|
3793
4152
|
* ### **Slots:**
|
|
3794
|
-
* - _default_ -
|
|
4153
|
+
* - _default_ - Initials, an image, or other content that identifies the represented user or bot.
|
|
3795
4154
|
*
|
|
3796
4155
|
* ### **CSS Properties:**
|
|
3797
4156
|
* - **--background** - undefined _(default: undefined)_
|
|
@@ -3811,7 +4170,7 @@ export type CustomElements = {
|
|
|
3811
4170
|
*
|
|
3812
4171
|
*
|
|
3813
4172
|
* ### **Slots:**
|
|
3814
|
-
* - _default_ -
|
|
4173
|
+
* - _default_ - Short text that communicates the badge status.
|
|
3815
4174
|
* - **prefix-icon** - slot for prefix icon
|
|
3816
4175
|
* - **suffix-icon** - slot for suffix icon
|
|
3817
4176
|
*
|
|
@@ -3924,7 +4283,7 @@ export type CustomElements = {
|
|
|
3924
4283
|
*
|
|
3925
4284
|
*
|
|
3926
4285
|
* ### **Slots:**
|
|
3927
|
-
* - _default_ -
|
|
4286
|
+
* - _default_ - Card title, supporting text, and optional action controls.
|
|
3928
4287
|
*
|
|
3929
4288
|
* ### **CSS Properties:**
|
|
3930
4289
|
* - **--padding** - undefined _(default: undefined)_
|
|
@@ -3967,7 +4326,7 @@ export type CustomElements = {
|
|
|
3967
4326
|
*
|
|
3968
4327
|
*
|
|
3969
4328
|
* ### **Slots:**
|
|
3970
|
-
* - _default_ -
|
|
4329
|
+
* - _default_ - The message body displayed between the prefix and suffix content.
|
|
3971
4330
|
* - **prefix** - for avatar/img content
|
|
3972
4331
|
* - **suffix** - for avatar/img content
|
|
3973
4332
|
*
|
|
@@ -4127,7 +4486,7 @@ export type CustomElements = {
|
|
|
4127
4486
|
*
|
|
4128
4487
|
*
|
|
4129
4488
|
* ### **Slots:**
|
|
4130
|
-
* - _default_ -
|
|
4489
|
+
* - _default_ - Text label displayed before the copy icon.
|
|
4131
4490
|
* - **icon** - slot for custom icon
|
|
4132
4491
|
*
|
|
4133
4492
|
* ### **CSS Properties:**
|
|
@@ -4280,7 +4639,7 @@ export type CustomElements = {
|
|
|
4280
4639
|
* - **close** - Dispatched when the dialog closes.
|
|
4281
4640
|
*
|
|
4282
4641
|
* ### **Slots:**
|
|
4283
|
-
* - _default_ -
|
|
4642
|
+
* - _default_ - Dialog body content displayed between the header and footer.
|
|
4284
4643
|
*
|
|
4285
4644
|
* ### **CSS Properties:**
|
|
4286
4645
|
* - **--border** - undefined _(default: undefined)_
|
|
@@ -4394,7 +4753,7 @@ export type CustomElements = {
|
|
|
4394
4753
|
* - **close** - Dispatched when the drawer closes.
|
|
4395
4754
|
*
|
|
4396
4755
|
* ### **Slots:**
|
|
4397
|
-
* - _default_ -
|
|
4756
|
+
* - _default_ - Drawer body content displayed between the header and footer.
|
|
4398
4757
|
*
|
|
4399
4758
|
* ### **CSS Properties:**
|
|
4400
4759
|
* - **--border** - undefined _(default: undefined)_
|
|
@@ -4422,13 +4781,14 @@ export type CustomElements = {
|
|
|
4422
4781
|
* - **open** - Dispatched when a dropdown in the group opens
|
|
4423
4782
|
* - **close** - Dispatched when a dropdown in the group closes
|
|
4424
4783
|
*
|
|
4784
|
+
* ### **Methods:**
|
|
4785
|
+
* - **close()** - Closes every descendant dropdown in the group.
|
|
4786
|
+
*
|
|
4425
4787
|
* ### **Slots:**
|
|
4426
4788
|
* - _default_ - default slot for dropdown content
|
|
4427
4789
|
*
|
|
4428
4790
|
* ### **CSS Properties:**
|
|
4429
|
-
* - **--
|
|
4430
|
-
* - **--nve-dropdown-group-transition** - undefined _(default: undefined)_
|
|
4431
|
-
* - **--arrow-transform** - Transform applied to the popover arrow _(default: undefined)_
|
|
4791
|
+
* - **--arrow-transform** - Transform applied to the popover arrow _(default: undefined)_
|
|
4432
4792
|
*/
|
|
4433
4793
|
"nve-dropdown-group": Partial<DropdownGroupProps & BaseProps & BaseEvents>;
|
|
4434
4794
|
|
|
@@ -4511,9 +4871,8 @@ export type CustomElements = {
|
|
|
4511
4871
|
* - **reset()** - Resets the control value to its initial value.
|
|
4512
4872
|
*
|
|
4513
4873
|
* ### **Slots:**
|
|
4514
|
-
* - _default_ -
|
|
4515
|
-
* - **icon** - default
|
|
4516
|
-
* - **content** - default slot for content
|
|
4874
|
+
* - _default_ - Custom messaging that replaces the default upload instructions.
|
|
4875
|
+
* - **icon** - Custom icon that replaces the default upload icon.
|
|
4517
4876
|
*
|
|
4518
4877
|
* ### **CSS Properties:**
|
|
4519
4878
|
* - **--background** - undefined _(default: undefined)_
|
|
@@ -4621,7 +4980,7 @@ export type CustomElements = {
|
|
|
4621
4980
|
*
|
|
4622
4981
|
*
|
|
4623
4982
|
* ### **Slots:**
|
|
4624
|
-
* - _default_ -
|
|
4983
|
+
* - _default_ - Validation or supporting message text for the associated control.
|
|
4625
4984
|
*
|
|
4626
4985
|
* ### **CSS Properties:**
|
|
4627
4986
|
* - **--color** - undefined _(default: undefined)_
|
|
@@ -4690,7 +5049,7 @@ export type CustomElements = {
|
|
|
4690
5049
|
*
|
|
4691
5050
|
*
|
|
4692
5051
|
* ### **Slots:**
|
|
4693
|
-
* - _default_ -
|
|
5052
|
+
* - _default_ - Data or interactive controls displayed within the cell.
|
|
4694
5053
|
*
|
|
4695
5054
|
* ### **CSS Properties:**
|
|
4696
5055
|
* - **--background** - undefined _(default: undefined)_
|
|
@@ -4716,7 +5075,7 @@ export type CustomElements = {
|
|
|
4716
5075
|
* - **nve-grid-column-resize**
|
|
4717
5076
|
*
|
|
4718
5077
|
* ### **Slots:**
|
|
4719
|
-
* - _default_ -
|
|
5078
|
+
* - _default_ - Column heading text or controls.
|
|
4720
5079
|
* - **actions** - slot for column actions
|
|
4721
5080
|
*
|
|
4722
5081
|
* ### **CSS Properties:**
|
|
@@ -4738,7 +5097,7 @@ export type CustomElements = {
|
|
|
4738
5097
|
*
|
|
4739
5098
|
*
|
|
4740
5099
|
* ### **Slots:**
|
|
4741
|
-
* - _default_ -
|
|
5100
|
+
* - _default_ - Grid summary, pagination, or other footer controls.
|
|
4742
5101
|
*
|
|
4743
5102
|
* ### **CSS Properties:**
|
|
4744
5103
|
* - **--background** - undefined _(default: undefined)_
|
|
@@ -4757,7 +5116,7 @@ export type CustomElements = {
|
|
|
4757
5116
|
* - **scrollTo(options: _ScrollToOptions_): _Promise<void>_** - Scroll to a specific position in the grid.
|
|
4758
5117
|
*
|
|
4759
5118
|
* ### **Slots:**
|
|
4760
|
-
* - _default_ -
|
|
5119
|
+
* - _default_ - `nve-grid-header`, `nve-grid-row`, and `nve-grid-placeholder` elements.
|
|
4761
5120
|
* - **footer** - slot for grid-footer or toolbar
|
|
4762
5121
|
*
|
|
4763
5122
|
* ### **CSS Properties:**
|
|
@@ -4792,7 +5151,7 @@ export type CustomElements = {
|
|
|
4792
5151
|
*
|
|
4793
5152
|
*
|
|
4794
5153
|
* ### **Slots:**
|
|
4795
|
-
* - _default_ -
|
|
5154
|
+
* - _default_ - Loading or empty-state message displayed in place of grid rows.
|
|
4796
5155
|
*
|
|
4797
5156
|
* ### **CSS Properties:**
|
|
4798
5157
|
* - **--color** - undefined _(default: undefined)_
|
|
@@ -4928,7 +5287,7 @@ export type CustomElements = {
|
|
|
4928
5287
|
*
|
|
4929
5288
|
*
|
|
4930
5289
|
* ### **Slots:**
|
|
4931
|
-
* - _default_ -
|
|
5290
|
+
* - _default_ - Text, an image, or other visual content representing the brand or application.
|
|
4932
5291
|
*
|
|
4933
5292
|
* ### **CSS Properties:**
|
|
4934
5293
|
* - **--background** - undefined _(default: undefined)_
|
|
@@ -4948,7 +5307,7 @@ export type CustomElements = {
|
|
|
4948
5307
|
*
|
|
4949
5308
|
*
|
|
4950
5309
|
* ### **Slots:**
|
|
4951
|
-
* - _default_ -
|
|
5310
|
+
* - _default_ - Label and supporting content for the menu option.
|
|
4952
5311
|
* - **suffix** - slot for suffix icon
|
|
4953
5312
|
*
|
|
4954
5313
|
* ### **CSS Properties:**
|
|
@@ -5053,7 +5412,7 @@ export type CustomElements = {
|
|
|
5053
5412
|
* - **open** - Dispatched when the notification opens.
|
|
5054
5413
|
*
|
|
5055
5414
|
* ### **Slots:**
|
|
5056
|
-
* - _default_ -
|
|
5415
|
+
* - _default_ - The message communicated by the notification.
|
|
5057
5416
|
* - **icon** - content slot for the status icon
|
|
5058
5417
|
*
|
|
5059
5418
|
* ### **CSS Properties:**
|
|
@@ -5102,7 +5461,7 @@ export type CustomElements = {
|
|
|
5102
5461
|
*
|
|
5103
5462
|
*
|
|
5104
5463
|
* ### **Slots:**
|
|
5105
|
-
* - _default_ -
|
|
5464
|
+
* - _default_ - Loading status text displayed with the progress indicator.
|
|
5106
5465
|
*
|
|
5107
5466
|
* ### **CSS Properties:**
|
|
5108
5467
|
* - **--gap** - undefined _(default: undefined)_
|
|
@@ -5169,7 +5528,7 @@ export type CustomElements = {
|
|
|
5169
5528
|
* - **close** - Dispatched after an invoker command sets `hidden` and closes the panel.
|
|
5170
5529
|
*
|
|
5171
5530
|
* ### **Slots:**
|
|
5172
|
-
* - _default_ -
|
|
5531
|
+
* - _default_ - `nve-page-panel-content` elements that provide the panel body.
|
|
5173
5532
|
* - **actions** - slot for action / dismiss buttons
|
|
5174
5533
|
*
|
|
5175
5534
|
* ### **CSS Properties:**
|
|
@@ -5220,7 +5579,7 @@ export type CustomElements = {
|
|
|
5220
5579
|
*
|
|
5221
5580
|
*
|
|
5222
5581
|
* ### **Events:**
|
|
5223
|
-
* - **step-change**
|
|
5582
|
+
* - **step-change** - Dispatched after the page size changes with the current page size in `detail`. The event bubbles and crosses shadow boundaries.
|
|
5224
5583
|
* - **last-page** - Dispatched when the last page is active
|
|
5225
5584
|
* - **first-page** - Dispatched when the first page is active
|
|
5226
5585
|
* - **input** - Dispatched when the value (page) has changed
|
|
@@ -5236,8 +5595,7 @@ export type CustomElements = {
|
|
|
5236
5595
|
* - **reset()** - Resets the control value to its initial value.
|
|
5237
5596
|
*
|
|
5238
5597
|
* ### **Slots:**
|
|
5239
|
-
* -
|
|
5240
|
-
* - **suffix-label** - slot for overriding the "n of total" label when total is an approximation
|
|
5598
|
+
* - **suffix-label** - Overrides the "of total" label when the total is an approximation.
|
|
5241
5599
|
*
|
|
5242
5600
|
* ### **CSS Properties:**
|
|
5243
5601
|
* - **--background** - undefined _(default: undefined)_
|
|
@@ -5448,7 +5806,7 @@ export type CustomElements = {
|
|
|
5448
5806
|
* - **close** - Dispatched when the filter chip closes.
|
|
5449
5807
|
*
|
|
5450
5808
|
* ### **Slots:**
|
|
5451
|
-
* - _default_ -
|
|
5809
|
+
* - _default_ - `input`, `select`, `nve-button`, or other `[nve-control]` elements used to build the filter.
|
|
5452
5810
|
*
|
|
5453
5811
|
* ### **CSS Properties:**
|
|
5454
5812
|
* - **--gap** - undefined _(default: undefined)_
|
|
@@ -5689,7 +6047,7 @@ export type CustomElements = {
|
|
|
5689
6047
|
*
|
|
5690
6048
|
*
|
|
5691
6049
|
* ### **Slots:**
|
|
5692
|
-
* - _default_ -
|
|
6050
|
+
* - _default_ - Loaded content that replaces the placeholder when provided.
|
|
5693
6051
|
*
|
|
5694
6052
|
* ### **CSS Properties:**
|
|
5695
6053
|
* - **--background** - undefined _(default: undefined)_
|
|
@@ -5892,7 +6250,7 @@ export type CustomElements = {
|
|
|
5892
6250
|
*
|
|
5893
6251
|
*
|
|
5894
6252
|
* ### **Slots:**
|
|
5895
|
-
* - _default_ -
|
|
6253
|
+
* - _default_ - The label displayed for the tab.
|
|
5896
6254
|
*
|
|
5897
6255
|
* ### **CSS Properties:**
|
|
5898
6256
|
* - **--font-size** - undefined _(default: undefined)_
|
|
@@ -5931,7 +6289,7 @@ export type CustomElements = {
|
|
|
5931
6289
|
*
|
|
5932
6290
|
*
|
|
5933
6291
|
* ### **Slots:**
|
|
5934
|
-
* - _default_ -
|
|
6292
|
+
* - _default_ - Text or other content that identifies the category or group.
|
|
5935
6293
|
*
|
|
5936
6294
|
* ### **CSS Properties:**
|
|
5937
6295
|
* - **--background** - undefined _(default: undefined)_
|
|
@@ -6038,7 +6396,7 @@ export type CustomElements = {
|
|
|
6038
6396
|
* - **close** - Dispatched when the toast closes.
|
|
6039
6397
|
*
|
|
6040
6398
|
* ### **Slots:**
|
|
6041
|
-
* - _default_ -
|
|
6399
|
+
* - _default_ - The message communicated by the toast.
|
|
6042
6400
|
* - **prefix** - custom status icon slot
|
|
6043
6401
|
*
|
|
6044
6402
|
* ### **CSS Properties:**
|
|
@@ -6130,7 +6488,7 @@ export type CustomElements = {
|
|
|
6130
6488
|
*
|
|
6131
6489
|
*
|
|
6132
6490
|
* ### **Slots:**
|
|
6133
|
-
* - _default_ -
|
|
6491
|
+
* - _default_ - Primary buttons, inputs, and other toolbar controls.
|
|
6134
6492
|
* - **prefix** - slot for prefix content
|
|
6135
6493
|
* - **suffix** - slot for suffix content
|
|
6136
6494
|
*
|
|
@@ -6159,7 +6517,7 @@ export type CustomElements = {
|
|
|
6159
6517
|
* - **close** - Dispatched when the tooltip closes.
|
|
6160
6518
|
*
|
|
6161
6519
|
* ### **Slots:**
|
|
6162
|
-
* - _default_ -
|
|
6520
|
+
* - _default_ - Noninteractive text or other descriptive content shown in the tooltip.
|
|
6163
6521
|
*
|
|
6164
6522
|
* ### **CSS Properties:**
|
|
6165
6523
|
* - **--border-radius** - undefined _(default: undefined)_
|