@eui/eds-shared 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/README.md +44 -0
- package/assets/eds-components.json +139 -0
- package/catalog/eds-components.d.ts +54 -0
- package/catalog/eds-components.d.ts.map +1 -0
- package/catalog/eds-components.js +16 -0
- package/catalog/eds-components.js.map +1 -0
- package/catalog/index.d.ts +5 -0
- package/catalog/index.d.ts.map +1 -0
- package/catalog/index.js +11 -0
- package/catalog/index.js.map +1 -0
- package/constants/index.d.ts +5 -0
- package/constants/index.d.ts.map +1 -0
- package/constants/index.js +6 -0
- package/constants/index.js.map +1 -0
- package/index.d.ts +3 -0
- package/index.d.ts.map +1 -0
- package/index.js +8 -0
- package/index.js.map +1 -0
- package/package.json +37 -0
package/README.md
ADDED
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
# @eui/eds-shared
|
|
2
|
+
|
|
3
|
+
Framework-agnostic **pure-TypeScript** primitives shared across the EDS projections:
|
|
4
|
+
|
|
5
|
+
- `@eui/eds` — Angular components
|
|
6
|
+
- `@eui/eds-react` — React components
|
|
7
|
+
- `@eui/eds-wc` — Lit Web Components
|
|
8
|
+
|
|
9
|
+
This package holds only portable code: shared **types**, **string unions**, **constants**, and small
|
|
10
|
+
**helpers**. It has **no framework dependency** — nothing here may import Angular, React, Lit, or any
|
|
11
|
+
DOM-framework runtime, so every projection can consume it without pulling in another framework.
|
|
12
|
+
|
|
13
|
+
## Build
|
|
14
|
+
|
|
15
|
+
```
|
|
16
|
+
cmd /c "rtk npm run pkg:build eui-eds-shared" 2>&1
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
The package is a CSDR `customBuild` TypeScript package: the build runs `tsc -p tsconfig.json`,
|
|
20
|
+
emitting `dist/`.
|
|
21
|
+
|
|
22
|
+
## Usage
|
|
23
|
+
|
|
24
|
+
```ts
|
|
25
|
+
import { EDS_CONTEXT_CLASS } from '@eui/eds-shared';
|
|
26
|
+
```
|
|
27
|
+
|
|
28
|
+
## EDS component catalog
|
|
29
|
+
|
|
30
|
+
`eds-components.json` is the **single source of truth** for all three EDS showcase hosts (Angular,
|
|
31
|
+
React, Web Components) — component listing, grouping, ordering, category, status and availability.
|
|
32
|
+
It moved here from `@eui/eds-styles/assets`. Consume it either strongly typed via the barrel, or as
|
|
33
|
+
a raw JSON asset:
|
|
34
|
+
|
|
35
|
+
```ts
|
|
36
|
+
// Typed (recommended) — data + types from the barrel:
|
|
37
|
+
import { edsComponentCatalog, type EdsComponentEntry } from '@eui/eds-shared';
|
|
38
|
+
|
|
39
|
+
// Raw JSON asset:
|
|
40
|
+
import catalog from '@eui/eds-shared/assets/eds-components.json' with { type: 'json' };
|
|
41
|
+
```
|
|
42
|
+
|
|
43
|
+
When adding, moving, or removing a component, edit `src/assets/eds-components.json` first, then
|
|
44
|
+
reflect it in each showcase's sidebar/registry.
|
|
@@ -0,0 +1,139 @@
|
|
|
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-shared/dist/assets/eds-components.json. THIS MANIFEST IS THE SINGLE SOURCE OF TRUTH FOR ALL SHOWCASES (Angular, React, Web Components) — component listing, grouping, ordering, category, status and availability all originate here. The Angular eds-links.ts sidebar, the React DemoEntry groups and the Web Components registry are all derived from / reconciled against this manifest (they no longer carry authoritative status data; they overlay statusMetadata from here). When adding, moving or removing a component, edit this manifest first, then reflect it in each showcase's sidebar/registry. `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
|
+
"Dev guide",
|
|
6
|
+
"Design tokens",
|
|
7
|
+
"Shell",
|
|
8
|
+
"EDS validated",
|
|
9
|
+
"Components",
|
|
10
|
+
"Directives",
|
|
11
|
+
"Charts",
|
|
12
|
+
"Utilities",
|
|
13
|
+
"Patterns",
|
|
14
|
+
"Templates"
|
|
15
|
+
],
|
|
16
|
+
"components": [
|
|
17
|
+
{ "id": "eds-introduction", "label": "Introduction", "group": "Dev guide", "angularUrl": "/showcase-eds/dev-guide/00-introduction", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "", "availability": { "angular": true, "react": false, "webcomponents": false } },
|
|
18
|
+
{ "id": "eds-architecture-overview", "label": "Architecture overview", "group": "Dev guide", "angularUrl": "/showcase-eds/dev-guide/00-architecture-overview", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "", "availability": { "angular": true, "react": false, "webcomponents": false } },
|
|
19
|
+
{ "id": "eds-prerequisites", "label": "Prerequisites", "group": "Dev guide", "angularUrl": "/showcase-eds/dev-guide/01-01-prerequisites", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "", "availability": { "angular": true, "react": false, "webcomponents": false } },
|
|
20
|
+
{ "id": "eds-eui-cli", "label": "eUI CLI", "group": "Dev guide", "angularUrl": "/showcase-eds/dev-guide/01-02-eui-cli", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "", "availability": { "angular": true, "react": false, "webcomponents": false } },
|
|
21
|
+
{ "id": "eds-tokens-colors", "label": "Colors", "group": "Design tokens", "angularUrl": "/showcase-eds/design-tokens/eds-tokens-colors", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "", "availability": { "angular": true, "react": false, "webcomponents": false } },
|
|
22
|
+
{ "id": "eds-tokens-typography", "label": "Typography", "group": "Design tokens", "angularUrl": "/showcase-eds/design-tokens/eds-tokens-typography", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "", "availability": { "angular": true, "react": false, "webcomponents": false } },
|
|
23
|
+
{ "id": "eds-tokens-others", "label": "Others", "group": "Design tokens", "angularUrl": "/showcase-eds/design-tokens/eds-tokens-others", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "", "availability": { "angular": true, "react": false, "webcomponents": false } },
|
|
24
|
+
{ "id": "eds-assets-logos", "label": "Logos", "group": "Design tokens", "angularUrl": "/showcase-eds/design-tokens/eds-assets-logos", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "", "availability": { "angular": true, "react": false, "webcomponents": false } },
|
|
25
|
+
{ "id": "eds-assets-icons", "label": "Icons", "group": "Design tokens", "angularUrl": "/showcase-eds/design-tokens/eds-assets-icons", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "", "availability": { "angular": true, "react": false, "webcomponents": false } },
|
|
26
|
+
{ "id": "eds-grid-system", "label": "Grid system", "group": "Design tokens", "angularUrl": "/showcase-eds/design-tokens/eds-grid-system", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "", "availability": { "angular": true, "react": false, "webcomponents": false } },
|
|
27
|
+
{ "id": "eds-utilities", "label": "Utilities", "group": "Design tokens", "angularUrl": "/showcase-eds/design-tokens/eds-utilities", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "", "availability": { "angular": true, "react": false, "webcomponents": false } },
|
|
28
|
+
{ "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 } },
|
|
29
|
+
{ "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 } },
|
|
30
|
+
{ "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 } },
|
|
31
|
+
{ "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 } },
|
|
32
|
+
{ "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 } },
|
|
33
|
+
{ "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 } },
|
|
34
|
+
{ "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 } },
|
|
35
|
+
{ "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 } },
|
|
36
|
+
{ "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 } },
|
|
37
|
+
{ "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 } },
|
|
38
|
+
{ "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 } },
|
|
39
|
+
{ "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 } },
|
|
40
|
+
{ "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 } },
|
|
41
|
+
{ "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 } },
|
|
42
|
+
{ "id": "eds-empty-state", "label": "Empty State", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-empty-state", "category": "content", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
43
|
+
{ "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 } },
|
|
44
|
+
{ "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 } },
|
|
45
|
+
{ "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 } },
|
|
46
|
+
{ "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 } },
|
|
47
|
+
{ "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 } },
|
|
48
|
+
{ "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 } },
|
|
49
|
+
{ "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 } },
|
|
50
|
+
{ "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 } },
|
|
51
|
+
{ "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 } },
|
|
52
|
+
{ "id": "eds-input-password", "label": "Input Password", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-input-password", "category": "atom", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
53
|
+
{ "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 } },
|
|
54
|
+
{ "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 } },
|
|
55
|
+
{ "id": "eds-label", "label": "Label", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-label", "category": "content", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
56
|
+
{ "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 } },
|
|
57
|
+
{ "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 } },
|
|
58
|
+
{ "id": "eds-multiselect", "label": "Multiselect", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-multiselect", "category": "atom", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
59
|
+
{ "id": "eds-popover", "label": "Popover", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-popover", "category": "content", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
60
|
+
{ "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 } },
|
|
61
|
+
{ "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 } },
|
|
62
|
+
{ "id": "eds-switch", "label": "Switch", "group": "EDS validated", "angularUrl": "/showcase-eds/components/eds-switch", "category": "atom", "status": "DRAFT", "statusColorVariant": "info", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": true } },
|
|
63
|
+
{ "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 } },
|
|
64
|
+
{ "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 } },
|
|
65
|
+
{ "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 } },
|
|
66
|
+
{ "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 } },
|
|
67
|
+
{ "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 } },
|
|
68
|
+
{ "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 } },
|
|
69
|
+
{ "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 } },
|
|
70
|
+
{ "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 } },
|
|
71
|
+
{ "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 } },
|
|
72
|
+
{ "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 } },
|
|
73
|
+
{ "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 } },
|
|
74
|
+
{ "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 } },
|
|
75
|
+
{ "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 } },
|
|
76
|
+
{ "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 } },
|
|
77
|
+
{ "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 } },
|
|
78
|
+
{ "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 } },
|
|
79
|
+
{ "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 } },
|
|
80
|
+
{ "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 } },
|
|
81
|
+
{ "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 } },
|
|
82
|
+
{ "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 } },
|
|
83
|
+
{ "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 } },
|
|
84
|
+
{ "id": "eds-dimmer", "label": "Dimmer", "group": "Components", "category": "layout", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": false, "react": true, "webcomponents": false } },
|
|
85
|
+
{ "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 } },
|
|
86
|
+
{ "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 } },
|
|
87
|
+
{ "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 } },
|
|
88
|
+
{ "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 } },
|
|
89
|
+
{ "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 } },
|
|
90
|
+
{ "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 } },
|
|
91
|
+
{ "id": "eds-input-prompt", "label": "Input Prompt", "group": "Components", "angularUrl": "/showcase-eds/components/eds-input-prompt", "category": "atom", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
92
|
+
{ "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 } },
|
|
93
|
+
{ "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 } },
|
|
94
|
+
{ "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 } },
|
|
95
|
+
{ "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 } },
|
|
96
|
+
{ "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 } },
|
|
97
|
+
{ "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 } },
|
|
98
|
+
{ "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 } },
|
|
99
|
+
{ "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 } },
|
|
100
|
+
{ "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 } },
|
|
101
|
+
{ "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 } },
|
|
102
|
+
{ "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 } },
|
|
103
|
+
{ "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 } },
|
|
104
|
+
{ "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 } },
|
|
105
|
+
{ "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 } },
|
|
106
|
+
{ "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 } },
|
|
107
|
+
{ "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 } },
|
|
108
|
+
{ "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 } },
|
|
109
|
+
{ "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 } },
|
|
110
|
+
{ "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 } },
|
|
111
|
+
{ "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 } },
|
|
112
|
+
{ "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 } },
|
|
113
|
+
{ "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 } },
|
|
114
|
+
{ "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 } },
|
|
115
|
+
{ "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 } },
|
|
116
|
+
{ "id": "eds-chart-legend", "label": "eds-chart-legend", "group": "Charts", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": false, "react": true, "webcomponents": false } },
|
|
117
|
+
{ "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 } },
|
|
118
|
+
{ "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 } },
|
|
119
|
+
{ "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 } },
|
|
120
|
+
{ "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 } },
|
|
121
|
+
{ "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 } },
|
|
122
|
+
{ "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 } },
|
|
123
|
+
{ "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 } },
|
|
124
|
+
{ "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 } },
|
|
125
|
+
{ "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 } },
|
|
126
|
+
{ "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 } },
|
|
127
|
+
{ "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 } },
|
|
128
|
+
{ "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 } },
|
|
129
|
+
{ "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 } },
|
|
130
|
+
{ "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 } },
|
|
131
|
+
{ "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 } },
|
|
132
|
+
{ "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 } },
|
|
133
|
+
{ "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 } },
|
|
134
|
+
{ "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 } },
|
|
135
|
+
{ "id": "template-notifications", "label": "Notifications", "group": "Templates", "angularUrl": "/showcase-eds/templates/notifications", "status": "DEMO", "statusColorVariant": "danger", "figmaLink": "", "availability": { "angular": true, "react": true, "webcomponents": false } },
|
|
136
|
+
{ "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 } },
|
|
137
|
+
{ "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 } }
|
|
138
|
+
]
|
|
139
|
+
}
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Type definitions for the shared EDS component catalog (`eds-components.json`).
|
|
3
|
+
*
|
|
4
|
+
* This manifest is the single source of truth for all three EDS showcase hosts (Angular, React,
|
|
5
|
+
* Web Components). It carries only the framework-agnostic catalog fields; each host attaches its
|
|
6
|
+
* own runtime binding (route/export for Angular, `Samples` component for React/WC) by matching on
|
|
7
|
+
* `id`, and filters the list by the relevant `availability` flag.
|
|
8
|
+
*
|
|
9
|
+
* Import the catalog + its types from the package barrel:
|
|
10
|
+
* import { edsComponentCatalog, type EdsComponentEntry } from '@eui/eds-shared';
|
|
11
|
+
*
|
|
12
|
+
* The raw JSON is also shipped for consumers that prefer a JSON import:
|
|
13
|
+
* import catalog from '@eui/eds-shared/assets/eds-components.json' with { type: 'json' };
|
|
14
|
+
*/
|
|
15
|
+
/** Top-level sidebar grouping (matches the Angular EDS showcase sections). */
|
|
16
|
+
export type EdsComponentGroup = 'Design tokens' | 'Shell' | 'EDS validated' | 'Components' | 'Directives' | 'Charts' | 'Utilities' | 'Patterns' | 'Templates';
|
|
17
|
+
/** Angular sidebar bucket for a component (drives the `category` on the Angular link). */
|
|
18
|
+
export type EdsComponentCategory = 'atom' | 'action' | 'content' | 'layout';
|
|
19
|
+
/** Documentation maturity, mirroring the Angular `statusMetadata.status`. */
|
|
20
|
+
export type EdsComponentStatus = 'DRAFT' | 'DEMO';
|
|
21
|
+
/** Status badge color, mirroring the Angular `statusMetadata.colorVariant` (info for DRAFT, danger for DEMO). */
|
|
22
|
+
export type EdsComponentStatusColorVariant = 'info' | 'danger';
|
|
23
|
+
/** Which showcase hosts actually ship samples for a component. */
|
|
24
|
+
export interface EdsComponentAvailability {
|
|
25
|
+
angular: boolean;
|
|
26
|
+
react: boolean;
|
|
27
|
+
webcomponents: boolean;
|
|
28
|
+
}
|
|
29
|
+
/** One catalog entry. `id` is the canonical `eds-*` folder name and the React/WC join key. */
|
|
30
|
+
export interface EdsComponentEntry {
|
|
31
|
+
id: string;
|
|
32
|
+
label: string;
|
|
33
|
+
group: EdsComponentGroup;
|
|
34
|
+
/**
|
|
35
|
+
* The Angular showcase sidebar route (`/showcase-eds/...`). This is the join key the Angular
|
|
36
|
+
* host uses to overlay statusMetadata onto its sidebar tree, since some entries share an `id`
|
|
37
|
+
* across variants (e.g. dialog service vs template) or use non-`eds-*` routes (patterns).
|
|
38
|
+
*/
|
|
39
|
+
angularUrl?: string;
|
|
40
|
+
/** Secondary grouping within a `group` (used by Patterns to cluster related demos, e.g. 'page-header'). */
|
|
41
|
+
subGroup?: string;
|
|
42
|
+
category?: EdsComponentCategory;
|
|
43
|
+
status?: EdsComponentStatus;
|
|
44
|
+
statusColorVariant?: EdsComponentStatusColorVariant;
|
|
45
|
+
figmaLink?: string;
|
|
46
|
+
availability: EdsComponentAvailability;
|
|
47
|
+
}
|
|
48
|
+
/** The parsed shape of `eds-components.json`. */
|
|
49
|
+
export interface EdsComponentCatalog {
|
|
50
|
+
version: number;
|
|
51
|
+
groups: EdsComponentGroup[];
|
|
52
|
+
components: EdsComponentEntry[];
|
|
53
|
+
}
|
|
54
|
+
//# sourceMappingURL=eds-components.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"eds-components.d.ts","sourceRoot":"","sources":["../../src/catalog/eds-components.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AAEH,8EAA8E;AAC9E,MAAM,MAAM,iBAAiB,GACvB,eAAe,GACf,OAAO,GACP,eAAe,GACf,YAAY,GACZ,YAAY,GACZ,QAAQ,GACR,WAAW,GACX,UAAU,GACV,WAAW,CAAC;AAElB,0FAA0F;AAC1F,MAAM,MAAM,oBAAoB,GAAG,MAAM,GAAG,QAAQ,GAAG,SAAS,GAAG,QAAQ,CAAC;AAE5E,6EAA6E;AAC7E,MAAM,MAAM,kBAAkB,GAAG,OAAO,GAAG,MAAM,CAAC;AAElD,iHAAiH;AACjH,MAAM,MAAM,8BAA8B,GAAG,MAAM,GAAG,QAAQ,CAAC;AAE/D,kEAAkE;AAClE,MAAM,WAAW,wBAAwB;IACrC,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,OAAO,CAAC;IACf,aAAa,EAAE,OAAO,CAAC;CAC1B;AAED,8FAA8F;AAC9F,MAAM,WAAW,iBAAiB;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,iBAAiB,CAAC;IACzB;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,2GAA2G;IAC3G,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,oBAAoB,CAAC;IAChC,MAAM,CAAC,EAAE,kBAAkB,CAAC;IAC5B,kBAAkB,CAAC,EAAE,8BAA8B,CAAC;IACpD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,wBAAwB,CAAC;CAC1C;AAED,iDAAiD;AACjD,MAAM,WAAW,mBAAmB;IAChC,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,iBAAiB,EAAE,CAAC;IAC5B,UAAU,EAAE,iBAAiB,EAAE,CAAC;CACnC"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Type definitions for the shared EDS component catalog (`eds-components.json`).
|
|
3
|
+
*
|
|
4
|
+
* This manifest is the single source of truth for all three EDS showcase hosts (Angular, React,
|
|
5
|
+
* Web Components). It carries only the framework-agnostic catalog fields; each host attaches its
|
|
6
|
+
* own runtime binding (route/export for Angular, `Samples` component for React/WC) by matching on
|
|
7
|
+
* `id`, and filters the list by the relevant `availability` flag.
|
|
8
|
+
*
|
|
9
|
+
* Import the catalog + its types from the package barrel:
|
|
10
|
+
* import { edsComponentCatalog, type EdsComponentEntry } from '@eui/eds-shared';
|
|
11
|
+
*
|
|
12
|
+
* The raw JSON is also shipped for consumers that prefer a JSON import:
|
|
13
|
+
* import catalog from '@eui/eds-shared/assets/eds-components.json' with { type: 'json' };
|
|
14
|
+
*/
|
|
15
|
+
export {};
|
|
16
|
+
//# sourceMappingURL=eds-components.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"eds-components.js","sourceRoot":"","sources":["../../src/catalog/eds-components.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG"}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import type { EdsComponentCatalog } from './eds-components';
|
|
2
|
+
export * from './eds-components';
|
|
3
|
+
/** The parsed, strongly-typed EDS component catalog (from `eds-components.json`). */
|
|
4
|
+
export declare const edsComponentCatalog: EdsComponentCatalog;
|
|
5
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/catalog/index.ts"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAE5D,cAAc,kBAAkB,CAAC;AAEjC,qFAAqF;AACrF,eAAO,MAAM,mBAAmB,EAAE,mBAAoD,CAAC"}
|
package/catalog/index.js
ADDED
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
// Typed accessor for the shared EDS component catalog.
|
|
2
|
+
//
|
|
3
|
+
// The raw data lives in ../assets/eds-components.json (also shipped as a JSON asset for
|
|
4
|
+
// consumers that prefer a direct JSON import). Here we import it once and re-export it
|
|
5
|
+
// strongly typed as EdsComponentCatalog, so barrel consumers get types for free:
|
|
6
|
+
// import { edsComponentCatalog, type EdsComponentEntry } from '@eui/eds-shared';
|
|
7
|
+
import catalog from '../assets/eds-components.json';
|
|
8
|
+
export * from './eds-components';
|
|
9
|
+
/** The parsed, strongly-typed EDS component catalog (from `eds-components.json`). */
|
|
10
|
+
export const edsComponentCatalog = catalog;
|
|
11
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/catalog/index.ts"],"names":[],"mappings":"AAAA,uDAAuD;AACvD,EAAE;AACF,wFAAwF;AACxF,uFAAuF;AACvF,iFAAiF;AACjF,mFAAmF;AACnF,OAAO,OAAO,MAAM,+BAA+B,CAAC;AAGpD,cAAc,kBAAkB,CAAC;AAEjC,qFAAqF;AACrF,MAAM,CAAC,MAAM,mBAAmB,GAAwB,OAA8B,CAAC"}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
/** The context class an EDS host document must carry for `--eds-*` design tokens to resolve. */
|
|
2
|
+
export declare const EDS_CONTEXT_CLASS = "eui-21";
|
|
3
|
+
/** Default base path under which EDS design assets (icon sprites, fonts) are served. */
|
|
4
|
+
export declare const EDS_ASSETS_BASE = "assets";
|
|
5
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/constants/index.ts"],"names":[],"mappings":"AAEA,gGAAgG;AAChG,eAAO,MAAM,iBAAiB,WAAW,CAAC;AAE1C,wFAAwF;AACxF,eAAO,MAAM,eAAe,WAAW,CAAC"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
// EDS shared constants + framework-agnostic types.
|
|
2
|
+
/** The context class an EDS host document must carry for `--eds-*` design tokens to resolve. */
|
|
3
|
+
export const EDS_CONTEXT_CLASS = 'eui-21';
|
|
4
|
+
/** Default base path under which EDS design assets (icon sprites, fonts) are served. */
|
|
5
|
+
export const EDS_ASSETS_BASE = 'assets';
|
|
6
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/constants/index.ts"],"names":[],"mappings":"AAAA,mDAAmD;AAEnD,gGAAgG;AAChG,MAAM,CAAC,MAAM,iBAAiB,GAAG,QAAQ,CAAC;AAE1C,wFAAwF;AACxF,MAAM,CAAC,MAAM,eAAe,GAAG,QAAQ,CAAC"}
|
package/index.d.ts
ADDED
package/index.d.ts.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAKA,cAAc,mBAAmB,CAAC;AAClC,cAAc,iBAAiB,CAAC"}
|
package/index.js
ADDED
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
// @eui/eds-shared — framework-agnostic barrel.
|
|
2
|
+
//
|
|
3
|
+
// Pure TypeScript primitives (types, unions, constants, small helpers) shared across the
|
|
4
|
+
// EDS projections: @eui/eds (Angular), @eui/eds-react (React), @eui/eds-wc (Lit Web Components).
|
|
5
|
+
// Nothing here may import Angular, React, Lit, or any DOM-framework runtime — keep it portable.
|
|
6
|
+
export * from './constants/index';
|
|
7
|
+
export * from './catalog/index';
|
|
8
|
+
//# sourceMappingURL=index.js.map
|
package/index.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,+CAA+C;AAC/C,EAAE;AACF,yFAAyF;AACzF,iGAAiG;AACjG,gGAAgG;AAChG,cAAc,mBAAmB,CAAC;AAClC,cAAc,iBAAiB,CAAC"}
|
package/package.json
ADDED
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@eui/eds-shared",
|
|
3
|
+
"version": "22.0.0-alpha.26",
|
|
4
|
+
"description": "EDS Shared — framework-agnostic pure-TypeScript primitives (types, unions, constants, helpers) shared across the @eui/eds Angular, @eui/eds-react and @eui/eds-wc projections. No framework dependency.",
|
|
5
|
+
"homepage": "https://eui.ecdevops.eu",
|
|
6
|
+
"author": "ec.europa.eui@gmail.com",
|
|
7
|
+
"license": "EUPL-1.1",
|
|
8
|
+
"type": "module",
|
|
9
|
+
"main": "./index.js",
|
|
10
|
+
"module": "./index.js",
|
|
11
|
+
"types": "./index.d.ts",
|
|
12
|
+
"sideEffects": false,
|
|
13
|
+
"exports": {
|
|
14
|
+
".": {
|
|
15
|
+
"types": "./index.d.ts",
|
|
16
|
+
"default": "./index.js"
|
|
17
|
+
},
|
|
18
|
+
"./assets/eds-components.json": "./assets/eds-components.json"
|
|
19
|
+
},
|
|
20
|
+
"files": [
|
|
21
|
+
"**/*.js",
|
|
22
|
+
"**/*.d.ts",
|
|
23
|
+
"**/*.d.ts.map",
|
|
24
|
+
"**/*.js.map",
|
|
25
|
+
"assets/**/*.json",
|
|
26
|
+
"package.json",
|
|
27
|
+
"README.md"
|
|
28
|
+
],
|
|
29
|
+
"engines": {
|
|
30
|
+
"node": "^20.19.0 || ^22.12.0 || >=24.0.0"
|
|
31
|
+
},
|
|
32
|
+
"repository": {
|
|
33
|
+
"type": "git",
|
|
34
|
+
"url": "https://sdlc.webcloud.ec.europa.eu/csdr/eui/eui.git"
|
|
35
|
+
},
|
|
36
|
+
"tag": "next"
|
|
37
|
+
}
|