@ebrains/react 1.0.0 → 1.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (59) hide show
  1. package/components-section.entry.esm.js +1 -1
  2. package/eds-accordion.entry.esm.js +9 -9
  3. package/eds-alert.entry.esm.js +2 -2
  4. package/{eds-avatar_34.entry.esm.js → eds-avatar_28.entry.esm.js} +676 -747
  5. package/eds-breadcrumb.entry.esm.js +179 -0
  6. package/eds-card-desc_2.entry.esm.js +85 -0
  7. package/eds-card-generic.entry.esm.js +114 -0
  8. package/eds-card-project.entry.esm.js +10 -10
  9. package/eds-card-tags.entry.esm.js +1 -1
  10. package/eds-card-tool.entry.esm.js +4 -4
  11. package/eds-code-block.entry.esm.js +7 -7
  12. package/eds-gauge.entry.esm.js +78 -0
  13. package/eds-icon-arrow-diagonal.entry.esm.js +1 -1
  14. package/eds-icon-arrow-right.entry.esm.js +1 -1
  15. package/eds-icon-bluesky.entry.esm.js +1 -1
  16. package/eds-icon-bookmark.entry.esm.js +1 -1
  17. package/eds-icon-chevron-down.entry.esm.js +1 -1
  18. package/eds-icon-chevron-left.entry.esm.js +1 -1
  19. package/eds-icon-chevron-right.entry.esm.js +1 -1
  20. package/eds-icon-chevron-up.entry.esm.js +1 -1
  21. package/eds-icon-close.entry.esm.js +1 -1
  22. package/eds-icon-copy.entry.esm.js +1 -1
  23. package/eds-icon-eu.entry.esm.js +1 -1
  24. package/eds-icon-external.entry.esm.js +1 -1
  25. package/eds-icon-facebook.entry.esm.js +1 -1
  26. package/eds-icon-gitlab.entry.esm.js +1 -1
  27. package/eds-icon-linkedin.entry.esm.js +1 -1
  28. package/eds-icon-loader.entry.esm.js +1 -1
  29. package/eds-icon-mastodon.entry.esm.js +1 -1
  30. package/eds-icon-menu.entry.esm.js +1 -1
  31. package/eds-icon-minus.entry.esm.js +1 -1
  32. package/eds-icon-more.entry.esm.js +1 -1
  33. package/eds-icon-paper.entry.esm.js +1 -1
  34. package/eds-icon-plus.entry.esm.js +1 -1
  35. package/eds-icon-portal.entry.esm.js +1 -1
  36. package/eds-icon-private.entry.esm.js +1 -1
  37. package/eds-icon-public.entry.esm.js +1 -1
  38. package/eds-icon-search.entry.esm.js +1 -1
  39. package/eds-icon-star.entry.esm.js +1 -1
  40. package/eds-icon-success.entry.esm.js +1 -1
  41. package/eds-icon-thumbs-down.entry.esm.js +1 -1
  42. package/eds-icon-thumbs-up.entry.esm.js +1 -1
  43. package/eds-icon-tutorial.entry.esm.js +1 -1
  44. package/eds-icon-twitter.entry.esm.js +1 -1
  45. package/eds-icon-unknown.entry.esm.js +1 -1
  46. package/eds-icon-updown.entry.esm.js +1 -1
  47. package/eds-icon-user.entry.esm.js +1 -1
  48. package/eds-icon-youtube.entry.esm.js +1 -1
  49. package/eds-pie.entry.esm.js +131 -0
  50. package/eds-progress-bar.entry.esm.js +4 -4
  51. package/eds-rating.entry.esm.js +1 -1
  52. package/eds-section-core_2.entry.esm.js +5 -5
  53. package/eds-spinner.entry.esm.js +3 -3
  54. package/eds-switch.entry.esm.js +5 -5
  55. package/eds-tooltip.entry.esm.js +41 -0
  56. package/index.esm2.js +23 -5
  57. package/package.json +1 -1
  58. package/token-spacing.entry.esm.js +93 -0
  59. package/eds-pagination_2.entry.esm.js +0 -493
@@ -1,7 +1,7 @@
1
- import { r as registerInstance, h, g as getElement, c as createEvent, H as Host } from './index.esm2.js';
2
- import { p as parseData } from './sharedUtils-a550989c.esm.js';
1
+ import { r as registerInstance, h, g as getElement, c as createEvent } from './index.esm2.js';
3
2
  import { s as sendAnalytics } from './analytics-d99780e3.esm.js';
4
3
  import { c as cva } from './index-39c58238.esm.js';
4
+ import { p as parseData } from './sharedUtils-a550989c.esm.js';
5
5
  import { h as hLogoColor } from './logo-color-7f1fd803.esm.js';
6
6
  import { h as hLogoBlack, a as hLogoColorWhite, b as hLogoWhite, c as hLogoWhiteNoBg, v as vLogoColor, d as vLogoBlack, e as vLogoColorWhite, f as vLogoWhite, g as vLogoWhiteNoBg } from './logo-white-no-bg-f382f86f.esm.js';
7
7
  import 'react';
@@ -54,7 +54,7 @@ const EdsAvatar = class {
54
54
  */
55
55
  render() {
56
56
  return h("div", {
57
- key: '7c207192778b86ce5a24816637cf6e6239310eca',
57
+ key: 'b7eff7ae1a1dea3509041e39316b49b673dbdf17',
58
58
  class: this.containerClasses
59
59
  }, this.picture ? h("eds-img", {
60
60
  src: this.picture,
@@ -80,183 +80,12 @@ const EdsBlockBreak = class {
80
80
  }
81
81
  render() {
82
82
  return h("hr", {
83
- key: 'fe48c93d6cb5648749bc050599fdfcb1712d1291',
83
+ key: 'b604a776cae7edeee189e00af6993b42b57203f0',
84
84
  class: `${this.inverse ? 'border-default' : 'border-softer'} my-16 inline-block w-full border-t-2`
85
85
  });
86
86
  }
87
87
  };
88
88
  EdsBlockBreak.style = EdsBlockBreakStyle0;
89
- const edsBreadcrumbCss = "blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}.hidden{display:none}.block{display:block}.inline-block{display:inline-block}.flex{display:flex}.inline-flex{display:inline-flex}.items-center{align-items:center}.justify-center{justify-content:center}.space-x-2>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(0.125rem * var(--tw-space-x-reverse));margin-left:calc(0.125rem * calc(1 - var(--tw-space-x-reverse)))}.px-2{padding-left:0.125rem;padding-right:0.125rem}.w-20{width:1.25rem}.w-28{width:1.75rem}.w-32{width:2rem}.w-44{width:2.75rem}.h-20{height:1.25rem}.h-24{height:1.5rem}.h-28{height:1.75rem}.h-32{height:2rem}@media (min-width: 750px){.md\\:block{display:block}}";
90
- const EdsBreadcrumbStyle0 = edsBreadcrumbCss;
91
- const EdsBreadcrumb = class {
92
- constructor(hostRef) {
93
- registerInstance(this, hostRef);
94
- /**
95
- * Updates the maximum number of visible items and tracks if the screen is small.
96
- */
97
- this.updateScreenSize = () => {
98
- const width = window.innerWidth;
99
- if (width < 769) {
100
- this.maxVisibleItems = 3;
101
- } else if (width <= 1024) {
102
- this.maxVisibleItems = 3;
103
- } else if (width <= 1280) {
104
- this.maxVisibleItems = 3;
105
- } else if (width <= 2200) {
106
- this.maxVisibleItems = 4;
107
- } else {
108
- this.maxVisibleItems = 6;
109
- }
110
- };
111
- this.items = [];
112
- this.intent = 'ghost';
113
- this.parsedItems = [];
114
- this.isSmallScreen = false;
115
- this.maxVisibleItems = 6;
116
- }
117
- /**
118
- * Watches for changes to the `items` prop and parses it.
119
- */
120
- parseItems(newValue) {
121
- this.parsedItems = parseData(newValue);
122
- }
123
- /**
124
- * Lifecycle method that runs when the component is about to be loaded.
125
- * It parses the initial `items` prop value.
126
- */
127
- componentWillLoad() {
128
- this.parseItems(this.items);
129
- this.updateScreenSize();
130
- window.addEventListener('resize', this.updateScreenSize);
131
- }
132
- disconnectedCallback() {
133
- window.removeEventListener('resize', this.updateScreenSize);
134
- }
135
- /**
136
- * Lifecycle method that runs when the component has fully loaded.
137
- * It emits a custom event for each `eds-link` element contained within the breadcrumb.
138
- */
139
- componentDidLoad() {
140
- var _a;
141
- const links = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelectorAll('eds-link');
142
- links === null || links === void 0 ? void 0 : links.forEach(link => {
143
- this.emitContext(link);
144
- });
145
- }
146
- /**
147
- * Emits a custom event called `parentContext` for a given link element.
148
- * This event provides context information about the breadcrumb component.
149
- *
150
- * @param linkElement - The link element to which the event will be dispatched.
151
- */
152
- emitContext(linkElement) {
153
- const event = new CustomEvent('parentContext', {
154
- detail: {
155
- componentName: this.el.tagName.toLowerCase(),
156
- identifier: null
157
- }
158
- });
159
- linkElement.dispatchEvent(event);
160
- }
161
- /**
162
- * Returns breadcrumb items with potential truncation if there are too many.
163
- * It inserts an ellipsis item where necessary.
164
- */
165
- getTruncatedItems() {
166
- const totalItems = this.parsedItems.length;
167
- const ellipsis = {
168
- label: '...',
169
- url: '',
170
- isHidden: true
171
- };
172
- if (totalItems > this.maxVisibleItems) {
173
- const firstItem = this.parsedItems[0];
174
- const lastItems = this.parsedItems.slice(-2);
175
- if (this.maxVisibleItems === 3) {
176
- return [firstItem, ellipsis, ...lastItems];
177
- } else if (this.maxVisibleItems === 4) {
178
- const middleItem = this.parsedItems[Math.floor(totalItems / 2)];
179
- return [firstItem, middleItem, ellipsis, ...lastItems];
180
- }
181
- }
182
- return this.parsedItems;
183
- }
184
- /**
185
- * Helper to determine the display label and full label.
186
- * If the label is longer than 15 characters and the item is not the current (last) item,
187
- * we display a truncated version but use the full label for aria attributes.
188
- */
189
- getLabels(item, isCurrent) {
190
- if (!isCurrent && item.label.length > 15) {
191
- return {
192
- displayLabel: `${item.label.slice(0, 15)}...`,
193
- fullLabel: item.label
194
- };
195
- }
196
- return {
197
- displayLabel: item.label,
198
- fullLabel: item.label
199
- };
200
- }
201
- /**
202
- * Render method for the breadcrumb component.
203
- * It creates a navigation element with an ordered list of breadcrumb links.
204
- * The last link is marked as the current page.
205
- */
206
- render() {
207
- const itemsToRender = this.getTruncatedItems();
208
- return h("nav", {
209
- key: '2651e18e4c157f49e1da2ef93d4f68b9497118e4',
210
- "aria-label": "Breadcrumb"
211
- }, h("ol", {
212
- key: 'd1f5bb18bb35df9455a4c7a566850d59eb657242',
213
- class: "flex items-center space-x-2"
214
- }, itemsToRender.map((item, index) => {
215
- const isLast = index === itemsToRender.length - 1;
216
- return h("li", {
217
- class: "flex items-center"
218
- }, !item.isHidden ? (() => {
219
- const {
220
- fullLabel
221
- } = this.getLabels(item, isLast);
222
- const linkIntent = isLast ? this.intent === 'strong' ? 'weak' : this.intent === 'weak' ? 'strong' : this.intent : this.intent;
223
- return h("eds-link", Object.assign({
224
- label: fullLabel,
225
- url: item.url,
226
- intent: linkIntent,
227
- disabled: isLast,
228
- current: isLast,
229
- "aria-label": fullLabel,
230
- size: "small",
231
- "icon-small": "false"
232
- }, isLast ? {
233
- 'aria-current': 'page'
234
- } : {}));
235
- })() : h("eds-link", {
236
- label: "...",
237
- url: "#",
238
- intent: "strong",
239
- current: false,
240
- "aria-label": "...",
241
- size: "small",
242
- "icon-small": "false",
243
- icon: "chevron-right"
244
- }), !isLast && !item.isHidden && h("eds-icon-wrapper", {
245
- icon: "chevron-right",
246
- class: "w-20 h-20"
247
- }));
248
- })));
249
- }
250
- get el() {
251
- return getElement(this);
252
- }
253
- static get watchers() {
254
- return {
255
- "items": ["parseItems"]
256
- };
257
- }
258
- };
259
- EdsBreadcrumb.style = EdsBreadcrumbStyle0;
260
89
  const edsButtonCss = "*,\n::before,\n::after {\n box-sizing: border-box;\n border-width: 0;\n border-style: solid;\n border-color: currentColor;\n}\n\na {\n color: inherit;\n text-decoration: inherit;\n}\n\n/*\n 1. Change the font styles in all browsers.\n 2. Remove the margin in Firefox and Safari.\n 3. Remove default padding in all browsers.\n */\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n font-family: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n font-size: 100%;\n font-weight: inherit;\n line-height: inherit;\n letter-spacing: inherit;\n color: inherit;\n margin: 0;\n padding: 0;\n}\n\n/*\n Remove the inheritance of text transform in Edge and Firefox.\n */\nbutton,\nselect {\n text-transform: none;\n}\n\n/*\n 1. Correct the inability to style clickable types in iOS and Safari.\n 2. Remove default button styles.\n */\nbutton,\ninput:where([type='button']),\ninput:where([type='reset']),\ninput:where([type='submit']) {\n -webkit-appearance: button;\n /* 1 */\n background-color: transparent;\n /* 2 */\n background-image: none;\n /* 2 */\n}\n\np {\n margin: 0;\n}\n\n/*\n Set the default cursor for buttons.\n */\nbutton,\n[role=\"button\"] {\n cursor: pointer;\n}\n\n/*\n Make sure disabled buttons don't get the pointer cursor.\n */\n:disabled {\n cursor: default;\n}\n\n/* Make elements with the HTML hidden attribute stay hidden by default */\n[hidden] {\n display: none;\n}\n\n.f-body-01 {\n font-family: var(--f-body-01-fontFamily);\n font-weight: var(--f-body-01-fontWeight);\n font-size: var(--f-body-01-fontSize);\n line-height: var(--f-body-01-lineHeight);\n letter-spacing: var(--f-body-01-letterSpacing);\n}\n\n.f-body-02 {\n font-family: var(--f-body-02-fontFamily);\n font-weight: var(--f-body-02-fontWeight);\n font-size: var(--f-body-02-fontSize);\n line-height: var(--f-body-02-lineHeight);\n letter-spacing: var(--f-body-02-letterSpacing);\n}\n\n.f-ui-01 {\n font-family: var(--f-ui-01-fontFamily);\n font-weight: var(--f-ui-01-fontWeight);\n font-size: var(--f-ui-01-fontSize);\n line-height: var(--f-ui-01-lineHeight);\n letter-spacing: var(--f-ui-01-letterSpacing);\n}\n\n.f-ui-02 {\n font-family: var(--f-ui-02-fontFamily);\n font-weight: var(--f-ui-02-fontWeight);\n font-size: var(--f-ui-02-fontSize);\n line-height: var(--f-ui-02-lineHeight);\n letter-spacing: var(--f-ui-02-letterSpacing);\n}\n\n.border-inside {\n position: relative;\n\n &::after {\n pointer-events: none;\n }\n\n &::after {\n position: absolute;\n }\n\n &::after {\n inset: 0rem;\n }\n\n &::after {\n z-index: 1;\n }\n\n &::after {\n border-radius: 8px;\n }\n\n &::after {\n border-width: 1px;\n }\n\n &::after {\n border-width: 2px;\n }\n\n &::after {\n border-color: rgba(0, 0, 0, .1);\n }\n\n &::after {\n content: '';\n }\n}\n\n.border-inside-inverse {\n &::after {\n border-color: rgba(255, 255, 255, 0.3);\n }\n\n &::after {\n content: '';\n }\n}\n\n.border-inside-pill {\n &::after {\n border-radius: 100px;\n }\n\n &::after {\n content: '';\n }\n}\n\n.loader {\n box-sizing: border-box;\n display: inline-block;\n height: 1rem;\n width: 1rem;\n}\n\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n\n.loader {\n animation: spin 1s linear infinite;\n border-radius: 9999px;\n border: 3px solid rgba(0, 0, 0, .3);\n border-bottom-color: #000;\n}\n\n/** region TRANSITIONS */\n.effect-color {\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 300ms;\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n}\n\n.effect-focus {\n outline-width: 3px;\n outline-offset: 2px;\n outline-color: var(--green-500);\n}\n\n.effect-focus:focus-visible {\n outline-style: solid;\n}\n\n.effect-focus-within {\n outline-width: 3px;\n outline-offset: 2px;\n outline-color: var(--green-500);\n}\n\n.effect-focus-within:focus-within {\n outline-style: solid;\n}\n\n.sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border-width: 0;\n}\n\n.pointer-events-none {\n pointer-events: none;\n}\n\n.static {\n position: static;\n}\n\n.fixed {\n position: fixed;\n}\n\n.absolute {\n position: absolute;\n}\n\n.relative {\n position: relative;\n}\n\n.sticky {\n position: sticky;\n}\n\n.inset-0 {\n inset: 0rem;\n}\n\n.inset-x-16 {\n left: 1rem;\n right: 1rem;\n}\n\n.-top-8 {\n top: -0.5rem;\n}\n\n.left-0 {\n left: 0rem;\n}\n\n.left-1\\/2 {\n left: 50%;\n}\n\n.left-4 {\n left: 0.25rem;\n}\n\n.left-\\[4px\\] {\n left: 4px;\n}\n\n.right-0 {\n right: 0rem;\n}\n\n.right-4 {\n right: 0.25rem;\n}\n\n.right-8 {\n right: 0.5rem;\n}\n\n.right-\\[6px\\] {\n right: 6px;\n}\n\n.top-0 {\n top: 0rem;\n}\n\n.top-1\\/2 {\n top: 50%;\n}\n\n.m-0 {\n margin: 0rem;\n}\n\n.mx-auto {\n margin-left: auto;\n margin-right: auto;\n}\n\n.-ml-16 {\n margin-left: -1rem;\n}\n\n.-mr-16 {\n margin-right: -1rem;\n}\n\n.ml-0 {\n margin-left: 0rem;\n}\n\n.ml-4 {\n margin-left: 0.25rem;\n}\n\n.ml-64 {\n margin-left: 4rem;\n}\n\n.ml-8 {\n margin-left: 0.5rem;\n}\n\n.ml-auto {\n margin-left: auto;\n}\n\n.mr-4 {\n margin-right: 0.25rem;\n}\n\n.mr-8 {\n margin-right: 0.5rem;\n}\n\n.mr-auto {\n margin-right: auto;\n}\n\n.block {\n display: block;\n}\n\n.inline-block {\n display: inline-block;\n}\n\n.inline {\n display: inline;\n}\n\n.flex {\n display: flex;\n}\n\n.inline-flex {\n display: inline-flex;\n}\n\n.hidden {\n display: none;\n}\n\n.h-20 {\n height: 1.25rem;\n}\n\n.h-24 {\n height: 1.5rem;\n}\n\n.h-36 {\n height: 2.25rem;\n}\n\n.h-44 {\n height: 2.75rem;\n}\n\n.h-auto {\n height: auto;\n}\n\n.h-full {\n height: 100%;\n}\n\n.\\!min-h-20 {\n min-height: 1.25rem !important;\n}\n\n.min-h-screen {\n min-height: 100vh;\n}\n\n.w-20 {\n width: 1.25rem;\n}\n\n.w-full {\n width: 100%;\n}\n\n.flex-none {\n flex: none;\n}\n\n.grow {\n flex-grow: 1;\n}\n\n.cursor-pointer {\n cursor: pointer;\n}\n\n.resize {\n resize: both;\n}\n\n.flex-row {\n flex-direction: row;\n}\n\n.flex-row-reverse {\n flex-direction: row-reverse;\n}\n\n.flex-col {\n flex-direction: column;\n}\n\n.flex-wrap {\n flex-wrap: wrap;\n}\n\n.items-center {\n align-items: center;\n}\n\n.justify-center {\n justify-content: center;\n}\n\n.justify-between {\n justify-content: space-between;\n}\n\n.space-x-2> :not([hidden])~ :not([hidden]) {\n --tw-space-x-reverse: 0;\n margin-right: calc(0.125rem * var(--tw-space-x-reverse));\n margin-left: calc(0.125rem * calc(1 - var(--tw-space-x-reverse)));\n}\n\n.overflow-hidden {\n overflow: hidden;\n}\n\n.overflow-x-auto {\n overflow-x: auto;\n}\n\n.overflow-x-hidden {\n overflow-x: hidden;\n}\n\n.overflow-y-scroll {\n overflow-y: scroll;\n}\n\n.whitespace-nowrap {\n white-space: nowrap;\n}\n\n.break-words {\n overflow-wrap: break-word;\n}\n\n.rounded {\n border-radius: 0.25rem;\n}\n\n.rounded-full {\n border-radius: 9999px;\n}\n\n.rounded-lg {\n border-radius: 16px;\n}\n\n.rounded-md {\n border-radius: 12px;\n}\n\n.rounded-pill {\n border-radius: 100px;\n}\n\n.rounded-sm {\n border-radius: 8px;\n}\n\n.rounded-xxs {\n border-radius: 2px;\n}\n\n.border {\n border-width: 1px;\n}\n\n.border-\\[\\#0034CB\\] {\n --tw-border-opacity: 1;\n border-color: rgb(0 52 203 / var(--tw-border-opacity));\n}\n\n.border-\\[\\#d2d2d2\\] {\n --tw-border-opacity: 1;\n border-color: rgb(210 210 210 / var(--tw-border-opacity));\n}\n\n.border-softest {\n border-color: rgba(0, 0, 0, .05);\n}\n\n.border-b-softer {\n border-bottom-color: rgba(0, 0, 0, .1);\n}\n\n.\\!bg-accent-dark {\n background-color: var(--green-600) !important;\n}\n\n.\\!bg-darker {\n background-color: var(--grey-400) !important;\n}\n\n.\\!bg-strong-dark {\n background-color: var(--grey-800) !important;\n}\n\n.bg-accent {\n background-color: var(--green-500);\n}\n\n.bg-accent-dark {\n background-color: var(--green-600);\n}\n\n.bg-dark {\n background-color: var(--grey-300);\n}\n\n.bg-darker {\n background-color: var(--grey-400);\n}\n\n.bg-overlay {\n background-color: rgba(0, 0, 0, 0.25);\n}\n\n.bg-strong {\n background-color: var(--grey-700);\n}\n\n.bg-strong-dark {\n background-color: var(--grey-800);\n}\n\n.bg-stronger {\n background-color: var(--grey-900);\n}\n\n.bg-strongest {\n background-color: var(--black);\n}\n\n.p-12 {\n padding: 0.75rem;\n}\n\n.p-6 {\n padding: 0.375rem;\n}\n\n.p-8 {\n padding: 0.5rem;\n}\n\n.\\!px-0 {\n padding-left: 0rem !important;\n padding-right: 0rem !important;\n}\n\n.px-12 {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n}\n\n.px-16 {\n padding-left: 1rem;\n padding-right: 1rem;\n}\n\n.py-8 {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n}\n\n.pl-4 {\n padding-left: 0.25rem;\n}\n\n.pl-8 {\n padding-left: 0.5rem;\n}\n\n.pr-4 {\n padding-right: 0.25rem;\n}\n\n.pr-8 {\n padding-right: 0.5rem;\n}\n\n.\\!text-current {\n color: currentColor !important;\n}\n\n.text-accent {\n color: var(--green-500);\n}\n\n.text-current {\n color: currentColor;\n}\n\n.text-default {\n color: var(--black);\n}\n\n.text-inverse {\n color: var(--white);\n}\n\n.text-lightest {\n color: var(--grey-500);\n}\n\n.opacity-0 {\n opacity: 0;\n}\n\n.shadow {\n --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n.shadow-accent {\n --tw-shadow: 0px 0px 12px rgba(0, 201, 89, 0.6);\n --tw-shadow-colored: 0px 0px 12px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n.underline-offset-4 {\n text-underline-offset: 0.2em;\n}\n\n.\\@container {\n container-type: inline-size;\n}\n\n.after\\:effect-opacity::after {\n transition-property: opacity;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 300ms;\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n}\n\n.even\\:bg-inverse-softer:nth-child(even) {\n background-color: rgba(255, 255, 255, .15);\n}\n\n.invalid\\:text-lightest:invalid {\n color: var(--grey-500);\n}\n\n.focus-within\\:bg-transparent:focus-within {\n background-color: var(--transparent);\n}\n\n.hover\\:bg-accent-dark:hover {\n background-color: var(--green-600);\n}\n\n.hover\\:bg-dark:hover {\n background-color: var(--grey-300);\n}\n\n.hover\\:bg-darker:hover {\n background-color: var(--grey-400);\n}\n\n.hover\\:bg-default:hover {\n background-color: var(--grey-200);\n}\n\n.hover\\:bg-inverse:hover {\n background-color: var(--white);\n}\n\n.hover\\:bg-strong-dark:hover {\n background-color: var(--grey-800);\n}\n\n.hover\\:bg-transparent:hover {\n background-color: var(--transparent);\n}\n\n.hover\\:text-default:hover {\n color: var(--black);\n}\n\n.hover\\:text-lighter:hover {\n color: var(--grey-600);\n}\n\n.hover\\:\\!underline:hover {\n text-decoration-line: underline !important;\n}\n\n.hover\\:no-underline:hover {\n text-decoration-line: none;\n}\n\n.hover\\:shadow-hover:hover {\n --tw-shadow: 0px 0px 16px rgba(0, 0, 0, 0.2);\n --tw-shadow-colored: 0px 0px 16px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n.focus\\:shadow-none:focus {\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n.focus\\:outline-none:focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n\n.disabled\\:cursor-not-allowed:disabled {\n cursor: not-allowed;\n}\n\n.disabled\\:bg-dark:disabled {\n background-color: var(--grey-300);\n}\n\n.disabled\\:text-lightest:disabled {\n color: var(--grey-500);\n}\n\n.aria-disabled\\:cursor-not-allowed[aria-disabled=\"true\"] {\n cursor: not-allowed;\n}\n\n.aria-disabled\\:\\!border-transparent[aria-disabled=\"true\"] {\n border-color: var(--transparent) !important;\n}\n\n.aria-disabled\\:bg-dark[aria-disabled=\"true\"] {\n background-color: var(--grey-300);\n}\n\n.aria-disabled\\:bg-transparent[aria-disabled=\"true\"] {\n background-color: var(--transparent);\n}\n\n.aria-disabled\\:text-light[aria-disabled=\"true\"] {\n color: var(--grey-700);\n}\n\n.aria-disabled\\:text-lightest[aria-disabled=\"true\"] {\n color: var(--grey-500);\n}\n\n.aria-disabled\\:line-through[aria-disabled=\"true\"] {\n text-decoration-line: line-through;\n}\n\n.aria-disabled\\:shadow-none[aria-disabled=\"true\"] {\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n.aria-current-page\\:bg-darker[aria-current=\"page\"] {\n background-color: var(--grey-400);\n}\n\n.after\\:absolute::after {\n position: absolute;\n}\n\n.after\\:inset-0::after {\n inset: 0rem;\n}\n\n.after\\:inset-x-0::after {\n left: 0rem;\n right: 0rem;\n}\n\n.after\\:bottom-0::after {\n bottom: 0rem;\n}\n\n.after\\:left-16::after {\n left: 1rem;\n}\n\n.after\\:right-16::after {\n right: 1rem;\n}\n\n.after\\:z-10::after {\n z-index: 10;\n}\n\n.after\\:rounded-lg::after {\n border-radius: 16px;\n}\n\n.after\\:rounded-t-lg::after {\n border-top-left-radius: 16px;\n border-top-right-radius: 16px;\n}\n\n.after\\:border-3::after {\n border-width: 3px;\n}\n\n.after\\:border-b-2::after {\n border-bottom-width: 2px;\n}\n\n.after\\:\\!border-transparent::after {\n border-color: var(--transparent) !important;\n}\n\n.after\\:border-accent::after {\n border-color: var(--green-500);\n}\n\n.after\\:border-softest::after {\n border-color: rgba(0, 0, 0, .05);\n}\n\n.after\\:opacity-0::after {\n opacity: 0;\n}\n\n.after\\:content-\\[\\'\\'\\]::after {\n --tw-content: '';\n content: var(--tw-content);\n}\n\n.hover\\:after\\:\\!border-transparent:hover::after {\n border-color: var(--transparent) !important;\n}\n\n.hover\\:after\\:opacity-100:hover::after {\n opacity: 1;\n}\n\n.focus-visible\\:after\\:opacity-100:focus-visible::after {\n opacity: 1;\n}\n\n.aria-disabled\\:after\\:\\!border-transparent[aria-disabled=\"true\"]::after {\n border-color: var(--transparent) !important;\n}\n\n.hover\\:before\\:opacity-100:hover::before {\n opacity: 1;\n}";
261
90
  const EdsButtonStyle0 = edsButtonCss;
262
91
  const EdsButton = class {
@@ -399,20 +228,20 @@ const EdsButton = class {
399
228
  });
400
229
  const ElementType = this.elementType;
401
230
  return h(ElementType, {
402
- key: 'b51281f8946bbf5a22b8fec9ec2d66ea4697bb23',
231
+ key: 'ecdd901c70578c07ef094aadbcd287588d4ba705',
403
232
  "aria-label": this.label || this.ariaLabel || undefined,
404
233
  "aria-disabled": this.elementType === 'button' ? this.disabled : undefined,
405
234
  disabled: this.elementType === 'button' ? this.disabled : undefined,
406
235
  class: `${classes || ''} ${this.extraClass || ''}`,
407
236
  onClick: event => this.handleClick(event)
408
237
  }, this.label && h("span", {
409
- key: 'c1df49fe70a7930d4c87f8130ef1102e503cd0fc',
238
+ key: 'af8d0ca1c5c3e54f9db3066931a69d3a5a812666',
410
239
  class: this.loading ? 'opacity-0' : ''
411
240
  }, this.label), this.loading && h("span", {
412
- key: 'e56515527843d11be53d66aa7598fc2fdf94d054',
241
+ key: '29b72c15e80f46e023f829568f58d8a8dca82b78',
413
242
  class: "absolute inset-0 flex items-center justify-center"
414
243
  }, h("span", {
415
- key: 'a50932ac2d5db24d50a3b10a30d07043e0354c62',
244
+ key: 'bad8bd059b1312ca3f5ab173b1203eb395e9bbd8',
416
245
  class: "loader",
417
246
  style: {
418
247
  border: `3px solid ${this.intent === 'secondary' ? 'rgba(255, 255, 255, .3)' : 'rgba(0, 0, 0, .3)'}`,
@@ -431,189 +260,6 @@ const EdsButton = class {
431
260
  }
432
261
  };
433
262
  EdsButton.style = EdsButtonStyle0;
434
- const edsCardDescCss = ".f-ui-03-light{font-family:var(--f-ui-03-light-fontFamily);font-weight:var(--f-ui-03-light-fontWeight);font-size:var(--f-ui-03-light-fontSize);line-height:var(--f-ui-03-light-lineHeight);letter-spacing:var(--f-ui-03-light-letterSpacing)}.text-light{color:var(--grey-700)}.line-clamp-1{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.line-clamp-3{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3}.line-clamp-4{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4}";
435
- const EdsCardDescStyle0 = edsCardDescCss;
436
- const EdsCardDesc = class {
437
- constructor(hostRef) {
438
- registerInstance(this, hostRef);
439
- this.description = undefined;
440
- this.truncate = true;
441
- this.truncateLines = '3';
442
- }
443
- getTruncateClass() {
444
- return this.truncate && this.truncateLines ? `line-clamp-${this.truncateLines}` : '';
445
- }
446
- render() {
447
- return h("p", {
448
- key: 'f2eec4a947de74a1e36bb13fdd2bfeb7a9f711b3',
449
- class: "text-light f-ui-03-light"
450
- }, h("span", {
451
- key: '444ffa34c3e8cac12af2f396144fd182d49c6baa',
452
- class: this.getTruncateClass()
453
- }, this.description));
454
- }
455
- };
456
- EdsCardDesc.style = EdsCardDescStyle0;
457
- const edsCardGenericCss = ".h-auto{height:auto}.h-full{height:100%}.\\!min-h-20{min-height:1.25rem !important}.min-h-120{min-height:120px}.min-h-156{min-height:156px}.bg-default{background-color:var(--grey-200)}.bg-inverse{background-color:var(--white)}.effect-shadow{transition-property:box-shadow;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:300ms;transition-timing-function:cubic-bezier(0, 0, 0.2, 1)}.hover\\:shadow-hover:hover{--tw-shadow:0px 0px 16px rgba(0, 0, 0, 0.2);--tw-shadow-colored:0px 0px 16px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.cursor-pointer{cursor:pointer}.border-soft{border-color:rgba(0, 0, 0, .15)}.border-softer{border:2px solid rgba(0, 0, 0, .1)}.effect-focus-within{outline-width:3px;outline-offset:2px;outline-color:var(--green-500)}.effect-focus-within:focus-within{outline-style:solid}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.grow{flex-grow:1}.flex-col{flex-direction:column}.rounded-lg{border-radius:16px}.border-2{border-width:2px}.p-12{padding:0.75rem}.p-16{padding:1rem}.mt-6{margin-top:0.375rem}.mt-8{margin-top:0.5rem}.gap-x-1{-moz-column-gap:0.0625rem;column-gap:0.0625rem}.gap-y-4{row-gap:0.25rem}.order-first{order:-9999}.mb-10{margin-bottom:0.625rem}.mb-12{margin-bottom:0.75rem}.mx-auto{margin-left:auto;margin-right:auto}.block{display:block}";
458
- const EdsCardGenericStyle0 = edsCardGenericCss;
459
- const EdsCardGeneric = class {
460
- constructor(hostRef) {
461
- registerInstance(this, hostRef);
462
- this.parentContext = null; // Accepts the entire event detail or null
463
- this.cardTitle = undefined;
464
- this.url = undefined;
465
- this.description = undefined;
466
- this.image = undefined;
467
- this.avatar = undefined;
468
- this.shortAbbreviation = undefined;
469
- this.headingLevel = 'h3';
470
- this.tags = [];
471
- this.tiny = false;
472
- this.bg = true;
473
- this.withHover = true;
474
- this.hierarchy = true;
475
- this.parsedImage = null;
476
- }
477
- componentWillLoad() {
478
- if (this.image) {
479
- try {
480
- if (typeof this.image === 'object') {
481
- // If image is already an object, assign it directly
482
- this.parsedImage = this.image;
483
- } else if (typeof this.image === 'string') {
484
- // If image is a string, try to parse it
485
- this.parsedImage = JSON.parse(this.image);
486
- }
487
- } catch (error) {
488
- // eslint-disable-next-line
489
- console.error('Error parsing image prop:', error);
490
- this.parsedImage = {}; // Assign a fallback empty object in case of an error
491
- }
492
- }
493
- }
494
- handleParentContext(event) {
495
- if (event.target !== this.el) {
496
- // Ignore the event if it's not targeted at this specific instance
497
- return;
498
- }
499
- //console.log(event.detail);
500
- this.parentContext = event.detail;
501
- event.stopPropagation();
502
- }
503
- /**
504
- * Parses the `tags` prop into an array of link objects.
505
- * Returns an empty array if parsing fails or if `tags` is not a valid JSON string or object.
506
- *
507
- * @returns {any[]} Array of parsed link objects
508
- */
509
- get parsedTags() {
510
- return parseData(this.tags);
511
- }
512
- articleClasses() {
513
- return [this.description ? this.tiny ? 'min-h-120' : 'min-h-156' : 'h-auto', this.bg ? 'bg-inverse' : 'bg-default', this.withHover ? 'effect-shadow hover:shadow-hover cursor-pointer' : '', 'border-softer effect-focus-within relative flex grow flex-col rounded-lg border-2 p-16'].join(' ');
514
- }
515
- handleClick() {
516
- var _a;
517
- sendAnalytics({
518
- category: 'ui-component',
519
- parentContext: this.parentContext,
520
- tag: this.el.tagName.toLowerCase(),
521
- name: ((_a = this.cardTitle) === null || _a === void 0 ? void 0 : _a.toLowerCase()) || '',
522
- action: 'click'
523
- });
524
- }
525
- render() {
526
- return h("article", {
527
- key: '440a448c841370838c0c66610bd1266b46f66541',
528
- class: this.articleClasses(),
529
- onClick: () => this.handleClick()
530
- }, h("eds-card-title", {
531
- key: '292d93a9a993c6dcbfd276097a21d3984b1794c4',
532
- "heading-level": this.headingLevel,
533
- titleClass: this.image ? 'f-ui-01' : undefined,
534
- "card-title": this.cardTitle,
535
- url: this.url,
536
- hierarchy: this.hierarchy
537
- }), this.description && h("eds-card-desc", {
538
- key: '4b304cc3c65a42b3b1bcbebd9968c45e79cdabf7',
539
- class: "mt-8",
540
- "truncate-lines": "3",
541
- description: this.description
542
- }), this.parsedImage ? h("eds-img", Object.assign({
543
- class: "mt-8 block mx-auto"
544
- }, this.parsedImage)) : this.avatar || this.shortAbbreviation ? h("eds-avatar", {
545
- class: "order-first mb-12",
546
- picture: this.avatar,
547
- initials: this.shortAbbreviation
548
- }) : null, h("div", {
549
- key: '40388913b1abb9308f42469956342efdbb48d508',
550
- class: "flex flex-wrap gap-y-4 gap-x-1"
551
- }, this.parsedTags.map((tag, index) => h("eds-tag", {
552
- key: index,
553
- intent: tag.style,
554
- label: tag.label
555
- }))), ' ');
556
- }
557
- get el() {
558
- return getElement(this);
559
- }
560
- };
561
- EdsCardGeneric.style = EdsCardGenericStyle0;
562
- const edsCardTitleCss = "a{all:unset;display:inline;color:inherit;text-decoration:none;cursor:pointer}h1,h2,h3,h4,h5,h6{margin:0}.f-heading-01{font-family:var(--f-heading-01-fontFamily);font-weight:var(--f-heading-01-fontWeight);font-size:var(--f-heading-01-fontSize);line-height:var(--f-heading-01-lineHeight);letter-spacing:var(--f-heading-01-letterSpacing)}.f-heading-02{font-family:var(--f-heading-02-fontFamily);font-weight:var(--f-heading-02-fontWeight);font-size:var(--f-heading-02-fontSize);line-height:var(--f-heading-02-lineHeight);letter-spacing:var(--f-heading-02-letterSpacing)}.f-heading-03{font-family:var(--f-heading-03-fontFamily);font-weight:var(--f-heading-03-fontWeight);font-size:var(--f-heading-03-fontSize);line-height:var(--f-heading-03-lineHeight);letter-spacing:var(--f-heading-03-letterSpacing)}.f-heading-04{font-family:var(--f-heading-04-fontFamily);font-weight:var(--f-heading-04-fontWeight);font-size:var(--f-heading-04-fontSize);line-height:var(--f-heading-04-lineHeight);letter-spacing:var(--f-heading-04-letterSpacing)}.f-heading-05{font-family:var(--f-heading-05-fontFamily);font-weight:var(--f-heading-05-fontWeight);font-size:var(--f-heading-05-fontSize);line-height:var(--f-heading-05-lineHeight);letter-spacing:var(--f-heading-05-letterSpacing)}.f-heading-06{font-family:var(--f-heading-06-fontFamily);font-weight:var(--f-heading-06-fontWeight);font-size:var(--f-heading-06-fontSize);line-height:var(--f-heading-06-lineHeight);letter-spacing:var(--f-heading-06-letterSpacing)}.break-words{overflow-wrap:break-word}.after\\:absolute::after{position:absolute}.after\\:inset-0::after{inset:0rem}.after\\:z-10::after{z-index:10}.after\\:content-\\[\\'\\'\\]::after{--tw-content:'';content:var(--tw-content)}.focus\\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}";
563
- const EdsCardTitleStyle0 = edsCardTitleCss;
564
- const EdsCardTitle = class {
565
- constructor(hostRef) {
566
- registerInstance(this, hostRef);
567
- this.url = undefined;
568
- this.titleClass = undefined;
569
- this.headingLevel = 'h3';
570
- this.externalLink = false;
571
- this.cardTitle = undefined;
572
- this.hierarchy = true;
573
- }
574
- /**
575
- * Dynamically generate the title class based on the heading level.
576
- */
577
- getTitleClass() {
578
- const levelMap = this.hierarchy ? {
579
- h1: '05',
580
- h2: '05',
581
- h3: '05',
582
- h4: '05',
583
- h5: '05',
584
- h6: '06'
585
- } : {
586
- h1: '01',
587
- h2: '02',
588
- h3: '03',
589
- h4: '04',
590
- h5: '05',
591
- h6: '06'
592
- };
593
- return `f-heading-${levelMap[this.headingLevel]}`;
594
- }
595
- /*private getTag() {
596
- if (this.url) {
597
- return 'a';
598
- }
599
- return 'span';
600
- }*/
601
- render() {
602
- //const Tag = this.getTag();
603
- const Heading = this.headingLevel;
604
- return h(Heading, {
605
- key: '9914950b1581456a3a875ed7383975710c05fa7f',
606
- class: this.getTitleClass()
607
- }, h("a", {
608
- key: '9b3298d8bacd8fbaecd8c714329ef5e6ac7192c7',
609
- class: "break-words after:absolute after:inset-0 after:z-10 after:content-[''] focus:outline-none",
610
- href: this.url,
611
- target: this.externalLink ? '_blank' : undefined,
612
- rel: this.externalLink ? 'noopener noreferrer' : undefined
613
- }, this.cardTitle));
614
- }
615
- };
616
- EdsCardTitle.style = EdsCardTitleStyle0;
617
263
  const edsDropdownCss = ".z-focus{z-index:99}.relative{position:relative}.shadow-small{--tw-shadow:0px 1.5px 2px rgba(0, 0, 0, 0.1);--tw-shadow-colored:0px 1.5px 2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.bg-inverse{background-color:var(--white)}.border-softest{border:2px solid rgba(0, 0, 0, .05)}.z-10{z-index:10}.z-on-top{z-index:99999}.absolute{position:absolute}.top-full{top:100%}.mt-4{margin-top:0.25rem}.mt-6{margin-top:0.375rem}.mt-8{margin-top:0.5rem}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.flex-col{flex-direction:column}.gap-y-4{row-gap:0.25rem}.rounded-lg{border-radius:16px}.border-2{border-width:2px}.p-8{padding:0.5rem}.left-0{left:0rem}.left-1\\/2{left:50%}.left-4{left:0.25rem}.left-\\[4px\\]{left:4px}.right-0{right:0rem}.right-4{right:0.25rem}.right-8{right:0.5rem}";
618
264
  const EdsDropdownStyle0 = edsDropdownCss;
619
265
  const EdsDropdown = class {
@@ -726,11 +372,11 @@ const EdsDropdown = class {
726
372
  */
727
373
  render() {
728
374
  return h("div", {
729
- key: 'c7044a1dabb4f65fe143ac3202dd0d1af4e706c2',
375
+ key: 'eb48745937126e580737c1da6787c3f16c06ba9e',
730
376
  class: "z-focus relative",
731
377
  ref: el => this.dropdownContent = el
732
378
  }, h("eds-button", {
733
- key: 'fa5812e59ea886a0adcba75576f07e94e7b0f713',
379
+ key: '3af6863201b1c25ad66e9f8c52d9e13505d742a3',
734
380
  label: this.label,
735
381
  "aria-label": this.ariaLabel,
736
382
  icon: this.icon,
@@ -739,7 +385,7 @@ const EdsDropdown = class {
739
385
  "aria-expanded": this.isOpen.toString(),
740
386
  "aria-haspopup": "menu"
741
387
  }), h("nav", {
742
- key: 'c0daa734601dbfcd290d5db8cc25fcd4b82dfdad',
388
+ key: 'c225074b3fbee543966523f8cd1c146485bc04bd',
743
389
  role: "menu",
744
390
  class: {
745
391
  'shadow-small bg-inverse border-softest z-10 z-on-top absolute top-full mt-4 flex flex-col gap-y-4 border-2 p-8': true,
@@ -755,7 +401,7 @@ const EdsDropdown = class {
755
401
  "aria-label": "Dropdown",
756
402
  "aria-hidden": !this.isOpen
757
403
  }, h("slot", {
758
- key: '6ca4e774160924fa248db790f33b81e374653569'
404
+ key: '6a7ba94045d366d20c6618845692d977f20437e3'
759
405
  })));
760
406
  }
761
407
  get host() {
@@ -822,30 +468,30 @@ const EdsFooter = class {
822
468
  key: 'fa09a0dbccb035b1e4f496aa447aca241bcc2415',
823
469
  class: "flex items-center gap-x-12"
824
470
  }, h("a", {
825
- key: '273bbee5c7353fa4ab0ac30f30a190bae250546c',
471
+ key: '578d6a8463e65d07278f8328c108ee266cfba2b8',
826
472
  target: "_blank",
827
473
  rel: "noopener noreferrer",
828
474
  class: "effect-focus focus-visible:rounded-xs flex w-[54px] ml-0",
829
- href: "https://research-and-innovation.ec.europa.eu/funding/funding-opportunities/funding-programmes-and-open-calls/horizon-2020_en",
830
- "aria-label": "Learn about Horizon 2020 funding"
475
+ href: "https://research-and-innovation.ec.europa.eu/funding/funding-opportunities/funding-programmes-and-open-calls/horizon-europe_en",
476
+ "aria-label": "Learn about Horizon Europe funding"
831
477
  }, h("eds-img", {
832
- key: '4568610de97ad886e26195bde656609e2584b792',
478
+ key: '5b9e987c2ecf62fb4f44c1faacad7c569a149805',
833
479
  width: 54,
834
480
  height: 41,
835
481
  src: "https://www.ebrains.eu/flags/4x3/eu.svg",
836
482
  alt: "European Union Flag"
837
483
  }))), h("div", {
838
- key: '65dc6a5b0da9d69b0b43ed738c9612293ef64e96'
484
+ key: 'df75949c0718b8fb7dd449a6e7df39d332da366f'
839
485
  }, h("div", {
840
- key: 'a89180b8f308502dfd864d5aab0702f262718cc8',
486
+ key: 'f83d31b16d0601cd456d5cb72e9fa2adb29a2b66',
841
487
  class: "f-ui-04 text-light"
842
488
  }, h("p", {
843
- key: '54a69763c38a7986008f9b553fb6b75e5a36d255'
489
+ key: 'dcdf09d78ca64c5391d56fe5ed69bab987cbf67b'
844
490
  }, this.fundedBy), h("div", {
845
- key: '9378c48e766a2df4d14805c8777d5d98a2d016ce',
491
+ key: 'af279fb5dfdf0a8f1f85e6ce7446dc3a0eeac397',
846
492
  class: "mt-4 flex flex-wrap gap-12 lg:flex-nowrap inline-block"
847
493
  }, h("span", {
848
- key: 'ef939799150dd7ea91f72de94b1e564039c1e900',
494
+ key: '026b41fa6162ffb6825ccf98364b4caf64b6457a',
849
495
  class: "effect-focus !no-underline decoration-2 underline-offset-4 hover:!underline mr-4"
850
496
  }, "\u00A9 ", this.rightsReserved), this.enableCookiesSettings ? h("eds-link", {
851
497
  label: this.cookiesPreferences,
@@ -855,7 +501,7 @@ const EdsFooter = class {
855
501
  this.toggleCookiesConsent();
856
502
  }
857
503
  }) : null))), h("div", {
858
- key: '3b5388855844f5857e4d6a2b8d19d204b681ca40',
504
+ key: '27cb561815d6918567ab8cfa1148019aca8aeda0',
859
505
  class: "ml-auto pl-12"
860
506
  }, this.enableScrollTop ? h("eds-button", {
861
507
  id: "backToTop",
@@ -1048,6 +694,9 @@ const EdsForm = class {
1048
694
  this.errors = {};
1049
695
  this.parsedFields = [];
1050
696
  }
697
+ async setData(newData) {
698
+ this.populateFormWithInitData(newData);
699
+ }
1051
700
  componentWillLoad() {
1052
701
  this.parseFields(this.fields);
1053
702
  // Emit context for each eds-link element after the component is fully loaded
@@ -1224,6 +873,14 @@ const EdsForm = class {
1224
873
  // Update the errors state and the hasError flag.
1225
874
  this.errors = newErrors;
1226
875
  this.hasError = Object.keys(newErrors).length > 0;
876
+ // Emit the updated form state.
877
+ this.form.emit({
878
+ event: 'input',
879
+ field: field.name,
880
+ value: target.type === 'checkbox' ? this.values[field.name] : target.value,
881
+ message: `${field.name} updated`
882
+ //data: this.makeFormData()
883
+ });
1227
884
  }
1228
885
  handleSubmit() {
1229
886
  var _a, _b;
@@ -1285,14 +942,14 @@ const EdsForm = class {
1285
942
  const hiddenFields = this.parsedFields.filter(field => field.type === 'hidden');
1286
943
  const otherFields = this.parsedFields.filter(field => field.type !== 'hidden');
1287
944
  return h("form", {
1288
- key: '76fbc3f587eaac0bd53553663f072e5066914ae5',
945
+ key: '1418bbac3ea7c994bf363602e6ddd18ed3c6c661',
1289
946
  ref: el => this.formEl = el,
1290
947
  autocomplete: "on",
1291
948
  onSubmit: this.handleSubmit
1292
949
  }, h("div", {
1293
- key: '64d99d4ac7e1cb8e4bfe436bb236648201dcbc29'
950
+ key: 'ae6f05d50a1c32312e585d55f0b5d64b0dd1fc9c'
1294
951
  }, h("slot", {
1295
- key: '9c257d29146b620367773726e65eaf680d3d010b'
952
+ key: '09c9ddd0d3b77ae9cbcb54389b799af7a6fc6c9e'
1296
953
  }), hiddenFields.map((field, index) => h("eds-input", {
1297
954
  key: index,
1298
955
  type: "hidden",
@@ -1326,10 +983,10 @@ const EdsForm = class {
1326
983
  options: field.options
1327
984
  });
1328
985
  })), this.formBtn && h("div", {
1329
- key: 'ba7908ab85c6368aeff6824fd402b78b514d2292',
986
+ key: 'af6ce29d25ae2e7c71537618456308891ff8abf4',
1330
987
  class: "mt-20"
1331
988
  }, h("eds-button", {
1332
- key: '84efe452f55b2898e5747a01b0dc6033ba14da7a',
989
+ key: '1442f4f6b924533f9aa46bd22e1d0adf69561370',
1333
990
  intent: "primary",
1334
991
  label: this.formBtnLabel,
1335
992
  disabled: this.isSubmitting,
@@ -1463,77 +1120,6 @@ const EdsFullscreenMenu = class {
1463
1120
  }
1464
1121
  };
1465
1122
  EdsFullscreenMenu.style = EdsFullscreenMenuStyle0;
1466
- const edsGaugeCss = ".relative{position:relative}.absolute{position:absolute}.inline-block{display:inline-block}.rounded-full{border-radius:9999px}.overflow-hidden{overflow:hidden}.bg-inverse{background-color:var(--white)}.bg-current{background-color:currentColor}.bg-dark{background-color:var(--grey-300)}.bg-darker{background-color:var(--grey-400)}.bg-default{background-color:var(--grey-200)}.bg-strong{background-color:var(--grey-700)}.bg-strongest{background-color:var(--black)}.inset-0{inset:0rem}.flex{display:flex}.items-center{align-items:center}.justify-center{justify-content:center}.f-body-01{font-family:var(--f-body-01-fontFamily);font-weight:var(--f-body-01-fontWeight);font-size:var(--f-body-01-fontSize);line-height:var(--f-body-01-lineHeight);letter-spacing:var(--f-body-01-letterSpacing)}.text-default{color:var(--black)}";
1467
- const EdsGaugeStyle0 = edsGaugeCss;
1468
- const BACKGROUND_VARIANTS = {
1469
- default: '#f2f2f2',
1470
- dark: '#d8d8d8',
1471
- strong: '#666666',
1472
- black: '#000000'
1473
- };
1474
- const EdsGauge = class {
1475
- constructor(hostRef) {
1476
- registerInstance(this, hostRef);
1477
- this.size = 100;
1478
- this.valueMin = 0;
1479
- this.valueMax = 100;
1480
- this.value = 60;
1481
- this.thickness = 0.1;
1482
- this.variant = 'default';
1483
- }
1484
- render() {
1485
- // Clamp thickness to [0,1]
1486
- const thicknessClamped = Math.min(Math.max(this.thickness, 0.1), 0.2);
1487
- // Normalize value within [valueMin, valueMax]
1488
- const clamped = Math.min(Math.max(this.value, this.valueMin), this.valueMax);
1489
- const range = this.valueMax - this.valueMin || 1;
1490
- const ratio = (clamped - this.valueMin) / range;
1491
- // Use the smaller of width/height as diameter
1492
- const diameter = this.size;
1493
- const angle = ratio * 360;
1494
- const ringThickness = thicknessClamped * diameter;
1495
- const innerDiameter = diameter - ringThickness * 2;
1496
- const fontSize = diameter * 0.2;
1497
- // Determine background color for empty portion
1498
- const emptyColor = BACKGROUND_VARIANTS[this.variant] || BACKGROUND_VARIANTS.default;
1499
- const containerStyle = {
1500
- width: `${diameter}px`,
1501
- height: `${diameter}px`,
1502
- background: `conic-gradient(#00e766 0deg ${angle}deg, ${emptyColor} ${angle}deg 360deg)`
1503
- };
1504
- const maskStyle = {
1505
- width: `${innerDiameter}px`,
1506
- height: `${innerDiameter}px`,
1507
- top: `${ringThickness}px`,
1508
- left: `${ringThickness}px`
1509
- };
1510
- const textStyle = {
1511
- fontSize: `${fontSize}px`
1512
- };
1513
- return h("div", {
1514
- key: 'a549808bcd0fc64583f90f284a7b139386e71be7',
1515
- role: "progressbar",
1516
- "aria-valuemin": this.valueMin,
1517
- "aria-valuemax": this.valueMax,
1518
- "aria-valuenow": clamped,
1519
- "aria-label": `Gauge value: ${clamped} of ${this.valueMax}`,
1520
- class: "relative inline-block rounded-full overflow-hidden",
1521
- style: containerStyle
1522
- }, h("div", {
1523
- key: 'c3efb2d512f96e4c3a9371416c6d9bb938cab43e',
1524
- class: "absolute bg-inverse rounded-full",
1525
- style: maskStyle
1526
- }), h("div", {
1527
- key: '7a6254e22240301b6716a2d6fed785196a39cdd8',
1528
- class: "absolute inset-0 flex items-center justify-center"
1529
- }, h("span", {
1530
- key: '78d8d1b7c442f75947b2813bbb569c566357c121',
1531
- class: "f-body-01 text-default",
1532
- style: textStyle
1533
- }, clamped)));
1534
- }
1535
- };
1536
- EdsGauge.style = EdsGaugeStyle0;
1537
1123
  const edsHeaderCss = ".block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.z-10{z-index:10}.text-default{color:var(--black)}.text-inverse{color:var(--white)}.bg-inverse{background-color:var(--white)}.bg-dark{background-color:var(--grey-300)}.bg-strongest{background-color:var(--black)}.mr-auto{margin-right:auto}.w-\\[200px\\]{width:200px}.h-\\[85px\\]{height:85px}.left-1\\/2{left:50%}.top-1\\/2{top:50%}.grow{flex-grow:1}.-translate-x-1\\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\\/2{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hidden{display:none}.gap-x-2{-moz-column-gap:0.125rem;column-gap:0.125rem}.after\\:effect-opacity::after{transition-property:opacity;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:300ms;transition-timing-function:cubic-bezier(0, 0, 0.2, 1)}.whitespace-nowrap{white-space:nowrap}.\\!text-current{color:currentColor !important}.overflow-hidden{overflow:hidden}.after\\:\\!border-transparent::after{border-color:var(--transparent) !important}.hover\\:after\\:\\!border-transparent:hover::after{border-color:var(--transparent) !important}.after\\:opacity-0::after{opacity:0}.hover\\:after\\:opacity-100:hover::after{opacity:1}.px-16{padding-left:1rem;padding-right:1rem}@media (min-width: 750px){.md\\:flex{display:flex}.md\\:hidden{display:none}}";
1538
1124
  const EdsHeaderStyle0 = edsHeaderCss;
1539
1125
  const EdsHeader = class {
@@ -1706,20 +1292,20 @@ const EdsImg = class {
1706
1292
  imgOpts['decoding'] = 'async';
1707
1293
  }
1708
1294
  return h("div", {
1709
- key: 'de3328e21b2b038984e74c08cd757cd85c7a7e01',
1295
+ key: '13ed3aa346c99321c609e49ce045b6361921350f',
1710
1296
  class: {
1711
1297
  'items-center justify-center': true,
1712
1298
  'effect-bg-pattern': this.lazyload && this.showBg
1713
1299
  }
1714
1300
  }, h("picture", {
1715
- key: '4e623a25c64ce1b2c09adf3519f12bde04280ba3'
1301
+ key: '56aa0ed8fd1ef8f9faf6ad576dd05edc34139c9b'
1716
1302
  }, this.formats.map(format => h("source", {
1717
1303
  type: format.type,
1718
1304
  srcSet: format.srcset,
1719
1305
  media: format.media,
1720
1306
  sizes: this.sizes
1721
1307
  })), h("img", Object.assign({
1722
- key: '6d87af22189017aa1e158c01a8295c98381a1ba1',
1308
+ key: '78e3ed9adcfe423d48388bf30140f4b70649faf7',
1723
1309
  ref: el => this.img = el,
1724
1310
  class: {
1725
1311
  'effect-opacity object-cover object-center': true,
@@ -1789,7 +1375,7 @@ const EdsInput = class {
1789
1375
  const withIcon = !!this.icon;
1790
1376
  const describedBy = this.hasMessage || this.error ? `${this.name}-error` : '';
1791
1377
  return h("div", {
1792
- key: 'bb88b782042a37d2fcbd8a93f03056199d822559',
1378
+ key: '5c66c14b19aa3d5fc37e7a77a2d1194fa0be9b8c',
1793
1379
  class: "relative flex items-center"
1794
1380
  }, this.type === 'textarea' ? h("textarea", {
1795
1381
  id: this.inputId || this.name,
@@ -1839,10 +1425,10 @@ const EdsInput = class {
1839
1425
  onInput: this.handleInput,
1840
1426
  onChange: this.handleInput
1841
1427
  }), this.maxLength && this.type === 'textarea' && h("span", {
1842
- key: '7b1cc490731455d00d500308458e6b2cd320fccf',
1428
+ key: '4326db3729dea8bbddb7a109a90424aa832aded7',
1843
1429
  class: `input-counter f-ui-05 absolute bottom-8 right-8 ${this.maxLengthReached ? 'input-counter-error' : ''}`
1844
1430
  }, this.maxLength), this.icon && h("eds-icon-wrapper", {
1845
- key: 'ce4d5548bc0fa1e681e3b74b03d071d73d8372d5',
1431
+ key: 'df2f5598aedd36b9cb2ce886fb8ea08da58dc5ff',
1846
1432
  class: `absolute top-1/2 left-[4px] -translate-y-1/2 ${this.disabled ? 'text-lightest' : 'text-lightest'}`,
1847
1433
  icon: this.icon
1848
1434
  }));
@@ -1946,7 +1532,7 @@ const EdsInputField = class {
1946
1532
  checked: this.checked
1947
1533
  };
1948
1534
  return h("div", {
1949
- key: '5243586c0bf3acc86d42684dbcd0288b3360b00c',
1535
+ key: 'e46f1b26212ee915c2fde3fa0c58a152005d2b50',
1950
1536
  class: "space-y-8"
1951
1537
  }, this.type === 'checkbox' || this.type === 'radio' ? this.parsedOptions.length > 0 ? h("fieldset", {
1952
1538
  class: "space-y-4 mt-8"
@@ -2018,7 +1604,7 @@ const EdsInputField = class {
2018
1604
  value: numberValue
2019
1605
  }));
2020
1606
  })() : h("eds-input", Object.assign({}, inputOpts))), h("eds-input-footer", {
2021
- key: 'e4e1f28766471d5451f342aa4d60d58fca2ddd01',
1607
+ key: 'ecf3ee5c0400749f1d89b53edfdee6fe62ca2a32',
2022
1608
  id: `${this.name}-footer`,
2023
1609
  name: this.name,
2024
1610
  message: this.message,
@@ -2043,26 +1629,26 @@ const EdsInputFooter = class {
2043
1629
  }
2044
1630
  render() {
2045
1631
  return h("div", {
2046
- key: 'c3dbdb05ce4cc9244a1ebc9f3ce5718742924ea1',
1632
+ key: 'd5424778da81d6558246efe97917d3e3ccfa9aaa',
2047
1633
  class: "space-y-4 mt-4"
2048
1634
  }, this.error && this.errorMessage && h("div", {
2049
- key: 'ccfde4960e1bec5697774de57da1a7948b5112c4',
1635
+ key: 'e915fc1f4719f48eca5a831ac72913d2f91f633b',
2050
1636
  id: `error_${this.name}`,
2051
1637
  class: "text-error flex items-center"
2052
1638
  }, h("eds-icon-wrapper", {
2053
- key: 'cc7171c96a7251c064f7ce527fe715aaac9a74e2',
1639
+ key: '9cc87cfd4955766947a2581604fe1e072f8d82a9',
2054
1640
  icon: "warning"
2055
1641
  }), h("p", {
2056
- key: '99893066c8aeac76793fef4d5cf6d5b34dbbc25f',
1642
+ key: '564a2397fb7e8185e43e1c2be216c76060e7498e',
2057
1643
  class: "f-ui-04 ml-4",
2058
1644
  innerHTML: this.errorMessage
2059
1645
  })), this.message && h("p", {
2060
- key: '55a6881d02d06440e6adac174a43a1cd59adf34b',
1646
+ key: '24e0702df7e5c2fe4ef0cc6755159fefe76b70a7',
2061
1647
  id: `desc_${this.name}`,
2062
1648
  class: "f-ui-05 text-lighter",
2063
1649
  innerHTML: this.message
2064
1650
  }), this.link && h("a", {
2065
- key: 'bb84693685aedbe7ba28551a1d944c0e1d8eda57',
1651
+ key: '9e3720a3ded9d755afd7755104df0942246f1fbe',
2066
1652
  href: this.link.url,
2067
1653
  class: "f-ui-05 effect-color hover:text-lighter underline underline-offset-4"
2068
1654
  }, this.link.label));
@@ -2078,16 +1664,16 @@ const EdsInputLabel = class {
2078
1664
  }
2079
1665
  render() {
2080
1666
  return h("label", {
2081
- key: '815b70d78f4004afb77a0c01772f750478dea1b3',
1667
+ key: 'd700690a67a8348836aec27d2ff4f4d4ee18b9c8',
2082
1668
  htmlFor: this.name,
2083
1669
  class: `input-label ${this.disabled ? 'text-lighter' : ''}`
2084
1670
  }, this.label, this.required && h("span", {
2085
- key: 'de2cba1c7e89632b3aac40de573d730cf38a85c6'
1671
+ key: '9b52c053652db132a9bdb2d9fc64c569a529c2d9'
2086
1672
  }, h("span", {
2087
- key: '58326fb23edd4521b0f1c6e67366e7c589217387',
1673
+ key: 'cd17268b6048ebaa70dc7f905fc7f7bf3ed3fa34',
2088
1674
  "aria-hidden": "true"
2089
1675
  }, "*"), h("span", {
2090
- key: 'e2208159652c9244e49c2c3d476a099a442d28ac',
1676
+ key: '352d7b5ef080336a5c7b53e0b710d5b0d7aa0efe',
2091
1677
  class: "sr-only"
2092
1678
  }, "required")));
2093
1679
  }
@@ -2134,10 +1720,10 @@ const EdsInputRange = class {
2134
1720
  }
2135
1721
  render() {
2136
1722
  return h("div", {
2137
- key: '9901432821b3dbdbf67e3b905c75acd7095ec8e9',
1723
+ key: '5c55f65e2acd6f4554af7d8ba513c9d9dfd445eb',
2138
1724
  class: "relative flex flex-col items-start space-y-2"
2139
1725
  }, h("input", {
2140
- key: '44023ef4a7e3fec22666103ccec3e2346aea885d',
1726
+ key: '4fcd0d3d978ddba7929958dd22a283c2ba61ee48',
2141
1727
  id: this.inputId || this.name,
2142
1728
  name: this.name,
2143
1729
  min: this.min,
@@ -2155,7 +1741,7 @@ const EdsInputRange = class {
2155
1741
  onInput: this.onInput,
2156
1742
  onChange: this.onChange
2157
1743
  }), h("p", {
2158
- key: 'b74e14f619acbe7b98966bac8ea2c5206d05ad62',
1744
+ key: 'c63b223e6af149efb68cabbe5228e77b09ca2168',
2159
1745
  id: `desc_${this.name}`,
2160
1746
  class: "block f-ui-05 text-lighter"
2161
1747
  }, "Current value: ", this.sliderVal));
@@ -2231,15 +1817,15 @@ const EdsInputSearch = class {
2231
1817
  }
2232
1818
  render() {
2233
1819
  return h("div", {
2234
- key: '2d74c44bf05f4ccbe81df14a3af112a763b01b5f',
1820
+ key: '27d6871df962e2bd27eac38b1a105142b1b68bab',
2235
1821
  class: "relative flex items-center"
2236
1822
  }, h("eds-icon-wrapper", {
2237
- key: 'c7c7c479801a9c5e6da0b616448f7b89ba25b040',
1823
+ key: 'b4b497cb435c673a550b169dea93fbc7006d0c5e',
2238
1824
  icon: "search",
2239
1825
  class: "absolute top-1/2 left-[4px] -translate-y-1/2 text-lightest",
2240
1826
  "aria-hidden": "true"
2241
1827
  }), h("input", {
2242
- key: '8e4954dc67ae59d46f2e3423325eccda0944363a',
1828
+ key: '1419cd8f5b8791b5b812c57ba649567e1b6ec0bb',
2243
1829
  id: this.inputId || this.name,
2244
1830
  name: this.name,
2245
1831
  placeholder: this.placeholder,
@@ -2280,10 +1866,10 @@ const EdsInputSelect = class {
2280
1866
  const placeholderText = this.placeholder || `Please select ${this.name}`;
2281
1867
  const describedBy = this.hasMessage || this.error ? `${this.name}-error` : undefined;
2282
1868
  return h("div", {
2283
- key: '0e1bf5f1ebf30d675e0b4927e7812a305f58d2b9',
1869
+ key: '80cbdab87f5baa21df5edc857685c3af4dee3a58',
2284
1870
  class: "relative"
2285
1871
  }, h("select", {
2286
- key: 'b92542caca12d77e3160baa84760b37bbbe172c7',
1872
+ key: '4e8f84fd9dbc63df7981898cadc24450f48aa92a',
2287
1873
  id: selectId,
2288
1874
  name: this.name,
2289
1875
  class: {
@@ -2298,7 +1884,7 @@ const EdsInputSelect = class {
2298
1884
  required: this.required,
2299
1885
  onChange: this.handleChange
2300
1886
  }, h("option", {
2301
- key: 'fa911a07fd0053f6c7e5044aac3e6d0846344899',
1887
+ key: '54b90339cae4c5c80711793a8c68c4587e0c2495',
2302
1888
  value: "",
2303
1889
  disabled: true,
2304
1890
  hidden: true
@@ -2307,10 +1893,10 @@ const EdsInputSelect = class {
2307
1893
  value: opt.value,
2308
1894
  selected: opt.value === this.value
2309
1895
  }, opt.label))), h("span", {
2310
- key: 'afa3c7ad3c583dec2ffc2fd5087d7695509a2a25',
1896
+ key: '6c9f0a0606f1d6f282c756f84ace7618584d5fa3',
2311
1897
  class: "bg-dark rounded-xs absolute top-1/2 right-[6px] flex h-28 w-28 -translate-y-1/2 items-center justify-center"
2312
1898
  }, h("eds-icon-wrapper", {
2313
- key: '1bb2a24fc9798a7359b9b45019b1432ff2e50e70',
1899
+ key: '4524af72468d3b37c01b0252d4b6b2bf7454514e',
2314
1900
  class: "w-20 h-20",
2315
1901
  icon: "chevron-right"
2316
1902
  })));
@@ -2502,7 +2088,7 @@ const EdsLink = class {
2502
2088
  const labelClasses = this.hideLabelOnSmallScreen ? 'hidden lg:flex' // Tailwind example: hidden on small screens, visible on larger
2503
2089
  : '';
2504
2090
  return h(ComponentType, {
2505
- key: 'ee6e8eeb12df62ee801164877a357c075590ebae',
2091
+ key: '8c7ab8b80b9765e83e4e57d59ba1b45fe36f15b7',
2506
2092
  class: `${classes || ''} ${this.extraClass || ''}`,
2507
2093
  href: !this.disabled ? this.url : undefined,
2508
2094
  target: this.external && !this.disabled ? '_blank' : undefined,
@@ -2513,10 +2099,10 @@ const EdsLink = class {
2513
2099
  download: this.download ? '' : undefined,
2514
2100
  onClick: event => this.handleClick(event)
2515
2101
  }, h("span", {
2516
- key: '7b35e3ddca346ff09730aa332b9f47b6d6707721',
2102
+ key: '94284b425a331f6a56a3e63db89fed5fa1a207c1',
2517
2103
  class: "z-1 relative inline-flex items-center justify-center"
2518
2104
  }, this.renderLeftIcon(), h("span", {
2519
- key: 'fe4201815e3791e6e3d6da8856d7a7a9e0211cfc',
2105
+ key: '7496886c7c975d6795633c36b9cc8d31673d5a4b',
2520
2106
  class: labelClasses
2521
2107
  }, this.label), this.renderRightIcon()));
2522
2108
  }
@@ -2587,13 +2173,13 @@ const EdsLogo = class {
2587
2173
  render() {
2588
2174
  const logoContent = this.getLogo();
2589
2175
  return h("a", {
2590
- key: 'a23e44227ebaa3b999c961e1354c268f2c916a6f',
2176
+ key: 'ab11d53e1f417221dcca2de441c7b3efa96f99a5',
2591
2177
  href: this.href,
2592
2178
  onClick: () => this.handleClick(),
2593
2179
  class: "eds-logo-wrapper",
2594
2180
  "aria-label": this.label
2595
2181
  }, h("div", {
2596
- key: 'cba53a54e6d31aabfa62ddcd8aa53bda56b8b706',
2182
+ key: '0d4a6b970788534d34d55b28fe83407ce7c4e00e',
2597
2183
  innerHTML: logoContent
2598
2184
  }));
2599
2185
  }
@@ -2703,40 +2289,40 @@ const EdsModal = class {
2703
2289
  // Generate a unique id for the title so we can reference it for aria-labelledby.
2704
2290
  const titleId = `modal-title-${this.el.tagName.toLowerCase()}`;
2705
2291
  return h("div", {
2706
- key: '3a2446813eebf215f2c7aafc26d5688f58020c54',
2292
+ key: 'affa340307adc5bdd637696b56a59e3f73cbf7e9',
2707
2293
  id: "eds-modal",
2708
2294
  class: `${this.isOpen ? 'block' : 'hidden'} fixed inset-0 z-9999999 flex`,
2709
2295
  role: "dialog",
2710
2296
  "aria-modal": "true",
2711
2297
  "aria-labelledby": titleId
2712
2298
  }, this.isOpen && h("div", {
2713
- key: '7081928b01c09e692cac0f61dbc58b4f5578271d',
2299
+ key: 'e4359b32052a155f879070deea34fbca2fb67e3b',
2714
2300
  class: "fixed inset-0 bg-dark bg-opacity-90" // Add backdrop-blur utility class here
2715
2301
  ,
2716
2302
 
2717
2303
  onClick: () => this.close()
2718
2304
  }), h("div", {
2719
- key: '0fc5f4716022cb01c2da9a28738586710625c70f',
2305
+ key: 'ba95f463e8c807e2ac2e900b3167191908ca2f5d',
2720
2306
  class: `container absolute bg-inverse z-10 ${this.getModalPositionClasses()} grow justify-center`
2721
2307
  }, h("div", {
2722
- key: '8e4bdffba2f69b18e8846e4c2709c5c423b0a99e',
2308
+ key: '1fc4649d6ba728745e4f1ed73e8fb8bdac6eda59',
2723
2309
  class: `flex justify-between items-center border-b-2 border-softer px-20 py-20 ${this.inverseHeader ? 'bg-strongest text-inverse' : 'bg-dark text-default'}`
2724
2310
  }, h("span", {
2725
- key: '6e0d237fc95c1b74b1b0c0456848684578367302',
2311
+ key: '731e7cb6c7aaa36bcda8d1c32bd1b8da9d85f253',
2726
2312
  id: titleId,
2727
2313
  class: `f-heading-04 ${this.getTruncateClass()}`
2728
2314
  }, this.heading), h("eds-button", {
2729
- key: '3499de216da4ba38edb66cdcd688872f51b41aaf',
2315
+ key: '89657ac29b27ce173569353f3101e998cb756eec',
2730
2316
  intent: "tertiary",
2731
2317
  icon: "close",
2732
2318
  "aria-label": "Close modal",
2733
2319
  onClick: () => this.close(),
2734
2320
  "extra-class": "ml-8 text-default"
2735
2321
  })), h("div", {
2736
- key: 'f723dded796961e925cc2b046c31e7345fd3e159',
2322
+ key: '2e39edaa1f5cc5389873e203c3e4294de8b56678',
2737
2323
  class: "pt-8 px-20 py-20"
2738
2324
  }, h("slot", {
2739
- key: 'ffe1213b65e60dfaf7c220e3c7e3dd8495706dcf'
2325
+ key: '0fb09f52100042fc5f20f5f443a8f5cff381d944'
2740
2326
  }))));
2741
2327
  }
2742
2328
  get el() {
@@ -2744,130 +2330,260 @@ const EdsModal = class {
2744
2330
  }
2745
2331
  };
2746
2332
  EdsModal.style = EdsModalStyle0;
2747
- const edsPieCss = ".relative{position:relative}.absolute{position:absolute}.inline-block{display:inline-block}.rounded-full{border-radius:9999px}.overflow-hidden{overflow:hidden}.bg-inverse{background-color:var(--white)}.bg-current{background-color:currentColor}.bg-dark{background-color:var(--grey-300)}.bg-darker{background-color:var(--grey-400)}.bg-default{background-color:var(--grey-200)}.bg-strong{background-color:var(--grey-700)}.bg-strongest{background-color:var(--black)}.inset-0{inset:0rem}.flex{display:flex}.items-center{align-items:center}.justify-center{justify-content:center}.f-body-01{font-family:var(--f-body-01-fontFamily);font-weight:var(--f-body-01-fontWeight);font-size:var(--f-body-01-fontSize);line-height:var(--f-body-01-lineHeight);letter-spacing:var(--f-body-01-letterSpacing)}.f-ui-01{font-family:var(--f-ui-01-fontFamily);font-weight:var(--f-ui-01-fontWeight);font-size:var(--f-ui-01-fontSize);line-height:var(--f-ui-01-lineHeight);letter-spacing:var(--f-ui-01-letterSpacing)}.f-ui-02{font-family:var(--f-ui-02-fontFamily);font-weight:var(--f-ui-02-fontWeight);font-size:var(--f-ui-02-fontSize);line-height:var(--f-ui-02-lineHeight);letter-spacing:var(--f-ui-02-letterSpacing)}.text-default{color:var(--black)}.w-8{width:0.5rem}.h-8{height:0.5rem}.mr-4{margin-right:0.25rem}:host{display:block}.wrapper{display:flex;align-items:center;justify-content:center;height:100%}.pie-chart{overflow:visible}.slice-label{font-size:var(--font-size-chart-label);font-weight:var(--font-weight-chart-label);fill:var(--color-text);pointer-events:none}.legend{list-style:none;margin:0;padding:0 0 0 1rem}.legend-item{display:flex;align-items:center;margin-bottom:0.5rem;outline:none}.legend-item:focus{outline:2px dashed var(--color-primary)}.legend-swatch{width:1rem;height:1rem;border-radius:50%;margin-right:0.5rem}.legend-label{font-size:var(--font-size-base);color:var(--color-text)}";
2748
- const EdsPieStyle0 = edsPieCss;
2749
- const EdsPie = class {
2333
+ const edsPaginationCss = "ul,menu{list-style:none;margin:0;padding:0}.f-ui-03{font-family:var(--f-ui-03-fontFamily);font-weight:var(--f-ui-03-fontWeight);font-size:var(--f-ui-03-fontSize);line-height:var(--f-ui-03-lineHeight);letter-spacing:var(--f-ui-03-letterSpacing)}.f-ui-03-light{font-family:var(--f-ui-03-light-fontFamily);font-weight:var(--f-ui-03-light-fontWeight);font-size:var(--f-ui-03-light-fontSize);line-height:var(--f-ui-03-light-lineHeight);letter-spacing:var(--f-ui-03-light-letterSpacing)}.f-ui-02{font-family:var(--f-ui-02-fontFamily);font-weight:var(--f-ui-02-fontWeight);font-size:var(--f-ui-02-fontSize);line-height:var(--f-ui-02-lineHeight);letter-spacing:var(--f-ui-02-letterSpacing)}.f-ui-02-light{font-family:var(--f-ui-02-light-fontFamily);font-weight:var(--f-ui-02-light-fontWeight);font-size:var(--f-ui-02-light-fontSize);line-height:var(--f-ui-02-light-lineHeight);letter-spacing:var(--f-ui-02-light-letterSpacing)}.text-lightest{color:var(--grey-500)}.mb-28{margin-bottom:1.75rem}.w-full{width:100%}.w-20{width:1.25rem}.h-20{height:1.25rem}.h-28{height:1.75rem}.h-32{height:2rem}.h-36{height:2.25rem}.text-center{text-align:center}.flex{display:flex}.inline-flex{display:inline-flex}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-x-8{-moz-column-gap:0.5rem;column-gap:0.5rem}.mr-auto{margin-right:auto}.ml-auto{margin-left:auto}.\\!p-8{padding:0.5rem !important}.ml-4{margin-left:0.25rem}.mr-4{margin-right:0.25rem}.hidden{display:none}.gap-1{gap:0.0625rem}.py-4{padding-top:0.25rem;padding-bottom:0.25rem}.transition-colors{transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}@media (min-width: 900px){.lg\\:\\!pr-12{padding-right:0.75rem !important}.lg\\:flex{display:flex}}";
2334
+ const EdsPaginationStyle0 = edsPaginationCss;
2335
+ const EdsPagination = class {
2750
2336
  constructor(hostRef) {
2751
2337
  registerInstance(this, hostRef);
2752
- this.size = 200;
2753
- this.slices = [];
2754
- this.thickness = 1;
2755
- this.display = 'value';
2756
- this.legend = true;
2757
- this.colorScheme = 'semantic';
2758
- }
2759
- parseSlices() {
2760
- if (typeof this.slices === 'string') {
2761
- try {
2762
- return JSON.parse(this.slices);
2763
- } catch (_a) {
2764
- // eslint-disable-next-line
2765
- console.warn('eds-pie: invalid slices JSON');
2338
+ this.currentPage = undefined;
2339
+ this.lastPage = undefined;
2340
+ this.perPage = 10;
2341
+ this.total = 0;
2342
+ this.url = '';
2343
+ this.mode = 'default';
2344
+ this.prevLabel = 'Prev';
2345
+ this.nextLabel = 'Next';
2346
+ this.prevUrl = '';
2347
+ this.nextUrl = '';
2348
+ this.links = [];
2349
+ }
2350
+ /** Lifecycle hook to generate pagination links on component load */
2351
+ componentWillLoad() {
2352
+ if (this.mode === 'default') {
2353
+ this.generateLinks();
2354
+ }
2355
+ }
2356
+ componentDidLoad() {
2357
+ // Emit context for each eds-link element after the component is fully loaded
2358
+ const links = this.hostEl.shadowRoot.querySelectorAll('eds-link');
2359
+ links.forEach(lnk => {
2360
+ this.emitContext(lnk);
2361
+ });
2362
+ /*if (links.length > 0) {
2363
+ // Emit context for the first link
2364
+ this.emitContext(links[0]);
2365
+ // Emit context for the last link, if it's different from the first
2366
+ if (links.length > 1) {
2367
+ this.emitContext(links[links.length - 1]);
2766
2368
  }
2369
+ }*/
2370
+ }
2371
+ /**
2372
+ * Emits a custom event called `parentContext` for a given link element.
2373
+ * This event provides context information about the breadcrumb component.
2374
+ *
2375
+ * @param linkElement - The link element to which the event will be dispatched.
2376
+ */
2377
+ emitContext(linkElement) {
2378
+ const event = new CustomEvent('parentContext', {
2379
+ detail: {
2380
+ componentName: this.hostEl.tagName.toLowerCase(),
2381
+ identifier: null
2382
+ }
2383
+ });
2384
+ linkElement.dispatchEvent(event);
2385
+ }
2386
+ onPageOrLastPageChange() {
2387
+ if (this.mode === 'default') {
2388
+ this.generateLinks();
2767
2389
  }
2768
- return Array.isArray(this.slices) ? this.slices : [];
2769
2390
  }
2770
- polarToCartesian(cx, cy, r, angle) {
2771
- const rad = (angle - 90) * (Math.PI / 180);
2391
+ /**
2392
+ * Checks if the current page is the first page
2393
+ * @returns {boolean} - true if current page is the first page
2394
+ */
2395
+ isFirstPage() {
2396
+ return this.currentPage === 1;
2397
+ }
2398
+ /**
2399
+ * Checks if the current page is the last page
2400
+ * @returns {boolean} - true if current page is the last page
2401
+ */
2402
+ isLastPage() {
2403
+ return this.currentPage === this.lastPage;
2404
+ }
2405
+ /**
2406
+ * Generates a pagination link object
2407
+ * @param {number} page - Page number for the link
2408
+ * @returns {Link} - Link object with page details
2409
+ */
2410
+ generateLink(page) {
2411
+ const urlHasQuery = this.url.includes('?');
2772
2412
  return {
2773
- x: cx + r * Math.cos(rad),
2774
- y: cy + r * Math.sin(rad)
2413
+ ariaLabel: `Page ${page}`,
2414
+ url: `${this.url}${urlHasQuery ? '&' : '?'}page=${page}`,
2415
+ label: page.toString(),
2416
+ current: this.currentPage === page,
2417
+ disabled: false
2775
2418
  };
2776
2419
  }
2777
- describeArc(x, y, r, startAngle, endAngle) {
2778
- const start = this.polarToCartesian(x, y, r, endAngle);
2779
- const end = this.polarToCartesian(x, y, r, startAngle);
2780
- const largeArcFlag = endAngle - startAngle <= 180 ? '0' : '1';
2781
- return [`M ${start.x} ${start.y}`, `A ${r} ${r} 0 ${largeArcFlag} 0 ${end.x} ${end.y}`, `L ${x} ${y}`, 'Z'].join(' ');
2420
+ /** Generates pagination links based on the last page and current page */
2421
+ generateLinks() {
2422
+ if (this.lastPage && this.lastPage > 5) {
2423
+ this.links = this.getPaginationGenerator(this.currentPage || 1, this.lastPage).map(page => typeof page === 'number' ? this.generateLink(page) : page);
2424
+ } else if (this.lastPage) {
2425
+ this.links = Array.from({
2426
+ length: this.lastPage
2427
+ }).map((_, i) => this.generateLink(i + 1));
2428
+ }
2782
2429
  }
2783
- render() {
2784
- const raw = this.parseSlices();
2785
- if (raw.length > EdsPie.MAX_SLICES) {
2786
- // eslint-disable-next-line
2787
- console.warn(`eds-pie: too many slices (${raw.length}), results may overlap.`);
2430
+ /**
2431
+ * Creates a pagination range based on delta, current, and total pages
2432
+ * @param {number} current - Current page number
2433
+ * @param {number} total - Total number of pages
2434
+ * @param {number} delta - Range of pages to display around the current page
2435
+ * @returns {(number | string)[]} - Range of page numbers or ellipses
2436
+ */
2437
+ getPaginationGenerator(current, total) {
2438
+ const delta = 1; // Show one page before and one after the current page
2439
+ const range = [];
2440
+ if (total <= 5) {
2441
+ // If total pages are 5 or less, show all pages
2442
+ for (let i = 1; i <= total; i++) {
2443
+ range.push(i);
2444
+ }
2445
+ } else {
2446
+ // Always show the first page
2447
+ range.push(1);
2448
+ // Add ellipsis if there’s a gap between the first page and the current range start
2449
+ if (current - delta > 2) {
2450
+ range.push('...');
2451
+ }
2452
+ // Determine range for pages around the current page
2453
+ for (let i = Math.max(2, current - delta); i <= Math.min(total - 1, current + delta); i++) {
2454
+ range.push(i);
2455
+ }
2456
+ // Add ellipsis if there’s a gap between the current range end and the last page
2457
+ if (current + delta < total - 1) {
2458
+ range.push('...');
2459
+ }
2460
+ // Always show the last page
2461
+ range.push(total);
2462
+ }
2463
+ return range;
2464
+ }
2465
+ /**
2466
+ * Formats the current page results information for display
2467
+ * @returns {string} - Formatted page result information
2468
+ */
2469
+ pageResults() {
2470
+ if (this.total > 0) {
2471
+ return this.total > this.perPage ? `${this.perPage * ((this.currentPage || 1) - 1) + 1} - ${this.perPage * (this.currentPage || 1) >= this.total ? this.total : this.perPage * (this.currentPage || 1)} of ${this.total}` : `${this.total}`;
2472
+ }
2473
+ return '';
2474
+ }
2475
+ /**
2476
+ * Handles a page click event, updating the current page and dispatching an event
2477
+ * @param {MouseEvent} event - Click event
2478
+ * @param {number} newPage - New page number
2479
+ */
2480
+ handlePageClick(event, newPage) {
2481
+ if (this.mode === 'navigator') {
2482
+ return; // No page clicking logic for navigator mode
2788
2483
  }
2789
- const total = raw.reduce((sum, s) => sum + s.value, 0) || 1;
2790
- const palette = [...EdsPie.PALETTES[this.colorScheme]];
2791
- const sorted = [...raw].sort((a, b) => b.value - a.value);
2792
- let cumulative = 0;
2793
- const processed = sorted.map(s => {
2794
- const angle = s.value / total * 360;
2795
- const start = cumulative,
2796
- end = cumulative + angle;
2797
- cumulative = end;
2798
- const color = s.color || palette.shift() || 'var(--color-chart-neutral-1)';
2799
- return Object.assign(Object.assign({}, s), {
2800
- start,
2801
- end,
2802
- color
2484
+ event.preventDefault(); // Prevent default link navigation
2485
+ if (newPage !== this.currentPage) {
2486
+ this.links = this.links.map(link => typeof link === 'object' ? Object.assign(Object.assign({}, link), {
2487
+ current: parseInt(link.label) === newPage
2488
+ }) : link);
2489
+ const pageChangeEvent = new CustomEvent('page', {
2490
+ detail: newPage,
2491
+ bubbles: true,
2492
+ composed: true
2803
2493
  });
2804
- });
2805
- const diameter = this.size;
2806
- const radius = diameter / 2;
2807
- // clamp into [0.5, 1]
2808
- const tClamped = Math.min(Math.max(this.thickness, 0.5), 1);
2809
- const innerRadius = radius * (1 - tClamped);
2810
- const outerRadius = radius;
2811
- // **replace** the previous labelRadius line with this:
2812
- const labelRadius = (radius + innerRadius) / 2;
2813
- // Build ARIA description
2814
- const ariaLabel = processed.map(s => `${s.label}: ${this.display === 'percent' ? `${Math.round(s.value / total * 100)}%` : s.value}`).join(', ');
2815
- return h(Host, null, h("div", {
2816
- class: "wrapper"
2817
- }, h("svg", {
2818
- width: diameter,
2819
- height: diameter,
2820
- role: "img",
2821
- "aria-label": `Pie chart: ${ariaLabel}`,
2822
- class: "pie-chart"
2823
- }, h("title", null, "Pie chart"), h("g", null, processed.map(s => h("path", {
2824
- key: s.id,
2825
- d: this.describeArc(radius, radius, outerRadius, s.start, s.end),
2826
- fill: s.color
2827
- })), innerRadius > 0 && h("circle", {
2828
- cx: radius,
2829
- cy: radius,
2830
- r: innerRadius,
2831
- fill: "var(--white)"
2832
- }), processed.map(s => {
2833
- const midAngle = s.start + (s.end - s.start) / 2;
2834
- const {
2835
- x,
2836
- y
2837
- } = this.polarToCartesian(radius, radius, labelRadius, midAngle);
2838
- const text = this.display === 'percent' ? `${Math.round(s.value / total * 100)}%` : String(s.value);
2839
- return h("text", {
2840
- key: s.id,
2841
- x: x,
2842
- y: y,
2843
- class: "f-ui-02",
2844
- "text-anchor": "middle",
2845
- "alignment-baseline": "middle"
2846
- }, text);
2847
- }))), this.legend && h("ul", {
2848
- class: "legend",
2849
- role: "list"
2850
- }, processed.map(s => h("li", {
2851
- key: s.id,
2852
- role: "listitem",
2853
- tabindex: "0",
2854
- class: "legend-item"
2494
+ this.hostEl.dispatchEvent(pageChangeEvent);
2495
+ this.currentPage = newPage;
2496
+ }
2497
+ }
2498
+ render() {
2499
+ return h("div", {
2500
+ key: '6377e0187e461bcbeac835dd7cb83e93ef199865'
2501
+ }, this.total > 0 && this.mode === 'default' && h("p", {
2502
+ key: 'ec2a6b6a40c76352743d012c51cda5d7fe1137df',
2503
+ class: "f-ui-03 text-lightest mb-28 w-full text-center"
2855
2504
  }, h("span", {
2856
- class: "legend-swatch",
2857
- style: {
2858
- backgroundColor: s.color
2505
+ key: '3a23e3d156f87167b0dacb4085870958ce19e793',
2506
+ class: "sr-only"
2507
+ }, "Results:"), this.pageResults()), this.mode === 'navigator' || this.lastPage && this.lastPage > 1 ? h("nav", {
2508
+ "aria-label": "Pagination"
2509
+ }, h("ul", {
2510
+ class: "flex items-center justify-center gap-x-8"
2511
+ }, h("li", {
2512
+ class: "mr-auto"
2513
+ }, h("eds-link", {
2514
+ label: this.prevLabel,
2515
+ url: this.mode === 'navigator' ? this.prevUrl || '#' // Use prevUrl if provided, otherwise disable with '#'
2516
+ : this.isFirstPage() ? '#' : this.generateLink(this.currentPage - 1).url,
2517
+ disabled: this.mode === 'navigator' ? !this.prevUrl // Disable if prevUrl is not provided
2518
+ : this.isFirstPage(),
2519
+ "aria-label": "Previous page",
2520
+ icon: "chevron-left",
2521
+ "icon-pos": "left",
2522
+ size: "small",
2523
+ "icon-small": "true",
2524
+ intent: "strong",
2525
+ "hide-label-on-small-screen": true,
2526
+ class: "!p-8 lg:!pr-12",
2527
+ onClick: event => {
2528
+ if (this.mode === 'default') {
2529
+ if (this.isFirstPage()) {
2530
+ event.preventDefault(); // Prevent click if disabled
2531
+ } else {
2532
+ this.handlePageClick(event, (this.currentPage || 1) - 1);
2533
+ }
2534
+ }
2535
+ }
2536
+ })), this.mode === 'default' && this.links.map((link, index) => h("li", {
2537
+ key: index,
2538
+ class: "f-ui-02 flex h-36 items-center justify-center"
2539
+ }, typeof link === 'string' ? h("span", {
2540
+ class: "flex items-center justify-center"
2541
+ }, link) : h("eds-link", {
2542
+ url: link.url,
2543
+ "aria-label": link.ariaLabel,
2544
+ label: link.label,
2545
+ current: link.current,
2546
+ size: "small",
2547
+ class: "!p-8",
2548
+ intent: link.current ? 'secondary' : 'ghost',
2549
+ onClick: event => this.handlePageClick(event, parseInt(link.label))
2550
+ }))), h("li", {
2551
+ class: "ml-auto"
2552
+ }, h("eds-link", {
2553
+ label: this.nextLabel,
2554
+ url: this.mode === 'navigator' ? this.nextUrl || '#' // Use nextUrl if provided, otherwise disable with '#'
2555
+ : this.isLastPage() ? '#' : this.generateLink(this.currentPage + 1).url,
2556
+ disabled: this.mode === 'navigator' ? !this.nextUrl // Disable if nextUrl is not provided
2557
+ : this.isLastPage(),
2558
+ "aria-label": "Next page",
2559
+ size: "small",
2560
+ "icon-small": "true",
2561
+ icon: "chevron-right",
2562
+ intent: "strong",
2563
+ "hide-label-on-small-screen": true,
2564
+ class: "!p-8 lg:!pl-12 flex items-center gap-1 py-4 transition-colors",
2565
+ onClick: event => {
2566
+ if (this.mode === 'default') {
2567
+ if (this.isLastPage()) {
2568
+ event.preventDefault(); // Prevent click if disabled
2569
+ } else {
2570
+ this.handlePageClick(event, (this.currentPage || 1) + 1);
2571
+ }
2572
+ }
2859
2573
  }
2860
- }), h("span", {
2861
- class: "legend-label"
2862
- }, s.label))))));
2574
+ })))) : null);
2575
+ }
2576
+ get hostEl() {
2577
+ return getElement(this);
2578
+ }
2579
+ static get watchers() {
2580
+ return {
2581
+ "currentPage": ["onPageOrLastPageChange"],
2582
+ "lastPage": ["onPageOrLastPageChange"]
2583
+ };
2863
2584
  }
2864
2585
  };
2865
- EdsPie.MAX_SLICES = 9;
2866
- EdsPie.PALETTES = {
2867
- semantic: ['var(--color-chart-accent)', 'var(--color-chart-strong)', 'var(--color-chart-accent-dark)', 'var(--color-chart-lighter)', 'var(--color-chart-accent-light)', 'var(--color-chart-lightest)', 'var(--color-chart-accent-lighter)', 'var(--color-chart-darker)', 'var(--color-chart-accent-lightest)'],
2868
- mono: ['var(--grey-700)', 'var(--grey-500)', 'var(--grey-300)', 'var(--grey-100)', 'var(--grey-800)', 'var(--grey-600)', 'var(--grey-400)', 'var(--grey-200)', 'var(--grey-900)']
2869
- };
2870
- EdsPie.style = EdsPieStyle0;
2586
+ EdsPagination.style = EdsPaginationStyle0;
2871
2587
  const edsSocialNetworksCss = "blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}.f-ui-02{font-family:var(--f-ui-02-fontFamily);font-weight:var(--f-ui-02-fontWeight);font-size:var(--f-ui-02-fontSize);line-height:var(--f-ui-02-lineHeight);letter-spacing:var(--f-ui-02-letterSpacing)}.f-ui-02-light{font-family:var(--f-ui-02-light-fontFamily);font-weight:var(--f-ui-02-light-fontWeight);font-size:var(--f-ui-02-light-fontSize);line-height:var(--f-ui-02-light-lineHeight);letter-spacing:var(--f-ui-02-light-letterSpacing)}.f-ui-03{font-family:var(--f-ui-03-fontFamily);font-weight:var(--f-ui-03-fontWeight);font-size:var(--f-ui-03-fontSize);line-height:var(--f-ui-03-lineHeight);letter-spacing:var(--f-ui-03-letterSpacing)}.mt-12{margin-top:0.75rem}.mt-16{margin-top:1rem}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.gap-4{gap:0.25rem}.effect-color{transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:300ms;transition-timing-function:cubic-bezier(0, 0, 0.2, 1)}.effect-focus{outline-width:3px;outline-offset:2px;outline-color:var(--green-500)}.text-light{color:var(--grey-700)}.text-lighter{color:var(--grey-600)}.hover\\:text-default:hover{color:var(--black)}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.rounded-sm{border-radius:8px}";
2872
2588
  const EdsSocialNetworksStyle0 = edsSocialNetworksCss;
2873
2589
  const EdsSocialNetworks = class {
@@ -3022,9 +2738,12 @@ const EdsSteps = class {
3022
2738
  onClick: () => this.handleStepClick(index)
3023
2739
  }, step.title), this.activeStep === index && h("div", {
3024
2740
  class: "content"
2741
+ }, h("slot", {
2742
+ name: `step-${index}`
3025
2743
  }, h("div", {
3026
- class: "f-body-02 text-lighter my-16"
3027
- }, step.content), h("eds-button", {
2744
+ class: index === steps.length - 1 ? 'f-body-02 text-lighter mt-16' : 'f-body-02 text-lighter my-16',
2745
+ innerHTML: step.content
2746
+ })), h("eds-button", {
3028
2747
  label: index === steps.length - 1 ? 'Finish' : 'Continue',
3029
2748
  intent: "primary",
3030
2749
  class: "next-btn",
@@ -3045,9 +2764,12 @@ const EdsSteps = class {
3045
2764
  key: index
3046
2765
  }, h("h3", null, step.title), h("div", {
3047
2766
  class: "content"
2767
+ }, h("slot", {
2768
+ name: `step-${index}`
3048
2769
  }, h("div", {
3049
- class: "f-body-02 text-lighter my-16"
3050
- }, step.content)))));
2770
+ class: index === steps.length - 1 ? 'f-body-02 text-lighter mt-16' : 'f-body-02 text-lighter my-16',
2771
+ innerHTML: step.content
2772
+ }))))));
3051
2773
  }
3052
2774
  get el() {
3053
2775
  return getElement(this);
@@ -3059,7 +2781,7 @@ const EdsSteps = class {
3059
2781
  }
3060
2782
  };
3061
2783
  EdsSteps.style = EdsStepsStyle0;
3062
- const edsStepsV2Css = "h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}.steps{position:sticky;margin-left:16px;border-left:1px solid var(--soft-color, #ddd);padding-left:23px;counter-reset:step}.steps h3{counter-increment:step;font-size:var(--f-heading-05-fontSize);font-weight:var(--f-heading-05-fontWeight);line-height:var(--f-heading-05-lineHeight);position:relative}.steps h3::before{content:counter(step);position:absolute;left:-40px;top:0;display:flex;align-items:center;justify-content:center;width:32px;height:32px;font-size:1rem;border:1px solid #ccc;background:var(--grey-900);color:#fff;border-radius:50%}.steps h4{counter-increment:step;font-size:var(--f-heading-06-fontSize);font-weight:var(--f-heading-06-fontWeight);line-height:var(--f-heading-06-lineHeight);position:relative}.steps h4::before{content:counter(step);position:absolute;left:-40px;top:0;display:flex;align-items:center;justify-content:center;width:30px;height:30px;font-size:0.875rem;border:1px solid #ccc;background:#333;color:#fff;border-radius:50%}.steps blockquote{margin-top:16px;margin-bottom:16px;font-style:italic;color:#aaa;padding-left:6px}.steps-img-placeholder{width:100%;height:200px;background:linear-gradient(to bottom, #9CE142, #00C959, #00A595);}.bg-\\[\\#00A595\\]{--tw-bg-opacity:1;background-color:rgb(0 165 149 / var(--tw-bg-opacity))}.relative{position:relative}.f-heading-04{font-family:var(--f-heading-04-fontFamily);font-weight:var(--f-heading-04-fontWeight);font-size:var(--f-heading-04-fontSize);line-height:var(--f-heading-04-lineHeight);letter-spacing:var(--f-heading-04-letterSpacing)}.f-body-02{font-family:var(--f-body-02-fontFamily);font-weight:var(--f-body-02-fontWeight);font-size:var(--f-body-02-fontSize);line-height:var(--f-body-02-lineHeight);letter-spacing:var(--f-body-02-letterSpacing)}.text-inverse{color:var(--white)}.text-light{color:var(--grey-700)}.text-lighter{color:var(--grey-600)}.w-full{width:100%}.h-52{height:3.25rem}.h-96{height:6rem}.h-\\[200px\\]{height:200px}.mt-16{margin-top:1rem}.mb-12{margin-bottom:0.75rem}.last\\:mb-0:last-child{margin-bottom:0rem}.last\\:mt-16:last-child{margin-top:1rem}.border-softer{border:2px solid rgba(0, 0, 0, .1)}.relative{position:relative}.flex{display:flex}.inline-flex{display:inline-flex}.grow{flex-grow:1}.rounded{border-radius:0.25rem}.rounded-lg{border-radius:16px}.rounded-t-lg{border-top-left-radius:16px;border-top-right-radius:16px}.border-2{border-width:2px}.p-8{padding:0.5rem}.p-24{padding:1.5rem}.bg-default{background-color:var(--grey-200)}.bg-inverse{background-color:var(--white)}.top-2{top:0.125rem}.bottom-2{bottom:0.125rem}.left-2{left:0.125rem}.right-2{right:0.125rem}.-translate-x-1\\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\\/2{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.overflow-hidden{overflow:hidden}";
2784
+ const edsStepsV2Css = "h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}.steps{position:sticky;margin-left:16px;border-left:1px solid var(--soft-color, #ddd);padding-left:23px;counter-reset:step}.steps h3{counter-increment:step;font-size:var(--f-heading-05-fontSize);font-weight:var(--f-heading-05-fontWeight);line-height:var(--f-heading-05-lineHeight);position:relative}.steps h3::before{content:counter(step);position:absolute;left:-40px;top:0;display:flex;align-items:center;justify-content:center;width:32px;height:32px;font-size:1rem;border:1px solid #ccc;background:var(--grey-900);color:#fff;border-radius:50%}.steps h4{counter-increment:step;font-size:var(--f-heading-06-fontSize);font-weight:var(--f-heading-06-fontWeight);line-height:var(--f-heading-06-lineHeight);position:relative}.steps h4::before{content:counter(step);position:absolute;left:-40px;top:0;display:flex;align-items:center;justify-content:center;width:30px;height:30px;font-size:0.875rem;border:1px solid #ccc;background:#333;color:#fff;border-radius:50%}.steps blockquote{margin-top:16px;margin-bottom:16px;font-style:italic;color:#aaa;padding-left:6px}.steps-img-placeholder{width:100%;height:200px;background:linear-gradient(to bottom, #9CE142, #00C959, #00A595);}.bg-\\[\\#00A595\\]{--tw-bg-opacity:1;background-color:rgb(0 165 149 / var(--tw-bg-opacity))}.relative{position:relative}.f-heading-04{font-family:var(--f-heading-04-fontFamily);font-weight:var(--f-heading-04-fontWeight);font-size:var(--f-heading-04-fontSize);line-height:var(--f-heading-04-lineHeight);letter-spacing:var(--f-heading-04-letterSpacing)}.f-body-02{font-family:var(--f-body-02-fontFamily);font-weight:var(--f-body-02-fontWeight);font-size:var(--f-body-02-fontSize);line-height:var(--f-body-02-lineHeight);letter-spacing:var(--f-body-02-letterSpacing)}.text-inverse{color:var(--white)}.text-light{color:var(--grey-700)}.text-lighter{color:var(--grey-600)}.w-full{width:100%}.h-52{height:3.25rem}.h-96{height:6rem}.h-\\[200px\\]{height:200px}.mt-16{margin-top:1rem}.my-16{margin-top:1rem;margin-bottom:1rem}.mb-12{margin-bottom:0.75rem}.last\\:mb-0:last-child{margin-bottom:0rem}.last\\:mt-16:last-child{margin-top:1rem}.border-softer{border:2px solid rgba(0, 0, 0, .1)}.relative{position:relative}.flex{display:flex}.inline-flex{display:inline-flex}.grow{flex-grow:1}.rounded{border-radius:0.25rem}.rounded-lg{border-radius:16px}.rounded-t-lg{border-top-left-radius:16px;border-top-right-radius:16px}.border-2{border-width:2px}.p-8{padding:0.5rem}.p-24{padding:1.5rem}.bg-default{background-color:var(--grey-200)}.bg-inverse{background-color:var(--white)}.top-2{top:0.125rem}.bottom-2{bottom:0.125rem}.left-2{left:0.125rem}.right-2{right:0.125rem}.-translate-x-1\\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\\/2{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.overflow-hidden{overflow:hidden}.space-y-8{--tw-space-y-reverse:0;margin-top:calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0.5rem * var(--tw-space-y-reverse))}.space-y-16{--tw-space-y-reverse:0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}";
3063
2785
  const EdsStepsV2Style0 = edsStepsV2Css;
3064
2786
  const EdsStepsV2 = class {
3065
2787
  constructor(hostRef) {
@@ -3080,6 +2802,7 @@ const EdsStepsV2 = class {
3080
2802
  this.steps = [];
3081
2803
  this.type = 'static';
3082
2804
  this.imageSrc = undefined;
2805
+ this.imageWidth = undefined;
3083
2806
  this.bg = true;
3084
2807
  this.message = undefined;
3085
2808
  this.activeStep = 0;
@@ -3133,12 +2856,13 @@ const EdsStepsV2 = class {
3133
2856
  render() {
3134
2857
  const steps = this.parsedSteps;
3135
2858
  return h("div", {
3136
- key: 'e86620aed9aafbf0c8e0cde0230b2147df952379',
2859
+ key: 'bbcec2dd9a5096eb0cecf0d413892e5708822f52',
3137
2860
  class: this.articleClasses()
3138
2861
  }, this.imageSrc ? h("div", {
3139
2862
  class: "w-full mb-12 rounded-t-lg overflow-hidden border-2"
3140
2863
  }, h("eds-img", {
3141
2864
  src: this.imageSrc,
2865
+ width: this.imageWidth,
3142
2866
  "with-bg": "true",
3143
2867
  "lazy-load": "true",
3144
2868
  alt: "Step illustration"
@@ -3149,21 +2873,23 @@ const EdsStepsV2 = class {
3149
2873
  }, h("span", {
3150
2874
  class: "text-inverse f-heading-04 "
3151
2875
  }, this.message))), h("div", {
3152
- key: '773e51621fbfbc7b828d196d1e64a9752d02e5a4',
2876
+ key: 'db0618aad7d5986fcb0889f1c439be73f83a00df',
3153
2877
  class: "p-8"
3154
2878
  }, this.type === 'linear' ? h("div", {
3155
2879
  class: "steps"
3156
2880
  }, steps.map((step, index) => h("div", {
3157
- class: "step space-y-8",
2881
+ class: index === 0 ? 'step' : 'step space-y-16',
3158
2882
  key: index
3159
2883
  }, h("h3", {
3160
2884
  onClick: () => this.handleStepClick(index)
3161
2885
  }, step.title), this.activeStep === index && h("div", {
3162
2886
  class: "content"
2887
+ }, h("slot", {
2888
+ name: `step-${index}`
3163
2889
  }, h("div", {
3164
- class: "f-body-02 text-lighter mt-16",
2890
+ class: index === steps.length - 1 ? 'f-body-02 text-lighter mt-16' : 'f-body-02 text-lighter my-16',
3165
2891
  innerHTML: step.content
3166
- }), h("eds-button", {
2892
+ })), h("eds-button", {
3167
2893
  label: index === steps.length - 1 ? 'Finish' : 'Continue',
3168
2894
  intent: "primary",
3169
2895
  class: "next-btn",
@@ -3185,10 +2911,12 @@ const EdsStepsV2 = class {
3185
2911
  onClick: () => this.handleStepClick(index)
3186
2912
  }, step.title), h("div", {
3187
2913
  class: "content"
2914
+ }, h("slot", {
2915
+ name: `step-${index}`
3188
2916
  }, h("div", {
3189
- class: "f-body-02 text-lighter mt-16",
2917
+ class: index === steps.length - 1 ? 'f-body-02 text-lighter mt-16' : 'f-body-02 text-lighter my-16',
3190
2918
  innerHTML: step.content
3191
- })))))));
2919
+ }))))))));
3192
2920
  }
3193
2921
  get el() {
3194
2922
  return getElement(this);
@@ -3200,6 +2928,326 @@ const EdsStepsV2 = class {
3200
2928
  }
3201
2929
  };
3202
2930
  EdsStepsV2.style = EdsStepsV2Style0;
2931
+ const edsTableCss = "table{text-indent:0;border-color:inherit;border-collapse:collapse;}.container{width:calc(var(--container-width, 100%) - (2 * var(--breakout-container-outer-gutter, var(--container-outer-gutter, var(--outer-gutter, 0)))));margin-right:auto;margin-left:auto}.container>*{--container-outer-gutter:0;--breakout-container-outer-gutter:0}.pt-32{padding-top:2rem}.pt-40{padding-top:2.5rem}.pt-48{padding-top:3rem}.pb-28{padding-bottom:1.75rem}.pb-60{padding-bottom:3.75rem}.mt-20{margin-top:1.25rem}.mt-28{margin-top:1.75rem}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.overflow-x-auto{overflow-x:auto}.mt-6{margin-top:0.375rem}.p-0{padding:0rem}.m-0{margin:0rem}.border{border-width:1px}.border-softer{border:1px solid rgba(0, 0, 0, .1)}.even\\:bg-inverse-softer:nth-child(even){background-color:rgba(255, 255, 255, .15)}.px-8{padding-left:0.5rem;padding-right:0.5rem}.px-20{padding-left:1.25rem;padding-right:1.25rem}.py-8{padding-top:0.5rem;padding-bottom:0.5rem}.f-ui-01{font-family:var(--f-ui-01-fontFamily);font-weight:var(--f-ui-01-fontWeight);font-size:var(--f-ui-01-fontSize);line-height:var(--f-ui-01-lineHeight);letter-spacing:var(--f-ui-01-letterSpacing)}.f-ui-02{font-family:var(--f-ui-02-fontFamily);font-weight:var(--f-ui-02-fontWeight);font-size:var(--f-ui-02-fontSize);line-height:var(--f-ui-02-lineHeight);letter-spacing:var(--f-ui-02-letterSpacing)}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.text-center{text-align:center}.break-words{overflow-wrap:anywhere}";
2932
+ const EdsTableStyle0 = edsTableCss;
2933
+ const EdsTable = class {
2934
+ constructor(hostRef) {
2935
+ registerInstance(this, hostRef);
2936
+ this.rowaction = createEvent(this, "rowaction", 7);
2937
+ this.handleResize = () => {
2938
+ this.updateContainerWidth();
2939
+ };
2940
+ this.data = null;
2941
+ this.endpoint = null;
2942
+ this.config = {};
2943
+ this.rowsPerPage = 10;
2944
+ this.paginationEnabled = true;
2945
+ this.searchEnabled = false;
2946
+ this.hostWidth = undefined;
2947
+ this.columnSize = 'default';
2948
+ this.actions = [];
2949
+ this.actionTemplate = undefined;
2950
+ this.parsedActions = [];
2951
+ this.dataColumns = [];
2952
+ this.tbData = [];
2953
+ this.columns = [];
2954
+ this.currentPage = 1;
2955
+ this.parsedConfig = {};
2956
+ this.totalRows = 0;
2957
+ this.searchQuery = '';
2958
+ this.containerWidth = 0;
2959
+ }
2960
+ handleDataChange() {
2961
+ this.parseData();
2962
+ }
2963
+ handleConfigChange() {
2964
+ this.parseConfig();
2965
+ }
2966
+ handleActionsChange() {
2967
+ try {
2968
+ this.parsedActions = typeof this.actions === 'string' ? JSON.parse(this.actions) : this.actions;
2969
+ } catch (_a) {
2970
+ console.error('Failed to parse actions JSON');
2971
+ this.parsedActions = [];
2972
+ }
2973
+ }
2974
+ componentWillLoad() {
2975
+ this.parseConfig();
2976
+ this.handleActionsChange();
2977
+ this.data ? this.parseData() : this.endpoint && this.fetchData();
2978
+ }
2979
+ componentDidLoad() {
2980
+ this.updateContainerWidth();
2981
+ window.addEventListener('resize', this.handleResize);
2982
+ this.setupPaginationListener();
2983
+ }
2984
+ componentDidUpdate() {
2985
+ this.setupPaginationListener();
2986
+ }
2987
+ disconnectedCallback() {
2988
+ window.removeEventListener('resize', this.handleResize);
2989
+ }
2990
+ updateContainerWidth() {
2991
+ // Use hostWidth prop if provided; otherwise, measure parent element
2992
+ if (this.hostWidth && this.hostWidth.trim() !== '') {
2993
+ this.containerWidth = Number(this.hostWidth);
2994
+ } else if (this.hostEl.parentElement instanceof HTMLElement) {
2995
+ this.containerWidth = this.hostEl.parentElement.getBoundingClientRect().width;
2996
+ } else {
2997
+ this.containerWidth = 400;
2998
+ }
2999
+ }
3000
+ parseData() {
3001
+ try {
3002
+ this.tbData = parseData(this.data);
3003
+ this.totalRows = this.tbData.length;
3004
+ this.updateColumns();
3005
+ this.currentPage = 1;
3006
+ } catch (error) {
3007
+ console.error('Failed to parse data:', error);
3008
+ this.tbData = [];
3009
+ }
3010
+ }
3011
+ parseConfig() {
3012
+ try {
3013
+ this.parsedConfig = typeof this.config === 'string' ? JSON.parse(this.config) : this.config;
3014
+ } catch (error) {
3015
+ console.error('Failed to parse config:', error);
3016
+ this.parsedConfig = {};
3017
+ }
3018
+ }
3019
+ async fetchData() {
3020
+ try {
3021
+ const response = await fetch(this.endpoint);
3022
+ const data = await response.json();
3023
+ this.data = data;
3024
+ } catch (error) {
3025
+ console.error('Failed to fetch data:', error);
3026
+ }
3027
+ }
3028
+ setupPaginationListener() {
3029
+ if (!this.shouldEnablePagination()) {
3030
+ return;
3031
+ }
3032
+ const paginationEl = this.hostEl.shadowRoot.querySelector('eds-pagination');
3033
+ if (paginationEl && !paginationEl.hasAttribute('listener-attached')) {
3034
+ paginationEl.addEventListener('page', event => this.handlePageChange(event.detail));
3035
+ paginationEl.setAttribute('listener-attached', 'true');
3036
+ }
3037
+ }
3038
+ getFilteredRows() {
3039
+ return this.tbData.filter(row => Object.values(row).some(value => value.toString().toLowerCase().includes(this.searchQuery.toLowerCase())));
3040
+ }
3041
+ getPaginatedRows() {
3042
+ const filteredRows = this.getFilteredRows();
3043
+ this.totalRows = filteredRows.length;
3044
+ const start = (this.currentPage - 1) * this.rowsPerPage;
3045
+ return filteredRows.slice(start, start + this.rowsPerPage);
3046
+ }
3047
+ handlePageChange(newPage) {
3048
+ this.currentPage = newPage;
3049
+ sendAnalytics({
3050
+ category: 'ui-component',
3051
+ parentContext: null,
3052
+ tag: `${this.hostEl.tagName.toLowerCase()}/eds-pagination`,
3053
+ name: `${newPage}` || '',
3054
+ action: 'page'
3055
+ });
3056
+ }
3057
+ handleSearch(event) {
3058
+ this.searchQuery = event.target.value;
3059
+ this.currentPage = 1;
3060
+ }
3061
+ renderCell(value, column) {
3062
+ var _a;
3063
+ const format = (_a = this.parsedConfig[column]) === null || _a === void 0 ? void 0 : _a.format;
3064
+ return format === 'uppercase' ? value === null || value === void 0 ? void 0 : value.toString().toUpperCase() : format === 'svg' ? h("div", {
3065
+ innerHTML: value
3066
+ }) : format === 'bold' ? h("strong", null, value) : format === 'code' ? h("code", null, value) : value;
3067
+ }
3068
+ /**
3069
+ * Renders one action (button or checkbox) for a specific action‐name.
3070
+ * Used by the “Actions” column below.
3071
+ */
3072
+ renderSingleActionCell(actionName, row) {
3073
+ var _a;
3074
+ const act = this.parsedActions.find(a => a.name === actionName);
3075
+ if (this.actionTemplate) {
3076
+ return this.actionTemplate(row);
3077
+ }
3078
+ const type = act.type || 'button';
3079
+ if (type === 'checkbox') {
3080
+ const boundField = (_a = act.field) !== null && _a !== void 0 ? _a : act.name;
3081
+ const checked = !!row[boundField];
3082
+ return h("eds-input-field", {
3083
+ name: `chc-${actionName}`,
3084
+ label: act.label,
3085
+ type: "checkbox",
3086
+ checked: checked,
3087
+ onChange: e => this.emitAction(act.name, row, e.target.checked)
3088
+ });
3089
+ }
3090
+ return h("eds-link", {
3091
+ label: act.label,
3092
+ intent: "weak",
3093
+ onClick: () => this.emitAction(act.name, row)
3094
+ });
3095
+ }
3096
+ emitAction(actionName, row, checked) {
3097
+ sendAnalytics({
3098
+ category: 'ui-component',
3099
+ parentContext: null,
3100
+ tag: `${this.hostEl.tagName.toLowerCase()}/action`,
3101
+ name: actionName,
3102
+ action: 'click'
3103
+ });
3104
+ this.rowaction.emit({
3105
+ action: actionName,
3106
+ row,
3107
+ checked: !!checked
3108
+ });
3109
+ }
3110
+ shouldEnablePagination() {
3111
+ return this.paginationEnabled && this.totalRows > this.rowsPerPage;
3112
+ }
3113
+ updateColumns() {
3114
+ var _a, _b;
3115
+ // 1) Grab all data‐keys from the first row (if any) as before:
3116
+ this.columns = this.tbData.length > 0 ? Object.keys(this.tbData[0]) : [];
3117
+ // 2) Instead of pushing each action.name, we add just a single “actions” column
3118
+ // (you can call it anything; we’ll detect it in render())
3119
+ if (((_b = (_a = this.parsedActions) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0) > 0 && this.tbData.length > 0) {
3120
+ this.columns.push('actions');
3121
+ }
3122
+ }
3123
+ getVisibleColumnsCount() {
3124
+ return this.columns.filter(column => {
3125
+ var _a;
3126
+ return !((_a = this.parsedConfig[column]) === null || _a === void 0 ? void 0 : _a.hidden);
3127
+ }).length;
3128
+ }
3129
+ divisionFactor() {
3130
+ let divisionFactor = 1;
3131
+ if (this.columnSize === 'medium') {
3132
+ divisionFactor = 2;
3133
+ } else if (this.columnSize === 'large') {
3134
+ divisionFactor = 4;
3135
+ }
3136
+ return divisionFactor;
3137
+ }
3138
+ capitalize(str) {
3139
+ return str.charAt(0).toUpperCase() + str.slice(1).toLowerCase();
3140
+ }
3141
+ render() {
3142
+ const currentContainerWidth = this.hostWidth && this.hostWidth.trim() !== '' ? Number(this.hostWidth) : this.containerWidth || 400;
3143
+ const visibleColumnsCount = this.getVisibleColumnsCount();
3144
+ const columnWidth = visibleColumnsCount > 0 ? Math.floor(currentContainerWidth / visibleColumnsCount * this.divisionFactor()) : 100;
3145
+ const paginatedRows = this.getPaginatedRows();
3146
+ const lastPage = Math.ceil(this.totalRows / this.rowsPerPage);
3147
+ return h("div", {
3148
+ key: '5034177431626ab2bfc5fd0118c006d11a4f6e96'
3149
+ }, this.searchEnabled && h("div", {
3150
+ key: '86e1a6ffc4bed69f290b3a53031341ab276eaf04'
3151
+ }, h("eds-input-field", {
3152
+ key: 1,
3153
+ name: "search",
3154
+ "aria-label": "Search",
3155
+ type: "text",
3156
+ placeholder: "Search...",
3157
+ onInput: event => this.handleSearch(event)
3158
+ })), h("div", {
3159
+ key: 'bc11838d819ecf89c5ba1cc1cfe7ac0af0e82b59',
3160
+ class: "mt-20"
3161
+ }, h("table", {
3162
+ key: '97f16b65eb1d9387e9ca7588184c9e68c1afcc2e',
3163
+ class: "block overflow-x-auto mt-6 p-0"
3164
+ }, h("thead", {
3165
+ key: 'f4d64ada28c225db1b224277513e663a99de1cec'
3166
+ }, h("tr", {
3167
+ key: 'c6a69e159cceada0f7143c0acb787e5c23242ae7',
3168
+ class: "m-0 p-0 border border-softer even:bg-inverse-softer"
3169
+ }, this.columns.map(col => {
3170
+ var _a;
3171
+ // 3) For the “actions” column, override the header to “Actions”
3172
+ if (col === 'actions') {
3173
+ // You can choose a smaller min‐width here if you wish:
3174
+ return h("th", {
3175
+ class: "m-0 py-8 border border-softer f-ui-02 break-words",
3176
+ style: {
3177
+ minWidth: `${columnWidth - 4}px`
3178
+ }
3179
+ }, "Actions");
3180
+ }
3181
+ // Otherwise, render column name or action label if you do want to override:
3182
+ if (!((_a = this.parsedConfig[col]) === null || _a === void 0 ? void 0 : _a.hidden)) {
3183
+ return h("th", {
3184
+ class: "m-0 py-8 border border-softer f-ui-02 break-words",
3185
+ style: {
3186
+ minWidth: `${columnWidth - 4}px`
3187
+ }
3188
+ }, this.capitalize(col));
3189
+ }
3190
+ return null;
3191
+ }))), h("tbody", {
3192
+ key: '133af82fdd1f820e853734ab48123cb3db527e15'
3193
+ }, paginatedRows.map(row => h("tr", {
3194
+ class: "m-0 p-0 border border-softer even:bg-inverse-softer"
3195
+ }, this.columns.map(col => {
3196
+ var _a;
3197
+ if (col === 'actions') {
3198
+ // 4) Render ALL actions inside a single <td> for this row:
3199
+ return h("td", {
3200
+ class: "text-center border border-softer m-0 f-ui-02 break-words actions-cell",
3201
+ style: {
3202
+ minWidth: `${columnWidth - 4}px`
3203
+ }
3204
+ }, h("div", {
3205
+ style: {
3206
+ display: 'flex',
3207
+ gap: '0.5rem',
3208
+ justifyContent: 'center',
3209
+ flexWrap: 'wrap'
3210
+ }
3211
+ }, this.parsedActions.map(act => h("span", {
3212
+ style: {
3213
+ whiteSpace: 'nowrap'
3214
+ }
3215
+ }, this.renderSingleActionCell(act.name, row)))));
3216
+ }
3217
+ if (!((_a = this.parsedConfig[col]) === null || _a === void 0 ? void 0 : _a.hidden)) {
3218
+ // Regular data cell:
3219
+ return h("td", {
3220
+ class: "text-center border border-softer m-0 py-8 f-ui-2 break-words",
3221
+ style: {
3222
+ minWidth: `${columnWidth - 4}px`
3223
+ }
3224
+ }, this.renderCell(row[col], col));
3225
+ }
3226
+ return null;
3227
+ })))))), this.shouldEnablePagination() && h("div", {
3228
+ key: '85032d06cd0ac5dae9b504d423fceba3cd074861',
3229
+ class: "mt-20"
3230
+ }, h("eds-pagination", {
3231
+ key: '8caf6f57960e222c04d45f57a5811cd7bd524f4c',
3232
+ currentPage: this.currentPage,
3233
+ lastPage: lastPage,
3234
+ perPage: this.rowsPerPage,
3235
+ total: this.totalRows,
3236
+ mode: "default"
3237
+ })));
3238
+ }
3239
+ get hostEl() {
3240
+ return getElement(this);
3241
+ }
3242
+ static get watchers() {
3243
+ return {
3244
+ "data": ["handleDataChange", "parseData"],
3245
+ "config": ["handleConfigChange"],
3246
+ "actions": ["handleActionsChange"]
3247
+ };
3248
+ }
3249
+ };
3250
+ EdsTable.style = EdsTableStyle0;
3203
3251
  const edsTabsCss = "*,::before,::after{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(147 197 253 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}*,::before,::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:currentColor;}::before,::after{--tw-content:''}a{color:inherit;text-decoration:inherit}.relative{position:relative}.f-ui-03{font-family:var(--f-ui-03-fontFamily);font-weight:var(--f-ui-03-fontWeight);font-size:var(--f-ui-03-fontSize);line-height:var(--f-ui-03-lineHeight);letter-spacing:var(--f-ui-03-letterSpacing)}.whitespace-nowrap{white-space:nowrap}.effect-color{transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:300ms;transition-timing-function:cubic-bezier(0, 0, 0.2, 1)}.focus-visible\\:text-default:focus-visible{color:var(--black)}.hover\\:text-default:hover{color:var(--black)}.border-2{border-width:2px}.after\\:content-\\[\\'\\'\\]::after{--tw-content:'';content:var(--tw-content)}.after\\:bottom-0::after{bottom:0rem}.after\\:border-0::after{border-width:0px}.after\\:border-b-2::after{border-bottom-width:2px}.after\\:absolute::after{position:absolute}.after\\:inset-0::after{inset:0rem}.after\\:rounded-lg::after{border-radius:16px}.after\\:border-solid::after{border-style:solid}.after\\:border-3::after{border-width:3px}.after\\:border-accent::after{border-color:var(--green-500)}.after\\:opacity-0::after{opacity:0}.outline-none{outline:2px solid transparent;outline-offset:2px}.focus\\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus-visible\\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus-visible\\:after\\:opacity-100:focus-visible::after{opacity:1}.rounded-t-lg{border-top-left-radius:16px;border-top-right-radius:16px}.rounded-tl-lg{border-top-left-radius:16px}.rounded-tr-lg{border-top-right-radius:16px}.border-l-0{border-left-width:0px}.border-r-0{border-right-width:0px}.pr-28{padding-right:1.75rem}.pl-28{padding-left:1.75rem}.-mr-16{margin-right:-1rem}.-ml-16{margin-left:-1rem}.px-16{padding-left:1rem;padding-right:1rem}.py-12{padding-top:0.75rem;padding-bottom:0.75rem}.after\\:left-16::after{left:1rem}.after\\:right-16::after{right:1rem}.text-lighter{color:var(--grey-600)}.bg-dark{background-color:var(--grey-300)}.hover\\:bg-darker:hover{background-color:var(--grey-400)}.border-soft{border-color:var(--grey-400)}.border-softest{border-color:rgba(0, 0, 0, .05)}.bg-default{background-color:var(--grey-200)}.text-default{color:var(--black)}.z-99{z-index:99}.before\\:bottom-0::before{bottom:0rem}.before\\:h-12::before{height:0.75rem}.before\\:opacity-5::before{opacity:0.05}.before\\:content-\\[\\'\\'\\]::before{--tw-content:'';content:var(--tw-content)}.before\\:absolute::before{position:absolute}.before\\:-bottom-2::before{bottom:-0.125rem}.after\\:inset-x-0::after{left:0rem;right:0rem}.before\\:inset-x-0::before{left:0rem;right:0rem}.before\\:h-3::before{height:0.1875rem}.before\\:bg-default::before{background-color:var(--grey-200)}.after\\:border-softest::after{border-color:rgba(0, 0, 0, .05)}.overflow-x-hidden{overflow-x:hidden}.overflow-y-auto{overflow-y:auto}.before\\:bg-gradient-y::before{background:linear-gradient(to bottom, transparent, ease-in-out, black)}.scroller-x{-ms-overflow-style:none;scrollbar-width:none}.overflow-x-auto{overflow-x:auto}.max-w-xxxl{max-width:2200px}.z-1{z-index:1}.mx-auto{margin-left:auto;margin-right:auto}.pt-8{padding-top:0.5rem}.pr-16{padding-right:1rem}.pl-16{padding-left:1rem}.inline-flex{display:inline-flex}@media (min-width: 900px){.lg\\:px-28{padding-left:1.75rem;padding-right:1.75rem}}@media (min-width: 2200px){.xxxl\\:px-0{padding-left:0rem;padding-right:0rem}}";
3204
3252
  const EdsTabsStyle0 = edsTabsCss;
3205
3253
  const EdsTabs = class {
@@ -3388,39 +3436,6 @@ const EdsTag = class {
3388
3436
  }
3389
3437
  };
3390
3438
  EdsTag.style = EdsTagStyle0;
3391
- const edsTooltipCss = ".relative{position:relative}.absolute{position:absolute}.inline-block{display:inline-block}.rounded-xs{border-radius:4px}.bg-strongest{background-color:var(--black)}.text-inverse{color:var(--white)}.f-ui-03-light{font-family:var(--f-ui-03-light-fontFamily);font-weight:var(--f-ui-03-light-fontWeight);font-size:var(--f-ui-03-light-fontSize);line-height:var(--f-ui-03-light-lineHeight);letter-spacing:var(--f-ui-03-light-letterSpacing)}.pointer-events-none{pointer-events:none}.left-1\\/2{left:50%}.z-10{z-index:10}.transform{transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-x-1\\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.whitespace-nowrap{white-space:nowrap}.p-6{padding:0.375rem}.bottom-full{bottom:100%}.mb-2{margin-bottom:0.125rem}.opacity-0{opacity:0}.transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.duration-150{transition-duration:150ms}.ease-in-out{transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}.group:hover .group-hover\\:opacity-100{opacity:1}";
3392
- const EdsTooltipStyle0 = edsTooltipCss;
3393
- const EdsTooltip = class {
3394
- constructor(hostRef) {
3395
- registerInstance(this, hostRef);
3396
- this.content = undefined;
3397
- }
3398
- /** fire analytics on every hover */
3399
- handleHover() {
3400
- sendAnalytics({
3401
- category: 'ui-component',
3402
- tag: this.el.tagName.toLowerCase(),
3403
- name: this.content.toLowerCase(),
3404
- action: 'hover'
3405
- });
3406
- }
3407
- render() {
3408
- return h("div", {
3409
- key: 'cf17cd61cd5888d6ea12bf6be0fb8c841072b4d6',
3410
- class: "relative inline-block group"
3411
- }, h("slot", {
3412
- key: '7a41d90940fff4e8b887ec4a3240371466f219a5'
3413
- }), h("div", {
3414
- key: 'ccf06592f4c977030b0cf54cce48d13889c059f3',
3415
- class: "absolute bottom-full left-1/2 \n transform -translate-x-1/2 mb-2\n rounded-xs bg-strongest text-inverse \n f-ui-03-light pointer-events-none \n z-10 whitespace-nowrap p-6 opacity-0 transition-opacity duration-150 ease-in-out\n group-hover:opacity-100",
3416
- role: "tooltip"
3417
- }, this.content));
3418
- }
3419
- get el() {
3420
- return getElement(this);
3421
- }
3422
- };
3423
- EdsTooltip.style = EdsTooltipStyle0;
3424
3439
  const edsUserCss = "hr,p{margin:0}.block{display:block}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.text-default{color:var(--black)}.min-w-\\[280px\\]{min-width:280px}.p-8{padding:0.5rem}.gap-x-16{-moz-column-gap:1rem;column-gap:1rem}.gap-y-8{row-gap:0.5rem}.pb-16{padding-bottom:1rem}.border-b-2{border-bottom-width:2px}.border-softer{border-color:rgba(0, 0, 0, .1 )}.max-w-full{max-width:100%}.w-full{width:100%}.f-ui-01{font-family:var(--f-ui-01-fontFamily);font-weight:var(--f-ui-01-fontWeight);font-size:var(--f-ui-01-fontSize);line-height:var(--f-ui-01-lineHeight);letter-spacing:var(--f-ui-01-letterSpacing)}.f-ui-03-light{font-family:var(--f-ui-03-light-fontFamily);font-weight:var(--f-ui-03-light-fontWeight);font-size:var(--f-ui-03-light-fontSize);line-height:var(--f-ui-03-light-lineHeight);letter-spacing:var(--f-ui-03-light-letterSpacing)}.text-light{color:var(--grey-700)}.mt-4{margin-top:0.25rem}.mt-16{margin-top:1rem}";
3425
3440
  const EdsUserStyle0 = edsUserCss;
3426
3441
  const EdsUser = class {
@@ -3458,8 +3473,8 @@ const EdsUser = class {
3458
3473
  key: 'ccc34b3c7b0ab8d515eebfa1962264365d20c788',
3459
3474
  class: "flex items-center"
3460
3475
  }, h("eds-dropdown", {
3461
- key: '5283fb61297cd5f631d04da9ca19371a3778068c',
3462
- label: `Welcome, ${user.preferred_username}`,
3476
+ key: 'dc4920fd442baa9f13d9f2b9a21065b5184eba83',
3477
+ label: `Hi, ${user.preferred_username}`,
3463
3478
  intent: "tertiary",
3464
3479
  "aria-label": "User Menu",
3465
3480
  "dropdown-pos": "right",
@@ -3467,36 +3482,36 @@ const EdsUser = class {
3467
3482
  icon: "chevron-down",
3468
3483
  class: "text-default"
3469
3484
  }, h("div", {
3470
- key: 'd39e041e54fb59a409520e8b88f6f569d55cc6fc',
3485
+ key: '0522db7fc229186c645665a4c9eeedc46fb5823b',
3471
3486
  class: "min-w-[280px] p-8"
3472
3487
  }, h("div", {
3473
- key: '50e571e30a6902b8443b9766dfb1018c76a2f68e',
3488
+ key: 'af7b9daec713d24f8a1415415d19cdf48905c0cb',
3474
3489
  class: "flex gap-x-16"
3475
3490
  }, h("eds-avatar", {
3476
- key: '88a675a256466366aba1028831626253d11d2474',
3491
+ key: 'c3ea7307d9beb597fe93d3942b7724f8526298ad',
3477
3492
  "first-name": user.given_name,
3478
3493
  "last-name": user.family_name,
3479
3494
  initials: this.initials,
3480
3495
  color: "grey"
3481
3496
  }), h("div", {
3482
- key: '99626794a7fa243bc599e9e77b0bc1b717d14c96',
3497
+ key: '7af823b5f38a3d7acf16c633471dcfe74bca5e3c',
3483
3498
  class: "max-w-full"
3484
3499
  }, user.name && h("p", {
3485
- key: '1f1e33e19fd2b266f442b596953100f6b5e6dfcd',
3500
+ key: '5973dfbac0efceeddb0dc211d9c502a1ad3b0dde',
3486
3501
  class: "f-ui-01 text-default w-full text-ellipsis"
3487
3502
  }, user.name), user.preferred_username && h("p", {
3488
- key: 'a36ebac6fdae9fa059887f7cc5d1009179f8eef9',
3503
+ key: '5989927760ed2a2d1365661bbdc112a3a3d23bbf',
3489
3504
  class: "f-ui-03-light text-light mt-4"
3490
3505
  }, user.preferred_username), user.email && h("p", {
3491
- key: '976cd925af318831a22f1d43242e0295614bb2a1',
3506
+ key: 'ee36be95298c0c7a748537012d48a85884955904',
3492
3507
  class: "f-ui-03-light text-light mt-4"
3493
3508
  }, user.email))), h("eds-block-break", {
3494
- key: '7d189caaab8a9b593017312d6e3d6943c36de22b'
3509
+ key: 'fb3ef5cad6e81f51983e54914412131c3bd4cbc2'
3495
3510
  }), h("div", {
3496
- key: 'efcfc9a2c1f774abfab09b09682d7839bd1d5d2c',
3511
+ key: 'e3784f3f4931378bf55d766d4a1cf5e24a75d462',
3497
3512
  class: "text-default flex w-full flex-col gap-y-8"
3498
3513
  }, h("slot", {
3499
- key: 'f54425f35d804753b94bb61e1d8e211a1583ac3b'
3514
+ key: 'c0052bb56286d9a3fdc686c8407e105499a38084'
3500
3515
  }))))));
3501
3516
  }
3502
3517
  get hostEl() {
@@ -3504,91 +3519,5 @@ const EdsUser = class {
3504
3519
  }
3505
3520
  };
3506
3521
  EdsUser.style = EdsUserStyle0;
3507
- const TokenSpacing = class {
3508
- constructor(hostRef) {
3509
- registerInstance(this, hostRef);
3510
- }
3511
- render() {
3512
- return h("div", {
3513
- key: 'ad89d21ec01f11c77d85853f7c0dbefd8ea9f07f',
3514
- class: "w-full"
3515
- }, h("ul", {
3516
- key: '6108fb2870c358de8e5c48e6d14f6c1e76af856f',
3517
- class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16"
3518
- }, h("li", {
3519
- key: 'cd0d1986b416f12164b8d0458262987a445662ca',
3520
- class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16"
3521
- }, h("div", {
3522
- key: 'f2cfd77fcba601b89605dabf109f599816bb118e',
3523
- class: "container p-8 item-center border-2 border-soft"
3524
- }, h("div", {
3525
- key: '69e4cb5660f5c51d2b9c1ba30a38f3b7decacc58',
3526
- class: "spacing-sample m-16 bg-strong"
3527
- }, h("span", {
3528
- key: '70a07326b0a95655db3aad083637499f5ed4aa73',
3529
- class: "f-body-01 text-inverse"
3530
- }, "Margin: 1rem / m-16")))), h("li", {
3531
- key: '97b8c127e9bbe9af4ec8f6876ebae3f87a52d130',
3532
- class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16"
3533
- }, h("div", {
3534
- key: '58537d6aa824b489ae9c5150400af21f11f1f447',
3535
- class: "container p-8 item-center border-2 border-soft"
3536
- }, h("div", {
3537
- key: '3f2913d232cb9de1b678b7f7903bef0642ef42df',
3538
- class: "spacing-sample ml-64 bg-strong"
3539
- }, h("span", {
3540
- key: 'fe56d1a501dc219a1bac474b674586609499f3de',
3541
- class: "f-body-01 text-inverse"
3542
- }, "Margin Left: 4rem / ml-64")))), h("li", {
3543
- key: 'e2dee648fd4bce503414d76f3afe64655285523c',
3544
- class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16"
3545
- }, h("div", {
3546
- key: 'e788fa22248ac92fb8bc89566c5b8a77cf14578f',
3547
- class: "container p-8 item-center border-2 border-soft"
3548
- }, h("div", {
3549
- key: '9629958b453aa831a1d871bb4e846d0926d9e57c',
3550
- class: "spacing-sample mt-32 bg-strong"
3551
- }, h("span", {
3552
- key: '0efde7eaed0fe3e14f476617e7e9bf2e20131f2c',
3553
- class: "f-body-01 text-inverse"
3554
- }, "Margin Top: 2rem / mt-32")))), h("li", {
3555
- key: '6dabfeb0086c784c50843abd12d5a505a56e0933',
3556
- class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16"
3557
- }, h("div", {
3558
- key: '164e7eec6ed3aad2847c4ede97f4bbfed34138d1',
3559
- class: "container p-8 item-center border-2 border-soft"
3560
- }, h("div", {
3561
- key: '9be99b05ba29204f6163df2c1522e7aa6211bd3d',
3562
- class: "spacing-sample p-32 bg-strong"
3563
- }, h("span", {
3564
- key: 'ae0a7ea74e31ea324015b844848c3d5a68930e8d',
3565
- class: "f-body-01 text-inverse"
3566
- }, "Padding: 2rem / p-32")))), h("li", {
3567
- key: '3804dbfb6a64a1dfd478bd0132ff83f51bcff33e',
3568
- class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16"
3569
- }, h("div", {
3570
- key: '75c96b0762c3fac8b4de897ab8147b2c5614a360',
3571
- class: "container p-8 item-center border-2 border-soft"
3572
- }, h("div", {
3573
- key: 'd00487531406fa89112bee34e05306c59dc4f497',
3574
- class: "spacing-sample pt-32 bg-strong"
3575
- }, h("span", {
3576
- key: '8a750b7ac07739a71949b236421427b8bb05b067',
3577
- class: "f-body-01 text-inverse"
3578
- }, "Padding Top: 2rem / pt-32")))), h("li", {
3579
- key: '5e5fe43383f13b4377aca7cfb07c97b6ac1dd79b',
3580
- class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16"
3581
- }, h("div", {
3582
- key: 'ed2ac88c543eba8c580d029ccacb1a8b26c1cae7',
3583
- class: "container p-8 item-center border-2 border-soft"
3584
- }, h("div", {
3585
- key: 'cf9a94b61e598c0ee6da9e771717574b48264333',
3586
- class: "spacing-sample pl-32 bg-strong"
3587
- }, h("span", {
3588
- key: 'a2d3fce66240c6b0d49d1a655c0b5a84be9c630d',
3589
- class: "f-body-01 text-inverse"
3590
- }, "Padding Left: 2rem / pl-32"))))));
3591
- }
3592
- };
3593
3522
 
3594
- export { EdsAvatar as eds_avatar, EdsBlockBreak as eds_block_break, EdsBreadcrumb as eds_breadcrumb, EdsButton as eds_button, EdsCardDesc as eds_card_desc, EdsCardGeneric as eds_card_generic, EdsCardTitle as eds_card_title, EdsDropdown as eds_dropdown, EdsFooter as eds_footer, EdsForm as eds_form, EdsFullscreenMenu as eds_fullscreen_menu, EdsGauge as eds_gauge, EdsHeader as eds_header, EdsIconWrapper as eds_icon_wrapper, EdsImg as eds_img, EdsInput as eds_input, EdsInputField as eds_input_field, EdsInputFooter as eds_input_footer, EdsInputLabel as eds_input_label, EdsInputRange as eds_input_range, EdsInputSearch as eds_input_search, EdsInputSelect as eds_input_select, EdsLink as eds_link, EdsLogo as eds_logo, EdsModal as eds_modal, EdsPie as eds_pie, EdsSocialNetworks as eds_social_networks, EdsSteps as eds_steps, EdsStepsV2 as eds_steps_v2, EdsTabs as eds_tabs, EdsTag as eds_tag, EdsTooltip as eds_tooltip, EdsUser as eds_user, TokenSpacing as token_spacing };
3523
+ export { EdsAvatar as eds_avatar, EdsBlockBreak as eds_block_break, EdsButton as eds_button, EdsDropdown as eds_dropdown, EdsFooter as eds_footer, EdsForm as eds_form, EdsFullscreenMenu as eds_fullscreen_menu, EdsHeader as eds_header, EdsIconWrapper as eds_icon_wrapper, EdsImg as eds_img, EdsInput as eds_input, EdsInputField as eds_input_field, EdsInputFooter as eds_input_footer, EdsInputLabel as eds_input_label, EdsInputRange as eds_input_range, EdsInputSearch as eds_input_search, EdsInputSelect as eds_input_select, EdsLink as eds_link, EdsLogo as eds_logo, EdsModal as eds_modal, EdsPagination as eds_pagination, EdsSocialNetworks as eds_social_networks, EdsSteps as eds_steps, EdsStepsV2 as eds_steps_v2, EdsTable as eds_table, EdsTabs as eds_tabs, EdsTag as eds_tag, EdsUser as eds_user };