@ebrains/components 0.9.2-beta → 1.0.0

package/dist/types/shared-ui/eds-feedback/eds-feedback.d.ts

@@ -1,5 +1,9 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 export declare class EdsFeedback {
+    /**
+     * The HTML heading level to use for the label. Valid values: 'h1' - 'h5'.
+     */
+    headingLevel: 'h1' | 'h2' | 'h3' | 'h4' | 'h5';
     /**
      * The type of icon to display. Can be "stars" or "thumbs".
      */

package/dist/types/shared-ui/eds-feedback/eds-feedback.stories.d.ts

@@ -2,11 +2,14 @@ declare const _default: {
     title: string;
     component: string;
     argTypes: {
+        headingLevel: {
+            control: string;
+            options: string[];
+            defaultValue: string;
+        };
         type: {
-            control: {
-                type: string;
-                options: string[];
-            };
+            control: string;
+            options: string[];
             description: string;
         };
         count: {
@@ -30,6 +33,7 @@ declare const _default: {
         };
     };
     args: {
+        headingLevel: string;
         type: string;
         count: number;
         label: string;

package/dist/types/shared-ui/eds-footer/eds-footer.d.ts

@@ -36,7 +36,17 @@ export declare class EdsFooter {
      * @type {string}
      */
     rightsReserved: string;
+    /**
+     * Controls the display of the "Cookies preferences" text.
+     * @type {string}
+     */
+    cookiesPreferences: string;
     enableCookiesSettings: boolean;
+    /**
+     * Controls the display of the "Back to Top" aria label text.
+     * @type {string}
+     */
+    backToTopAriaLabel: string;
     /**
      * State to control whether the eds-matomo-notice popup is visible.
      */

package/dist/types/shared-ui/eds-footer/eds-footer.stories.d.ts

@@ -22,6 +22,14 @@ declare const _default: {
             control: string;
             description: string;
         };
+        cookiesPreferences: {
+            control: string;
+            description: string;
+        };
+        backToTopAriaLabel: {
+            control: string;
+            description: string;
+        };
     };
     args: {
         social: boolean;
@@ -29,6 +37,8 @@ declare const _default: {
         rightsReserved: string;
         enableScrollTop: boolean;
         enableCookiesSettings: boolean;
+        cookiesPreferences: string;
+        backToTopAriaLabel: string;
     };
     parameters: {};
 };

package/dist/types/shared-ui/eds-form/eds-form.d.ts

@@ -74,7 +74,6 @@ export declare class EdsForm {
         value?: any;
         message?: string;
         success?: boolean;
-        data: any;
     }>;
     /**
      * Reference to the host element.
@@ -96,5 +95,6 @@ export declare class EdsForm {
     handleChange(e: Event, field: any): void;
     handleInput(e: Event, field: any): void;
     handleSubmit(): void;
+    getData(): Promise<FormData>;
     render(): any;
 }

package/dist/types/shared-ui/eds-header/eds-header.d.ts

@@ -29,10 +29,12 @@ export declare class EdsHeader {
         external?: boolean;
     }[];
     /**
-     * Determines if the header is rendered in inverse style.
-     * When true, the header applies styles suitable for a dark background.
+     * Header style variant: determines text and background colors.
+     * - "default": text-default on bg-dark
+     * - "inverse": text-default on bg-inverse
+     * - "strong": text-inverse on bg-strongest
      */
-    inverseHeader: boolean;
+    headerVariant: 'default' | 'inverse' | 'strong';
     /**
      * Flag to enable or disable header menu toggle feature.
      * When true, displays the toggle in the header.
@@ -53,32 +55,11 @@ export declare class EdsHeader {
     hostEl: HTMLElement;
     onAuthStatusChanged(event: CustomEvent<any>): void;
     /** Event to signal toggle menu action */
-    toggleMenu: EventEmitter<boolean>;
-    /**
-     * Lifecycle method that runs when the component has fully loaded.
-     * It emits a custom event for each `eds-link` element contained within the breadcrumb.
-     */
+    toggleheadermenu: EventEmitter<boolean>;
     componentDidLoad(): void;
-    /**
-     * Emits a custom event called `parentContext` for a given link element.
-     * This event provides context information about the breadcrumb component.
-     *
-     * @param linkElement - The link element to which the event will be dispatched.
-     */
     emitContext(linkElement: HTMLElement): void;
-    /** Emits an event to open or close the menu */
     handleToggleMenu(): void;
-    /**
-     * Toggles the visibility of the user menu.
-     * Opens the user menu if closed, and closes it if open.
-     */
     toggleUserMenu(): void;
-    /**
-     * Parses the `links` prop into an array of link objects.
-     * Returns an empty array if parsing fails or if `links` is not a valid JSON string or object.
-     *
-     * @returns {any[]} Array of parsed link objects
-     */
     get parsedLinks(): any[];
     render(): any;
 }

package/dist/types/shared-ui/eds-header/eds-header.stories.d.ts

@@ -14,8 +14,11 @@ declare const _default: {
             control: string;
             description: string;
         };
-        inverseHeader: {
-            control: string;
+        headerVariant: {
+            control: {
+                type: string;
+            };
+            options: string[];
             description: string;
         };
     };
@@ -26,7 +29,7 @@ declare const _default: {
             url: string;
         }[];
         menuEnabled: boolean;
-        inverseHeader: boolean;
+        headerVariant: string;
     };
 };
 export default _default;

package/dist/types/shared-ui/eds-matomo-notice/eds-matomo-notice.d.ts

@@ -50,7 +50,6 @@ export declare class EdsMatomoNotice {
     private optInAnalytics;
     private optOutAnalytics;
     private noThanks;
-    private deferDecision;
     private keepMeIn;
     private hideNotice;
     render(): any;

package/dist/types/shared-ui/eds-matomo-notice/eds-matomo-notice.stories.d.ts

@@ -10,10 +10,6 @@ declare const _default: {
             control: string;
             description: string;
         };
-        forceShow: {
-            control: string;
-            description: string;
-        };
     };
     args: {
         title: string;
@@ -26,6 +22,5 @@ export declare const Default: {
     args: {
         title: string;
         description: string;
-        forceShow: boolean;
     };
 };

package/dist/types/shared-ui/eds-steps-v2/eds-steps-v2.stories.d.ts

@@ -0,0 +1,48 @@
+declare const _default: {
+    title: string;
+    component: string;
+    argTypes: {
+        steps: {
+            control: string;
+            description: string;
+            defaultValue: {
+                title: string;
+                content: string;
+            }[];
+        };
+        type: {
+            control: string;
+            options: string[];
+            description: string;
+            defaultValue: string;
+        };
+        imageSrc: {
+            control: string;
+            description: string;
+        };
+        bg: {
+            control: string;
+            description: string;
+            defaultValue: boolean;
+        };
+        message: {
+            control: string;
+            description: string;
+        };
+    };
+    args: {
+        steps: {
+            title: string;
+            content: string;
+        }[];
+        type: string;
+        imageSrc: string;
+        bg: boolean;
+        message: string;
+    };
+};
+export default _default;
+export declare const Static: any;
+export declare const WithImage: any;
+export declare const WithMessage: any;
+export declare const Linear: any;

package/dist/types/shared-ui/eds-tabs/eds-tabs.stories.d.ts

@@ -14,4 +14,3 @@ declare const _default: {
 };
 export default _default;
 export declare const Default: any;
-export declare const CustomTabs: any;

package/loader/cdn.js

@@ -0,0 +1 @@
+module.exports = require('../dist/cjs/loader.cjs.js');

package/loader/index.cjs.js

@@ -0,0 +1 @@
+module.exports = require('../dist/cjs/loader.cjs.js');

package/loader/index.d.ts

@@ -0,0 +1,24 @@
+export * from '../dist/types/components';
+export interface CustomElementsDefineOptions {
+  exclude?: string[];
+  resourcesUrl?: string;
+  syncQueue?: boolean;
+  jmp?: (c: Function) => any;
+  raf?: (c: FrameRequestCallback) => number;
+  ael?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
+  rel?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
+}
+export declare function defineCustomElements(win?: Window, opts?: CustomElementsDefineOptions): void;
+/**
+ * @deprecated
+ */
+export declare function applyPolyfills(): Promise<void>;
+
+/**
+ * Used to specify a nonce value that corresponds with an application's CSP.
+ * When set, the nonce will be added to all dynamically created script and style tags at runtime.
+ * Alternatively, the nonce value can be set on a meta tag in the DOM head
+ * (<meta name="csp-nonce" content="{ nonce value here }" />) which
+ * will result in the same behavior.
+ */
+export declare function setNonce(nonce: string): void;

package/loader/index.es2017.js

@@ -0,0 +1 @@
+export * from '../dist/esm/loader.js';

package/loader/index.js

@@ -0,0 +1,2 @@
+(function(){if("undefined"!==typeof window&&void 0!==window.Reflect&&void 0!==window.customElements){var a=HTMLElement;window.HTMLElement=function(){return Reflect.construct(a,[],this.constructor)};HTMLElement.prototype=a.prototype;HTMLElement.prototype.constructor=HTMLElement;Object.setPrototypeOf(HTMLElement,a)}})();
+export * from '../dist/esm/loader.js';

package/loader/package.json

@@ -0,0 +1,11 @@
+{
+  "name": "components-loader",
+  "private": true,
+  "typings": "./index.d.ts",
+  "module": "./index.js",
+  "main": "./index.cjs.js",
+  "jsnext:main": "./index.es2017.js",
+  "es2015": "./index.es2017.js",
+  "es2017": "./index.es2017.js",
+  "unpkg": "./cdn.js"
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ebrains/components",
-  "version": "0.9.2-beta",
+  "version": "1.0.0",
   "main": "./dist/index.cjs.js",
   "module": "./dist/index.js",
   "es2015": "./dist/esm/index.mjs",
@@ -13,8 +13,18 @@
     "dist/",
     "loader/"
   ],
-  "dependencies": {
-    "@ebrains/assets":"0.6.1-beta",
-    "@ebrains/svgs":"0.6.1-beta"
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs.js"
+    },
+    "./*": {
+      "import": "./dist/components/*.js",
+      "require": "./dist/components/*.js"
+    },
+    "./dist/components/*.js": {
+      "import": "./dist/components/*.js",
+      "require": "./dist/components/*.js"
+    }
   }
 }

package/dist/components/eds-alert.entry.js

@@ -1,99 +0,0 @@
-import { r as registerInstance, h, g as getElement } from './index-9d277061.js';
-import { c as cva } from './index-144c9ae8.js';
-
-const edsAlertCss = ":root {\n  font-optical-sizing: auto;\n}\n\nhtml,\nbody {\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\n/*\n:focus[data-focus-method=\"mouse\"],\n:focus[data-focus-method=\"touch\"] {\n  outline: none !important;\n}\n*/\n/*FADE*/\n/*FADE TRANSLATE Y*/\n/*SLIDE LEFT*/\n/*SLIDE BOTTOM*/\n/*COLLAPSE Y*/\n*,\n::before,\n::after {\n  --tw-ring-offset-shadow: 0 0 #0000;\n  --tw-ring-shadow: 0 0 #0000;\n  --tw-shadow: 0 0 #0000;\n}\n\n::backdrop {\n  --tw-ring-offset-shadow: 0 0 #0000;\n  --tw-ring-shadow: 0 0 #0000;\n  --tw-shadow: 0 0 #0000;\n}\n\n/*\n! tailwindcss v3.4.13 | MIT License | https://tailwindcss.com\n*/\n/*\n1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)\n2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)\n*/\n*,\n::before,\n::after {\n  box-sizing: border-box;\n  /* 1 */\n  border-width: 0;\n  /* 2 */\n  border-style: solid;\n  /* 2 */\n  border-color: currentColor;\n  /* 2 */\n}\n\n::before,\n::after {}\n\n/*\n1. Use a consistent sensible line-height in all browsers.\n2. Prevent adjustments of font size after orientation changes in iOS.\n3. Use a more readable tab size.\n4. Use the user's configured `sans` font-family by default.\n5. Use the user's configured `sans` font-feature-settings by default.\n6. Use the user's configured `sans` font-variation-settings by default.\n7. Disable tap highlights on iOS\n*/\nhtml {\n  line-height: 1.5;\n  /* 1 */\n  -webkit-text-size-adjust: 100%;\n  /* 2 */\n  -moz-tab-size: 4;\n  /* 3 */\n  -o-tab-size: 4;\n  tab-size: 4;\n  /* 3 */\n  font-family: ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n  /* 4 */\n  font-feature-settings: normal;\n  /* 5 */\n  font-variation-settings: normal;\n  /* 6 */\n  -webkit-tap-highlight-color: transparent;\n  /* 7 */\n}\n\n/*\n1. Remove the margin in all browsers.\n2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.\n*/\nbody {\n  margin: 0;\n  /* 1 */\n  line-height: inherit;\n  /* 2 */\n}\n\n/*\n1. Add the correct height in Firefox.\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\n3. Ensure horizontal rules are visible by default.\n*/\nhr {\n  height: 0;\n  /* 1 */\n  color: inherit;\n  /* 2 */\n  border-top-width: 1px;\n  /* 3 */\n}\n\n/*\nAdd the correct text decoration in Chrome, Edge, and Safari.\n*/\nabbr:where([title]) {\n  -webkit-text-decoration: underline dotted;\n  text-decoration: underline dotted;\n}\n\n/*\nRemove the default font size and weight for headings.\n*/\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n  font-size: inherit;\n  font-weight: inherit;\n}\n\n/*\nReset links to optimize for opt-in styling instead of opt-out.\n*/\na {\n  color: inherit;\n  text-decoration: inherit;\n}\n\n/*\nAdd the correct font weight in Edge and Safari.\n*/\nb,\nstrong {\n  font-weight: bolder;\n}\n\n/*\n1. Use the user's configured `mono` font-family by default.\n2. Use the user's configured `mono` font-feature-settings by default.\n3. Use the user's configured `mono` font-variation-settings by default.\n4. Correct the odd `em` font sizing in all browsers.\n*/\ncode,\npre {\n  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n  /* 1 */\n  font-feature-settings: normal;\n  /* 2 */\n  font-variation-settings: normal;\n  /* 3 */\n  font-size: 1em;\n  /* 4 */\n}\n\n/*\nAdd the correct font size in all browsers.\n*/\nsmall {\n  font-size: 80%;\n}\n\n/*\nPrevent `sub` and `sup` elements from affecting the line height in all browsers.\n*/\nsub {\n  font-size: 75%;\n  line-height: 0;\n  position: relative;\n  vertical-align: baseline;\n}\n\nsub {\n  bottom: -0.25em;\n}\n\n/*\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\n3. Remove gaps between table borders by default.\n*/\ntable {\n  text-indent: 0;\n  /* 1 */\n  border-color: inherit;\n  /* 2 */\n  border-collapse: collapse;\n  /* 3 */\n}\n\n/*\n1. Change the font styles in all browsers.\n2. Remove the margin in Firefox and Safari.\n3. Remove default padding in all browsers.\n*/\nbutton,\ninput,\nselect,\ntextarea {\n  font-family: inherit;\n  /* 1 */\n  font-feature-settings: inherit;\n  /* 1 */\n  font-variation-settings: inherit;\n  /* 1 */\n  font-size: 100%;\n  /* 1 */\n  font-weight: inherit;\n  /* 1 */\n  line-height: inherit;\n  /* 1 */\n  letter-spacing: inherit;\n  /* 1 */\n  color: inherit;\n  /* 1 */\n  margin: 0;\n  /* 2 */\n  padding: 0;\n  /* 3 */\n}\n\n/*\nRemove the inheritance of text transform in Edge and Firefox.\n*/\nbutton,\nselect {\n  text-transform: none;\n}\n\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Remove default button styles.\n*/\nbutton,\ninput:where([type='button']),\ninput:where([type='submit']) {\n  -webkit-appearance: button;\n  /* 1 */\n  background-color: transparent;\n  /* 2 */\n  background-image: none;\n  /* 2 */\n}\n\n/*\nUse the modern Firefox focus style for all focusable elements.\n*/\n/*\nRemove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)\n*/\n/*\nAdd the correct vertical alignment in Chrome and Firefox.\n*/\n/*\nCorrect the cursor style of increment and decrement buttons in Safari.\n*/\n::-webkit-inner-spin-button,\n::-webkit-outer-spin-button {\n  height: auto;\n}\n\n/*\n1. Correct the odd appearance in Chrome and Safari.\n2. Correct the outline style in Safari.\n*/\n[type='search'] {\n  -webkit-appearance: textfield;\n  /* 1 */\n  outline-offset: -2px;\n  /* 2 */\n}\n\n/*\nRemove the inner padding in Chrome and Safari on macOS.\n*/\n::-webkit-search-decoration {\n  -webkit-appearance: none;\n}\n\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Change font properties to `inherit` in Safari.\n*/\n::-webkit-file-upload-button {\n  -webkit-appearance: button;\n  /* 1 */\n  font: inherit;\n  /* 2 */\n}\n\n/*\nAdd the correct display in Chrome and Safari.\n*/\n/*\nRemoves the default spacing and border for appropriate elements.\n*/\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\nhr,\np,\npre {\n  margin: 0;\n}\n\nfieldset {\n  margin: 0;\n  padding: 0;\n}\n\nol,\nul,\nmenu {\n  list-style: none;\n  margin: 0;\n  padding: 0;\n}\n\n/*\nReset default styling for dialogs.\n*/\ndialog {\n  padding: 0;\n}\n\n/*\nPrevent resizing textareas horizontally by default.\n*/\ntextarea {\n  resize: vertical;\n}\n\n/*\n1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)\n2. Set the default placeholder color to the user's configured gray 400 color.\n*/\ninput::-moz-placeholder,\ntextarea::-moz-placeholder {\n  opacity: 1;\n  /* 1 */\n  color: #9ca3af;\n  /* 2 */\n}\n\ninput::placeholder,\ntextarea::placeholder {\n  opacity: 1;\n  /* 1 */\n  color: #9ca3af;\n  /* 2 */\n}\n\n/*\nSet the default cursor for buttons.\n*/\nbutton,\n[role=\"button\"] {\n  cursor: pointer;\n}\n\n/*\nMake sure disabled buttons don't get the pointer cursor.\n*/\n/*\n1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)\n2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)\n   This can trigger a poorly considered lint error in some tools but is included by design.\n*/\nimg,\niframe,\nobject {\n  display: block;\n  /* 1 */\n  vertical-align: middle;\n  /* 2 */\n}\n\n/*\nConstrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)\n*/\nimg {\n  max-width: 100%;\n  height: auto;\n}\n\n/* Make elements with the HTML hidden attribute stay hidden by default */\n[hidden] {\n  display: none;\n}\n\n:root {\n  --inner-gutter: 8px;\n}\n\n@media (min-width: 750px) {\n  :root {\n    --inner-gutter: 12px;\n  }\n}\n\n@media (min-width: 900px) {\n  :root {\n    --inner-gutter: 16px;\n  }\n}\n\n@media (min-width: 1024px) {\n  :root {\n    --inner-gutter: 16px;\n  }\n}\n\n@media (min-width: 1280px) {\n  :root {\n    --inner-gutter: 16px;\n  }\n}\n\n@media (min-width: 2200px) {\n  :root {\n    --inner-gutter: 16px;\n  }\n}\n\n:root {}\n\n@media (min-width: 900px) {\n  :root {}\n}\n\n:root {\n  --sans: Inter, Helvetica, Arial, sans-serif;\n  --f-ui-01-fontFamily: var(--sans);\n  --f-ui-01-fontWeight: 800;\n  --f-ui-01-fontSize: 18px;\n  --f-ui-01-lineHeight: 110%;\n  --f-ui-01-letterSpacing: -0.01em;\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@media (min-width: 750px) {\n  :root {}\n}\n\n@media (min-width: 900px) {\n  :root {}\n}\n\n@media (min-width: 1024px) {\n  :root {}\n}\n\n.f-ui-01 b,\n.f-ui-01 strong {\n  font-weight: var(--f-ui-01---bold-weight, bold);\n}\n\n:root {\n  --grey-300: #e6e6e6;\n  --green-200: #d3ffdc;\n  --yellow-200: #ffffcb;\n  --red-200: #ffe0e1;\n}\n\n@media (min-width: 750px) {\n  .md\\:grid-line-x>*::before {\n    content: attr(👻);\n    inset-inline-start: 0;\n    inset-inline-end: 0;\n    top: 0;\n    bottom: calc(var(--inner-gutter) / -2);\n    border-top: 0 solid transparent;\n    border-bottom: 0 solid transparent;\n  }\n\n  .md\\:grid-line-xfull>*::before {\n    content: attr(👻);\n    inset-inline-start: calc(var(--inner-gutter) / -2);\n    inset-inline-end: calc(var(--inner-gutter) / -2);\n    top: 0;\n    bottom: calc(var(--inner-gutter) / -2);\n    border-top: 0 solid transparent;\n    border-bottom: 0 solid transparent;\n  }\n\n  .md\\:grid-line-x-0>*::before {\n    content: none;\n  }\n\n  .md\\:grid-line-y>*::after {\n    content: attr(👻);\n    inset-inline-start: 0;\n    inset-inline-end: calc(var(--inner-gutter) / -2);\n    top: 0;\n    bottom: 0;\n    border-inline-start: 0 solid transparent;\n    border-inline-end: 0 solid transparent;\n  }\n\n  .md\\:grid-line-yfull>*::after {\n    content: attr(👻);\n    inset-inline-start: 0;\n    inset-inline-end: calc(var(--inner-gutter) / -2);\n    top: calc(var(--inner-gutter) / -1);\n    bottom: 0;\n    border-inline-start: 0 solid transparent;\n    border-inline-end: 0 solid transparent;\n  }\n\n  .md\\:grid-line-y-0>*::after {\n    content: none;\n  }\n}\n\n@media (min-width: 900px) {\n  .lg\\:grid-line-x>*::before {\n    content: attr(👻);\n    inset-inline-start: 0;\n    inset-inline-end: 0;\n    top: 0;\n    bottom: calc(var(--inner-gutter) / -2);\n    border-top: 0 solid transparent;\n    border-bottom: 0 solid transparent;\n  }\n\n  .lg\\:grid-line-xfull>*::before {\n    content: attr(👻);\n    inset-inline-start: calc(var(--inner-gutter) / -2);\n    inset-inline-end: calc(var(--inner-gutter) / -2);\n    top: 0;\n    bottom: calc(var(--inner-gutter) / -2);\n    border-top: 0 solid transparent;\n    border-bottom: 0 solid transparent;\n  }\n\n  .lg\\:grid-line-x-0>*::before {\n    content: none;\n  }\n\n  .lg\\:grid-line-y>*::after {\n    content: attr(👻);\n    inset-inline-start: 0;\n    inset-inline-end: calc(var(--inner-gutter) / -2);\n    top: 0;\n    bottom: 0;\n    border-inline-start: 0 solid transparent;\n    border-inline-end: 0 solid transparent;\n  }\n\n  .lg\\:grid-line-yfull>*::after {\n    content: attr(👻);\n    inset-inline-start: 0;\n    inset-inline-end: calc(var(--inner-gutter) / -2);\n    top: calc(var(--inner-gutter) / -1);\n    bottom: 0;\n    border-inline-start: 0 solid transparent;\n    border-inline-end: 0 solid transparent;\n  }\n\n  .lg\\:grid-line-y-0>*::after {\n    content: none;\n  }\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/** region TRANSITIONS */\n/** endregion */\n/* region FOCUS */\n/* endregion */\n/* region BG */\n/* endregion */\n/*region shadow*/\n/*endregion*/\n.flex {\n  display: flex;\n}\n\n.w-full {\n  width: 100%;\n}\n\n.flex-row {\n  flex-direction: row;\n}\n\n.items-center {\n  align-items: center;\n}\n\n.justify-between {\n  justify-content: space-between;\n}\n\n.gap-x-12 {\n  -moz-column-gap: 0.75rem;\n  column-gap: 0.75rem;\n}\n\n.space-y-12> :not([hidden])~ :not([hidden]) {\n  --tw-space-y-reverse: 0;\n  margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));\n  margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));\n}\n\n.rounded-lg {\n  border-radius: 16px;\n}\n\n.bg-dark {\n  background-color: var(--grey-300);\n}\n\n.bg-error {\n  background-color: var(--red-200);\n}\n\n.bg-success {\n  background-color: var(--green-200);\n}\n\n.bg-warning {\n  background-color: var(--yellow-200);\n}\n\n.p-16 {\n  padding: 1rem;\n}\n\n.p-20 {\n  padding: 1.25rem;\n}\n\n.px-12 {\n  padding-left: 0.75rem;\n  padding-right: 0.75rem;\n}\n\n.px-20 {\n  padding-left: 1.25rem;\n  padding-right: 1.25rem;\n}\n\n.py-12 {\n  padding-top: 0.75rem;\n  padding-bottom: 0.75rem;\n}\n\n.py-20 {\n  padding-top: 1.25rem;\n  padding-bottom: 1.25rem;\n}\n\n.py-8 {\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n}\n\n.pr-12 {\n  padding-right: 0.75rem;\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  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n[class*=underline-] {\n  text-decoration-line: underline;\n}\n\n.after\\:rounded-lg::after {\n  border-radius: 16px;\n}\n\n.after\\:border-softest::after {\n  border-color: rgba(0, 0, 0, .05);\n}";
-
-const alertStyles = cva(['w-full bg-dark'], {
-    variants: {
-        intent: {
-            default: '',
-            warning: 'bg-warning',
-            error: 'bg-error',
-            success: 'bg-success'
-        },
-        brd: {
-            rounded: 'rounded-lg border-inside after:border-softest after:rounded-lg',
-            normal: ''
-        },
-        direction: {
-            vertical: 'space-y-12',
-            horizontal: 'flex flex-row items-center justify-between gap-x-12'
-        },
-        withBtn: {
-            false: '',
-            true: ''
-        }
-    },
-    compoundVariants: [
-        {
-            direction: 'horizontal',
-            withBtn: true,
-            class: 'px-20 pr-12 py-12'
-        },
-        {
-            direction: 'horizontal',
-            withBtn: false,
-            class: 'p-20'
-        },
-        {
-            direction: 'vertical',
-            withBtn: true,
-            class: 'p-16'
-        },
-        {
-            direction: 'vertical',
-            withBtn: false,
-            class: 'px-12 py-20'
-        }
-    ],
-    defaultVariants: {
-        intent: 'default',
-        brd: 'rounded',
-        direction: 'horizontal'
-    }
-});
-const EdsAlert = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.message = undefined;
-        this.pressableLabel = undefined;
-        this.pressableUrl = undefined;
-        this.direction = 'horizontal';
-        this.intent = 'default';
-        this.brd = 'rounded';
-        this.withBtn = false;
-    }
-    componentWillLoad() {
-        this.withBtn = Boolean(this.pressableLabel);
-    }
-    componentDidLoad() {
-        var _a;
-        // Query for the 'eds-link' element inside the shadow root.
-        const lnk = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('eds-link');
-        if (lnk) {
-            this.emitContext(lnk);
-        }
-    }
-    emitContext(linkElement) {
-        const event = new CustomEvent('parentContext', {
-            detail: {
-                componentName: this.el.tagName.toLowerCase(),
-                identifier: null
-            }
-        });
-        linkElement.dispatchEvent(event);
-    }
-    render() {
-        return (h("div", { key: '02e7ec45a64008c3a5e8ea99cade7da6b076259f', class: alertStyles({
-                intent: this.intent,
-                brd: this.brd,
-                direction: this.direction,
-                withBtn: this.withBtn
-            }), role: "alert" }, h("p", { key: 'ba99f147a48ed7cc19ccc18b309e1a11ca053a09', class: "f-ui-01 py-8", innerHTML: this.message }), this.withBtn &&
-            (this.pressableUrl ? (h("eds-link", { class: "eds-alert-link", label: this.pressableLabel, url: this.pressableUrl, intent: "secondary", external: true })) : null)));
-    }
-    get el() { return getElement(this); }
-};
-EdsAlert.style = edsAlertCss;
-
-export { EdsAlert as eds_alert };

package/dist/components/eds-avatar.entry.js

@@ -1,76 +0,0 @@
-import { r as registerInstance, h } from './index-9d277061.js';
-import { g as gradientBGColorVariants } from './color-47266964.js';
-import './index-144c9ae8.js';
-
-const edsAvatarCss = "html,\nbody {\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\nbody {\n    margin: 0; /* 1 */\n    line-height: inherit; /* 2 */\n}\n\n::before,\n::after {\n  box-sizing: border-box; /* 1 */\n  border-width: 0; /* 2 */\n  border-style: solid; /* 2 */\n  border-color: currentColor; /* 2 */\n}\n::before,\n::after {\n  --tw-content: '';\n}\n\nabbr:where([title]) {\n    -webkit-text-decoration: underline dotted;\n            text-decoration: underline dotted;\n  }\n\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.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: 2px solid rgba(0, 0, 0, .1);\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.border-inside-inverse {\n    &::after {\n        border: 2px solid rgba(255, 255, 255, 0.3);\n    }\n\n    &::after {\n        content: '';\n    }\n}\n\n.aspect-1x1 {\n    aspect-ratio: 1/1;\n}\n\n.flex {\n    display: flex;\n}\n\n.inline-flex {\n    display: inline-flex;\n}\n\n.items-center {\n    align-items: center;\n}\n\n.justify-center {\n    justify-content: center;\n}\n\n.overflow-hidden {\n    overflow: hidden;\n}\n\n.px-4 {\n    padding-left: 0.25rem;\n    padding-right: 0.25rem;\n}\n\n.rounded-pill {\n    border-radius: 100px;\n}\n\n.rounded-sm {\n    border-radius: 8px;\n}\n\n.rounded-xs {\n    border-radius: 4px;\n}\n\n.rounded-full {\n    border-radius: 9999px;\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-stronger {\n    background-color: var(--grey-900);\n}\n\n.bg-strongest {\n    background-color: var(--black);\n}\n\n.text-accent {\n    color: var(--green-500);\n}\n\n.text-default {\n    color: var(--black);\n}\n\n.\\!no-underline {\n    text-decoration-line: none !important;\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.w-32 {\n    width: 2rem;\n}\n\n.w-44 {\n    width: 2.75rem;\n}\n\n.w-\\[54px\\] {\n    width: 54px;\n}";
-
-const EdsAvatar = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.firstName = 'User';
-        this.lastName = 'Avatar';
-        this.picture = undefined;
-        this.initials = undefined;
-        this.color = undefined;
-    }
-    /**
-     * Flag to render the avatar with rounded (pill) shape if `true`.
-     */
-    //@Prop() rounded: boolean = false;
-    /**
-     * Determines if the initials should use a stronger (larger) font style.
-     */
-    //@Prop() initialsStrong: boolean = false;
-    /**
-     * Computed initials based on the provided `initials` prop or derived from `firstName` and `lastName`.
-     * @returns {string | undefined} Initials for display in the avatar.
-     */
-    get computedInitials() {
-        if (this.initials) {
-            return (this.initials.match(/.{1,3}/g) || [])[0] || '';
-        }
-        else if (this.firstName && this.lastName) {
-            return `${this.firstName.charAt(0)}${this.lastName.charAt(0)}`.toUpperCase();
-        }
-        return undefined;
-    }
-    /**
-     * Computes the CSS classes for the avatar container based on provided props like `rounded`, `color`, and `picture`.
-     * @returns {string} List of CSS classes to apply to the avatar container.
-     */
-    get containerClasses() {
-        return [
-            'border-inside',
-            'aspect-1x1',
-            'flex',
-            'items-center',
-            'justify-center',
-            'overflow-hidden',
-            this.picture ? '' : 'px-4',
-            'w-[54px] rounded-sm',
-            //this.rounded ? 'rounded-full border-inside-pill w-32' : 'w-[54px] rounded-sm',
-            this.color ? 'border-inside-inverse' : '',
-            this.color === 'grey'
-                ? 'bg-dark'
-                : this.color && !this.picture
-                    ? gradientBGColorVariants({
-                        color: this.color,
-                        direction: 'top',
-                        pseudo: false
-                    })
-                    : !this.picture
-                        ? 'bg-strongest text-accent'
-                        : ''
-        ].join(' ');
-    }
-    /**
-     * Renders the avatar component. Displays either an image using `eds-img` or initials depending on whether `picture` or `computedInitials` is set.
-     * @returns {JSX.Element} The rendered avatar component.
-     */
-    render() {
-        return (h("div", { key: '3ce8be58a8705b99904720b0e8bb878d36072d5e', class: this.containerClasses }, this.picture ? (h("eds-img", { src: this.picture, width: 54, height: 54, sizes: "120px", alt: `${this.firstName} ${this.lastName}`, lazyload: true, withBg: true })) : (h("abbr", { title: this.computedInitials || `${this.firstName} ${this.lastName}`, class: "!no-underline f-ui-01" }, this.computedInitials))));
-    }
-};
-EdsAvatar.style = edsAvatarCss;
-
-export { EdsAvatar as eds_avatar };

package/dist/components/eds-block-break.entry.js

@@ -1,16 +0,0 @@
-import { r as registerInstance, h } from './index-9d277061.js';
-
-const edsBlockBreakCss = ".border-soft{border-color:rgba(0, 0, 0, .15)}.border-softer{border-color:rgba(0, 0, 0, .1)}.border-softest{border-color:rgba(0, 0, 0, .05)}.my-16{margin-top:1rem;margin-bottom:1rem}.my-20{margin-top:1.25rem;margin-bottom:1.25rem}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.w-full{width:100%}.border-t-2{border-top-width:2px}";
-
-const EdsBlockBreak = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.extraClass = '';
-    }
-    render() {
-        return h("hr", { key: '9807e47c4a3b1143b3228e1be49c4069c7bc2014', class: `border-softer my-20 inline-block w-full border-t-2 ${this.extraClass}` });
-    }
-};
-EdsBlockBreak.style = edsBlockBreakCss;
-
-export { EdsBlockBreak as eds_block_break };