gridsmith-ui 0.24.0 → 0.26.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +8 -6
- package/dist/MentionList-CoNBRFGR.d.ts +8 -0
- package/dist/charts.d.ts +42 -1
- package/dist/charts.js +320 -89
- package/dist/charts.js.map +1 -1
- package/dist/chat.js +5 -4
- package/dist/chat.js.map +1 -1
- package/dist/{chunk-6XAU44U4.js → chunk-CYN5O567.js} +10 -23
- package/dist/chunk-CYN5O567.js.map +1 -0
- package/dist/{chunk-SBTBMAIU.js → chunk-EX64MN2U.js} +6 -6
- package/dist/{chunk-SBTBMAIU.js.map → chunk-EX64MN2U.js.map} +1 -1
- package/dist/chunk-HP7WUZPK.js +80 -0
- package/dist/chunk-HP7WUZPK.js.map +1 -0
- package/dist/{chunk-4LDYR7QP.js → chunk-HXVXJUGV.js} +53 -13
- package/dist/chunk-HXVXJUGV.js.map +1 -0
- package/dist/{chunk-MV7JXWXK.js → chunk-KWLNEH53.js} +8 -7
- package/dist/chunk-KWLNEH53.js.map +1 -0
- package/dist/{chunk-CXMV7SXJ.js → chunk-MD2EFMES.js} +5 -77
- package/dist/chunk-MD2EFMES.js.map +1 -0
- package/dist/{chunk-SVP2IG4S.js → chunk-MYIJNVTK.js} +7 -7
- package/dist/chunk-MYIJNVTK.js.map +1 -0
- package/dist/{chunk-IVCVNAXG.js → chunk-OTCEJN64.js} +3 -3
- package/dist/{chunk-IVCVNAXG.js.map → chunk-OTCEJN64.js.map} +1 -1
- package/dist/{chunk-2PWGJ4PK.js → chunk-QM4SJKWV.js} +11 -6
- package/dist/chunk-QM4SJKWV.js.map +1 -0
- package/dist/chunk-RWKCAKN3.js +209 -0
- package/dist/chunk-RWKCAKN3.js.map +1 -0
- package/dist/{chunk-2YSEME33.js → chunk-SFY2KMHG.js} +63 -6
- package/dist/chunk-SFY2KMHG.js.map +1 -0
- package/dist/{chunk-NCIZQYXQ.js → chunk-X2HEV7FB.js} +33 -3
- package/dist/chunk-X2HEV7FB.js.map +1 -0
- package/dist/{chunk-JXANCXK6.js → chunk-ZI3OQDET.js} +18 -4
- package/dist/chunk-ZI3OQDET.js.map +1 -0
- package/dist/{chunk-7TOJ4G7S.js → chunk-ZYVXV4WC.js} +14 -9
- package/dist/chunk-ZYVXV4WC.js.map +1 -0
- package/dist/data-grid.d.ts +1 -1
- package/dist/data-grid.js +13 -12
- package/dist/data-grid.js.map +1 -1
- package/dist/editor-mentions.d.ts +30 -0
- package/dist/editor-mentions.js +160 -0
- package/dist/editor-mentions.js.map +1 -0
- package/dist/editor.d.ts +23 -3
- package/dist/editor.js +58 -9
- package/dist/editor.js.map +1 -1
- package/dist/{feather-2JFSFLXN.js → feather-VFWLAILO.js} +12 -3
- package/dist/feather-VFWLAILO.js.map +1 -0
- package/dist/{heroicons-4AQ4YBVG.js → heroicons-H3Z7DFCF.js} +22 -7
- package/dist/heroicons-H3Z7DFCF.js.map +1 -0
- package/dist/icons.d.ts +11 -4
- package/dist/icons.js +1 -1
- package/dist/index.d.ts +202 -31
- package/dist/index.js +1473 -1181
- package/dist/index.js.map +1 -1
- package/dist/kanban.js +8 -8
- package/dist/kanban.js.map +1 -1
- package/dist/{lucide-RZC2FEMS.js → lucide-MR32KM4G.js} +12 -3
- package/dist/lucide-MR32KM4G.js.map +1 -0
- package/dist/{phosphor-CEN25FLM.js → phosphor-ABQQL5N5.js} +12 -3
- package/dist/phosphor-ABQQL5N5.js.map +1 -0
- package/dist/resizable.js +8 -8
- package/dist/roots.css +28 -0
- package/dist/{tabler-YXXC7Y6B.js → tabler-ANUSY4D2.js} +12 -3
- package/dist/tabler-ANUSY4D2.js.map +1 -0
- package/dist/tokens.css +6 -0
- package/dist/{use-pagination-DiJo0aW5.d.ts → use-pagination-BnKOnBdz.d.ts} +3 -0
- package/dist/virtualized.d.ts +1 -1
- package/dist/virtualized.js +7 -6
- package/dist/virtualized.js.map +1 -1
- package/dist-static/tokens.css +6 -0
- package/package.json +29 -21
- package/dist/chunk-2PWGJ4PK.js.map +0 -1
- package/dist/chunk-2YSEME33.js.map +0 -1
- package/dist/chunk-4LDYR7QP.js.map +0 -1
- package/dist/chunk-6XAU44U4.js.map +0 -1
- package/dist/chunk-7TOJ4G7S.js.map +0 -1
- package/dist/chunk-CXMV7SXJ.js.map +0 -1
- package/dist/chunk-JXANCXK6.js.map +0 -1
- package/dist/chunk-MV7JXWXK.js.map +0 -1
- package/dist/chunk-NCIZQYXQ.js.map +0 -1
- package/dist/chunk-SVP2IG4S.js.map +0 -1
- package/dist/chunk-WOVYHFUD.js +0 -50
- package/dist/chunk-WOVYHFUD.js.map +0 -1
- package/dist/feather-2JFSFLXN.js.map +0 -1
- package/dist/heroicons-4AQ4YBVG.js.map +0 -1
- package/dist/lucide-RZC2FEMS.js.map +0 -1
- package/dist/phosphor-CEN25FLM.js.map +0 -1
- package/dist/tabler-YXXC7Y6B.js.map +0 -1
package/dist/index.d.ts
CHANGED
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
2
|
import { ButtonHTMLAttributes, ReactNode, InputHTMLAttributes, LabelHTMLAttributes, TextareaHTMLAttributes, Ref, ReactElement, CSSProperties, HTMLAttributes, RefObject, KeyboardEvent, AnchorHTMLAttributes, ElementType } from 'react';
|
|
3
|
+
import { IconSlot, IconName } from './icons.js';
|
|
3
4
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
4
|
-
import {
|
|
5
|
+
import { M as MentionSuggestion } from './MentionList-CoNBRFGR.js';
|
|
5
6
|
import { C as ColumnKind, B as BreakpointKey } from './table-utils-BkjNEWts.js';
|
|
6
7
|
export { a as BreakpointWidthProvider, u as useBreakpoint } from './table-utils-BkjNEWts.js';
|
|
7
|
-
import { P as Pager, A as AppShellPreferences } from './use-pagination-
|
|
8
|
-
export { a as PaginationOptions, b as PreferencesContext, R as ResolvedPreferences, p as preferenceActionKey, u as usePagination, c as usePreferences } from './use-pagination-
|
|
8
|
+
import { P as Pager, A as AppShellPreferences } from './use-pagination-BnKOnBdz.js';
|
|
9
|
+
export { a as PaginationOptions, b as PreferencesContext, R as ResolvedPreferences, p as preferenceActionKey, u as usePagination, c as usePreferences } from './use-pagination-BnKOnBdz.js';
|
|
9
10
|
export { B as BreadcrumbItem, a as Breadcrumbs, b as BreadcrumbsSeparator, c as BreadcrumbsSize, d as BreadcrumbsVariant } from './Breadcrumbs-CGS8GKl-.js';
|
|
10
11
|
|
|
11
12
|
type ButtonVariant = "default" | "secondary" | "tertiary" | "outline" | "ghost" | "destructive" | "success" | "warning" | "link";
|
|
@@ -16,8 +17,10 @@ declare const ButtonSizeContext: react.Context<ControlSize | null>;
|
|
|
16
17
|
interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
17
18
|
variant?: ButtonVariant;
|
|
18
19
|
size?: ButtonSize;
|
|
19
|
-
|
|
20
|
-
|
|
20
|
+
/** An icon name ("clock"), drawn as the theme's icon at the button's icon size, or an element. Not text: use children. */
|
|
21
|
+
iconLeft?: IconSlot;
|
|
22
|
+
/** As iconLeft, after the label. */
|
|
23
|
+
iconRight?: IconSlot;
|
|
21
24
|
loading?: boolean;
|
|
22
25
|
children?: ReactNode;
|
|
23
26
|
}
|
|
@@ -193,6 +196,8 @@ interface ComboboxOption {
|
|
|
193
196
|
value: string;
|
|
194
197
|
label: string;
|
|
195
198
|
disabled?: boolean;
|
|
199
|
+
/** Words a search finds it by as well as its label, never shown (gridsmith-ui 0.26.0 or later): TimezoneSelect's renamed cities. */
|
|
200
|
+
keywords?: string;
|
|
196
201
|
}
|
|
197
202
|
interface ComboboxProps extends FieldControlWiring {
|
|
198
203
|
value: string;
|
|
@@ -206,8 +211,87 @@ interface ComboboxProps extends FieldControlWiring {
|
|
|
206
211
|
container?: Element | DocumentFragment;
|
|
207
212
|
error?: boolean;
|
|
208
213
|
size?: ControlSize;
|
|
214
|
+
/** The control's name when no Field labels it (a toolbar's filter). Inside a Field, the Field's label names it. */
|
|
215
|
+
"aria-label"?: string;
|
|
216
|
+
}
|
|
217
|
+
declare function Combobox({ value, onChange: onChangeProp, options, placeholder, disabled, loading, className, ref, container, error, size: sizeProp, "aria-label": ariaLabel, ...wiring }: ComboboxProps): react_jsx_runtime.JSX.Element;
|
|
218
|
+
|
|
219
|
+
/**
|
|
220
|
+
* The browser's own name for a zone (Sprint 25.17 A28, R28-51): one browser always names a zone one way, so a stored
|
|
221
|
+
* "Asia/Calcutta" and a listed "Asia/Kolkata" are one zone, with no alias table shipped. An id the browser doesn't know
|
|
222
|
+
* stays as given.
|
|
223
|
+
*/
|
|
224
|
+
declare function canonicalTimeZone(zone: string): string;
|
|
225
|
+
/** The browser's time zone, by its own name; "UTC" where the browser names none. */
|
|
226
|
+
declare function browserTimeZone(): string;
|
|
227
|
+
/**
|
|
228
|
+
* A zone's offset from UTC at an instant, as the page's language names it ("GMT+1", "GMT-5", "GMT+5:30"): read at that
|
|
229
|
+
* instant, so it follows daylight saving.
|
|
230
|
+
*/
|
|
231
|
+
declare function timeZoneOffset(zone: string, at?: Date): string;
|
|
232
|
+
interface TimezoneSelectProps extends FieldControlWiring {
|
|
233
|
+
/**
|
|
234
|
+
* The stored zone, an IANA id ("Europe/London"). Empty: the field is empty, and the browser's zone is the list's first
|
|
235
|
+
* option, marked as the user's, to pick with one key. Start the page's state from the stored zone, else
|
|
236
|
+
* browserTimeZone(), to show the browser's as chosen.
|
|
237
|
+
*/
|
|
238
|
+
value?: string;
|
|
239
|
+
/** Called with the chosen zone's id, by the browser's own name. */
|
|
240
|
+
onChange: (zone: string) => void;
|
|
241
|
+
size?: ControlSize;
|
|
242
|
+
disabled?: boolean;
|
|
243
|
+
placeholder?: string;
|
|
244
|
+
className?: string;
|
|
245
|
+
/** The control's name when no Field labels it. In a settings form, a Field labels it ("Time zone"). */
|
|
246
|
+
"aria-label"?: string;
|
|
247
|
+
}
|
|
248
|
+
/**
|
|
249
|
+
* A time zone select (Sprint 25.17 A28, R28-51): every IANA zone the browser knows, each shown with its offset now
|
|
250
|
+
* (which follows daylight saving), searchable by city, region or offset, with the house keyboard (the Combobox's).
|
|
251
|
+
* UTC is always offered. A stored zone is matched by the browser's own name for it, and one the browser doesn't list
|
|
252
|
+
* is still shown, never a blank.
|
|
253
|
+
*/
|
|
254
|
+
declare function TimezoneSelect({ value, onChange, placeholder, ...rest }: TimezoneSelectProps): react_jsx_runtime.JSX.Element;
|
|
255
|
+
|
|
256
|
+
/** A time: an ISO string, a Date, or milliseconds since the epoch. */
|
|
257
|
+
type TimeValue = string | Date | number;
|
|
258
|
+
/**
|
|
259
|
+
* A time as people read it (Sprint 25.17 A29, R28-48; date_time#1, #11 and #13): within `thresholdHours` of now,
|
|
260
|
+
* relative ("now", "5 minutes ago", "in 2 hours", "yesterday", counting days on the calendar), in the page's language;
|
|
261
|
+
* beyond it, the date and the time. The threshold is given: the project's is the shell's
|
|
262
|
+
* (dateTime.relativeThresholdHours), which RelativeTime and useRelativeTimeFormat read for you.
|
|
263
|
+
*/
|
|
264
|
+
declare function formatRelativeTime(time: TimeValue, options: {
|
|
265
|
+
thresholdHours: number;
|
|
266
|
+
now?: number;
|
|
267
|
+
}): string;
|
|
268
|
+
/**
|
|
269
|
+
* formatRelativeTime with the project's threshold, the shell's (dateTime.relativeThresholdHours), for a time drawn as
|
|
270
|
+
* text in a slot that takes a string: a Timeline item's `timestamp`, with the time itself as its `dateTime` so the exact
|
|
271
|
+
* time shows on hover. The text is read when the page renders; RelativeTime draws a time that refreshes as it ages.
|
|
272
|
+
*/
|
|
273
|
+
declare function useRelativeTimeFormat(): (time: TimeValue) => string;
|
|
274
|
+
/** The full timestamp, as the tooltip and a screen reader give it: the date, the time and its zone, in the page's language. */
|
|
275
|
+
declare function formatFullTime(time: TimeValue): string;
|
|
276
|
+
interface RelativeTimeProps {
|
|
277
|
+
/** The time: an ISO string, a Date, or milliseconds since the epoch. */
|
|
278
|
+
time: TimeValue;
|
|
279
|
+
/** Within this many hours it reads relative, else the date and time. Leave it out: the project's (the shell's dateTime.relativeThresholdHours). */
|
|
280
|
+
thresholdHours?: number;
|
|
281
|
+
/** The time's own classes (its colour, its size); the tooltip keeps the library's. */
|
|
282
|
+
className?: string;
|
|
209
283
|
}
|
|
210
|
-
|
|
284
|
+
/**
|
|
285
|
+
* A time drawn as the project reads times (Sprint 25.17 A29, R28-48): relative within the project's threshold, the date
|
|
286
|
+
* and time beyond it, and the full timestamp, with its zone, on hover and, outside a collection's rows, on focus
|
|
287
|
+
* (date_time#1, #2, #13). Outside them it is a Tab stop; among a table's, a list's or a grid's rows it isn't (a stop per
|
|
288
|
+
* row would make the collection hard to cross, and nest a stop in a row that is a button), and a screen reader hears the
|
|
289
|
+
* full timestamp with the time everywhere. It refreshes as it ages, each minute in its first hour and each hour after,
|
|
290
|
+
* and becomes the date and time once past the threshold; a time that changes is read against the clock afresh. Drawn on a
|
|
291
|
+
* server, the browser's reading of the clock replaces the server's when the page hydrates, with no error for the moment
|
|
292
|
+
* between them. In a sortable Table column, pass the time itself as the column's sort value.
|
|
293
|
+
*/
|
|
294
|
+
declare function RelativeTime({ time, thresholdHours, className }: RelativeTimeProps): react_jsx_runtime.JSX.Element | null;
|
|
211
295
|
|
|
212
296
|
type CheckboxSize = "sm" | "md";
|
|
213
297
|
/** A Field passes its wiring (0.21.0): its label names the box, and its hint and error describe it. */
|
|
@@ -660,13 +744,7 @@ interface TransferListProps {
|
|
|
660
744
|
}
|
|
661
745
|
declare function TransferList({ available, selected, onChange: onChangeProp, availableTitle, selectedTitle, searchable, className, ref, }: TransferListProps): react_jsx_runtime.JSX.Element;
|
|
662
746
|
|
|
663
|
-
interface
|
|
664
|
-
id: string;
|
|
665
|
-
label: string;
|
|
666
|
-
avatar?: string;
|
|
667
|
-
description?: string;
|
|
668
|
-
}
|
|
669
|
-
interface MentionInputProps {
|
|
747
|
+
interface MentionInputProps extends FieldControlWiring {
|
|
670
748
|
value?: string;
|
|
671
749
|
onChange?: (value: string) => void;
|
|
672
750
|
suggestions: MentionSuggestion[];
|
|
@@ -674,8 +752,10 @@ interface MentionInputProps {
|
|
|
674
752
|
placeholder?: string;
|
|
675
753
|
disabled?: boolean;
|
|
676
754
|
className?: string;
|
|
755
|
+
/** The field's name when no Field labels it. Inside a Field, the Field's label names it. */
|
|
756
|
+
"aria-label"?: string;
|
|
677
757
|
}
|
|
678
|
-
declare function MentionInput({ value: controlledValue, onChange: onChangeProp, suggestions, trigger, placeholder, disabled, className, }: MentionInputProps): react_jsx_runtime.JSX.Element;
|
|
758
|
+
declare function MentionInput({ value: controlledValue, onChange: onChangeProp, suggestions, trigger, placeholder, disabled, className, error, "aria-label": ariaLabel, ...wiring }: MentionInputProps): react_jsx_runtime.JSX.Element;
|
|
679
759
|
|
|
680
760
|
type CardVariant = "default" | "featured" | "interactive" | "outline" | "ghost";
|
|
681
761
|
type CardSelectType = "radio" | "checkbox" | "toggle";
|
|
@@ -866,9 +946,11 @@ interface Column {
|
|
|
866
946
|
* What the column sorts by, when its cells don't say (Sprint 25.13 A3): a column of elements (an avatar beside a name,
|
|
867
947
|
* a badge, a time) gives each row's name, number or date here, `sortValue: (row) => row.actorName`, and a column of
|
|
868
948
|
* sizes gives bytes. Without it a sortable column sorts by the cell itself, which works for text and numbers; a cell
|
|
869
|
-
* that is an element can't be compared, and the column warns in development (data_display#1).
|
|
949
|
+
* that is an element can't be compared, and the column warns in development (data_display#1). It may return any of a
|
|
950
|
+
* row's fields as they are (a row's values are typed for its cells): a string, a number or a Date sorts; an element
|
|
951
|
+
* doesn't.
|
|
870
952
|
*/
|
|
871
|
-
sortValue?: (row: TableRow) =>
|
|
953
|
+
sortValue?: (row: TableRow) => unknown;
|
|
872
954
|
/**
|
|
873
955
|
* Keep the column in view while the table scrolls sideways (Sprint 25.13 A35): "end" for the row's actions, pinned on
|
|
874
956
|
* the right; "start" for the row's name, drawn first and pinned beside the selection while it leaves room. Without a
|
|
@@ -969,19 +1051,53 @@ interface TableProps {
|
|
|
969
1051
|
}
|
|
970
1052
|
declare function Table({ columns: columnsProp, data, className, sortable, sortKey: controlledSortKey, sortDir: controlledSortDir, onSortChange, selectable, selectedRows, onSelectionChange, expandable, renderExpanded, rowKey, expandedRows: expandedRowsProp, defaultExpandedRows, onExpandedChange, density, stickyHeader, striped, loading, emptyState, onRowClick, mobileBreakpoint: mobileBreakpointProp, cardsBelow, pager, title, description, actions, "aria-label": ariaLabel, ref, }: TableProps): string | number | bigint | boolean | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null | undefined;
|
|
971
1053
|
|
|
1054
|
+
/** Someone attending an event: their name shows in the event's card (gridsmith-ui 0.26.0 or later). */
|
|
1055
|
+
interface CalendarEventAttendee {
|
|
1056
|
+
name: string;
|
|
1057
|
+
/** Shown in their avatar; their name's initials when left out. */
|
|
1058
|
+
initials?: string;
|
|
1059
|
+
}
|
|
972
1060
|
interface CalendarEvent {
|
|
973
1061
|
id: string;
|
|
974
1062
|
title: string;
|
|
975
1063
|
start: Date;
|
|
1064
|
+
/**
|
|
1065
|
+
* An all-day event's last day ("7 to 9 September" ends on the 9th); a timed event's end, which it doesn't include:
|
|
1066
|
+
* one ending at midnight ends the day before.
|
|
1067
|
+
*/
|
|
976
1068
|
end?: Date;
|
|
977
1069
|
allDay?: boolean;
|
|
1070
|
+
/** A key of the Calendar's `categories`. */
|
|
978
1071
|
category?: string;
|
|
979
1072
|
description?: string;
|
|
980
1073
|
location?: string;
|
|
1074
|
+
/** The people attending, named in the event's card (gridsmith-ui 0.26.0 or later). */
|
|
1075
|
+
attendees?: CalendarEventAttendee[];
|
|
981
1076
|
}
|
|
1077
|
+
/**
|
|
1078
|
+
* An event type's colour (gridsmith-ui 0.26.0 or later): one of the theme's supporting colours by number (1 to 5, as
|
|
1079
|
+
* Badge's palette colours), "accent" or "neutral". Its events draw in that colour's readable pair, as a rota's shifts do:
|
|
1080
|
+
* the pale fill, the deep text, the colour on the edge. A supporting colour's token written as a CSS colour
|
|
1081
|
+
* ("var(--ds-palette-2-bold)") is read as that colour, and so is a chart colour ("var(--ds-chart-1)" the accent,
|
|
1082
|
+
* "var(--ds-chart-3)" supporting colour 2), so a legend can draw the same string; any other CSS colour draws on the
|
|
1083
|
+
* neutral pair, the colour on its edge only, so its text always reads.
|
|
1084
|
+
*/
|
|
1085
|
+
type CalendarColour = number | "accent" | "neutral" | (string & {});
|
|
982
1086
|
interface EventCategory {
|
|
983
|
-
color:
|
|
1087
|
+
color: CalendarColour;
|
|
1088
|
+
label: string;
|
|
1089
|
+
}
|
|
1090
|
+
/** A button in an event's card (gridsmith-ui 0.26.0 or later): the card closes, gives focus back to the event, then runs it. */
|
|
1091
|
+
interface CalendarEventAction {
|
|
984
1092
|
label: string;
|
|
1093
|
+
onClick: (event: CalendarEvent) => void;
|
|
1094
|
+
variant?: "default" | "secondary" | "outline" | "ghost" | "destructive";
|
|
1095
|
+
/** An icon name ("edit"), drawn as the theme's icon, or an element. */
|
|
1096
|
+
iconLeft?: IconSlot;
|
|
1097
|
+
}
|
|
1098
|
+
/** Where a day or a time was chosen: `time` is "HH:mm", from the week view's hours (an hour's lower half gives :30). */
|
|
1099
|
+
interface CalendarDayClickDetail {
|
|
1100
|
+
time?: string;
|
|
985
1101
|
}
|
|
986
1102
|
type CalendarView = "month" | "week" | "year";
|
|
987
1103
|
type CalendarSize = "default" | "compact";
|
|
@@ -997,15 +1113,28 @@ interface CalendarProps {
|
|
|
997
1113
|
start: Date;
|
|
998
1114
|
end: Date;
|
|
999
1115
|
}) => void;
|
|
1116
|
+
/**
|
|
1117
|
+
* A page that opens its own surface for an event (a page of its own, a drawer): the Calendar's card is then not shown.
|
|
1118
|
+
* Leave it out for the card, and put the page's buttons in `eventActions`.
|
|
1119
|
+
*/
|
|
1000
1120
|
onEventClick?: (event: CalendarEvent) => void;
|
|
1001
|
-
|
|
1121
|
+
/**
|
|
1122
|
+
* A day or a time chosen to start an event: a month's day, a week's day, or (gridsmith-ui 0.26.0 or later) a week's
|
|
1123
|
+
* hour, with its time. `date` is the day at midnight. By keyboard: Enter or Space on a day or an hour.
|
|
1124
|
+
*/
|
|
1125
|
+
onDayClick?: (date: Date, detail?: CalendarDayClickDetail) => void;
|
|
1126
|
+
/**
|
|
1127
|
+
* The buttons in an event's card (gridsmith-ui 0.26.0 or later), where Edit goes: the same for every event, or worked
|
|
1128
|
+
* out for each (none for one the user can't change).
|
|
1129
|
+
*/
|
|
1130
|
+
eventActions?: CalendarEventAction[] | ((event: CalendarEvent) => CalendarEventAction[]);
|
|
1002
1131
|
categories?: Record<string, EventCategory>;
|
|
1003
1132
|
weekStartsOn?: 0 | 1;
|
|
1004
1133
|
size?: CalendarSize;
|
|
1005
1134
|
className?: string;
|
|
1006
1135
|
}
|
|
1007
1136
|
|
|
1008
|
-
declare function Calendar({ events, view: controlledView, defaultView, onViewChange, date: controlledDate, defaultDate, onDateChange, onDateRangeChange, onEventClick, onDayClick, categories, weekStartsOn, size, className, }: CalendarProps): react_jsx_runtime.JSX.Element;
|
|
1137
|
+
declare function Calendar({ events, view: controlledView, defaultView, onViewChange, date: controlledDate, defaultDate, onDateChange, onDateRangeChange, onEventClick, onDayClick, eventActions, categories, weekStartsOn, size, className, }: CalendarProps): react_jsx_runtime.JSX.Element;
|
|
1009
1138
|
|
|
1010
1139
|
type BadgeVariant = "default" | "neutral" | "subtle" | "success" | "success-soft" | "warning" | "warning-soft" | "error" | "error-soft" | "outline";
|
|
1011
1140
|
type BadgeSize = "xs" | "sm" | "md";
|
|
@@ -1098,9 +1227,11 @@ interface EmptyStateProps {
|
|
|
1098
1227
|
* An icon name from the theme's pack ("inbox", "filter") or an element. A
|
|
1099
1228
|
* name is the easy path: the state renders it at the frame's size. An `Icon`
|
|
1100
1229
|
* element is resized to match; any other element is rendered as given. A
|
|
1101
|
-
* string
|
|
1102
|
-
*
|
|
1103
|
-
*
|
|
1230
|
+
* string is always read as a name, never printed as a word (the Sprint 22
|
|
1231
|
+
* bench saw builders pass names into a ReactNode prop and React print the
|
|
1232
|
+
* word — 14 Sep 2026). `IconName` takes any string, so a name the theme's
|
|
1233
|
+
* pack lacks still type-checks: it draws nothing, and in development the Icon
|
|
1234
|
+
* says so (Sprint 25.17 A26).
|
|
1104
1235
|
*/
|
|
1105
1236
|
icon?: IconName | Exclude<ReactNode, string>;
|
|
1106
1237
|
/** How the icon is framed: the neutral circle (default), or none when the icon element brings its own frame. */
|
|
@@ -1223,7 +1354,14 @@ declare function TableToolbar({ search, primaryFilter, filters, filtersOpen, onF
|
|
|
1223
1354
|
interface TimelineItem {
|
|
1224
1355
|
title: string;
|
|
1225
1356
|
description?: string;
|
|
1226
|
-
/**
|
|
1357
|
+
/**
|
|
1358
|
+
* When it happened (an ISO string, a Date or milliseconds), drawn as the project reads times, with RelativeTime:
|
|
1359
|
+
* relative within the shell's threshold, the date and time beyond it, the full timestamp on hover, refreshing as it
|
|
1360
|
+
* ages (Sprint 25.17's second review: a time the page formatted itself read differently on a server and in the browser,
|
|
1361
|
+
* and read the date twice to a screen reader). With `time`, leave timestamp and dateTime out.
|
|
1362
|
+
*/
|
|
1363
|
+
time?: TimeValue;
|
|
1364
|
+
/** What the item shows for its time, as text the page wrote: "Mon 14:05". For a time ago, pass `time`. */
|
|
1227
1365
|
timestamp?: string;
|
|
1228
1366
|
/**
|
|
1229
1367
|
* The item's exact time (an ISO string or a Date). The timestamp is then a <time> element, with the exact date and
|
|
@@ -1231,8 +1369,11 @@ interface TimelineItem {
|
|
|
1231
1369
|
* "2 hours ago" with no way to the date). Without a timestamp, the exact date is shown.
|
|
1232
1370
|
*/
|
|
1233
1371
|
dateTime?: string | Date;
|
|
1234
|
-
/**
|
|
1235
|
-
|
|
1372
|
+
/**
|
|
1373
|
+
* Takes the dot's place — the actor's Avatar (size="sm") on an activity feed, or an icon: its name ("upload"), drawn as
|
|
1374
|
+
* the theme's icon at 16 px, or an element. `variant` colours the dot only.
|
|
1375
|
+
*/
|
|
1376
|
+
icon?: IconSlot;
|
|
1236
1377
|
variant?: "default" | "success" | "warning" | "error";
|
|
1237
1378
|
}
|
|
1238
1379
|
interface TimelineProps {
|
|
@@ -1669,7 +1810,7 @@ interface TimeScaleOptions {
|
|
|
1669
1810
|
today?: DateInput;
|
|
1670
1811
|
/** Default 1 (Monday), as Calendar's. */
|
|
1671
1812
|
weekStartsOn?: 0 | 1;
|
|
1672
|
-
/** Default the
|
|
1813
|
+
/** Default the page's language (its `lang`, in the visitor's formats where they speak it: formatLocale). */
|
|
1673
1814
|
locale?: string;
|
|
1674
1815
|
/** Px per day at each level, where a view needs another density (the defaults fit each level's labels). */
|
|
1675
1816
|
pxPerDay?: Partial<Record<TimeZoom, number>>;
|
|
@@ -2028,7 +2169,7 @@ interface GanttProps<T extends GanttItem = GanttItem> {
|
|
|
2028
2169
|
today?: DateInput;
|
|
2029
2170
|
/** Default 1 (Monday), as Calendar's. */
|
|
2030
2171
|
weekStartsOn?: 0 | 1;
|
|
2031
|
-
/** Default the
|
|
2172
|
+
/** Default the page's language (its `lang`, in the visitor's formats where they speak it): the scale's labels and the items' dates. */
|
|
2032
2173
|
locale?: string;
|
|
2033
2174
|
/**
|
|
2034
2175
|
* Beside the title in the name column (assignees' avatars): shown, not announced (say it in `describe`), and left out
|
|
@@ -2083,8 +2224,10 @@ interface LinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
|
|
|
2083
2224
|
* strict TypeScript (Sprint 25.16 A19).
|
|
2084
2225
|
*/
|
|
2085
2226
|
component?: ElementType;
|
|
2086
|
-
|
|
2087
|
-
|
|
2227
|
+
/** An icon name ("info"), drawn as the theme's icon at 14 px, or an element. Not text: use children. */
|
|
2228
|
+
iconLeft?: IconSlot;
|
|
2229
|
+
/** As iconLeft, after the label. */
|
|
2230
|
+
iconRight?: IconSlot;
|
|
2088
2231
|
}
|
|
2089
2232
|
/**
|
|
2090
2233
|
* Navigation link. Renders a real <a> (or a router link via `component`) so
|
|
@@ -2884,7 +3027,8 @@ interface AlertAction {
|
|
|
2884
3027
|
label: string;
|
|
2885
3028
|
onClick: () => void;
|
|
2886
3029
|
variant?: "secondary" | "outline";
|
|
2887
|
-
|
|
3030
|
+
/** An icon name ("refresh"), drawn as the theme's icon at 14 px, or an element. */
|
|
3031
|
+
iconLeft?: IconSlot;
|
|
2888
3032
|
}
|
|
2889
3033
|
interface AlertProps {
|
|
2890
3034
|
variant: AlertVariant;
|
|
@@ -3492,6 +3636,8 @@ interface SectionHeadingProps {
|
|
|
3492
3636
|
onTitleChange?: (title: string) => void;
|
|
3493
3637
|
/** The editable title's name for a screen reader, what it is the title of ("Document title"). Default "Title". */
|
|
3494
3638
|
titleLabel?: string;
|
|
3639
|
+
/** The heading's id, for a section named by its heading (`aria-labelledby`). */
|
|
3640
|
+
titleId?: string;
|
|
3495
3641
|
description?: string;
|
|
3496
3642
|
/** The section's buttons. Below sm they sit under the title, like PageHeader's actions. */
|
|
3497
3643
|
actions?: ReactNode;
|
|
@@ -3527,6 +3673,31 @@ interface ActionPanelGroupProps {
|
|
|
3527
3673
|
}
|
|
3528
3674
|
declare const ActionPanelGroup: react.ForwardRefExoticComponent<ActionPanelGroupProps & react.RefAttributes<HTMLDivElement>>;
|
|
3529
3675
|
|
|
3676
|
+
interface DangerZoneProps {
|
|
3677
|
+
/** The section's heading. Default "Danger zone". */
|
|
3678
|
+
title?: string;
|
|
3679
|
+
/** A line under the heading ("Irreversible actions for this project"). */
|
|
3680
|
+
description?: string;
|
|
3681
|
+
/**
|
|
3682
|
+
* One ActionPanel per action: what the action does and what it costs, and its destructive Button that opens the
|
|
3683
|
+
* confirmation (destructive_actions#3).
|
|
3684
|
+
*/
|
|
3685
|
+
children: ReactNode;
|
|
3686
|
+
className?: string;
|
|
3687
|
+
}
|
|
3688
|
+
/**
|
|
3689
|
+
* A danger zone (Sprint 25.17 A39, R28-75; destructive_actions#7): the page's last section, holding its irreversible
|
|
3690
|
+
* actions. Its heading, then a frame drawn as a Card is, in the error colour, with one row per action, divided:
|
|
3691
|
+
*
|
|
3692
|
+
* <DangerZone>
|
|
3693
|
+
* <ActionPanel title="Delete project" description="Removes the project and its tasks. This can't be undone."
|
|
3694
|
+
* action={<Button variant="destructive" onClick={confirm}>Delete project</Button>} />
|
|
3695
|
+
* </DangerZone>
|
|
3696
|
+
*
|
|
3697
|
+
* The rows sit at a card's inset, so they line up with the cards above it.
|
|
3698
|
+
*/
|
|
3699
|
+
declare function DangerZone({ title, description, children, className }: DangerZoneProps): react_jsx_runtime.JSX.Element;
|
|
3700
|
+
|
|
3530
3701
|
interface TextOverflowProps {
|
|
3531
3702
|
/** Max visible lines before truncation. 1 = single-line ellipsis, >1 = line-clamp-N. */
|
|
3532
3703
|
lines?: number;
|
|
@@ -3571,4 +3742,4 @@ interface UseTextOverflowResult {
|
|
|
3571
3742
|
*/
|
|
3572
3743
|
declare function useTextOverflow(options?: UseTextOverflowOptions): UseTextOverflowResult;
|
|
3573
3744
|
|
|
3574
|
-
export { Accordion, ActionPanel, ActionPanelGroup, AddAnother, type AddAnotherProps, Alert, type AlertPlacement, AppShell, type AppShellContextValue, type AppShellFocus, AppShellPreferences, type AppShellTheme, AsidePanel, type AsidePanelProps, type AsidePanelSide, Avatar, AvatarGroup, type AvatarGroupItem, type AvatarGroupProps, type AvatarStatus, Badge, type BadgePaletteColor, type BadgeSeverity, type BadgeSize, type BadgeVariant, BottomNav, type BottomNavItem, BreakpointKey, BulkActionBar, Button, ButtonSizeContext, Calendar, type CalendarDay, Card, CardContent, CardDescription, CardFooter, CardGrid, type CardGridProps, CardHeader, type CardSelectType, CardTitle, type CardVariant, Carousel, type ChatMessage, type ChatMessageAction, type ChatMessageLayout, ChatMessageList, type ChatMessageSender, type ChatMessageSource, type ChatMessageStatus, ChatPanel, type ChatPanelProps, type ChatPanelStatusTone, Checkbox, CheckboxGroup, CheckboxGroupItem, CodeBlock, Collapsible, ColorPicker, type Column, Combobox, CommandPalette, ContextMenu, type ControlSize, ControlSizeContext, CornerPanel, type CornerPanelEdge, type CornerPanelProps, DEFAULT_DATE_RANGE_PRESETS, DataList, type DateInput, DatePicker, type DateRange, DateRangePicker, type DateRangePickerProps, type DateRangePreset, type DateRangeWords, type DescriptionItem, DescriptionList, type DescriptionListOrientation, type DescriptionListSize, type DestructiveActionHandle, type DestructiveActionOptions, Dialog, Divider, Dock, Drawer, Dropdown, DropdownMenu, type DropdownMenuDivider, type DropdownMenuEntry, type DropdownMenuItem, EmptyState, EntityCell, Field, type FieldControlProps, type FieldLabel, type FieldProps, FileUpload, type FileUploadItem, type FileUploadRequestOptions, type FileUploadStatus, type FitLabelsOptions, type FittedLabel, type FlowNavigate, type FlowProgress, FlowSaved, type FlowSavedProps, type FlowStep, type FlowSteps, FormWrapper, Gantt, type GanttGroup, type GanttItem, type GanttProps, type GanttStatus, type GanttTone, type GridKeyboard, type GridKeyboardOptions, HoverCard, InlineFieldError, Input, Kbd, Label, type LabelBox, Launcher, type LauncherEdge, type LauncherProps, type LauncherVariant, type LauncherWhenOpen, Link, type LinkProps, MentionInput, MobileHeaderMenu, type MobileHeaderMenuItemData, type MobileHeaderMenuType, NavItem, type NavItemProps, type NavItemType, NavMenu, type NavMenuItem, Navbar, type NavbarSize, type NavbarType, type NavbarVariant, NotificationCenter, NumberInput, PageActions, PageContainer, type PageContainerWidth, PageHeader, type PageHeaderBehavior, type PageHeaderIntensity, type PageHeaderProps, type PageHeaderVariant, Pager, Pagination, PinInput, Popover, Progress, type PromiseToastMessages, RadioGroup, Rating, ScrollArea, SectionHeading, type SectionHeadingProps, SegmentedControl, SettingsLayout, type SettingsLayoutProps, type SettingsSection, Sheet, Sidebar, type SidebarContextValue, type SidebarItem, SidebarNav, type SidebarNavSize, type SidebarPosition, type SidebarSection, type SidebarType, Skeleton, SkipLink, SliderRange, type SortDir, Spinner, StackedList, type StackedListVariant, StatsCard, StatusDot, type StatusDotVariant, Stepper, TIME_ZOOMS, type Tab, Table, type TableDensity, type TableProps, type TableRow, TableToolbar, type TableToolbarActiveFilter, type TableToolbarFilterOption, Tabs, Tag, TagInput, type TagPaletteColor, type TagVariant, TextOverflow, type TextOverflowProps, Textarea, TimeBar, type TimeBarProps, TimePicker, TimeRow, type TimeRowProps, type TimeScale, TimeScaleHeader, type TimeScaleHeaderProps, type TimeScaleOptions, type TimeTick, TimeViewport, type TimeViewportHandle, type TimeViewportLayout, type TimeViewportProps, type TimeViewportState, type TimeZoom, Timeline, Toast, type ToastAction, type ToastApi, type ToastOptions, type ToastPosition, ToastProvider, type ToastVariant, Toggle, Tooltip, Tour, TransferList, TreeView, type Trend, type UseFlowStepsOptions, type UseTextOverflowOptions, type UseTextOverflowResult, dateOfDay, dayOf, endDayOf, fitLabel, fitLabels, formatDateRange, readFlowProgress, timeExtent, useAppShell, useContentWidth, useDestructiveAction, useFittedLabels, useFlowSteps, useFormContext, useGridKeyboard, useSidebar, useTextMeasure, useTextOverflow, useTimeScale, useTimeViewport, useTimeViewportLayout, useToast, useToastOptional, useUnsavedChanges };
|
|
3745
|
+
export { Accordion, ActionPanel, ActionPanelGroup, AddAnother, type AddAnotherProps, Alert, type AlertPlacement, AppShell, type AppShellContextValue, type AppShellFocus, AppShellPreferences, type AppShellTheme, AsidePanel, type AsidePanelProps, type AsidePanelSide, Avatar, AvatarGroup, type AvatarGroupItem, type AvatarGroupProps, type AvatarStatus, Badge, type BadgePaletteColor, type BadgeSeverity, type BadgeSize, type BadgeVariant, BottomNav, type BottomNavItem, BreakpointKey, BulkActionBar, Button, ButtonSizeContext, Calendar, type CalendarColour, type CalendarDay, type CalendarDayClickDetail, type CalendarEvent, type CalendarEventAction, type CalendarEventAttendee, type CalendarProps, type CalendarSize, type CalendarView, Card, CardContent, CardDescription, CardFooter, CardGrid, type CardGridProps, CardHeader, type CardSelectType, CardTitle, type CardVariant, Carousel, type ChatMessage, type ChatMessageAction, type ChatMessageLayout, ChatMessageList, type ChatMessageSender, type ChatMessageSource, type ChatMessageStatus, ChatPanel, type ChatPanelProps, type ChatPanelStatusTone, Checkbox, CheckboxGroup, CheckboxGroupItem, CodeBlock, Collapsible, ColorPicker, type Column, Combobox, CommandPalette, ContextMenu, type ControlSize, ControlSizeContext, CornerPanel, type CornerPanelEdge, type CornerPanelProps, DEFAULT_DATE_RANGE_PRESETS, DangerZone, type DangerZoneProps, DataList, type DateInput, DatePicker, type DateRange, DateRangePicker, type DateRangePickerProps, type DateRangePreset, type DateRangeWords, type DescriptionItem, DescriptionList, type DescriptionListOrientation, type DescriptionListSize, type DestructiveActionHandle, type DestructiveActionOptions, Dialog, Divider, Dock, Drawer, Dropdown, DropdownMenu, type DropdownMenuDivider, type DropdownMenuEntry, type DropdownMenuItem, EmptyState, EntityCell, type EventCategory, Field, type FieldControlProps, type FieldLabel, type FieldProps, FileUpload, type FileUploadItem, type FileUploadRequestOptions, type FileUploadStatus, type FitLabelsOptions, type FittedLabel, type FlowNavigate, type FlowProgress, FlowSaved, type FlowSavedProps, type FlowStep, type FlowSteps, FormWrapper, Gantt, type GanttGroup, type GanttItem, type GanttProps, type GanttStatus, type GanttTone, type GridKeyboard, type GridKeyboardOptions, HoverCard, InlineFieldError, Input, Kbd, Label, type LabelBox, Launcher, type LauncherEdge, type LauncherProps, type LauncherVariant, type LauncherWhenOpen, Link, type LinkProps, MentionInput, type MentionInputProps, MentionSuggestion, MobileHeaderMenu, type MobileHeaderMenuItemData, type MobileHeaderMenuType, NavItem, type NavItemProps, type NavItemType, NavMenu, type NavMenuItem, Navbar, type NavbarSize, type NavbarType, type NavbarVariant, NotificationCenter, NumberInput, PageActions, PageContainer, type PageContainerWidth, PageHeader, type PageHeaderBehavior, type PageHeaderIntensity, type PageHeaderProps, type PageHeaderVariant, Pager, Pagination, PinInput, Popover, Progress, type PromiseToastMessages, RadioGroup, Rating, RelativeTime, type RelativeTimeProps, ScrollArea, SectionHeading, type SectionHeadingProps, SegmentedControl, SettingsLayout, type SettingsLayoutProps, type SettingsSection, Sheet, Sidebar, type SidebarContextValue, type SidebarItem, SidebarNav, type SidebarNavSize, type SidebarPosition, type SidebarSection, type SidebarType, Skeleton, SkipLink, SliderRange, type SortDir, Spinner, StackedList, type StackedListVariant, StatsCard, StatusDot, type StatusDotVariant, Stepper, TIME_ZOOMS, type Tab, Table, type TableDensity, type TableProps, type TableRow, TableToolbar, type TableToolbarActiveFilter, type TableToolbarFilterOption, Tabs, Tag, TagInput, type TagPaletteColor, type TagVariant, TextOverflow, type TextOverflowProps, Textarea, TimeBar, type TimeBarProps, TimePicker, TimeRow, type TimeRowProps, type TimeScale, TimeScaleHeader, type TimeScaleHeaderProps, type TimeScaleOptions, type TimeTick, type TimeValue, TimeViewport, type TimeViewportHandle, type TimeViewportLayout, type TimeViewportProps, type TimeViewportState, type TimeZoom, Timeline, TimezoneSelect, type TimezoneSelectProps, Toast, type ToastAction, type ToastApi, type ToastOptions, type ToastPosition, ToastProvider, type ToastVariant, Toggle, Tooltip, Tour, TransferList, TreeView, type Trend, type UseFlowStepsOptions, type UseTextOverflowOptions, type UseTextOverflowResult, browserTimeZone, canonicalTimeZone, dateOfDay, dayOf, endDayOf, fitLabel, fitLabels, formatDateRange, formatFullTime, formatRelativeTime, readFlowProgress, timeExtent, timeZoneOffset, useAppShell, useContentWidth, useDestructiveAction, useFittedLabels, useFlowSteps, useFormContext, useGridKeyboard, useRelativeTimeFormat, useSidebar, useTextMeasure, useTextOverflow, useTimeScale, useTimeViewport, useTimeViewportLayout, useToast, useToastOptional, useUnsavedChanges };
|