@eui/eds-styles 22.0.0-alpha.24 → 22.0.0-alpha.26
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/package.json
CHANGED
|
@@ -1,70 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Type definitions for the shared EDS component catalog (`eds-components.json`).
|
|
3
|
-
*
|
|
4
|
-
* This manifest is consumed by all three EDS showcase hosts (Angular, React, Web Components).
|
|
5
|
-
* It carries only the framework-agnostic catalog fields; each host attaches its own runtime
|
|
6
|
-
* binding (route/export for Angular, `Samples` component for React/WC) by matching on `id`,
|
|
7
|
-
* and filters the list by the relevant `availability` flag.
|
|
8
|
-
*
|
|
9
|
-
* Import it as JSON, e.g.:
|
|
10
|
-
* import catalog from '@eui/eds-styles/assets/eds-components.json' with { type: 'json' };
|
|
11
|
-
* import type { EdsComponentCatalog } from '@eui/eds-styles/assets/eds-components';
|
|
12
|
-
*/
|
|
13
|
-
|
|
14
|
-
/** Top-level sidebar grouping (matches the Angular EDS showcase sections). */
|
|
15
|
-
export type EdsComponentGroup =
|
|
16
|
-
| 'Design tokens'
|
|
17
|
-
| 'Shell'
|
|
18
|
-
| 'EDS validated'
|
|
19
|
-
| 'Components'
|
|
20
|
-
| 'Directives'
|
|
21
|
-
| 'Charts'
|
|
22
|
-
| 'Utilities'
|
|
23
|
-
| 'Patterns'
|
|
24
|
-
| 'Templates';
|
|
25
|
-
|
|
26
|
-
/** Angular sidebar bucket for a component (drives the `category` on the Angular link). */
|
|
27
|
-
export type EdsComponentCategory = 'atom' | 'action' | 'content' | 'layout';
|
|
28
|
-
|
|
29
|
-
/** Documentation maturity, mirroring the Angular `statusMetadata.status`. */
|
|
30
|
-
export type EdsComponentStatus = 'DRAFT' | 'DEMO';
|
|
31
|
-
|
|
32
|
-
/** Status badge color, mirroring the Angular `statusMetadata.colorVariant` (info for DRAFT, danger for DEMO). */
|
|
33
|
-
export type EdsComponentStatusColorVariant = 'info' | 'danger';
|
|
34
|
-
|
|
35
|
-
/** Which showcase hosts actually ship samples for a component. */
|
|
36
|
-
export interface EdsComponentAvailability {
|
|
37
|
-
angular: boolean;
|
|
38
|
-
react: boolean;
|
|
39
|
-
webcomponents: boolean;
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
/** One catalog entry. `id` is the canonical `eds-*` folder name and the React/WC join key. */
|
|
43
|
-
export interface EdsComponentEntry {
|
|
44
|
-
id: string;
|
|
45
|
-
label: string;
|
|
46
|
-
group: EdsComponentGroup;
|
|
47
|
-
/**
|
|
48
|
-
* The Angular showcase sidebar route (`/showcase-eds/...`). This is the join key the Angular
|
|
49
|
-
* host uses to overlay statusMetadata onto its sidebar tree, since some entries share an `id`
|
|
50
|
-
* across variants (e.g. dialog service vs template) or use non-`eds-*` routes (patterns).
|
|
51
|
-
*/
|
|
52
|
-
angularUrl?: string;
|
|
53
|
-
/** Secondary grouping within a `group` (used by Patterns to cluster related demos, e.g. 'page-header'). */
|
|
54
|
-
subGroup?: string;
|
|
55
|
-
category?: EdsComponentCategory;
|
|
56
|
-
status?: EdsComponentStatus;
|
|
57
|
-
statusColorVariant?: EdsComponentStatusColorVariant;
|
|
58
|
-
figmaLink?: string;
|
|
59
|
-
availability: EdsComponentAvailability;
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
/** The parsed shape of `eds-components.json`. */
|
|
63
|
-
export interface EdsComponentCatalog {
|
|
64
|
-
version: number;
|
|
65
|
-
groups: EdsComponentGroup[];
|
|
66
|
-
components: EdsComponentEntry[];
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
declare const catalog: EdsComponentCatalog;
|
|
70
|
-
export default catalog;
|
|
@@ -1,134 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"$comment": "Shared, framework-agnostic catalog of EDS components consumed by all three showcase hosts (Angular eui-showcase-ux-components, React eui-showcase-react, Web Components eui-showcase-webcomponents). Ships to @eui/eds-styles/dist/assets/eds-components.json. THE ANGULAR eds-links.ts SIDEBAR IS THE SOURCE OF TRUTH — this manifest is the complete union of it, and the Angular host overlays statusMetadata from here (so eds-links.ts no longer carries status data). `id` is the canonical eds-* folder name and the React/WC join key; `angularUrl` is the Angular sidebar route and the Angular join key (needed because some entries share an id, e.g. dialog service vs template, or use non-eds routes like patterns). `availability` flags reflect which showcase actually ships samples; the Angular host derives statusIcons (figma/wc/react) from figmaLink + availability. `category` is the Angular sidebar bucket (atom|action|content|layout); `subGroup` clusters related demos within a group (Patterns); `status` mirrors statusMetadata.status (DRAFT|DEMO); `statusColorVariant` mirrors statusMetadata.colorVariant (info for DRAFT, danger for DEMO).",
|
|
3
|
-
"version": 1,
|
|
4
|
-
"groups": [
|
|
5
|
-
"Design tokens",
|
|
6
|
-
"Shell",
|
|
7
|
-
"EDS validated",
|
|
8
|
-
"Components",
|
|
9
|
-
"Directives",
|
|
10
|
-
"Charts",
|
|
11
|
-
"Utilities",
|
|
12
|
-
"Patterns",
|
|
13
|
-
"Templates"
|
|
14
|
-
],
|
|
15
|
-
"components": [
|
|
16
|
-
{ "id": "eds-design-tokens", "label": "Design tokens", "group": "Design tokens", "angularUrl": "/showcase-eds/design-tokens", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "", "availability": { "angular": true, "react": false, "webcomponents": false } },
|
|
17
|
-
|
|
18
|
-
{ "id": "eds-shell-demos", "label": "Shell demos", "group": "Shell", "angularUrl": "/showcase-eds/shell", "category": "layout", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": false, "webcomponents": false } },
|
|
19
|
-
{ "id": "eds-shell-playground", "label": "Playground", "group": "Shell", "angularUrl": "/showcase-eds/shell/playground", "category": "layout", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": false, "webcomponents": false } },
|
|
20
|
-
{ "id": "eds-shell", "label": "Shell", "group": "Shell", "angularUrl": "/showcase-eds/components/eds-shell", "category": "layout", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
21
|
-
{ "id": "eds-shell-header", "label": "Shell Header", "group": "Shell", "angularUrl": "/showcase-eds/components/eds-shell-header", "category": "layout", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
22
|
-
{ "id": "eds-shell-toolbar", "label": "Shell Toolbar", "group": "Shell", "angularUrl": "/showcase-eds/components/eds-shell-toolbar", "category": "layout", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
23
|
-
{ "id": "eds-user-profile", "label": "User Profile", "group": "Shell", "angularUrl": "/showcase-eds/components/eds-user-profile", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
24
|
-
{ "id": "eds-overlay", "label": "Overlay", "group": "Shell", "angularUrl": "/showcase-eds/components/eds-overlay", "category": "layout", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
25
|
-
{ "id": "eds-language-selector", "label": "Language Selector", "group": "Shell", "angularUrl": "/showcase-eds/components/eds-language-selector", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
26
|
-
|
|
27
|
-
{ "id": "eds-alert", "label": "Alert", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-alert", "category": "content", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "https://www.figma.com/design/lurOi9W7As4dohgypUtA8U/Core-Components?node-id=3556-30014&p=f&t=YkZw9uMoXgcpt6Nk-0", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
28
|
-
{ "id": "eds-avatar", "label": "Avatar", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-avatar", "category": "content", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "https://www.figma.com/design/lurOi9W7As4dohgypUtA8U/Core-Components?node-id=10126-7467&p=f&t=YkZw9uMoXgcpt6Nk-0", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
29
|
-
{ "id": "eds-badge", "label": "Badge", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-badge", "category": "content", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "https://www.figma.com/design/lurOi9W7As4dohgypUtA8U/Core-Components?node-id=6383-156600&p=f&t=YkZw9uMoXgcpt6Nk-0", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
30
|
-
{ "id": "eds-button", "label": "Button", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-button", "category": "action", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "https://www.figma.com/design/lurOi9W7As4dohgypUtA8U/Core-Components?node-id=1-692&p=f&t=YkZw9uMoXgcpt6Nk-0", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
31
|
-
{ "id": "eds-chip", "label": "Chip", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-chip", "category": "content", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "https://www.figma.com/design/lurOi9W7As4dohgypUtA8U/Core-Components?node-id=921-149258&p=f&t=OO4eYEevhyJFTBsz-0", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
32
|
-
{ "id": "eds-chip-list", "label": "Chip List", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-chip-list", "category": "content", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
33
|
-
{ "id": "eds-feedback-message", "label": "Feedback Message", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-feedback-message", "category": "content", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "https://www.figma.com/design/lurOi9W7As4dohgypUtA8U/Core-Components?node-id=21097-26299&p=f&t=YkZw9uMoXgcpt6Nk-0", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
34
|
-
{ "id": "eds-icon", "label": "Icon", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-icon", "category": "atom", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "https://www.figma.com/design/lurOi9W7As4dohgypUtA8U/Core-Components?node-id=10129-17612&p=f&t=OO4eYEevhyJFTBsz-0", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
35
|
-
{ "id": "eds-icon-button", "label": "Icon Button", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-icon-button", "category": "atom", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "https://www.figma.com/design/lurOi9W7As4dohgypUtA8U/Core-Components?node-id=10065-2538&p=f&t=YkZw9uMoXgcpt6Nk-0", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
36
|
-
{ "id": "eds-icon-state", "label": "Icon State", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-icon-state", "category": "atom", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
37
|
-
{ "id": "eds-input-button", "label": "Input Button", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-input-button", "category": "atom", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
38
|
-
{ "id": "eds-input-checkbox", "label": "Input Checkbox", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-input-checkbox", "category": "atom", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "https://www.figma.com/design/lurOi9W7As4dohgypUtA8U/Core-Components?node-id=21097-26306&p=f&t=YkZw9uMoXgcpt6Nk-0", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
39
|
-
{ "id": "eds-input-group", "label": "Input Group", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-input-group", "category": "atom", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "https://www.figma.com/design/lurOi9W7As4dohgypUtA8U/Core-Components?node-id=21097-24355&p=f&t=YkZw9uMoXgcpt6Nk-0", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
40
|
-
{ "id": "eds-input-icon", "label": "Input Icon", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-input-icon", "category": "atom", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
41
|
-
{ "id": "eds-input-number", "label": "Input Number", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-input-number", "category": "atom", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
42
|
-
{ "id": "eds-input-radio", "label": "Input Radio", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-input-radio", "category": "atom", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "https://www.figma.com/design/lurOi9W7As4dohgypUtA8U/Core-Components?node-id=21097-26304&p=f&t=OO4eYEevhyJFTBsz-0", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
43
|
-
{ "id": "eds-input-text", "label": "Input Text", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-input-text", "category": "atom", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "https://www.figma.com/design/lurOi9W7As4dohgypUtA8U/Core-Components?node-id=21097-26302&p=f&t=YkZw9uMoXgcpt6Nk-0", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
44
|
-
{ "id": "eds-link", "label": "Link", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-link", "category": "atom", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "https://www.figma.com/design/lurOi9W7As4dohgypUtA8U/Core-Components?node-id=10183-36762&p=f&t=YkZw9uMoXgcpt6Nk-0", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
45
|
-
{ "id": "eds-loading-indicator", "label": "Loading Indicator", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-loading-indicator", "category": "atom", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
46
|
-
{ "id": "eds-rating", "label": "Rating", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-rating", "category": "atom", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "https://www.figma.com/design/lurOi9W7As4dohgypUtA8U/Core-Components?node-id=12073-32704&p=f&t=OO4eYEevhyJFTBsz-0", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
47
|
-
{ "id": "eds-select", "label": "Select", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-select", "category": "atom", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "https://www.figma.com/design/lurOi9W7As4dohgypUtA8U/Core-Components?node-id=21097-77325&p=f&t=YkZw9uMoXgcpt6Nk-0", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
48
|
-
{ "id": "eds-tabs", "label": "Tabs", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-tabs", "category": "content", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
49
|
-
{ "id": "eds-tag", "label": "Tag", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-tag", "category": "content", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "https://www.figma.com/design/lurOi9W7As4dohgypUtA8U/Core-Components?node-id=355-142743&p=f&t=OO4eYEevhyJFTBsz-0", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
50
|
-
{ "id": "eds-textarea", "label": "Textarea", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-textarea", "category": "atom", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "https://www.figma.com/design/lurOi9W7As4dohgypUtA8U/Core-Components?node-id=21097-77324&p=f&t=YkZw9uMoXgcpt6Nk-0", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
51
|
-
{ "id": "eds-tooltip", "label": "Tooltip", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-tooltip", "category": "content", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "https://www.figma.com/design/lurOi9W7As4dohgypUtA8U/Core-Components?node-id=10153-12798&p=f&t=OO4eYEevhyJFTBsz-0", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
52
|
-
|
|
53
|
-
{ "id": "eds-accordion", "label": "Accordion", "group": "Components", "angularUrl": "/showcase-eds/components/eds-accordion", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
54
|
-
{ "id": "eds-autocomplete", "label": "Autocomplete", "group": "Components", "angularUrl": "/showcase-eds/components/eds-autocomplete", "category": "atom", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
55
|
-
{ "id": "eds-banner", "label": "Banner", "group": "Components", "angularUrl": "/showcase-eds/components/eds-banner", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
56
|
-
{ "id": "eds-block-content", "label": "Block Content", "group": "Components", "angularUrl": "/showcase-eds/components/eds-block-content", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
57
|
-
{ "id": "eds-block-document", "label": "Block Document", "group": "Components", "angularUrl": "/showcase-eds/components/eds-block-document", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
58
|
-
{ "id": "eds-blockquote", "label": "Blockquote", "group": "Components", "angularUrl": "/showcase-eds/components/eds-blockquote", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
59
|
-
{ "id": "eds-breadcrumb", "label": "Breadcrumb", "group": "Components", "angularUrl": "/showcase-eds/components/eds-breadcrumb", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": false, "react": true, "webcomponents": true } },
|
|
60
|
-
{ "id": "eds-button-group", "label": "Button Group", "group": "Components", "angularUrl": "/showcase-eds/components/eds-button-group", "category": "action", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
61
|
-
{ "id": "eds-calendar", "label": "Calendar", "group": "Components", "angularUrl": "/showcase-eds/components/eds-calendar", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
62
|
-
{ "id": "eds-card", "label": "Card", "group": "Components", "angularUrl": "/showcase-eds/components/eds-card", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
63
|
-
{ "id": "eds-carousel", "label": "Carousel", "group": "Components", "angularUrl": "/showcase-eds/components/eds-carousel", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
64
|
-
{ "id": "eds-date-block", "label": "Date Block", "group": "Components", "angularUrl": "/showcase-eds/components/eds-date-block", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
65
|
-
{ "id": "eds-datepicker", "label": "Datepicker", "group": "Components", "angularUrl": "/showcase-eds/components/eds-datepicker", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
66
|
-
{ "id": "eds-dialog-service", "label": "eds-dialog (S)", "group": "Components", "angularUrl": "/showcase-eds/components/eds-dialog-service", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": false, "webcomponents": false } },
|
|
67
|
-
{ "id": "eds-dialog", "label": "eds-dialog (T)", "group": "Components", "angularUrl": "/showcase-eds/components/eds-dialog-template", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
68
|
-
{ "id": "eds-disable-content", "label": "Disable Content", "group": "Components", "angularUrl": "/showcase-eds/components/eds-disable-content", "category": "layout", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
69
|
-
{ "id": "eds-discussion-thread", "label": "Discussion Thread", "group": "Components", "angularUrl": "/showcase-eds/components/eds-discussion-thread", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
70
|
-
{ "id": "eds-dimmer", "label": "Dimmer", "group": "Components", "category": "layout", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": false, "react": true, "webcomponents": false } },
|
|
71
|
-
{ "id": "eds-dropdown", "label": "Dropdown", "group": "Components", "angularUrl": "/showcase-eds/components/eds-dropdown", "category": "action", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
72
|
-
{ "id": "eds-empty-state", "label": "Empty State", "group": "Components", "angularUrl": "/showcase-eds/components/eds-empty-state", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
73
|
-
{ "id": "eds-fab-button", "label": "Fab Button", "group": "Components", "angularUrl": "/showcase-eds/components/eds-fab-button", "category": "action", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
74
|
-
{ "id": "eds-fieldset", "label": "Fieldset", "group": "Components", "angularUrl": "/showcase-eds/components/eds-fieldset", "category": "layout", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
75
|
-
{ "id": "eds-file-upload", "label": "File Upload", "group": "Components", "angularUrl": "/showcase-eds/components/eds-file-upload", "category": "atom", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
76
|
-
{ "id": "eds-growl", "label": "Growl", "group": "Components", "angularUrl": "/showcase-eds/components/eds-growl", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
77
|
-
{ "id": "eds-icon-toggle", "label": "Icon Toggle", "group": "Components", "angularUrl": "/showcase-eds/components/eds-icon-toggle", "category": "atom", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
78
|
-
{ "id": "eds-label", "label": "Label", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-label", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
79
|
-
{ "id": "eds-list", "label": "List", "group": "Components", "angularUrl": "/showcase-eds/components/eds-list", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
80
|
-
{ "id": "eds-menu", "label": "Menu", "group": "Components", "angularUrl": "/showcase-eds/components/eds-menu", "category": "layout", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
81
|
-
{ "id": "eds-message-box-service", "label": "eds-message-box (S)", "group": "Components", "angularUrl": "/showcase-eds/components/eds-message-box-service", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": false, "webcomponents": false } },
|
|
82
|
-
{ "id": "eds-message-box", "label": "eds-message-box (T)", "group": "Components", "angularUrl": "/showcase-eds/components/eds-message-box-template", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
83
|
-
{ "id": "eds-multiselect", "label": "Multiselect", "group": "Components", "angularUrl": "/showcase-eds/components/eds-multiselect", "category": "atom", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
84
|
-
{ "id": "eds-page", "label": "Page", "group": "Components", "angularUrl": "/showcase-eds/components/eds-page", "category": "layout", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
85
|
-
{ "id": "eds-paginator", "label": "Paginator", "group": "Components", "angularUrl": "/showcase-eds/components/eds-paginator", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
86
|
-
{ "id": "eds-popover", "label": "Popover", "group": "Components", "angularUrl": "/showcase-eds/components/eds-popover", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
87
|
-
{ "id": "eds-progress-bar", "label": "Progress Bar", "group": "Components", "angularUrl": "/showcase-eds/components/eds-progress-bar", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "https://www.figma.com/design/lurOi9W7As4dohgypUtA8U/Core-Components?node-id=17377-87742&p=f&t=YkZw9uMoXgcpt6Nk-0", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
88
|
-
{ "id": "eds-progress-circle", "label": "Progress Circle", "group": "Components", "angularUrl": "/showcase-eds/components/eds-progress-circle", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
89
|
-
{ "id": "eds-skeleton", "label": "Skeleton", "group": "Components", "angularUrl": "/showcase-eds/components/eds-skeleton", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
90
|
-
{ "id": "eds-slider", "label": "Slider", "group": "Components", "angularUrl": "/showcase-eds/components/eds-slider", "category": "atom", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
91
|
-
{ "id": "eds-split-button", "label": "Split Button", "group": "Components", "angularUrl": "/showcase-eds/components/eds-split-button", "category": "action", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
92
|
-
{ "id": "eds-swiper", "label": "Swiper", "group": "Components", "angularUrl": "/showcase-eds/components/eds-swiper", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": false, "webcomponents": true } },
|
|
93
|
-
{ "id": "eds-table", "label": "Table", "group": "Components", "angularUrl": "/showcase-eds/components/eds-table", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
94
|
-
{ "id": "eds-tag-group", "label": "Tag Group", "group": "Components", "angularUrl": "/showcase-eds/components/eds-tag-group", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
95
|
-
{ "id": "eds-timeline", "label": "Timeline", "group": "Components", "angularUrl": "/showcase-eds/components/eds-timeline", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
96
|
-
{ "id": "eds-timepicker", "label": "Timepicker", "group": "Components", "angularUrl": "/showcase-eds/components/eds-timepicker", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
97
|
-
{ "id": "eds-toggle", "label": "Toggle", "group": "Components", "angularUrl": "/showcase-eds/components/eds-toggle", "category": "atom", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
98
|
-
{ "id": "eds-tree", "label": "Tree", "group": "Components", "angularUrl": "/showcase-eds/components/eds-tree", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
99
|
-
{ "id": "eds-tree-list", "label": "Tree List", "group": "Components", "angularUrl": "/showcase-eds/components/eds-tree-list", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
100
|
-
{ "id": "eds-wizard", "label": "Wizard", "group": "Components", "angularUrl": "/showcase-eds/components/eds-wizard", "category": "content", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
101
|
-
|
|
102
|
-
{ "id": "eds-text-truncate", "label": "edsTextTruncate", "group": "Directives", "angularUrl": "/showcase-eds/components/eds-text-truncate", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": false, "webcomponents": false } },
|
|
103
|
-
{ "id": "eds-clearable", "label": "edsClearable", "group": "Directives", "angularUrl": "/showcase-eds/components/eds-clearable", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": false, "webcomponents": false } },
|
|
104
|
-
{ "id": "eds-loading", "label": "edsLoading", "group": "Directives", "angularUrl": "/showcase-eds/components/eds-loading", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": false, "webcomponents": false } },
|
|
105
|
-
{ "id": "eds-resizable", "label": "edsResizable", "group": "Directives", "angularUrl": "/showcase-eds/components/eds-resizable", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": false, "webcomponents": false } },
|
|
106
|
-
|
|
107
|
-
{ "id": "eds-chart", "label": "eds-chart", "group": "Charts", "angularUrl": "/showcase-eds/charts/eds-chart", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
108
|
-
{ "id": "eds-chart-legend", "label": "eds-chart-legend", "group": "Charts", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": false, "react": true, "webcomponents": false } },
|
|
109
|
-
{ "id": "eds-sparkline", "label": "eds-sparkline", "group": "Charts", "angularUrl": "/showcase-eds/charts/eds-sparkline", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
110
|
-
{ "id": "eds-geo-chart", "label": "eds-geo-chart", "group": "Charts", "angularUrl": "/showcase-eds/charts/eds-geo-chart", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
111
|
-
{ "id": "eds-gauge-chart", "label": "eds-gauge-chart", "group": "Charts", "angularUrl": "/showcase-eds/charts/eds-gauge-chart", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
112
|
-
|
|
113
|
-
{ "id": "eds-flex-layout", "label": "Flex Layout", "group": "Utilities", "angularUrl": "/showcase-eds/utilities/eds-flex-layout", "category": "layout", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
114
|
-
{ "id": "eds-grid-layout", "label": "Grid Layout", "group": "Utilities", "angularUrl": "/showcase-eds/utilities/eds-grid-layout", "category": "layout", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
115
|
-
|
|
116
|
-
{ "id": "pattern-page-header-anatomy", "label": "Page header - anatomy", "group": "Patterns", "subGroup": "page-header", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": false, "react": true, "webcomponents": false } },
|
|
117
|
-
{ "id": "pattern-page-header-simple", "label": "Page header - simple", "group": "Patterns", "subGroup": "page-header", "angularUrl": "/showcase-eds/patterns/page-header/simple", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
118
|
-
{ "id": "pattern-page-header-advanced", "label": "Page header - advanced", "group": "Patterns", "subGroup": "page-header", "angularUrl": "/showcase-eds/patterns/page-header/advanced", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
119
|
-
{ "id": "pattern-page-layout-simple", "label": "Page layout - simple", "group": "Patterns", "subGroup": "page-layout", "angularUrl": "/showcase-eds/patterns/page-layout/simple", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
120
|
-
{ "id": "pattern-page-layout-columns", "label": "Page layout - columns", "group": "Patterns", "subGroup": "page-layout", "angularUrl": "/showcase-eds/patterns/page-layout/columns", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
121
|
-
{ "id": "pattern-page-layout-navigation", "label": "Page layout - navigation", "group": "Patterns", "subGroup": "page-layout", "angularUrl": "/showcase-eds/patterns/page-layout/navigation", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
122
|
-
{ "id": "pattern-page-list-cards-list-simple", "label": "Page list - cards list simple", "group": "Patterns", "subGroup": "page-list", "angularUrl": "/showcase-eds/patterns/page-list/cards-list-simple", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
123
|
-
{ "id": "pattern-page-list-cards-filter", "label": "Page list - cards filter", "group": "Patterns", "subGroup": "page-list", "angularUrl": "/showcase-eds/patterns/page-list/cards-filter", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
124
|
-
{ "id": "pattern-page-list-cards-selection", "label": "Page list - cards selection", "group": "Patterns", "subGroup": "page-list", "angularUrl": "/showcase-eds/patterns/page-list/cards-selection", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
125
|
-
{ "id": "pattern-page-list-cards-variants", "label": "Page list - cards variants", "group": "Patterns", "subGroup": "page-list", "angularUrl": "/showcase-eds/patterns/page-list/cards-variants", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
126
|
-
{ "id": "pattern-page-details-simple", "label": "Page details - simple", "group": "Patterns", "subGroup": "page-details", "angularUrl": "/showcase-eds/patterns/page-details/simple", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
127
|
-
{ "id": "pattern-page-details-advanced", "label": "Page details - advanced", "group": "Patterns", "subGroup": "page-details", "angularUrl": "/showcase-eds/patterns/page-details/advanced", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
128
|
-
{ "id": "pattern-table-list-anatomy", "label": "Table list - anatomy", "group": "Patterns", "subGroup": "table-list", "angularUrl": "/showcase-eds/patterns/table-list/anatomy", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
129
|
-
|
|
130
|
-
{ "id": "template-notifications", "label": "Notifications", "group": "Templates", "angularUrl": "/showcase-eds/templates/notifications", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
131
|
-
{ "id": "template-filter-card-grid", "label": "Filter Card Grid", "group": "Templates", "angularUrl": "/showcase-eds/templates/filter-card-grid", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
132
|
-
{ "id": "template-dashboard-1", "label": "Dashboard", "group": "Templates", "angularUrl": "/showcase-eds/templates/dashboard-1", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } }
|
|
133
|
-
]
|
|
134
|
-
}
|