@voxel51/voodo 2.9.0 → 2.10.0-app-revamp.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/dist/components/Avatar/Avatar.d.ts +32 -2
- package/dist/components/Avatar/Avatar.d.ts.map +1 -1
- package/dist/components/Button/Button.d.ts.map +1 -1
- package/dist/components/Checkbox/Checkbox.d.ts.map +1 -1
- package/dist/components/ChipSelect/ChipSelect.d.ts +51 -0
- package/dist/components/ChipSelect/ChipSelect.d.ts.map +1 -0
- package/dist/components/ChipSelect/index.d.ts +2 -0
- package/dist/components/ChipSelect/index.d.ts.map +1 -0
- package/dist/components/CodeBlock/CodeBlock.d.ts +29 -0
- package/dist/components/CodeBlock/CodeBlock.d.ts.map +1 -0
- package/dist/components/CodeBlock/index.d.ts +2 -0
- package/dist/components/CodeBlock/index.d.ts.map +1 -0
- package/dist/components/CodeEditor/CodeEditor.d.ts +46 -0
- package/dist/components/CodeEditor/CodeEditor.d.ts.map +1 -0
- package/dist/components/CodeEditor/index.d.ts +2 -0
- package/dist/components/CodeEditor/index.d.ts.map +1 -0
- package/dist/components/Combobox/Combobox.d.ts +28 -4
- package/dist/components/Combobox/Combobox.d.ts.map +1 -1
- package/dist/components/Dropdown/DropdownTrigger.d.ts +10 -4
- package/dist/components/Dropdown/DropdownTrigger.d.ts.map +1 -1
- package/dist/components/EmptyArt/EmptyArt.d.ts +96 -0
- package/dist/components/EmptyArt/EmptyArt.d.ts.map +1 -0
- package/dist/components/EmptyArt/index.d.ts +2 -0
- package/dist/components/EmptyArt/index.d.ts.map +1 -0
- package/dist/components/EmptyState/EmptyState.d.ts +21 -1
- package/dist/components/EmptyState/EmptyState.d.ts.map +1 -1
- package/dist/components/FilterBar/FilterBar.d.ts +33 -0
- package/dist/components/FilterBar/FilterBar.d.ts.map +1 -0
- package/dist/components/FilterBar/index.d.ts +2 -0
- package/dist/components/FilterBar/index.d.ts.map +1 -0
- package/dist/components/FilterChip/FilterChip.d.ts +28 -0
- package/dist/components/FilterChip/FilterChip.d.ts.map +1 -0
- package/dist/components/FilterChip/index.d.ts +2 -0
- package/dist/components/FilterChip/index.d.ts.map +1 -0
- package/dist/components/IconAction/IconAction.d.ts +9 -2
- package/dist/components/IconAction/IconAction.d.ts.map +1 -1
- package/dist/components/Icons/icons.d.ts +33 -1
- package/dist/components/Icons/icons.d.ts.map +1 -1
- package/dist/components/Input/Input.d.ts +5 -1
- package/dist/components/Input/Input.d.ts.map +1 -1
- package/dist/components/Input/SearchInput.d.ts +53 -0
- package/dist/components/Input/SearchInput.d.ts.map +1 -0
- package/dist/components/Input/index.d.ts +1 -0
- package/dist/components/Input/index.d.ts.map +1 -1
- package/dist/components/ListItem/ListItem.d.ts +5 -1
- package/dist/components/ListItem/ListItem.d.ts.map +1 -1
- package/dist/components/ListRow/ListRow.d.ts +36 -0
- package/dist/components/ListRow/ListRow.d.ts.map +1 -0
- package/dist/components/ListRow/index.d.ts +2 -0
- package/dist/components/ListRow/index.d.ts.map +1 -0
- package/dist/components/LiveToggle/LiveToggle.d.ts +39 -0
- package/dist/components/LiveToggle/LiveToggle.d.ts.map +1 -0
- package/dist/components/LiveToggle/index.d.ts +2 -0
- package/dist/components/LiveToggle/index.d.ts.map +1 -0
- package/dist/components/Menu/MenuCheckItem.d.ts +15 -0
- package/dist/components/Menu/MenuCheckItem.d.ts.map +1 -1
- package/dist/components/Modal/Modal.d.ts +42 -0
- package/dist/components/Modal/Modal.d.ts.map +1 -1
- package/dist/components/Pill/Pill.d.ts +6 -1
- package/dist/components/Pill/Pill.d.ts.map +1 -1
- package/dist/components/Radio/Radio.d.ts.map +1 -1
- package/dist/components/RichButton/RichButton.d.ts +2 -0
- package/dist/components/RichButton/RichButton.d.ts.map +1 -1
- package/dist/components/RichList/RichList.d.ts +3 -1
- package/dist/components/RichList/RichList.d.ts.map +1 -1
- package/dist/components/Select/Select.d.ts.map +1 -1
- package/dist/components/Table/Table.d.ts +1 -1
- package/dist/components/Tabs/Tabs.d.ts.map +1 -1
- package/dist/components/TagInput/TagInput.d.ts +54 -0
- package/dist/components/TagInput/TagInput.d.ts.map +1 -0
- package/dist/components/TagInput/index.d.ts +2 -0
- package/dist/components/TagInput/index.d.ts.map +1 -0
- package/dist/components/Tooltip/Tooltip.d.ts.map +1 -1
- package/dist/components/index.d.ts +9 -0
- package/dist/components/index.d.ts.map +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +5926 -4394
- package/dist/index.js.map +1 -1
- package/dist/tokens.cjs +1 -1
- package/dist/tokens.cjs.map +1 -1
- package/dist/tokens.js +2 -2
- package/dist/{palette-BLGoOCeZ.cjs → transitions-C2j90pjT.cjs} +2 -2
- package/dist/transitions-C2j90pjT.cjs.map +1 -0
- package/dist/{palette-uQpkQcc3.js → transitions-Cv-CPkZ8.js} +27 -27
- package/dist/transitions-Cv-CPkZ8.js.map +1 -0
- package/dist/util/useCompactRow.d.ts +2 -0
- package/dist/util/useCompactRow.d.ts.map +1 -1
- package/dist/voodo.css +1 -1
- package/package.json +12 -3
- package/dist/palette-BLGoOCeZ.cjs.map +0 -1
- package/dist/palette-uQpkQcc3.js.map +0 -1
|
@@ -1,23 +1,53 @@
|
|
|
1
|
-
import { FC, HTMLAttributes } from 'react';
|
|
1
|
+
import { FC, HTMLAttributes, ReactNode } from 'react';
|
|
2
2
|
import { Size } from '../../types';
|
|
3
3
|
export type AvatarSize = `${Size.Sm | Size.Md | Size.Lg}`;
|
|
4
|
+
/** `"auto"`: a fill picked from the name; `"neutral"`: the muted fill. */
|
|
5
|
+
export type AvatarTone = "auto" | "neutral";
|
|
4
6
|
export interface AvatarProps extends HTMLAttributes<HTMLSpanElement> {
|
|
5
7
|
name: string;
|
|
6
8
|
src?: string;
|
|
7
9
|
size?: AvatarSize;
|
|
10
|
+
/** Shows the name beside the avatar, truncating, as in a "Run by" cell. */
|
|
11
|
+
showName?: boolean;
|
|
12
|
+
/** With `showName`, a second line under the name, such as an email. */
|
|
13
|
+
subtitle?: ReactNode;
|
|
14
|
+
tone?: AvatarTone;
|
|
15
|
+
/** Shown in place of the initials (an invite, a group), on the muted fill. */
|
|
16
|
+
icon?: ReactNode;
|
|
17
|
+
/** What picks the colour, such as an email; defaults to the initials. */
|
|
18
|
+
colorKey?: string;
|
|
19
|
+
/** Rounded square instead of a circle, for a group rather than a person. */
|
|
20
|
+
square?: boolean;
|
|
8
21
|
}
|
|
9
22
|
/**
|
|
10
23
|
* A round picture of a person, falling back to their initials when there is
|
|
11
|
-
* no image.
|
|
24
|
+
* no image or it fails to load.
|
|
12
25
|
*
|
|
13
26
|
* @example
|
|
14
27
|
* ```tsx
|
|
15
28
|
* <Avatar name="Ada Lovelace" src={user.photoUrl} size="sm" />
|
|
29
|
+
* <Avatar name={run.runBy.name} size="sm" showName />
|
|
30
|
+
* <Avatar name="Ada Lovelace" size="lg" showName subtitle="ada@example.com" />
|
|
31
|
+
* <Avatar name="Ada Lovelace" tone="neutral" />
|
|
32
|
+
* <Avatar name="ada@example.com" icon={<MailOutlineIcon size="md" />} />
|
|
33
|
+
* <Avatar name="Labelers" icon={<UsersRoundIcon size={14} />} />
|
|
34
|
+
* <Avatar name="Ada Lovelace" colorKey={user.email} />
|
|
16
35
|
* ```
|
|
17
36
|
*
|
|
18
37
|
* @param name The person's name: it makes the initials and the accessible label.
|
|
19
38
|
* @param src Image URL. Initials show when it is missing.
|
|
20
39
|
* @param size `"sm"` (20px), `"md"` (24px) or `"lg"` (32px). Defaults to `"md"`.
|
|
40
|
+
* @param showName Shows the name beside the avatar (body text, truncating).
|
|
41
|
+
* @param subtitle With `showName`, a second line under a larger name, such
|
|
42
|
+
* as an email or a group's description; both lines truncate.
|
|
43
|
+
* @param tone `"auto"` (default): initials on one of twenty tuned colours
|
|
44
|
+
* picked from `colorKey`, the same for a key everywhere; `"neutral"`: on the
|
|
45
|
+
* muted fill.
|
|
46
|
+
* @param icon Shown in place of the initials when there is no image, on the
|
|
47
|
+
* muted fill: a person not known yet (an invite) or not a person (a group).
|
|
48
|
+
* @param colorKey What picks the colour: a stable id such as the email.
|
|
49
|
+
* Defaults to the initials.
|
|
50
|
+
* @param square Rounded square instead of a circle, for a group.
|
|
21
51
|
* @param className `class` overrides to apply to the component.
|
|
22
52
|
* @param props Additional HTML properties to apply to the component.
|
|
23
53
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../src/components/Avatar/Avatar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../src/components/Avatar/Avatar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,EAAE,EACP,KAAK,cAAc,EACnB,KAAK,SAAS,EAEf,MAAM,OAAO,CAAC;AAIf,OAAO,EAIL,IAAI,EAIL,MAAM,SAAS,CAAC;AAGjB,MAAM,MAAM,UAAU,GAAG,GAAG,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;AAE1D,0EAA0E;AAC1E,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,SAAS,CAAC;AAE5C,MAAM,WAAW,WAAY,SAAQ,cAAc,CAAC,eAAe,CAAC;IAClE,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,2EAA2E;IAC3E,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,uEAAuE;IACvE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,8EAA8E;IAC9E,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,yEAAyE;IACzE,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,4EAA4E;IAC5E,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAkHD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,eAAO,MAAM,MAAM,EAAE,EAAE,CAAC,WAAW,CAoFlC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,oBAAoB,EACpB,oBAAoB,EAEpB,EAAE,EAGF,SAAS,EACV,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,KAAK,SAAS,EAAe,MAAM,oBAAoB,CAAC;AAEjE,OAAuB,EACrB,KAAK,QAAQ,EAGd,MAAM,mBAAmB,CAAC;AAG3B,OAAO,EAOL,IAAI,EAIJ,OAAO,EACR,MAAM,SAAS,CAAC;AAMjB,KAAK,UAAU,GAAG,GAAG,OAAO,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,EAAE,CAAC,EAAE,CAAC;AAExD,MAAM,WAAW,WACf,SACE,oBAAoB,CAAC,iBAAiB,CAAC,EACvC,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,KAAK,CAAC;IAC1E;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;
|
|
1
|
+
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,oBAAoB,EACpB,oBAAoB,EAEpB,EAAE,EAGF,SAAS,EACV,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,KAAK,SAAS,EAAe,MAAM,oBAAoB,CAAC;AAEjE,OAAuB,EACrB,KAAK,QAAQ,EAGd,MAAM,mBAAmB,CAAC;AAG3B,OAAO,EAOL,IAAI,EAIJ,OAAO,EACR,MAAM,SAAS,CAAC;AAMjB,KAAK,UAAU,GAAG,GAAG,OAAO,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,EAAE,CAAC,EAAE,CAAC;AAExD,MAAM,WAAW,WACf,SACE,oBAAoB,CAAC,iBAAiB,CAAC,EACvC,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,KAAK,CAAC;IAC1E;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AA8ID;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,MAAM,EAAE,EAAE,CAAC,WAAW,CA+HlC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/Checkbox/Checkbox.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,EAAE,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAC;AAMrD,OAAO,EAML,MAAM,EACN,IAAI,EAIL,MAAM,SAAS,CAAC;AAGjB,KAAK,qBAAqB,GAAG,IAAI,CAC/B,mBAAmB,CAAC,gBAAgB,CAAC,EACrC,MAAM,GAAG,UAAU,GAAG,SAAS,GAAG,UAAU,GAAG,WAAW,CAC3D,CAAC;AAEF,MAAM,WAAW,aAAc,SAAQ,qBAAqB;IAC1D,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAsBD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,eAAO,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,
|
|
1
|
+
{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/Checkbox/Checkbox.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,EAAE,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAC;AAMrD,OAAO,EAML,MAAM,EACN,IAAI,EAIL,MAAM,SAAS,CAAC;AAGjB,KAAK,qBAAqB,GAAG,IAAI,CAC/B,mBAAmB,CAAC,gBAAgB,CAAC,EACrC,MAAM,GAAG,UAAU,GAAG,SAAS,GAAG,UAAU,GAAG,WAAW,CAC3D,CAAC;AAEF,MAAM,WAAW,aAAc,SAAQ,qBAAqB;IAC1D,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAsBD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,eAAO,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,CAwFtC,CAAC"}
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
import { JSX } from 'react';
|
|
2
|
+
import { ButtonProps } from '../Button';
|
|
3
|
+
export interface ChipSelectOption<T extends string = string> {
|
|
4
|
+
id: T;
|
|
5
|
+
label: string;
|
|
6
|
+
}
|
|
7
|
+
export interface ChipSelectProps<T extends string = string> {
|
|
8
|
+
/** The choices, one checked at a time. */
|
|
9
|
+
options: ChipSelectOption<T>[];
|
|
10
|
+
/** The `id` of the checked option. */
|
|
11
|
+
value: T;
|
|
12
|
+
/** Called with the `id` of the option picked. */
|
|
13
|
+
onChange: (value: T) => void;
|
|
14
|
+
/** Names the control; also the accessible name of the trigger. */
|
|
15
|
+
"aria-label": string;
|
|
16
|
+
/** Leading icon of the trigger. */
|
|
17
|
+
icon?: ButtonProps["leadingIcon"];
|
|
18
|
+
/** What the value is (`Sort by`), shown before it; on a phone only in the tooltip. */
|
|
19
|
+
prefix?: string;
|
|
20
|
+
/** The trigger text, when it should differ from the checked option's label (a count, say). */
|
|
21
|
+
label?: string;
|
|
22
|
+
"data-cy"?: string;
|
|
23
|
+
}
|
|
24
|
+
/**
|
|
25
|
+
* A borderless single-choice menu for filter and sort rows: an icon, an optional
|
|
26
|
+
* `prefix: value` and a caret, opening a checklist of options.
|
|
27
|
+
*
|
|
28
|
+
* @example
|
|
29
|
+
* ```tsx
|
|
30
|
+
* <ChipSelect
|
|
31
|
+
* aria-label="Sort by"
|
|
32
|
+
* prefix="Sort by"
|
|
33
|
+
* icon={ArrowDownWideNarrowIcon}
|
|
34
|
+
* value={sort}
|
|
35
|
+
* onChange={setSort}
|
|
36
|
+
* options={[
|
|
37
|
+
* { id: "newest", label: "Newest" },
|
|
38
|
+
* { id: "oldest", label: "Oldest" },
|
|
39
|
+
* ]}
|
|
40
|
+
* />
|
|
41
|
+
* ```
|
|
42
|
+
*
|
|
43
|
+
* @param options The choices, one checked at a time. See {@link ChipSelectOption}.
|
|
44
|
+
* @param value The `id` of the checked option.
|
|
45
|
+
* @param onChange Called with the `id` of the option picked.
|
|
46
|
+
* @param icon Leading icon of the trigger.
|
|
47
|
+
* @param prefix What the value is, shown before it. Below 640px only the value shows and a tooltip names both.
|
|
48
|
+
* @param label The trigger text, when it should differ from the checked option's label. Defaults to that label.
|
|
49
|
+
*/
|
|
50
|
+
export declare function ChipSelect<T extends string = string>({ options, value, onChange, icon, prefix, label, "aria-label": ariaLabel, "data-cy": dataCy, }: ChipSelectProps<T>): JSX.Element;
|
|
51
|
+
//# sourceMappingURL=ChipSelect.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ChipSelect.d.ts","sourceRoot":"","sources":["../../../src/components/ChipSelect/ChipSelect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAEjC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAKvD,MAAM,WAAW,gBAAgB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM;IACzD,EAAE,EAAE,CAAC,CAAC;IACN,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,eAAe,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM;IACxD,0CAA0C;IAC1C,OAAO,EAAE,gBAAgB,CAAC,CAAC,CAAC,EAAE,CAAC;IAC/B,sCAAsC;IACtC,KAAK,EAAE,CAAC,CAAC;IACT,iDAAiD;IACjD,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC7B,kEAAkE;IAClE,YAAY,EAAE,MAAM,CAAC;IACrB,mCAAmC;IACnC,IAAI,CAAC,EAAE,WAAW,CAAC,aAAa,CAAC,CAAC;IAClC,sFAAsF;IACtF,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,8FAA8F;IAC9F,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,UAAU,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,EAAE,EACpD,OAAO,EACP,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,MAAM,EACN,KAAK,EACL,YAAY,EAAE,SAAS,EACvB,SAAS,EAAE,MAAM,GAClB,EAAE,eAAe,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,OAAO,CA6BlC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ChipSelect/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import { FC, HTMLAttributes, ReactNode } from 'react';
|
|
2
|
+
export interface CodeBlockProps extends Omit<HTMLAttributes<HTMLDivElement>, "onCopy" | "children"> {
|
|
3
|
+
code: string;
|
|
4
|
+
children?: ReactNode;
|
|
5
|
+
language?: string;
|
|
6
|
+
onCopy?: (code: string) => void;
|
|
7
|
+
}
|
|
8
|
+
/**
|
|
9
|
+
* A read-only code snippet on a card, with a copy action in its corner.
|
|
10
|
+
*
|
|
11
|
+
* @param code The code to show and copy.
|
|
12
|
+
* @param language A Prism language for syntax colours (`"python"`, `"json"`,
|
|
13
|
+
* `"yaml"`, `"ts"`, ...). Defaults to `"python"`; unknown languages render plain.
|
|
14
|
+
* @param children Already highlighted markup to show instead of `language`
|
|
15
|
+
* colours; `code` is still what is copied.
|
|
16
|
+
* @param onCopy Called with the code after it is copied.
|
|
17
|
+
* @param props Additional HTML properties to apply to the card.
|
|
18
|
+
*
|
|
19
|
+
* @example
|
|
20
|
+
* ```tsx
|
|
21
|
+
* <CodeBlock
|
|
22
|
+
* language="python"
|
|
23
|
+
* code={'import fiftyone as fo\n\ndataset = fo.load_dataset("quickstart")'}
|
|
24
|
+
* onCopy={() => toast("Copied")}
|
|
25
|
+
* />
|
|
26
|
+
* ```
|
|
27
|
+
*/
|
|
28
|
+
export declare const CodeBlock: FC<CodeBlockProps>;
|
|
29
|
+
//# sourceMappingURL=CodeBlock.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CodeBlock.d.ts","sourceRoot":"","sources":["../../../src/components/CodeBlock/CodeBlock.tsx"],"names":[],"mappings":"AACA,OAAO,EAGL,KAAK,EAAE,EACP,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAwDf,MAAM,WAAW,cAAe,SAAQ,IAAI,CAC1C,cAAc,CAAC,cAAc,CAAC,EAC9B,QAAQ,GAAG,UAAU,CACtB;IACC,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACjC;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CA4DxC,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/CodeBlock/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC"}
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import { EditorProps } from '@monaco-editor/react';
|
|
2
|
+
import { FC, HTMLAttributes } from 'react';
|
|
3
|
+
export interface CodeEditorProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange" | "defaultValue"> {
|
|
4
|
+
value?: string;
|
|
5
|
+
defaultValue?: string;
|
|
6
|
+
onChange?: (value: string) => void;
|
|
7
|
+
language?: string;
|
|
8
|
+
readOnly?: boolean;
|
|
9
|
+
height?: number | string;
|
|
10
|
+
options?: EditorProps["options"];
|
|
11
|
+
}
|
|
12
|
+
/**
|
|
13
|
+
* An editable code editor (Monaco) themed with VOODO tokens, for JSON and
|
|
14
|
+
* config editing. Use {@link CodeBlock} to show a read-only snippet.
|
|
15
|
+
*
|
|
16
|
+
* Monaco loads lazily on first render, so it costs nothing until used; install
|
|
17
|
+
* the optional peer `@monaco-editor/react` in the consuming app. The editor
|
|
18
|
+
* follows the light/dark mode and keeps Monaco's `.monaco-editor` root.
|
|
19
|
+
*
|
|
20
|
+
* @example
|
|
21
|
+
* ```tsx
|
|
22
|
+
* <CodeEditor
|
|
23
|
+
* language="json"
|
|
24
|
+
* value={json}
|
|
25
|
+
* onChange={setJson}
|
|
26
|
+
* height={320}
|
|
27
|
+
* />
|
|
28
|
+
* ```
|
|
29
|
+
*
|
|
30
|
+
* @example
|
|
31
|
+
* ```tsx
|
|
32
|
+
* <CodeEditor value={JSON.stringify(doc, null, 2)} readOnly height="60vh" />
|
|
33
|
+
* ```
|
|
34
|
+
*
|
|
35
|
+
* @param value The controlled text.
|
|
36
|
+
* @param defaultValue The initial text when uncontrolled.
|
|
37
|
+
* @param onChange Called with the full text on every edit.
|
|
38
|
+
* @param language Monaco language id. Defaults to `"json"`.
|
|
39
|
+
* @param readOnly If `true`, the text can be selected but not edited.
|
|
40
|
+
* @param height Editor height (CSS length or px). Defaults to `"100%"`.
|
|
41
|
+
* @param options Extra Monaco editor options, merged over VOODO's defaults.
|
|
42
|
+
* @param className `class` overrides for the framed container.
|
|
43
|
+
* @param props Additional HTML properties for the container.
|
|
44
|
+
*/
|
|
45
|
+
export declare const CodeEditor: FC<CodeEditorProps>;
|
|
46
|
+
//# sourceMappingURL=CodeEditor.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CodeEditor.d.ts","sourceRoot":"","sources":["../../../src/components/CodeEditor/CodeEditor.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAU,MAAM,sBAAsB,CAAC;AAChE,OAAO,EACL,KAAK,EAAE,EACP,KAAK,cAAc,EAKpB,MAAM,OAAO,CAAC;AAuDf,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAC3C,cAAc,CAAC,cAAc,CAAC,EAC9B,UAAU,GAAG,cAAc,CAC5B;IACC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,OAAO,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;CAClC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,eAAO,MAAM,UAAU,EAAE,EAAE,CAAC,eAAe,CA8D1C,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/CodeEditor/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { FC, HTMLAttributes, ReactNode } from 'react';
|
|
1
|
+
import { FC, HTMLAttributes, ReactNode, RefObject } from 'react';
|
|
2
2
|
import { IconInput } from '../Icons';
|
|
3
3
|
import { Size, ZIndex } from '../../types';
|
|
4
4
|
/** `data-*` attributes a host attaches to a part — a test id, a tracking hook. */
|
|
@@ -11,6 +11,16 @@ export interface ComboboxOption {
|
|
|
11
11
|
label: string;
|
|
12
12
|
/** Optional second line — a definition, a slug, an owner. */
|
|
13
13
|
description?: ReactNode;
|
|
14
|
+
/** A leading icon saying what kind of row it is. */
|
|
15
|
+
icon?: IconInput;
|
|
16
|
+
/** A short note at the row's end, such as what picking it does; the
|
|
17
|
+
* highlighted row adds an Enter glyph after it. */
|
|
18
|
+
hint?: ReactNode;
|
|
19
|
+
/**
|
|
20
|
+
* The section the row belongs to. A titled section starts wherever the
|
|
21
|
+
* group changes, so pass the rows ordered by group.
|
|
22
|
+
*/
|
|
23
|
+
group?: string;
|
|
14
24
|
/** `data-*` attributes for the row — a test id, a tracking hook. */
|
|
15
25
|
[dataAttribute: `data-${string}`]: string | undefined;
|
|
16
26
|
}
|
|
@@ -71,6 +81,18 @@ export interface ComboboxProps extends Omit<HTMLAttributes<HTMLDivElement>, "onC
|
|
|
71
81
|
* @default false
|
|
72
82
|
*/
|
|
73
83
|
portal?: boolean;
|
|
84
|
+
/**
|
|
85
|
+
* With `portal`, the element the list drops under and takes its width
|
|
86
|
+
* from, instead of the field — for a field inside a larger frame, such as
|
|
87
|
+
* a search bar, whose list spans the frame.
|
|
88
|
+
*/
|
|
89
|
+
anchor?: RefObject<HTMLElement | null>;
|
|
90
|
+
/**
|
|
91
|
+
* The list always shows, in the flow under the field, with no frame of its
|
|
92
|
+
* own — for a picker inside a popover, like a command palette. Escape and
|
|
93
|
+
* picking still report `onOpenChange(false)`, so the host can close.
|
|
94
|
+
*/
|
|
95
|
+
inline?: boolean;
|
|
74
96
|
/** Explicit z-index for the list. A portaled list defaults to above-modal. */
|
|
75
97
|
zIndex?: ZIndex;
|
|
76
98
|
/**
|
|
@@ -87,8 +109,8 @@ export interface ComboboxProps extends Omit<HTMLAttributes<HTMLDivElement>, "onC
|
|
|
87
109
|
/** Focus the field on mount — for a combobox that opens on demand. */
|
|
88
110
|
focusOnMount?: boolean;
|
|
89
111
|
/**
|
|
90
|
-
* Highlight the first row whenever there is text
|
|
91
|
-
* match without an arrow key first. Off by default: with it off, Enter on
|
|
112
|
+
* Highlight the first row whenever there is text (an inline list: always),
|
|
113
|
+
* so Enter takes the top match without an arrow key first. Off by default: with it off, Enter on
|
|
92
114
|
* unmatched text commits free text (or nothing), never a row the user
|
|
93
115
|
* has not pointed at.
|
|
94
116
|
* @default false
|
|
@@ -145,12 +167,14 @@ export interface ComboboxProps extends Omit<HTMLAttributes<HTMLDivElement>, "onC
|
|
|
145
167
|
* @param emptyMessage Shown when there are no options; a function receives `close`.
|
|
146
168
|
* @param className `class` overrides for the wrapper.
|
|
147
169
|
* @param portal Render the list in a portal, anchored to the field.
|
|
170
|
+
* @param anchor With `portal`, the element the list drops under instead of the field.
|
|
171
|
+
* @param inline The list always shows, in the flow, unframed.
|
|
148
172
|
* @param zIndex Explicit z-index for the list.
|
|
149
173
|
* @param commitOnBlur Commit free text on blur (default `true`).
|
|
150
174
|
* @param borderless No frame on the field.
|
|
151
175
|
* @param icon A leading icon in the field.
|
|
152
176
|
* @param focusOnMount Focus the field on mount.
|
|
153
|
-
* @param autoHighlight Highlight the first row whenever there is text.
|
|
177
|
+
* @param autoHighlight Highlight the first row whenever there is text (inline: always).
|
|
154
178
|
* @param inputProps Attributes for the field itself.
|
|
155
179
|
* @param header Shown above the list's contents whenever the list is open.
|
|
156
180
|
* @param listProps Attributes for the list.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Combobox.d.ts","sourceRoot":"","sources":["../../../src/components/Combobox/Combobox.tsx"],"names":[],"mappings":"AASA,OAAO,
|
|
1
|
+
{"version":3,"file":"Combobox.d.ts","sourceRoot":"","sources":["../../../src/components/Combobox/Combobox.tsx"],"names":[],"mappings":"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"}
|
|
@@ -3,6 +3,8 @@ import { ButtonProps } from '../Button';
|
|
|
3
3
|
export type DropdownTriggerProps = Omit<ButtonProps, "variant" | "trailingIcon"> & {
|
|
4
4
|
/** What the value is, shown before it (`Sort by: Newest`); on a phone only in the tooltip. */
|
|
5
5
|
prefix?: ReactNode;
|
|
6
|
+
/** Spans its container: the label truncates on the left, the caret sits at the far right (a form picker). */
|
|
7
|
+
fullWidth?: boolean;
|
|
6
8
|
};
|
|
7
9
|
/**
|
|
8
10
|
* The standard trigger button for a {@link Dropdown}.
|
|
@@ -31,11 +33,15 @@ export type DropdownTriggerProps = Omit<ButtonProps, "variant" | "trailingIcon">
|
|
|
31
33
|
* ```
|
|
32
34
|
*
|
|
33
35
|
* @param children Button label.
|
|
34
|
-
* @param prefix What the value names, shown as `prefix: value`. Below 640px
|
|
35
|
-
*
|
|
36
|
-
* `aria-label` keeps both
|
|
36
|
+
* @param prefix What the value names, shown as `prefix: value`. Below 640px,
|
|
37
|
+
* or in a row out of room (`useCompactRow`, `OverflowRow`), only the value
|
|
38
|
+
* shows and a tooltip reads prefix and value; the `aria-label` keeps both
|
|
39
|
+
* unless one is passed.
|
|
37
40
|
* @param size Button size. Defaults to `"sm"`.
|
|
38
|
-
* @param borderless No outline; a rounded fill appears on hover.
|
|
41
|
+
* @param borderless No outline; a rounded fill appears on hover. The leading
|
|
42
|
+
* icon shrinks to 14px and both icons take the muted icon colour.
|
|
43
|
+
* @param leadingIcon Optional icon before the label.
|
|
44
|
+
* @param fullWidth Span the container, label truncating left and caret at the far right.
|
|
39
45
|
* @param props Additional {@link ButtonProps} (excluding `variant` and `trailingIcon`).
|
|
40
46
|
*/
|
|
41
47
|
export declare const DropdownTrigger: FC<DropdownTriggerProps>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownTrigger.d.ts","sourceRoot":"","sources":["../../../src/components/Dropdown/DropdownTrigger.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"DropdownTrigger.d.ts","sourceRoot":"","sources":["../../../src/components/Dropdown/DropdownTrigger.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,EAAE,EACP,KAAK,SAAS,EAIf,MAAM,OAAO,CAAC;AAEf,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,qBAAqB,CAAC;AA4C/D,MAAM,MAAM,oBAAoB,GAAG,IAAI,CACrC,WAAW,EACX,SAAS,GAAG,cAAc,CAC3B,GAAG;IACF,8FAA8F;IAC9F,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,6GAA6G;IAC7G,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AACH,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC,oBAAoB,CA6EpD,CAAC"}
|
|
@@ -0,0 +1,96 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
export interface EmptyArtProps {
|
|
3
|
+
className?: string;
|
|
4
|
+
}
|
|
5
|
+
/**
|
|
6
|
+
* Attention travelling across a frame and resolving into a thread: the
|
|
7
|
+
* "no comments yet" art.
|
|
8
|
+
*
|
|
9
|
+
* @example
|
|
10
|
+
* ```tsx
|
|
11
|
+
* <EmptyState art={<CommentsEmptyArt />} title="No comments yet" />
|
|
12
|
+
* ```
|
|
13
|
+
*
|
|
14
|
+
* @param className Extra classes for the SVG; it fills its container's width.
|
|
15
|
+
*/
|
|
16
|
+
export declare const CommentsEmptyArt: FC<EmptyArtProps>;
|
|
17
|
+
/**
|
|
18
|
+
* A timeline assembling itself: the "no history yet" art.
|
|
19
|
+
*
|
|
20
|
+
* @example
|
|
21
|
+
* ```tsx
|
|
22
|
+
* <EmptyState art={<HistoryEmptyArt />} title="No history yet" />
|
|
23
|
+
* ```
|
|
24
|
+
*
|
|
25
|
+
* @param className Extra classes for the SVG; it fills its container's width.
|
|
26
|
+
*/
|
|
27
|
+
export declare const HistoryEmptyArt: FC<EmptyArtProps>;
|
|
28
|
+
/**
|
|
29
|
+
* A scan converging on one match in a grid: the "no results" art.
|
|
30
|
+
*
|
|
31
|
+
* @example
|
|
32
|
+
* ```tsx
|
|
33
|
+
* <EmptyState art={<SearchEmptyArt />} title="Nothing matches yet" />
|
|
34
|
+
* ```
|
|
35
|
+
*
|
|
36
|
+
* @param className Extra classes for the SVG; it fills its container's width.
|
|
37
|
+
*/
|
|
38
|
+
export declare const SearchEmptyArt: FC<EmptyArtProps>;
|
|
39
|
+
/**
|
|
40
|
+
* Scattered samples pulled into a neighbourhood around one anchor: the
|
|
41
|
+
* "no similarity index yet" art.
|
|
42
|
+
*
|
|
43
|
+
* @example
|
|
44
|
+
* ```tsx
|
|
45
|
+
* <EmptyState art={<SimilarityEmptyArt />} title="No similarity index yet" />
|
|
46
|
+
* ```
|
|
47
|
+
*
|
|
48
|
+
* @param className Extra classes for the SVG; it fills its container's width.
|
|
49
|
+
*/
|
|
50
|
+
export declare const SimilarityEmptyArt: FC<EmptyArtProps>;
|
|
51
|
+
/**
|
|
52
|
+
* Bars rising into a comparison, a scorecard writing itself: the
|
|
53
|
+
* "no evaluations yet" art.
|
|
54
|
+
*
|
|
55
|
+
* @example
|
|
56
|
+
* ```tsx
|
|
57
|
+
* <EmptyState art={<EvaluationEmptyArt />} title="No evaluations yet" />
|
|
58
|
+
* ```
|
|
59
|
+
*
|
|
60
|
+
* @param className Extra classes for the SVG; it fills its container's width.
|
|
61
|
+
*/
|
|
62
|
+
export declare const EvaluationEmptyArt: FC<EmptyArtProps>;
|
|
63
|
+
/**
|
|
64
|
+
* A panel surface assembling itself: the neutral "nothing here yet" art.
|
|
65
|
+
*
|
|
66
|
+
* @example
|
|
67
|
+
* ```tsx
|
|
68
|
+
* <EmptyState art={<PanelEmptyArt />} title="No runs yet" />
|
|
69
|
+
* ```
|
|
70
|
+
*
|
|
71
|
+
* @param className Extra classes for the SVG; it fills its container's width.
|
|
72
|
+
*/
|
|
73
|
+
export declare const PanelEmptyArt: FC<EmptyArtProps>;
|
|
74
|
+
/**
|
|
75
|
+
* A box drawn and locked onto its subject: the "no annotations yet" art.
|
|
76
|
+
*
|
|
77
|
+
* @example
|
|
78
|
+
* ```tsx
|
|
79
|
+
* <EmptyState art={<AnnotationEmptyArt />} title="No annotations yet" />
|
|
80
|
+
* ```
|
|
81
|
+
*
|
|
82
|
+
* @param className Extra classes for the SVG; it fills its container's width.
|
|
83
|
+
*/
|
|
84
|
+
export declare const AnnotationEmptyArt: FC<EmptyArtProps>;
|
|
85
|
+
/**
|
|
86
|
+
* Weights settling into a served model: the "no models yet" art.
|
|
87
|
+
*
|
|
88
|
+
* @example
|
|
89
|
+
* ```tsx
|
|
90
|
+
* <EmptyState art={<ModelsEmptyArt />} title="No models yet" />
|
|
91
|
+
* ```
|
|
92
|
+
*
|
|
93
|
+
* @param className Extra classes for the SVG; it fills its container's width.
|
|
94
|
+
*/
|
|
95
|
+
export declare const ModelsEmptyArt: FC<EmptyArtProps>;
|
|
96
|
+
//# sourceMappingURL=EmptyArt.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"EmptyArt.d.ts","sourceRoot":"","sources":["../../../src/components/EmptyArt/EmptyArt.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAsB,KAAK,EAAE,EAAyB,MAAM,OAAO,CAAC;AAM3E,MAAM,WAAW,aAAa;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAyCD;;;;;;;;;;GAUG;AACH,eAAO,MAAM,gBAAgB,EAAE,EAAE,CAAC,aAAa,CAwH9C,CAAC;AAGF;;;;;;;;;GASG;AACH,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC,aAAa,CAkD7C,CAAC;AAGF;;;;;;;;;GASG;AACH,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,aAAa,CAoD5C,CAAC;AAGF;;;;;;;;;;GAUG;AACH,eAAO,MAAM,kBAAkB,EAAE,EAAE,CAAC,aAAa,CAqDhD,CAAC;AAGF;;;;;;;;;;GAUG;AACH,eAAO,MAAM,kBAAkB,EAAE,EAAE,CAAC,aAAa,CA0ChD,CAAC;AAGF;;;;;;;;;GASG;AACH,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,aAAa,CAoC3C,CAAC;AAGF;;;;;;;;;GASG;AACH,eAAO,MAAM,kBAAkB,EAAE,EAAE,CAAC,aAAa,CA6ChD,CAAC;AAGF;;;;;;;;;GASG;AACH,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,aAAa,CAuD5C,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/EmptyArt/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC"}
|
|
@@ -1,11 +1,16 @@
|
|
|
1
|
-
import { FC } from 'react';
|
|
1
|
+
import { FC, ReactNode } from 'react';
|
|
2
2
|
import { IconInput } from '../Icons';
|
|
3
3
|
import { StackProps } from '../Stack';
|
|
4
|
+
import { Size } from '../../types';
|
|
4
5
|
export interface EmptyStateProps extends StackProps {
|
|
5
6
|
icon?: IconInput;
|
|
7
|
+
art?: ReactNode;
|
|
6
8
|
title: string;
|
|
7
9
|
description?: string;
|
|
10
|
+
size?: EmptyStateSize;
|
|
8
11
|
}
|
|
12
|
+
/** `sm` for narrow sidebars and inline list slots, `md` for panels and pages. */
|
|
13
|
+
export type EmptyStateSize = `${Extract<Size, "sm" | "md">}`;
|
|
9
14
|
/**
|
|
10
15
|
* A basic empty state to display to the user.
|
|
11
16
|
*
|
|
@@ -18,9 +23,24 @@ export interface EmptyStateProps extends StackProps {
|
|
|
18
23
|
* />
|
|
19
24
|
* ```
|
|
20
25
|
*
|
|
26
|
+
* With `art` (such as {@link PanelEmptyArt}), the illustration replaces the
|
|
27
|
+
* icon and the text follows the illustrated layout; `children` render below
|
|
28
|
+
* the text as an action area.
|
|
29
|
+
*
|
|
30
|
+
* ```tsx
|
|
31
|
+
* <EmptyState art={<PanelEmptyArt />} title="No runs yet">
|
|
32
|
+
* <Button variant="primary">Run a workflow</Button>
|
|
33
|
+
* </EmptyState>
|
|
34
|
+
* ```
|
|
35
|
+
*
|
|
21
36
|
* @param icon The icon to display in the empty state: a per-icon component.
|
|
37
|
+
* @param art An illustration shown instead of the icon, 150px wide.
|
|
22
38
|
* @param title The title to display in the empty state.
|
|
23
39
|
* @param description An optional description to display in the empty state.
|
|
40
|
+
* @param size `"sm"` for narrow sidebars and list slots (104px art, tighter
|
|
41
|
+
* padding and smaller text), `"md"` for panels and pages. Applies to the
|
|
42
|
+
* illustrated layout. Defaults to `"md"`.
|
|
43
|
+
* @param children An optional action area below the text.
|
|
24
44
|
* @param props Additional {@link Stack} properties to apply to the component.
|
|
25
45
|
*/
|
|
26
46
|
export declare const EmptyState: FC<EmptyStateProps>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmptyState.d.ts","sourceRoot":"","sources":["../../../src/components/EmptyState/EmptyState.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"EmptyState.d.ts","sourceRoot":"","sources":["../../../src/components/EmptyState/EmptyState.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE3C,OAAO,EAAE,KAAK,SAAS,EAAoB,MAAM,oBAAoB,CAAC;AACtE,OAAO,EAAS,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAGvD,OAAO,EAOL,IAAI,EAGL,MAAM,SAAS,CAAC;AAGjB,MAAM,WAAW,eAAgB,SAAQ,UAAU;IACjD,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,GAAG,CAAC,EAAE,SAAS,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,cAAc,CAAC;CACvB;AAED,iFAAiF;AACjF,MAAM,MAAM,cAAc,GAAG,GAAG,OAAO,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC,EAAE,CAAC;AAE7D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,eAAO,MAAM,UAAU,EAAE,EAAE,CAAC,eAAe,CA2E1C,CAAC"}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { FC, ReactNode } from 'react';
|
|
2
|
+
export interface FilterBarProps {
|
|
3
|
+
/** A title or heading: at the start of the row, or on its own row when narrow. */
|
|
4
|
+
leading?: ReactNode;
|
|
5
|
+
/** The search input; the bar sizes its slot. */
|
|
6
|
+
search?: ReactNode;
|
|
7
|
+
/** Filter and sort controls, such as {@link ChipSelect}s. */
|
|
8
|
+
children?: ReactNode;
|
|
9
|
+
/** Primary actions (a create button), kept at the end of the row. */
|
|
10
|
+
actions?: ReactNode;
|
|
11
|
+
}
|
|
12
|
+
/**
|
|
13
|
+
* The search, filter and action controls above a list. One row on a wide screen;
|
|
14
|
+
* below 1024px the title, then the search and actions, then the filters each
|
|
15
|
+
* take a row, the filters scrolling sideways.
|
|
16
|
+
*
|
|
17
|
+
* @example
|
|
18
|
+
* ```tsx
|
|
19
|
+
* <FilterBar
|
|
20
|
+
* search={<Input type="search" icon={SearchIcon} placeholder="Search" />}
|
|
21
|
+
* actions={<Button variant="primary" leadingIcon={AddIcon} collapse="sm">New</Button>}
|
|
22
|
+
* >
|
|
23
|
+
* <ChipSelect aria-label="Group by" prefix="Group by" value="none" onChange={() => {}} options={[{ id: "none", label: "None" }]} />
|
|
24
|
+
* </FilterBar>
|
|
25
|
+
* ```
|
|
26
|
+
*
|
|
27
|
+
* @param leading A title or heading: at the start of the row on a wide screen, on its own row below 1024px.
|
|
28
|
+
* @param search The search input. Its slot grows to fill the row.
|
|
29
|
+
* @param children Filter and sort controls.
|
|
30
|
+
* @param actions Primary actions, kept at the end of the row.
|
|
31
|
+
*/
|
|
32
|
+
export declare const FilterBar: FC<FilterBarProps>;
|
|
33
|
+
//# sourceMappingURL=FilterBar.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FilterBar.d.ts","sourceRoot":"","sources":["../../../src/components/FilterBar/FilterBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAK3C,MAAM,WAAW,cAAc;IAC7B,kFAAkF;IAClF,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,gDAAgD;IAChD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,6DAA6D;IAC7D,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,qEAAqE;IACrE,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAoCxC,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FilterBar/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { ButtonHTMLAttributes, FC, ReactNode } from 'react';
|
|
2
|
+
export interface FilterChipProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "children"> {
|
|
3
|
+
/** The chip text. */
|
|
4
|
+
children: ReactNode;
|
|
5
|
+
/** A count after the text, in a smaller muted figure. */
|
|
6
|
+
count?: number;
|
|
7
|
+
/** Whether the filter is on; shows the chip inverted and sets `aria-pressed`. */
|
|
8
|
+
selected?: boolean;
|
|
9
|
+
}
|
|
10
|
+
/**
|
|
11
|
+
* A pill button that toggles one filter, such as a tag in a tag cloud, with an
|
|
12
|
+
* optional count.
|
|
13
|
+
*
|
|
14
|
+
* @example
|
|
15
|
+
* ```tsx
|
|
16
|
+
* <FilterChip count={6} selected={on} onClick={() => setOn(!on)}>
|
|
17
|
+
* automotive
|
|
18
|
+
* </FilterChip>
|
|
19
|
+
* ```
|
|
20
|
+
*
|
|
21
|
+
* @param children The chip text.
|
|
22
|
+
* @param count A count after the text, shown smaller and muted, locale formatted.
|
|
23
|
+
* @param selected Whether the filter is on: the chip inverts and `aria-pressed` is set.
|
|
24
|
+
* @param className `class` overrides to apply to the component.
|
|
25
|
+
* @param props Additional button properties.
|
|
26
|
+
*/
|
|
27
|
+
export declare const FilterChip: FC<FilterChipProps>;
|
|
28
|
+
//# sourceMappingURL=FilterChip.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FilterChip.d.ts","sourceRoot":"","sources":["../../../src/components/FilterChip/FilterChip.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,oBAAoB,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAWjE,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAC3C,oBAAoB,CAAC,iBAAiB,CAAC,EACvC,UAAU,CACX;IACC,qBAAqB;IACrB,QAAQ,EAAE,SAAS,CAAC;IACpB,yDAAyD;IACzD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iFAAiF;IACjF,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,UAAU,EAAE,EAAE,CAAC,eAAe,CAsC1C,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FilterChip/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}
|