@eui/eds 22.0.0-alpha.20 → 22.0.0-alpha.21

package/docs/json/documentation.json

@@ -19267,7 +19267,7 @@
             "assetsDirs": [],
             "styleUrlsData": [
                 {
-                    "data": ".eds-avatar {\n    :host.eds-avatar-icon {\n        display: inline-flex;\n        color: var(--_color);\n\n        ::ng-deep .eds-icon-svg {\n            svg {\n                height: var(--_icon-size) !important;\n                width: var(--_icon-size) !important;\n                fill: var(--_color) !important;\n                color: var(--_color) !important;\n            }\n        }\n    }\n}\n",
+                    "data": ":host {\n    display: inline-flex;\n\n    // Icon sizing is driven by the parent eds-avatar via the inherited `--_icon-size`\n    // custom property (see eds-avatar.scss); eds-icon honors it over its own `size`\n    // attribute, so no ::ng-deep is needed to reach into the projected icon.\n}\n",
                     "styleUrl": "./eds-avatar-icon.scss"
                 }
             ],
@@ -19900,7 +19900,7 @@
             "assetsDirs": [],
             "styleUrlsData": [
                 {
-                    "data": "@use '../base' as base;\n\n:host {\n    // Common defaults\n    --_eds-badge-padding: 0 var(--eds-sp-3xs);\n    --_eds-badge-border-radius: var(--eds-br-full);\n    --_eds-badge-border-width: var(--eds-bw-xs);\n    --_eds-badge-font: var(--eds-f-microcopy-xs);\n    --_eds-badge-height: calc(var(--eds-sp-m) + var(--eds-sp-3xs));\n    --_eds-badge-min-width: calc(var(--eds-sp-m) + var(--eds-sp-3xs));\n    --_eds-badge-empty-size: var(--eds-sp-s);\n\n    // Default color (neutral)\n    --_eds-badge-surface: var(--eds-c-surface-neutral);\n    --_eds-badge-on-surface: var(--eds-c-on-surface-neutral);\n    --_eds-badge-border-color: var(--eds-c-border-neutral-subtle);\n\n    display: inline-flex;\n    border: var(--_eds-badge-border-width) solid var(--_eds-badge-border-color);\n    border-radius: var(--_eds-badge-border-radius);\n    background-color: var(--_eds-badge-surface);\n\n    // a projected eds-icon follows the badge foreground (on-surface) color\n    --_eds-icon-on-surface: var(--_eds-badge-on-surface);\n\n    .eds-badge__wrapper {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        color: var(--_eds-badge-on-surface);\n        height: var(--_eds-badge-height);\n        min-width: var(--_eds-badge-min-width);\n        padding: var(--_eds-badge-padding);\n        font: var(--_eds-badge-font);\n        @include base.eds-ellipsis();\n    }\n}\n\n// COLOR — filled (default) surface / foreground / border\n:host([color=\"primary\"]) {\n    --_eds-badge-surface: var(--eds-c-surface-primary);\n    --_eds-badge-on-surface: var(--eds-c-on-surface-primary);\n    --_eds-badge-border-color: var(--eds-c-border-primary-subtle);\n}\n:host([color=\"neutral\"]) {\n    --_eds-badge-surface: var(--eds-c-surface-neutral);\n    --_eds-badge-on-surface: var(--eds-c-on-surface-neutral);\n    --_eds-badge-border-color: var(--eds-c-border-neutral-subtle);\n}\n:host([color=\"success\"]) {\n    --_eds-badge-surface: var(--eds-c-surface-success);\n    --_eds-badge-on-surface: var(--eds-c-on-surface-success);\n    --_eds-badge-border-color: var(--eds-c-border-success-subtle);\n}\n:host([color=\"info\"]) {\n    --_eds-badge-surface: var(--eds-c-surface-info);\n    --_eds-badge-on-surface: var(--eds-c-on-surface-info);\n    --_eds-badge-border-color: var(--eds-c-border-info-subtle);\n}\n:host([color=\"warning\"]) {\n    --_eds-badge-surface: var(--eds-c-surface-warning);\n    --_eds-badge-on-surface: var(--eds-c-on-surface-warning);\n    --_eds-badge-border-color: var(--eds-c-border-warning-subtle);\n}\n:host([color=\"critical\"]) {\n    --_eds-badge-surface: var(--eds-c-surface-critical);\n    --_eds-badge-on-surface: var(--eds-c-on-surface-critical);\n    --_eds-badge-border-color: var(--eds-c-border-critical-subtle);\n}\n\n// VARIANT — outline: transparent surface, subtler foreground, stronger border\n:host([variant=\"outline\"]) {\n    --_eds-badge-surface: transparent;\n}\n:host([variant=\"outline\"][color=\"primary\"]) {\n    --_eds-badge-on-surface: var(--eds-c-on-surface-primary-subtler);\n    --_eds-badge-border-color: var(--eds-c-border-primary);\n}\n:host([variant=\"outline\"][color=\"neutral\"]) {\n    --_eds-badge-on-surface: var(--eds-c-on-surface-neutral-subtler);\n    --_eds-badge-border-color: var(--eds-c-border-neutral);\n}\n:host([variant=\"outline\"][color=\"success\"]) {\n    --_eds-badge-on-surface: var(--eds-c-on-surface-success-subtler);\n    --_eds-badge-border-color: var(--eds-c-border-success);\n}\n:host([variant=\"outline\"][color=\"info\"]) {\n    --_eds-badge-on-surface: var(--eds-c-on-surface-info-subtler);\n    --_eds-badge-border-color: var(--eds-c-border-info);\n}\n:host([variant=\"outline\"][color=\"warning\"]) {\n    --_eds-badge-on-surface: var(--eds-c-on-surface-warning-subtler);\n    --_eds-badge-border-color: var(--eds-c-border-warning);\n}\n:host([variant=\"outline\"][color=\"critical\"]) {\n    --_eds-badge-on-surface: var(--eds-c-on-surface-critical-subtler);\n    --_eds-badge-border-color: var(--eds-c-border-critical);\n}\n\n// SIZE\n:host([size=\"s\"]) {\n    --_eds-badge-height: var(--eds-sp-m);\n    --_eds-badge-min-width: var(--eds-sp-m);\n    --_eds-badge-font: var(--eds-f-microcopy-2xs);\n}\n\n// EMPTY — dot badge, no content in wrapper\n:host([empty]) {\n    width: var(--_eds-badge-empty-size);\n    height: var(--_eds-badge-empty-size);\n}\n\n// ICON-ONLY — circular indicator holding a single small icon, no wrapper padding\n:host([icon-only]) {\n    .eds-badge__wrapper {\n        padding: 0;\n        width: var(--_eds-badge-height);\n        min-width: var(--_eds-badge-height);\n    }\n}\n\n// CONTEXTUAL POSITIONING — badge projected inside icon / icon-button / avatar\n// ---------------------------------------------------------------------------\n// The badge is content-projected into another component's host, so it must react\n// to that ancestor via :host-context() (the ancestor lives in a different\n// encapsulation scope; a plain descendant selector would not match).\n\n// icon > badge\n:host-context(.eds-icon) {\n    position: absolute;\n    left: 60%;\n    top: -20%;\n}\n\n:host([empty]):host-context(.eds-icon) {\n    left: 60%;\n    top: -10%;\n}\n\n:host([size=\"xs\"][empty]):host-context(.eds-icon) {\n    left: 70%;\n    top: -10%;\n}\n\n// icon-button (per size) > icon > badge\n:host-context(.eds-icon-button[size=\"2xs\"]) {\n    left: 50%;\n    top: -30%;\n}\n\n:host-context(.eds-icon-button[size=\"xs\"]) {\n    left: 50%;\n    top: -40%;\n}\n\n:host-context(.eds-icon-button[size=\"s\"]) {\n    left: 50%;\n    top: -50%;\n}\n\n:host-context(.eds-icon-button[size=\"m\"]) {\n    left: 50%;\n    top: -40%;\n}\n\n:host-context(.eds-icon-button[size=\"l\"]) {\n    left: 50%;\n    top: -25%;\n}\n\n// avatar > badge\n:host-context(.eds-avatar) {\n    border: var(--eds-bw-s) solid var(--eds-c-border-inverted);\n}\n",
+                    "data": "@use '../base' as base;\n\n:host {\n    // Common defaults\n    --_eds-badge-padding: 0 var(--eds-sp-3xs);\n    --_eds-badge-border-radius: var(--eds-br-full);\n    --_eds-badge-border-width: var(--eds-bw-xs);\n    --_eds-badge-font: var(--eds-f-microcopy-xs);\n    --_eds-badge-height: calc(var(--eds-sp-m) + var(--eds-sp-3xs));\n    --_eds-badge-min-width: calc(var(--eds-sp-m) + var(--eds-sp-3xs));\n    --_eds-badge-empty-size: var(--eds-sp-s);\n\n    // Default color (neutral)\n    --_eds-badge-surface: var(--eds-c-surface-neutral);\n    --_eds-badge-on-surface: var(--eds-c-on-surface-neutral);\n    --_eds-badge-border-color: var(--eds-c-border-neutral-subtle);\n\n    display: inline-flex;\n    border: var(--_eds-badge-border-width) solid var(--_eds-badge-border-color);\n    border-radius: var(--_eds-badge-border-radius);\n    background-color: var(--_eds-badge-surface);\n\n    // a projected eds-icon follows the badge foreground (on-surface) color\n    --_eds-icon-on-surface: var(--_eds-badge-on-surface);\n\n    // Reset the icon-size channel so a value inherited from a composing ancestor\n    // (e.g. eds-avatar sets `--_icon-size` for its own slot) does NOT leak into the\n    // badge's projected icon; the icon falls back to its own `size` attribute.\n    --_icon-size: initial;\n\n    .eds-badge__wrapper {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        color: var(--_eds-badge-on-surface);\n        height: var(--_eds-badge-height);\n        min-width: var(--_eds-badge-min-width);\n        padding: var(--_eds-badge-padding);\n        font: var(--_eds-badge-font);\n        @include base.eds-ellipsis();\n    }\n}\n\n// COLOR — filled (default) surface / foreground / border\n:host([color=\"primary\"]) {\n    --_eds-badge-surface: var(--eds-c-surface-primary);\n    --_eds-badge-on-surface: var(--eds-c-on-surface-primary);\n    --_eds-badge-border-color: var(--eds-c-border-primary-subtle);\n}\n:host([color=\"neutral\"]) {\n    --_eds-badge-surface: var(--eds-c-surface-neutral);\n    --_eds-badge-on-surface: var(--eds-c-on-surface-neutral);\n    --_eds-badge-border-color: var(--eds-c-border-neutral-subtle);\n}\n:host([color=\"success\"]) {\n    --_eds-badge-surface: var(--eds-c-surface-success);\n    --_eds-badge-on-surface: var(--eds-c-on-surface-success);\n    --_eds-badge-border-color: var(--eds-c-border-success-subtle);\n}\n:host([color=\"info\"]) {\n    --_eds-badge-surface: var(--eds-c-surface-info);\n    --_eds-badge-on-surface: var(--eds-c-on-surface-info);\n    --_eds-badge-border-color: var(--eds-c-border-info-subtle);\n}\n:host([color=\"warning\"]) {\n    --_eds-badge-surface: var(--eds-c-surface-warning);\n    --_eds-badge-on-surface: var(--eds-c-on-surface-warning);\n    --_eds-badge-border-color: var(--eds-c-border-warning-subtle);\n}\n:host([color=\"critical\"]) {\n    --_eds-badge-surface: var(--eds-c-surface-critical);\n    --_eds-badge-on-surface: var(--eds-c-on-surface-critical);\n    --_eds-badge-border-color: var(--eds-c-border-critical-subtle);\n}\n\n// VARIANT — outline: transparent surface, subtler foreground, stronger border\n:host([variant=\"outline\"]) {\n    --_eds-badge-surface: var(--eui-c-surface-container);\n}\n:host([variant=\"outline\"][color=\"primary\"]) {\n    --_eds-badge-on-surface: var(--eds-c-on-surface-primary-subtler);\n    --_eds-badge-border-color: var(--eds-c-border-primary);\n}\n:host([variant=\"outline\"][color=\"neutral\"]) {\n    --_eds-badge-on-surface: var(--eds-c-on-surface-neutral-subtler);\n    --_eds-badge-border-color: var(--eds-c-border-neutral);\n}\n:host([variant=\"outline\"][color=\"success\"]) {\n    --_eds-badge-on-surface: var(--eds-c-on-surface-success-subtler);\n    --_eds-badge-border-color: var(--eds-c-border-success);\n}\n:host([variant=\"outline\"][color=\"info\"]) {\n    --_eds-badge-on-surface: var(--eds-c-on-surface-info-subtler);\n    --_eds-badge-border-color: var(--eds-c-border-info);\n}\n:host([variant=\"outline\"][color=\"warning\"]) {\n    --_eds-badge-on-surface: var(--eds-c-on-surface-warning-subtler);\n    --_eds-badge-border-color: var(--eds-c-border-warning);\n}\n:host([variant=\"outline\"][color=\"critical\"]) {\n    --_eds-badge-on-surface: var(--eds-c-on-surface-critical-subtler);\n    --_eds-badge-border-color: var(--eds-c-border-critical);\n}\n\n// SIZE\n:host([size=\"s\"]) {\n    --_eds-badge-height: var(--eds-sp-m);\n    --_eds-badge-min-width: var(--eds-sp-m);\n    --_eds-badge-font: var(--eds-f-microcopy-2xs);\n}\n\n// EMPTY — dot badge, no content in wrapper\n:host([empty]) {\n    width: var(--_eds-badge-empty-size);\n    height: var(--_eds-badge-empty-size);\n}\n\n// ICON-ONLY — circular indicator holding a single small icon, no wrapper padding\n:host([icon-only]) {\n    .eds-badge__wrapper {\n        padding: 0;\n        width: var(--_eds-badge-height);\n        min-width: var(--_eds-badge-height);\n    }\n}\n\n// CONTEXTUAL POSITIONING — badge projected inside icon / icon-button / avatar\n// ---------------------------------------------------------------------------\n// The badge is content-projected into another component's host, so it must react\n// to that ancestor via :host-context() (the ancestor lives in a different\n// encapsulation scope; a plain descendant selector would not match).\n\n// icon > badge\n:host-context(.eds-icon) {\n    position: absolute;\n    left: 60%;\n    top: -20%;\n}\n\n:host([empty]):host-context(.eds-icon) {\n    left: 60%;\n    top: -10%;\n}\n\n:host([size=\"xs\"][empty]):host-context(.eds-icon) {\n    left: 70%;\n    top: -10%;\n}\n\n// icon-button (per size) > icon > badge\n:host-context(.eds-icon-button[size=\"2xs\"]) {\n    left: 50%;\n    top: -30%;\n}\n\n:host-context(.eds-icon-button[size=\"xs\"]) {\n    left: 50%;\n    top: -40%;\n}\n\n:host-context(.eds-icon-button[size=\"s\"]) {\n    left: 50%;\n    top: -50%;\n}\n\n:host-context(.eds-icon-button[size=\"m\"]) {\n    left: 50%;\n    top: -40%;\n}\n\n:host-context(.eds-icon-button[size=\"l\"]) {\n    left: 50%;\n    top: -25%;\n}\n\n// avatar > badge\n:host-context(.eds-avatar) {\n    border: var(--eds-bw-s) solid var(--eds-c-border-inverted);\n}\n",
                     "styleUrl": "./eds-badge.scss"
                 }
             ],
@@ -40991,7 +40991,7 @@
             "assetsDirs": [],
             "styleUrlsData": [
                 {
-                    "data": "@use '../base' as base;\n\n:host {\n    --_eds-icon-size: var(--_icon-size, var(--eds-is-m)); // inherited from parent\n    // --_eds-icon-on-surface lets a parent (e.g. eds-badge) override the icon color;\n    // when unset, each color variant supplies its own token below.\n    --_eds-icon-color: var(--_eds-icon-on-surface, var(--_on-surface, var(--eds-c-foreground))); // inherited from parent\n\n    display: inline-flex;\n    position: relative;\n\n    .eds-icon-svg {\n        height: var(--_eds-icon-size);\n        width: var(--_eds-icon-size);\n        fill: var(--_eds-icon-color);\n        color: var(--_eds-icon-color);\n    }\n\n    // Multi-color sprites (flags) — disable fill inheritance so path fill attributes render\n    .eds-icon-svg.eds-icon-set-flags-1x1,\n    .eds-icon-svg.eds-icon-set-flags-4x3 {\n        fill: none;\n    }\n}\n\n// SIZE VARIANTS\n// -------------\n\n:host([size=\"2xs\"]) { --_eds-icon-size: var(--eds-is-2xs); }\n:host([size=\"xs\"])  { --_eds-icon-size: var(--eds-is-xs); }\n:host([size=\"s\"])   { --_eds-icon-size: var(--eds-is-s); }\n:host([size=\"m\"])   { --_eds-icon-size: var(--eds-is-m); }\n:host([size=\"l\"])   { --_eds-icon-size: var(--eds-is-l); }\n:host([size=\"xl\"])  { --_eds-icon-size: var(--eds-is-xl); }\n:host([size=\"2xl\"]) { --_eds-icon-size: var(--eds-is-2xl); }\n:host([size=\"3xl\"]) { --_eds-icon-size: var(--eds-is-3xl); }\n:host([size=\"4xl\"]) { --_eds-icon-size: var(--eds-is-4xl); }\n\n// COLOR VARIANTS\n// --------------\n\n:host([color=\"neutral\"])         { --_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground)); }\n:host([color=\"neutral-subtle\"])  { --_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-subtle)); }\n:host([color=\"neutral-subtler\"]) { --_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-subtler)); }\n:host([color=\"primary\"])         { --_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-primary)); }\n:host([color=\"highlight\"])       { --_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-highlight)); }\n:host([color=\"info\"])            { --_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-info)); }\n:host([color=\"success\"])         { --_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-success)); }\n:host([color=\"warning\"])         { --_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-warning)); }\n:host([color=\"critical\"])        { --_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-critical)); }\n:host([color=\"brand\"])           { --_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-on-surface-brand)); }\n:host([color=\"disabled\"])        { --_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-disabled)); }\n\n// ROUNDED\n// -------\n\n:host([rounded]) {\n    border-radius: 50%;\n    overflow: hidden;\n\n    .eds-icon-svg {\n        border-radius: 50%;\n    }\n}\n\n// LOADING SPINNER — inherits icon size and color\n// ----------------------------------------------\n\n:host([loading]) {\n    .eds-icon-spinner {\n        display: inline-block;\n        width: var(--_eds-icon-size);\n        height: var(--_eds-icon-size);\n        border: 3px solid var(--eds-c-border-neutral-subtle);\n        border-top-color: var(--_eds-icon-color);\n        border-radius: 50%;\n        animation: eds-icon-spin 0.6s linear infinite;\n    }\n}\n\n@keyframes eds-icon-spin {\n    to {\n        transform: rotate(360deg);\n    }\n}\n",
+                    "data": "@use '../base' as base;\n\n:host {\n    --_eds-icon-size: var(--_icon-size, var(--eds-is-m)); // inherited from parent\n    // --_eds-icon-on-surface lets a parent (e.g. eds-badge) override the icon color;\n    // when unset, each color variant supplies its own token below.\n    --_eds-icon-color: var(--_eds-icon-on-surface, var(--_on-surface, var(--eds-c-foreground))); // inherited from parent\n\n    display: inline-flex;\n    position: relative;\n\n    .eds-icon-svg {\n        height: var(--_eds-icon-size);\n        width: var(--_eds-icon-size);\n        fill: var(--_eds-icon-color);\n        color: var(--_eds-icon-color);\n    }\n\n    // Multi-color sprites (flags) — disable fill inheritance so path fill attributes render\n    .eds-icon-svg.eds-icon-set-flags-1x1,\n    .eds-icon-svg.eds-icon-set-flags-4x3 {\n        fill: none;\n    }\n}\n\n// SIZE VARIANTS\n// -------------\n\n// An inherited `--_icon-size` (set by a composing parent such as eds-avatar) always\n// takes precedence; the icon's own `size` attribute is the fallback. This lets a\n// parent size a projected icon purely through custom-property inheritance — no\n// ::ng-deep required across the component boundary.\n:host([size=\"2xs\"]) { --_eds-icon-size: var(--_icon-size, var(--eds-is-2xs)); }\n:host([size=\"xs\"])  { --_eds-icon-size: var(--_icon-size, var(--eds-is-xs)); }\n:host([size=\"s\"])   { --_eds-icon-size: var(--_icon-size, var(--eds-is-s)); }\n:host([size=\"m\"])   { --_eds-icon-size: var(--_icon-size, var(--eds-is-m)); }\n:host([size=\"l\"])   { --_eds-icon-size: var(--_icon-size, var(--eds-is-l)); }\n:host([size=\"xl\"])  { --_eds-icon-size: var(--_icon-size, var(--eds-is-xl)); }\n:host([size=\"2xl\"]) { --_eds-icon-size: var(--_icon-size, var(--eds-is-2xl)); }\n:host([size=\"3xl\"]) { --_eds-icon-size: var(--_icon-size, var(--eds-is-3xl)); }\n:host([size=\"4xl\"]) { --_eds-icon-size: var(--_icon-size, var(--eds-is-4xl)); }\n\n// COLOR VARIANTS\n// --------------\n\n:host([color=\"neutral\"])         { --_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground)); }\n:host([color=\"neutral-subtle\"])  { --_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-subtle)); }\n:host([color=\"neutral-subtler\"]) { --_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-subtler)); }\n:host([color=\"primary\"])         { --_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-primary)); }\n:host([color=\"highlight\"])       { --_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-highlight)); }\n:host([color=\"info\"])            { --_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-info)); }\n:host([color=\"success\"])         { --_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-success)); }\n:host([color=\"warning\"])         { --_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-warning)); }\n:host([color=\"critical\"])        { --_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-critical)); }\n:host([color=\"brand\"])           { --_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-on-surface-brand)); }\n:host([color=\"disabled\"])        { --_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-disabled)); }\n\n// ROUNDED\n// -------\n\n:host([rounded]) {\n    border-radius: 50%;\n    overflow: hidden;\n\n    .eds-icon-svg {\n        border-radius: 50%;\n    }\n}\n\n// LOADING SPINNER — inherits icon size and color\n// ----------------------------------------------\n\n:host([loading]) {\n    .eds-icon-spinner {\n        display: inline-block;\n        width: var(--_eds-icon-size);\n        height: var(--_eds-icon-size);\n        border: 3px solid var(--eds-c-border-neutral-subtle);\n        border-top-color: var(--_eds-icon-color);\n        border-radius: 50%;\n        animation: eds-icon-spin 0.6s linear infinite;\n    }\n}\n\n@keyframes eds-icon-spin {\n    to {\n        transform: rotate(360deg);\n    }\n}\n",
                     "styleUrl": "./eds-icon.scss"
                 }
             ],

package/docs/llms.txt

@@ -1,6 +1,6 @@
 # eui documentation
 
-> Generated by compodoc 2.0.0 at 2026-09-24T09:52:55.688Z, llm-md export.
+> Generated by compodoc 2.0.0 at 2026-09-24T12:14:16.845Z, llm-md export.
 
 ## Components
 

package/docs/properties.html

@@ -128,7 +128,7 @@
     </ol>
     <ul class="properties-list">
         <li>
-            <b>Version</b> : 22.0.0-alpha.20</li>
+            <b>Version</b> : 22.0.0-alpha.21</li>
     </ul>
 
 

package/fesm2022/eui-eds-eds-avatar.mjs

@@ -24,13 +24,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImpor
 
 class EdsAvatarIcon {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsAvatarIcon, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.2", type: EdsAvatarIcon, isStandalone: true, selector: "eds-avatar-icon", host: { classAttribute: "eds-avatar-icon" }, ngImport: i0, template: '<ng-content/>', isInline: true, styles: [".eds-avatar :host.eds-avatar-icon{display:inline-flex;color:var(--_color)}.eds-avatar :host.eds-avatar-icon ::ng-deep .eds-icon-svg svg{height:var(--_icon-size)!important;width:var(--_icon-size)!important;fill:var(--_color)!important;color:var(--_color)!important}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.2", type: EdsAvatarIcon, isStandalone: true, selector: "eds-avatar-icon", host: { classAttribute: "eds-avatar-icon" }, ngImport: i0, template: '<ng-content/>', isInline: true, styles: [":host{display:inline-flex}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsAvatarIcon, decorators: [{
             type: Component,
             args: [{ selector: 'eds-avatar-icon', template: '<ng-content/>', host: {
                         class: 'eds-avatar-icon',
-                    }, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".eds-avatar :host.eds-avatar-icon{display:inline-flex;color:var(--_color)}.eds-avatar :host.eds-avatar-icon ::ng-deep .eds-icon-svg svg{height:var(--_icon-size)!important;width:var(--_icon-size)!important;fill:var(--_color)!important;color:var(--_color)!important}\n"] }]
+                    }, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:inline-flex}\n"] }]
         }] });
 
 class EdsAvatarImage {

package/fesm2022/eui-eds-eds-avatar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"eui-eds-eds-avatar.mjs","sources":["../../eds-avatar/eds-avatar-badge.ts","../../eds-avatar/eds-avatar-icon.ts","../../eds-avatar/eds-avatar-image.ts","../../eds-avatar/eds-avatar-image.html","../../eds-avatar/eds-avatar-content.ts","../../eds-avatar/eds-avatar-content.html","../../eds-avatar/eds-avatar-content-sublabel.ts","../../eds-avatar/eds-avatar-content-label.ts","../../eds-avatar/eds-avatar-list.ts","../../eds-avatar/eds-avatar-text.ts","../../eds-avatar/eds-avatar.ts","../../eds-avatar/eds-avatar.html","../../eds-avatar/index.ts","../../eds-avatar/eui-eds-eds-avatar.ts"],"sourcesContent":["import { booleanAttribute, ChangeDetectionStrategy, Component, input } from '@angular/core';\n\n@Component({\n    selector: 'eds-avatar-badge',\n    template: '<ng-content/>',\n    styleUrl: './eds-avatar-badge.scss',\n    host: {\n        class: 'eds-avatar-badge',\n        '[attr.position]': 'isPositionBottom() ? \"bottom\" : \"top\"',\n    },\n    changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class EdsAvatarBadge {\n    /**\n     * Whether the badge is positioned at the bottom of the avatar.\n     * @default false\n     */\n    isPositionBottom = input(false, { transform: booleanAttribute });\n}\n","import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n    selector: 'eds-avatar-icon',\n    template: '<ng-content/>',\n    styleUrl: './eds-avatar-icon.scss',\n    host: {\n        class: 'eds-avatar-icon',\n    },\n    changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class EdsAvatarIcon {}\n","import { ChangeDetectionStrategy, Component, input, computed } from '@angular/core';\nimport { EDS_ICON } from '@eui/eds/eds-icon';\n\n@Component({\n    selector: 'eds-avatar-image',\n    templateUrl: './eds-avatar-image.html',\n    styleUrl: './eds-avatar-image.scss',\n    imports: [\n        ...EDS_ICON,\n    ],\n    host: {\n        class: 'eds-avatar-image',\n        '[attr.default]': 'isDefault() || null',\n    },\n    changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class EdsAvatarImage {\n    /**\n     * URL of the image to be displayed in the avatar.\n     * If not provided, a default (user icon) is shown.\n     */\n    imageUrl = input<string>('');\n\n    /** Whether the default (no image URL) fallback is shown. */\n    protected isDefault = computed(() => !this.imageUrl());\n\n    /**\n     * The final image URL to be used in the template.\n     * This will be either the provided imageUrl or a default image URL.\n     */\n    public imageUrlGenerated = 'assets';\n}\n","@if (imageUrl()) {\n    <div class=\"eds-avatar-image-wrapper\">\n        <img [src]=\"imageUrl()\" alt=\"Avatar\"/>\n    </div>\n} @else {\n    <eds-icon icon=\"user:core\" color=\"neutral\"/>\n}\n","import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n    selector: 'eds-avatar-content',\n    templateUrl: './eds-avatar-content.html',\n    styleUrl: './eds-avatar-content.scss',\n    host: {\n        class: 'eds-avatar-content',\n    },\n    changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class EdsAvatarContent {\n}\n","<ng-content select=\"eds-avatar-content-label\"/>\n<ng-content select=\"eds-avatar-content-sublabel\"/>","import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n    selector: 'eds-avatar-content-sublabel',\n    template: '<ng-content />',\n    styleUrl: './eds-avatar-content-sublabel.scss',\n    host: {\n        class: 'eds-avatar-content-sublabel',\n    },\n    changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class EdsAvatarContentSublabel {\n}\n","import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n    selector: 'eds-avatar-content-label',\n    template: '<ng-content />',\n    styleUrl: './eds-avatar-content-label.scss',\n    host: {\n        class: 'eds-avatar-content-label',\n    },\n    changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class EdsAvatarContentLabel {\n}\n","import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n    selector: 'eds-avatar-list',\n    template: '<ng-content/>',\n    styleUrl: './eds-avatar-list.scss',\n    host: {\n        class: 'eds-avatar-list',\n    },\n    changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class EdsAvatarList {\n}\n","import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n    selector: 'eds-avatar-text',\n    template: '<ng-content/>',\n    styleUrl: './eds-avatar-text.scss',\n    host: {\n        class: 'eds-avatar-text',\n    },\n    changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class EdsAvatarText {\n}\n","import { Component, ChangeDetectionStrategy, input, contentChild, computed } from '@angular/core';\nimport { EdsAvatarImage } from './eds-avatar-image';\n\n/**\n * Local narrowed size union — the avatar's size contract.\n */\nexport type EdsAvatarSize = '2xs' | 'xs' | 's' | 'm' | 'l' | 'xl';\n\n@Component({\n    selector: 'div[edsAvatar], span[edsAvatar], eds-avatar',\n    templateUrl: './eds-avatar.html',\n    styleUrl: './eds-avatar.scss',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {\n        class: 'eds-avatar',\n        role: 'img',\n        '[attr.size]': 'size()',\n        '[attr.color]': 'color() || null',\n        '[attr.image]': 'hasImage() || null',\n        '[attr.data-e2e]': 'e2eAttr()',\n        '[attr.aria-label]': 'ariaLabel()',\n    },\n})\nexport class EdsAvatar {\n    /**\n     * Data attribute for E2E testing\n     * @default 'eds-avatar'\n     */\n    e2eAttr = input('eds-avatar');\n\n    /**\n     * Size of the avatar.\n     * @default 'm'\n     */\n    size = input<EdsAvatarSize>('m');\n\n    /**\n     * ARIA label for accessibility.\n     * Should describe the avatar's identity (e.g. user name, initials meaning).\n     * When null, no aria-label is rendered — ensure visible text or an explicit label is provided.\n     * @default null\n     */\n    ariaLabel = input<string | null>(null, { alias: 'aria-label' });\n\n    /**\n     * Extra color palette applied to the avatar surface (maps to an EDS color palette,\n     * e.g. `info`, `success`, `warning`, `critical`). Empty string uses the default neutral surface.\n     * @default ''\n     */\n    color = input<string>('');\n\n    /** Signal-based content query for avatar image sub-component. */\n    protected avatarImage = contentChild(EdsAvatarImage);\n\n    /** Whether an image sub-component is projected. */\n    protected hasImage = computed(() => !!this.avatarImage());\n}\n","<div class=\"eds-avatar-wrapper\">\n    <ng-content select=\"eds-avatar-icon\"/>\n    <ng-content select=\"eds-avatar-text\"/>\n    <ng-content select=\"eds-avatar-image\"/>\n    <ng-content select=\"eds-avatar-badge\"/>\n</div>\n\n<ng-content select=\"eds-avatar-content\"/>\n","import { EdsAvatarBadge } from './eds-avatar-badge';\nimport { EdsAvatarIcon } from './eds-avatar-icon';\nimport { EdsAvatarImage } from './eds-avatar-image';\nimport { EdsAvatarContent } from './eds-avatar-content';\nimport { EdsAvatarContentSublabel } from './eds-avatar-content-sublabel';\nimport { EdsAvatarContentLabel } from './eds-avatar-content-label';\nimport { EdsAvatarList } from './eds-avatar-list';\nimport { EdsAvatarText } from './eds-avatar-text';\nimport { EdsAvatar } from './eds-avatar';\n\nexport * from './eds-avatar';\nexport * from './eds-avatar-icon';\nexport * from './eds-avatar-text';\nexport * from './eds-avatar-image';\nexport * from './eds-avatar-badge';\nexport * from './eds-avatar-list';\nexport * from './eds-avatar-content';\nexport * from './eds-avatar-content-label';\nexport * from './eds-avatar-content-sublabel';\n\nexport const EDS_AVATAR = [\n        EdsAvatar,\n        EdsAvatarIcon,\n        EdsAvatarText,\n        EdsAvatarImage,\n        EdsAvatarBadge,\n        EdsAvatarList,\n        EdsAvatarContent,\n        EdsAvatarContentLabel,\n        EdsAvatarContentSublabel,\n] as const;","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"eui-eds-eds-avatar.mjs","sources":["../../eds-avatar/eds-avatar-badge.ts","../../eds-avatar/eds-avatar-icon.ts","../../eds-avatar/eds-avatar-image.ts","../../eds-avatar/eds-avatar-image.html","../../eds-avatar/eds-avatar-content.ts","../../eds-avatar/eds-avatar-content.html","../../eds-avatar/eds-avatar-content-sublabel.ts","../../eds-avatar/eds-avatar-content-label.ts","../../eds-avatar/eds-avatar-list.ts","../../eds-avatar/eds-avatar-text.ts","../../eds-avatar/eds-avatar.ts","../../eds-avatar/eds-avatar.html","../../eds-avatar/index.ts","../../eds-avatar/eui-eds-eds-avatar.ts"],"sourcesContent":["import { booleanAttribute, ChangeDetectionStrategy, Component, input } from '@angular/core';\n\n@Component({\n    selector: 'eds-avatar-badge',\n    template: '<ng-content/>',\n    styleUrl: './eds-avatar-badge.scss',\n    host: {\n        class: 'eds-avatar-badge',\n        '[attr.position]': 'isPositionBottom() ? \"bottom\" : \"top\"',\n    },\n    changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class EdsAvatarBadge {\n    /**\n     * Whether the badge is positioned at the bottom of the avatar.\n     * @default false\n     */\n    isPositionBottom = input(false, { transform: booleanAttribute });\n}\n","import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n    selector: 'eds-avatar-icon',\n    template: '<ng-content/>',\n    styleUrl: './eds-avatar-icon.scss',\n    host: {\n        class: 'eds-avatar-icon',\n    },\n    changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class EdsAvatarIcon {}\n","import { ChangeDetectionStrategy, Component, input, computed } from '@angular/core';\nimport { EDS_ICON } from '@eui/eds/eds-icon';\n\n@Component({\n    selector: 'eds-avatar-image',\n    templateUrl: './eds-avatar-image.html',\n    styleUrl: './eds-avatar-image.scss',\n    imports: [\n        ...EDS_ICON,\n    ],\n    host: {\n        class: 'eds-avatar-image',\n        '[attr.default]': 'isDefault() || null',\n    },\n    changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class EdsAvatarImage {\n    /**\n     * URL of the image to be displayed in the avatar.\n     * If not provided, a default (user icon) is shown.\n     */\n    imageUrl = input<string>('');\n\n    /** Whether the default (no image URL) fallback is shown. */\n    protected isDefault = computed(() => !this.imageUrl());\n\n    /**\n     * The final image URL to be used in the template.\n     * This will be either the provided imageUrl or a default image URL.\n     */\n    public imageUrlGenerated = 'assets';\n}\n","@if (imageUrl()) {\n    <div class=\"eds-avatar-image-wrapper\">\n        <img [src]=\"imageUrl()\" alt=\"Avatar\"/>\n    </div>\n} @else {\n    <eds-icon icon=\"user:core\" color=\"neutral\"/>\n}\n","import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n    selector: 'eds-avatar-content',\n    templateUrl: './eds-avatar-content.html',\n    styleUrl: './eds-avatar-content.scss',\n    host: {\n        class: 'eds-avatar-content',\n    },\n    changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class EdsAvatarContent {\n}\n","<ng-content select=\"eds-avatar-content-label\"/>\n<ng-content select=\"eds-avatar-content-sublabel\"/>","import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n    selector: 'eds-avatar-content-sublabel',\n    template: '<ng-content />',\n    styleUrl: './eds-avatar-content-sublabel.scss',\n    host: {\n        class: 'eds-avatar-content-sublabel',\n    },\n    changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class EdsAvatarContentSublabel {\n}\n","import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n    selector: 'eds-avatar-content-label',\n    template: '<ng-content />',\n    styleUrl: './eds-avatar-content-label.scss',\n    host: {\n        class: 'eds-avatar-content-label',\n    },\n    changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class EdsAvatarContentLabel {\n}\n","import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n    selector: 'eds-avatar-list',\n    template: '<ng-content/>',\n    styleUrl: './eds-avatar-list.scss',\n    host: {\n        class: 'eds-avatar-list',\n    },\n    changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class EdsAvatarList {\n}\n","import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n    selector: 'eds-avatar-text',\n    template: '<ng-content/>',\n    styleUrl: './eds-avatar-text.scss',\n    host: {\n        class: 'eds-avatar-text',\n    },\n    changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class EdsAvatarText {\n}\n","import { Component, ChangeDetectionStrategy, input, contentChild, computed } from '@angular/core';\nimport { EdsAvatarImage } from './eds-avatar-image';\n\n/**\n * Local narrowed size union — the avatar's size contract.\n */\nexport type EdsAvatarSize = '2xs' | 'xs' | 's' | 'm' | 'l' | 'xl';\n\n@Component({\n    selector: 'div[edsAvatar], span[edsAvatar], eds-avatar',\n    templateUrl: './eds-avatar.html',\n    styleUrl: './eds-avatar.scss',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {\n        class: 'eds-avatar',\n        role: 'img',\n        '[attr.size]': 'size()',\n        '[attr.color]': 'color() || null',\n        '[attr.image]': 'hasImage() || null',\n        '[attr.data-e2e]': 'e2eAttr()',\n        '[attr.aria-label]': 'ariaLabel()',\n    },\n})\nexport class EdsAvatar {\n    /**\n     * Data attribute for E2E testing\n     * @default 'eds-avatar'\n     */\n    e2eAttr = input('eds-avatar');\n\n    /**\n     * Size of the avatar.\n     * @default 'm'\n     */\n    size = input<EdsAvatarSize>('m');\n\n    /**\n     * ARIA label for accessibility.\n     * Should describe the avatar's identity (e.g. user name, initials meaning).\n     * When null, no aria-label is rendered — ensure visible text or an explicit label is provided.\n     * @default null\n     */\n    ariaLabel = input<string | null>(null, { alias: 'aria-label' });\n\n    /**\n     * Extra color palette applied to the avatar surface (maps to an EDS color palette,\n     * e.g. `info`, `success`, `warning`, `critical`). Empty string uses the default neutral surface.\n     * @default ''\n     */\n    color = input<string>('');\n\n    /** Signal-based content query for avatar image sub-component. */\n    protected avatarImage = contentChild(EdsAvatarImage);\n\n    /** Whether an image sub-component is projected. */\n    protected hasImage = computed(() => !!this.avatarImage());\n}\n","<div class=\"eds-avatar-wrapper\">\n    <ng-content select=\"eds-avatar-icon\"/>\n    <ng-content select=\"eds-avatar-text\"/>\n    <ng-content select=\"eds-avatar-image\"/>\n    <ng-content select=\"eds-avatar-badge\"/>\n</div>\n\n<ng-content select=\"eds-avatar-content\"/>\n","import { EdsAvatarBadge } from './eds-avatar-badge';\nimport { EdsAvatarIcon } from './eds-avatar-icon';\nimport { EdsAvatarImage } from './eds-avatar-image';\nimport { EdsAvatarContent } from './eds-avatar-content';\nimport { EdsAvatarContentSublabel } from './eds-avatar-content-sublabel';\nimport { EdsAvatarContentLabel } from './eds-avatar-content-label';\nimport { EdsAvatarList } from './eds-avatar-list';\nimport { EdsAvatarText } from './eds-avatar-text';\nimport { EdsAvatar } from './eds-avatar';\n\nexport * from './eds-avatar';\nexport * from './eds-avatar-icon';\nexport * from './eds-avatar-text';\nexport * from './eds-avatar-image';\nexport * from './eds-avatar-badge';\nexport * from './eds-avatar-list';\nexport * from './eds-avatar-content';\nexport * from './eds-avatar-content-label';\nexport * from './eds-avatar-content-sublabel';\n\nexport const EDS_AVATAR = [\n        EdsAvatar,\n        EdsAvatarIcon,\n        EdsAvatarText,\n        EdsAvatarImage,\n        EdsAvatarBadge,\n        EdsAvatarList,\n        EdsAvatarContent,\n        EdsAvatarContentLabel,\n        EdsAvatarContentSublabel,\n] as const;","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/eui-eds-eds-badge.mjs

@@ -134,7 +134,7 @@ class EdsBadge {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsBadge, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: EdsBadge, isStandalone: true, selector: "eds-badge, span[edsBadge]", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, iconOnly: { classPropertyName: "iconOnly", publicName: "iconOnly", isSignal: true, isRequired: false, transformFunction: null }, maxCharCount: { classPropertyName: "maxCharCount", publicName: "maxCharCount", isSignal: true, isRequired: false, transformFunction: null }, charReplacement: { classPropertyName: "charReplacement", publicName: "charReplacement", isSignal: true, isRequired: false, transformFunction: null }, e2eAttr: { classPropertyName: "e2eAttr", publicName: "e2eAttr", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "status" }, properties: { "attr.color": "color()", "attr.variant": "variant()", "attr.size": "size()", "attr.icon-only": "iconOnly() || null", "attr.empty": "isEmpty() || null", "attr.data-e2e": "e2eAttr()", "attr.aria-label": "ariaLabel()" } }, viewQueries: [{ propertyName: "content", first: true, predicate: ["contentRef"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (hasContentUpdated()) {\n    <span class=\"eds-badge__wrapper\">\n        {{ updatedContent() }}\n    </span>\n} @else {\n    <span class=\"eds-badge__wrapper\" #contentRef (cdkObserveContent)=\"onContentChanged()\">\n        <ng-content></ng-content>\n    </span>\n}\n", styles: [":host{--_eds-badge-padding: 0 var(--eds-sp-3xs);--_eds-badge-border-radius: var(--eds-br-full);--_eds-badge-border-width: var(--eds-bw-xs);--_eds-badge-font: var(--eds-f-microcopy-xs);--_eds-badge-height: calc(var(--eds-sp-m) + var(--eds-sp-3xs));--_eds-badge-min-width: calc(var(--eds-sp-m) + var(--eds-sp-3xs));--_eds-badge-empty-size: var(--eds-sp-s);--_eds-badge-surface: var(--eds-c-surface-neutral);--_eds-badge-on-surface: var(--eds-c-on-surface-neutral);--_eds-badge-border-color: var(--eds-c-border-neutral-subtle);display:inline-flex;border:var(--_eds-badge-border-width) solid var(--_eds-badge-border-color);border-radius:var(--_eds-badge-border-radius);background-color:var(--_eds-badge-surface);--_eds-icon-on-surface: var(--_eds-badge-on-surface)}:host .eds-badge__wrapper{display:inline-flex;align-items:center;justify-content:center;color:var(--_eds-badge-on-surface);height:var(--_eds-badge-height);min-width:var(--_eds-badge-min-width);padding:var(--_eds-badge-padding);font:var(--_eds-badge-font);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host([color=primary]){--_eds-badge-surface: var(--eds-c-surface-primary);--_eds-badge-on-surface: var(--eds-c-on-surface-primary);--_eds-badge-border-color: var(--eds-c-border-primary-subtle)}:host([color=neutral]){--_eds-badge-surface: var(--eds-c-surface-neutral);--_eds-badge-on-surface: var(--eds-c-on-surface-neutral);--_eds-badge-border-color: var(--eds-c-border-neutral-subtle)}:host([color=success]){--_eds-badge-surface: var(--eds-c-surface-success);--_eds-badge-on-surface: var(--eds-c-on-surface-success);--_eds-badge-border-color: var(--eds-c-border-success-subtle)}:host([color=info]){--_eds-badge-surface: var(--eds-c-surface-info);--_eds-badge-on-surface: var(--eds-c-on-surface-info);--_eds-badge-border-color: var(--eds-c-border-info-subtle)}:host([color=warning]){--_eds-badge-surface: var(--eds-c-surface-warning);--_eds-badge-on-surface: var(--eds-c-on-surface-warning);--_eds-badge-border-color: var(--eds-c-border-warning-subtle)}:host([color=critical]){--_eds-badge-surface: var(--eds-c-surface-critical);--_eds-badge-on-surface: var(--eds-c-on-surface-critical);--_eds-badge-border-color: var(--eds-c-border-critical-subtle)}:host([variant=outline]){--_eds-badge-surface: transparent}:host([variant=outline][color=primary]){--_eds-badge-on-surface: var(--eds-c-on-surface-primary-subtler);--_eds-badge-border-color: var(--eds-c-border-primary)}:host([variant=outline][color=neutral]){--_eds-badge-on-surface: var(--eds-c-on-surface-neutral-subtler);--_eds-badge-border-color: var(--eds-c-border-neutral)}:host([variant=outline][color=success]){--_eds-badge-on-surface: var(--eds-c-on-surface-success-subtler);--_eds-badge-border-color: var(--eds-c-border-success)}:host([variant=outline][color=info]){--_eds-badge-on-surface: var(--eds-c-on-surface-info-subtler);--_eds-badge-border-color: var(--eds-c-border-info)}:host([variant=outline][color=warning]){--_eds-badge-on-surface: var(--eds-c-on-surface-warning-subtler);--_eds-badge-border-color: var(--eds-c-border-warning)}:host([variant=outline][color=critical]){--_eds-badge-on-surface: var(--eds-c-on-surface-critical-subtler);--_eds-badge-border-color: var(--eds-c-border-critical)}:host([size=s]){--_eds-badge-height: var(--eds-sp-m);--_eds-badge-min-width: var(--eds-sp-m);--_eds-badge-font: var(--eds-f-microcopy-2xs)}:host([empty]){width:var(--_eds-badge-empty-size);height:var(--_eds-badge-empty-size)}:host([icon-only]) .eds-badge__wrapper{padding:0;width:var(--_eds-badge-height);min-width:var(--_eds-badge-height)}:host-context(.eds-icon){position:absolute;left:60%;top:-20%}:host([empty]):host-context(.eds-icon){left:60%;top:-10%}:host([size=xs][empty]):host-context(.eds-icon){left:70%;top:-10%}:host-context(.eds-icon-button[size=\"2xs\"]){left:50%;top:-30%}:host-context(.eds-icon-button[size=xs]){left:50%;top:-40%}:host-context(.eds-icon-button[size=s]){left:50%;top:-50%}:host-context(.eds-icon-button[size=m]){left:50%;top:-40%}:host-context(.eds-icon-button[size=l]){left:50%;top:-25%}:host-context(.eds-avatar){border:var(--eds-bw-s) solid var(--eds-c-border-inverted)}\n"], dependencies: [{ kind: "ngmodule", type: ObserversModule }, { kind: "directive", type: i1.CdkObserveContent, selector: "[cdkObserveContent]", inputs: ["cdkObserveContentDisabled", "debounce"], outputs: ["cdkObserveContent"], exportAs: ["cdkObserveContent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: EdsBadge, isStandalone: true, selector: "eds-badge, span[edsBadge]", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, iconOnly: { classPropertyName: "iconOnly", publicName: "iconOnly", isSignal: true, isRequired: false, transformFunction: null }, maxCharCount: { classPropertyName: "maxCharCount", publicName: "maxCharCount", isSignal: true, isRequired: false, transformFunction: null }, charReplacement: { classPropertyName: "charReplacement", publicName: "charReplacement", isSignal: true, isRequired: false, transformFunction: null }, e2eAttr: { classPropertyName: "e2eAttr", publicName: "e2eAttr", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "status" }, properties: { "attr.color": "color()", "attr.variant": "variant()", "attr.size": "size()", "attr.icon-only": "iconOnly() || null", "attr.empty": "isEmpty() || null", "attr.data-e2e": "e2eAttr()", "attr.aria-label": "ariaLabel()" } }, viewQueries: [{ propertyName: "content", first: true, predicate: ["contentRef"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (hasContentUpdated()) {\n    <span class=\"eds-badge__wrapper\">\n        {{ updatedContent() }}\n    </span>\n} @else {\n    <span class=\"eds-badge__wrapper\" #contentRef (cdkObserveContent)=\"onContentChanged()\">\n        <ng-content></ng-content>\n    </span>\n}\n", styles: [":host{--_eds-badge-padding: 0 var(--eds-sp-3xs);--_eds-badge-border-radius: var(--eds-br-full);--_eds-badge-border-width: var(--eds-bw-xs);--_eds-badge-font: var(--eds-f-microcopy-xs);--_eds-badge-height: calc(var(--eds-sp-m) + var(--eds-sp-3xs));--_eds-badge-min-width: calc(var(--eds-sp-m) + var(--eds-sp-3xs));--_eds-badge-empty-size: var(--eds-sp-s);--_eds-badge-surface: var(--eds-c-surface-neutral);--_eds-badge-on-surface: var(--eds-c-on-surface-neutral);--_eds-badge-border-color: var(--eds-c-border-neutral-subtle);display:inline-flex;border:var(--_eds-badge-border-width) solid var(--_eds-badge-border-color);border-radius:var(--_eds-badge-border-radius);background-color:var(--_eds-badge-surface);--_eds-icon-on-surface: var(--_eds-badge-on-surface);--_icon-size: initial}:host .eds-badge__wrapper{display:inline-flex;align-items:center;justify-content:center;color:var(--_eds-badge-on-surface);height:var(--_eds-badge-height);min-width:var(--_eds-badge-min-width);padding:var(--_eds-badge-padding);font:var(--_eds-badge-font);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host([color=primary]){--_eds-badge-surface: var(--eds-c-surface-primary);--_eds-badge-on-surface: var(--eds-c-on-surface-primary);--_eds-badge-border-color: var(--eds-c-border-primary-subtle)}:host([color=neutral]){--_eds-badge-surface: var(--eds-c-surface-neutral);--_eds-badge-on-surface: var(--eds-c-on-surface-neutral);--_eds-badge-border-color: var(--eds-c-border-neutral-subtle)}:host([color=success]){--_eds-badge-surface: var(--eds-c-surface-success);--_eds-badge-on-surface: var(--eds-c-on-surface-success);--_eds-badge-border-color: var(--eds-c-border-success-subtle)}:host([color=info]){--_eds-badge-surface: var(--eds-c-surface-info);--_eds-badge-on-surface: var(--eds-c-on-surface-info);--_eds-badge-border-color: var(--eds-c-border-info-subtle)}:host([color=warning]){--_eds-badge-surface: var(--eds-c-surface-warning);--_eds-badge-on-surface: var(--eds-c-on-surface-warning);--_eds-badge-border-color: var(--eds-c-border-warning-subtle)}:host([color=critical]){--_eds-badge-surface: var(--eds-c-surface-critical);--_eds-badge-on-surface: var(--eds-c-on-surface-critical);--_eds-badge-border-color: var(--eds-c-border-critical-subtle)}:host([variant=outline]){--_eds-badge-surface: var(--eui-c-surface-container)}:host([variant=outline][color=primary]){--_eds-badge-on-surface: var(--eds-c-on-surface-primary-subtler);--_eds-badge-border-color: var(--eds-c-border-primary)}:host([variant=outline][color=neutral]){--_eds-badge-on-surface: var(--eds-c-on-surface-neutral-subtler);--_eds-badge-border-color: var(--eds-c-border-neutral)}:host([variant=outline][color=success]){--_eds-badge-on-surface: var(--eds-c-on-surface-success-subtler);--_eds-badge-border-color: var(--eds-c-border-success)}:host([variant=outline][color=info]){--_eds-badge-on-surface: var(--eds-c-on-surface-info-subtler);--_eds-badge-border-color: var(--eds-c-border-info)}:host([variant=outline][color=warning]){--_eds-badge-on-surface: var(--eds-c-on-surface-warning-subtler);--_eds-badge-border-color: var(--eds-c-border-warning)}:host([variant=outline][color=critical]){--_eds-badge-on-surface: var(--eds-c-on-surface-critical-subtler);--_eds-badge-border-color: var(--eds-c-border-critical)}:host([size=s]){--_eds-badge-height: var(--eds-sp-m);--_eds-badge-min-width: var(--eds-sp-m);--_eds-badge-font: var(--eds-f-microcopy-2xs)}:host([empty]){width:var(--_eds-badge-empty-size);height:var(--_eds-badge-empty-size)}:host([icon-only]) .eds-badge__wrapper{padding:0;width:var(--_eds-badge-height);min-width:var(--_eds-badge-height)}:host-context(.eds-icon){position:absolute;left:60%;top:-20%}:host([empty]):host-context(.eds-icon){left:60%;top:-10%}:host([size=xs][empty]):host-context(.eds-icon){left:70%;top:-10%}:host-context(.eds-icon-button[size=\"2xs\"]){left:50%;top:-30%}:host-context(.eds-icon-button[size=xs]){left:50%;top:-40%}:host-context(.eds-icon-button[size=s]){left:50%;top:-50%}:host-context(.eds-icon-button[size=m]){left:50%;top:-40%}:host-context(.eds-icon-button[size=l]){left:50%;top:-25%}:host-context(.eds-avatar){border:var(--eds-bw-s) solid var(--eds-c-border-inverted)}\n"], dependencies: [{ kind: "ngmodule", type: ObserversModule }, { kind: "directive", type: i1.CdkObserveContent, selector: "[cdkObserveContent]", inputs: ["cdkObserveContentDisabled", "debounce"], outputs: ["cdkObserveContent"], exportAs: ["cdkObserveContent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsBadge, decorators: [{
             type: Component,
@@ -147,7 +147,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImpor
                         '[attr.empty]': 'isEmpty() || null',
                         '[attr.data-e2e]': 'e2eAttr()',
                         '[attr.aria-label]': 'ariaLabel()',
-                    }, template: "@if (hasContentUpdated()) {\n    <span class=\"eds-badge__wrapper\">\n        {{ updatedContent() }}\n    </span>\n} @else {\n    <span class=\"eds-badge__wrapper\" #contentRef (cdkObserveContent)=\"onContentChanged()\">\n        <ng-content></ng-content>\n    </span>\n}\n", styles: [":host{--_eds-badge-padding: 0 var(--eds-sp-3xs);--_eds-badge-border-radius: var(--eds-br-full);--_eds-badge-border-width: var(--eds-bw-xs);--_eds-badge-font: var(--eds-f-microcopy-xs);--_eds-badge-height: calc(var(--eds-sp-m) + var(--eds-sp-3xs));--_eds-badge-min-width: calc(var(--eds-sp-m) + var(--eds-sp-3xs));--_eds-badge-empty-size: var(--eds-sp-s);--_eds-badge-surface: var(--eds-c-surface-neutral);--_eds-badge-on-surface: var(--eds-c-on-surface-neutral);--_eds-badge-border-color: var(--eds-c-border-neutral-subtle);display:inline-flex;border:var(--_eds-badge-border-width) solid var(--_eds-badge-border-color);border-radius:var(--_eds-badge-border-radius);background-color:var(--_eds-badge-surface);--_eds-icon-on-surface: var(--_eds-badge-on-surface)}:host .eds-badge__wrapper{display:inline-flex;align-items:center;justify-content:center;color:var(--_eds-badge-on-surface);height:var(--_eds-badge-height);min-width:var(--_eds-badge-min-width);padding:var(--_eds-badge-padding);font:var(--_eds-badge-font);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host([color=primary]){--_eds-badge-surface: var(--eds-c-surface-primary);--_eds-badge-on-surface: var(--eds-c-on-surface-primary);--_eds-badge-border-color: var(--eds-c-border-primary-subtle)}:host([color=neutral]){--_eds-badge-surface: var(--eds-c-surface-neutral);--_eds-badge-on-surface: var(--eds-c-on-surface-neutral);--_eds-badge-border-color: var(--eds-c-border-neutral-subtle)}:host([color=success]){--_eds-badge-surface: var(--eds-c-surface-success);--_eds-badge-on-surface: var(--eds-c-on-surface-success);--_eds-badge-border-color: var(--eds-c-border-success-subtle)}:host([color=info]){--_eds-badge-surface: var(--eds-c-surface-info);--_eds-badge-on-surface: var(--eds-c-on-surface-info);--_eds-badge-border-color: var(--eds-c-border-info-subtle)}:host([color=warning]){--_eds-badge-surface: var(--eds-c-surface-warning);--_eds-badge-on-surface: var(--eds-c-on-surface-warning);--_eds-badge-border-color: var(--eds-c-border-warning-subtle)}:host([color=critical]){--_eds-badge-surface: var(--eds-c-surface-critical);--_eds-badge-on-surface: var(--eds-c-on-surface-critical);--_eds-badge-border-color: var(--eds-c-border-critical-subtle)}:host([variant=outline]){--_eds-badge-surface: transparent}:host([variant=outline][color=primary]){--_eds-badge-on-surface: var(--eds-c-on-surface-primary-subtler);--_eds-badge-border-color: var(--eds-c-border-primary)}:host([variant=outline][color=neutral]){--_eds-badge-on-surface: var(--eds-c-on-surface-neutral-subtler);--_eds-badge-border-color: var(--eds-c-border-neutral)}:host([variant=outline][color=success]){--_eds-badge-on-surface: var(--eds-c-on-surface-success-subtler);--_eds-badge-border-color: var(--eds-c-border-success)}:host([variant=outline][color=info]){--_eds-badge-on-surface: var(--eds-c-on-surface-info-subtler);--_eds-badge-border-color: var(--eds-c-border-info)}:host([variant=outline][color=warning]){--_eds-badge-on-surface: var(--eds-c-on-surface-warning-subtler);--_eds-badge-border-color: var(--eds-c-border-warning)}:host([variant=outline][color=critical]){--_eds-badge-on-surface: var(--eds-c-on-surface-critical-subtler);--_eds-badge-border-color: var(--eds-c-border-critical)}:host([size=s]){--_eds-badge-height: var(--eds-sp-m);--_eds-badge-min-width: var(--eds-sp-m);--_eds-badge-font: var(--eds-f-microcopy-2xs)}:host([empty]){width:var(--_eds-badge-empty-size);height:var(--_eds-badge-empty-size)}:host([icon-only]) .eds-badge__wrapper{padding:0;width:var(--_eds-badge-height);min-width:var(--_eds-badge-height)}:host-context(.eds-icon){position:absolute;left:60%;top:-20%}:host([empty]):host-context(.eds-icon){left:60%;top:-10%}:host([size=xs][empty]):host-context(.eds-icon){left:70%;top:-10%}:host-context(.eds-icon-button[size=\"2xs\"]){left:50%;top:-30%}:host-context(.eds-icon-button[size=xs]){left:50%;top:-40%}:host-context(.eds-icon-button[size=s]){left:50%;top:-50%}:host-context(.eds-icon-button[size=m]){left:50%;top:-40%}:host-context(.eds-icon-button[size=l]){left:50%;top:-25%}:host-context(.eds-avatar){border:var(--eds-bw-s) solid var(--eds-c-border-inverted)}\n"] }]
+                    }, template: "@if (hasContentUpdated()) {\n    <span class=\"eds-badge__wrapper\">\n        {{ updatedContent() }}\n    </span>\n} @else {\n    <span class=\"eds-badge__wrapper\" #contentRef (cdkObserveContent)=\"onContentChanged()\">\n        <ng-content></ng-content>\n    </span>\n}\n", styles: [":host{--_eds-badge-padding: 0 var(--eds-sp-3xs);--_eds-badge-border-radius: var(--eds-br-full);--_eds-badge-border-width: var(--eds-bw-xs);--_eds-badge-font: var(--eds-f-microcopy-xs);--_eds-badge-height: calc(var(--eds-sp-m) + var(--eds-sp-3xs));--_eds-badge-min-width: calc(var(--eds-sp-m) + var(--eds-sp-3xs));--_eds-badge-empty-size: var(--eds-sp-s);--_eds-badge-surface: var(--eds-c-surface-neutral);--_eds-badge-on-surface: var(--eds-c-on-surface-neutral);--_eds-badge-border-color: var(--eds-c-border-neutral-subtle);display:inline-flex;border:var(--_eds-badge-border-width) solid var(--_eds-badge-border-color);border-radius:var(--_eds-badge-border-radius);background-color:var(--_eds-badge-surface);--_eds-icon-on-surface: var(--_eds-badge-on-surface);--_icon-size: initial}:host .eds-badge__wrapper{display:inline-flex;align-items:center;justify-content:center;color:var(--_eds-badge-on-surface);height:var(--_eds-badge-height);min-width:var(--_eds-badge-min-width);padding:var(--_eds-badge-padding);font:var(--_eds-badge-font);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host([color=primary]){--_eds-badge-surface: var(--eds-c-surface-primary);--_eds-badge-on-surface: var(--eds-c-on-surface-primary);--_eds-badge-border-color: var(--eds-c-border-primary-subtle)}:host([color=neutral]){--_eds-badge-surface: var(--eds-c-surface-neutral);--_eds-badge-on-surface: var(--eds-c-on-surface-neutral);--_eds-badge-border-color: var(--eds-c-border-neutral-subtle)}:host([color=success]){--_eds-badge-surface: var(--eds-c-surface-success);--_eds-badge-on-surface: var(--eds-c-on-surface-success);--_eds-badge-border-color: var(--eds-c-border-success-subtle)}:host([color=info]){--_eds-badge-surface: var(--eds-c-surface-info);--_eds-badge-on-surface: var(--eds-c-on-surface-info);--_eds-badge-border-color: var(--eds-c-border-info-subtle)}:host([color=warning]){--_eds-badge-surface: var(--eds-c-surface-warning);--_eds-badge-on-surface: var(--eds-c-on-surface-warning);--_eds-badge-border-color: var(--eds-c-border-warning-subtle)}:host([color=critical]){--_eds-badge-surface: var(--eds-c-surface-critical);--_eds-badge-on-surface: var(--eds-c-on-surface-critical);--_eds-badge-border-color: var(--eds-c-border-critical-subtle)}:host([variant=outline]){--_eds-badge-surface: var(--eui-c-surface-container)}:host([variant=outline][color=primary]){--_eds-badge-on-surface: var(--eds-c-on-surface-primary-subtler);--_eds-badge-border-color: var(--eds-c-border-primary)}:host([variant=outline][color=neutral]){--_eds-badge-on-surface: var(--eds-c-on-surface-neutral-subtler);--_eds-badge-border-color: var(--eds-c-border-neutral)}:host([variant=outline][color=success]){--_eds-badge-on-surface: var(--eds-c-on-surface-success-subtler);--_eds-badge-border-color: var(--eds-c-border-success)}:host([variant=outline][color=info]){--_eds-badge-on-surface: var(--eds-c-on-surface-info-subtler);--_eds-badge-border-color: var(--eds-c-border-info)}:host([variant=outline][color=warning]){--_eds-badge-on-surface: var(--eds-c-on-surface-warning-subtler);--_eds-badge-border-color: var(--eds-c-border-warning)}:host([variant=outline][color=critical]){--_eds-badge-on-surface: var(--eds-c-on-surface-critical-subtler);--_eds-badge-border-color: var(--eds-c-border-critical)}:host([size=s]){--_eds-badge-height: var(--eds-sp-m);--_eds-badge-min-width: var(--eds-sp-m);--_eds-badge-font: var(--eds-f-microcopy-2xs)}:host([empty]){width:var(--_eds-badge-empty-size);height:var(--_eds-badge-empty-size)}:host([icon-only]) .eds-badge__wrapper{padding:0;width:var(--_eds-badge-height);min-width:var(--_eds-badge-height)}:host-context(.eds-icon){position:absolute;left:60%;top:-20%}:host([empty]):host-context(.eds-icon){left:60%;top:-10%}:host([size=xs][empty]):host-context(.eds-icon){left:70%;top:-10%}:host-context(.eds-icon-button[size=\"2xs\"]){left:50%;top:-30%}:host-context(.eds-icon-button[size=xs]){left:50%;top:-40%}:host-context(.eds-icon-button[size=s]){left:50%;top:-50%}:host-context(.eds-icon-button[size=m]){left:50%;top:-40%}:host-context(.eds-icon-button[size=l]){left:50%;top:-25%}:host-context(.eds-avatar){border:var(--eds-bw-s) solid var(--eds-c-border-inverted)}\n"] }]
         }], ctorParameters: () => [], propDecorators: { color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], iconOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconOnly", required: false }] }], maxCharCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxCharCount", required: false }] }], charReplacement: [{ type: i0.Input, args: [{ isSignal: true, alias: "charReplacement", required: false }] }], e2eAttr: [{ type: i0.Input, args: [{ isSignal: true, alias: "e2eAttr", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], content: [{ type: i0.ViewChild, args: ['contentRef', { isSignal: true }] }] } });
 
 const EDS_BADGE = [

package/fesm2022/eui-eds-eds-badge.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"eui-eds-eds-badge.mjs","sources":["../../eds-badge/eds-badge.ts","../../eds-badge/eds-badge.html","../../eds-badge/index.ts","../../eds-badge/eui-eds-eds-badge.ts"],"sourcesContent":["import {\n    Component,\n    ChangeDetectionStrategy,\n    ElementRef,\n    booleanAttribute,\n    numberAttribute,\n    computed,\n    effect,\n    input,\n    signal,\n    viewChild,\n} from '@angular/core';\nimport { ObserversModule } from '@angular/cdk/observers';\n\n/**\n * Local narrowed unions — the badge's variant contract. No shared-token import.\n */\nexport type EdsBadgeColor = 'primary' | 'neutral' | 'success' | 'info' | 'warning' | 'critical';\nexport type EdsBadgeVariant = 'filled' | 'outline';\nexport type EdsBadgeSize = 's' | 'm';\n\n/**\n * @description\n * A badge component that displays text, numbers, or a dot indicator with semantic\n * color, size, and variant styling. Supports content truncation, an automatic empty\n * state, and an icon-only (dot) mode.\n *\n * @usageNotes\n * #### Basic badge\n * ```html\n * <eds-badge>99</eds-badge>\n * ```\n *\n * #### Semantic colors\n * ```html\n * <eds-badge color=\"success\">Active</eds-badge>\n * <eds-badge color=\"critical\">Error</eds-badge>\n * ```\n *\n * #### Variant\n * ```html\n * <eds-badge color=\"info\" variant=\"outline\">New</eds-badge>\n * ```\n *\n * #### Truncation\n * ```html\n * <eds-badge [maxCharCount]=\"2\" charReplacement=\"99+\">150</eds-badge>\n * ```\n *\n * #### Icon-only (dot indicator)\n * ```html\n * <eds-badge iconOnly color=\"critical\"></eds-badge>\n * ```\n */\n@Component({\n    selector: 'eds-badge, span[edsBadge]',\n    templateUrl: './eds-badge.html',\n    styleUrl: './eds-badge.scss',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    imports: [ObserversModule],\n    host: {\n        role: 'status',\n        '[attr.color]': 'color()',\n        '[attr.variant]': 'variant()',\n        '[attr.size]': 'size()',\n        '[attr.icon-only]': 'iconOnly() || null',\n        '[attr.empty]': 'isEmpty() || null',\n        '[attr.data-e2e]': 'e2eAttr()',\n        '[attr.aria-label]': 'ariaLabel()',\n    },\n})\nexport class EdsBadge {\n    /**\n     * Semantic color of the badge.\n     *\n     * @default 'neutral'\n     */\n    color = input<EdsBadgeColor>('neutral');\n\n    /**\n     * Visual variant of the badge. `filled` uses a solid semantic surface; `outline`\n     * uses a transparent surface with a stronger border.\n     *\n     * @default 'filled'\n     */\n    variant = input<EdsBadgeVariant>('filled');\n\n    /**\n     * Size of the badge.\n     *\n     * @default 'm'\n     */\n    size = input<EdsBadgeSize>('m');\n\n    /**\n     * Whether the badge is a small dot indicator with no text content.\n     *\n     * @default false\n     */\n    iconOnly = input(false, { transform: booleanAttribute });\n\n    /**\n     * Maximum number of characters to display before truncating. When the content\n     * exceeds this limit it is replaced with `charReplacement`. `0` disables truncation.\n     *\n     * @default 0\n     */\n    maxCharCount = input(0, { transform: numberAttribute });\n\n    /**\n     * Text shown when the content is truncated by `maxCharCount`. Falls back to `'99+'`.\n     *\n     * @default ''\n     */\n    charReplacement = input('');\n\n    /**\n     * Data attribute for e2e testing.\n     *\n     * @default 'eds-badge'\n     */\n    e2eAttr = input('eds-badge');\n\n    /**\n     * ARIA label for accessibility. When `null`, the visible content serves as the\n     * accessible name.\n     *\n     * @default 'badge'\n     */\n    ariaLabel = input<string | null>('badge');\n\n    protected readonly content = viewChild<ElementRef<HTMLElement>>('contentRef');\n\n    /** Whether the projected content is empty (drives the dot/empty state). */\n    protected readonly isEmpty = signal(false);\n\n    /** Whether the content was truncated by `maxCharCount`. */\n    protected readonly hasContentUpdated = signal(false);\n\n    /** The replacement text shown when content is truncated. */\n    protected readonly updatedContent = computed(() => this.charReplacement() || '99+');\n\n    constructor() {\n        effect(() => {\n            const content = this.content();\n            if (content) {\n                this.isEmpty.set(content.nativeElement.childNodes.length === 0);\n                if (!this.isEmpty()) {\n                    this._checkContent();\n                }\n            }\n        });\n    }\n\n    /**\n     * Handles projected content changes and re-evaluates truncation.\n     */\n    onContentChanged(): void {\n        this._checkContent();\n    }\n\n    /**\n     * Checks whether the content exceeds `maxCharCount` and flags truncation.\n     */\n    private _checkContent(): void {\n        const maxCharCount = this.maxCharCount();\n        const contentEl = this.content();\n        if (maxCharCount !== 0 && contentEl) {\n            const contentText = contentEl.nativeElement.outerText;\n            this.hasContentUpdated.set(!!contentText && contentText.length > maxCharCount);\n        }\n    }\n}\n","@if (hasContentUpdated()) {\n    <span class=\"eds-badge__wrapper\">\n        {{ updatedContent() }}\n    </span>\n} @else {\n    <span class=\"eds-badge__wrapper\" #contentRef (cdkObserveContent)=\"onContentChanged()\">\n        <ng-content></ng-content>\n    </span>\n}\n","import { EdsBadge } from './eds-badge';\n\nexport * from './eds-badge';\n\nexport const EDS_BADGE = [\n    EdsBadge,\n] as const;\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"eui-eds-eds-badge.mjs","sources":["../../eds-badge/eds-badge.ts","../../eds-badge/eds-badge.html","../../eds-badge/index.ts","../../eds-badge/eui-eds-eds-badge.ts"],"sourcesContent":["import {\n    Component,\n    ChangeDetectionStrategy,\n    ElementRef,\n    booleanAttribute,\n    numberAttribute,\n    computed,\n    effect,\n    input,\n    signal,\n    viewChild,\n} from '@angular/core';\nimport { ObserversModule } from '@angular/cdk/observers';\n\n/**\n * Local narrowed unions — the badge's variant contract. No shared-token import.\n */\nexport type EdsBadgeColor = 'primary' | 'neutral' | 'success' | 'info' | 'warning' | 'critical';\nexport type EdsBadgeVariant = 'filled' | 'outline';\nexport type EdsBadgeSize = 's' | 'm';\n\n/**\n * @description\n * A badge component that displays text, numbers, or a dot indicator with semantic\n * color, size, and variant styling. Supports content truncation, an automatic empty\n * state, and an icon-only (dot) mode.\n *\n * @usageNotes\n * #### Basic badge\n * ```html\n * <eds-badge>99</eds-badge>\n * ```\n *\n * #### Semantic colors\n * ```html\n * <eds-badge color=\"success\">Active</eds-badge>\n * <eds-badge color=\"critical\">Error</eds-badge>\n * ```\n *\n * #### Variant\n * ```html\n * <eds-badge color=\"info\" variant=\"outline\">New</eds-badge>\n * ```\n *\n * #### Truncation\n * ```html\n * <eds-badge [maxCharCount]=\"2\" charReplacement=\"99+\">150</eds-badge>\n * ```\n *\n * #### Icon-only (dot indicator)\n * ```html\n * <eds-badge iconOnly color=\"critical\"></eds-badge>\n * ```\n */\n@Component({\n    selector: 'eds-badge, span[edsBadge]',\n    templateUrl: './eds-badge.html',\n    styleUrl: './eds-badge.scss',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    imports: [ObserversModule],\n    host: {\n        role: 'status',\n        '[attr.color]': 'color()',\n        '[attr.variant]': 'variant()',\n        '[attr.size]': 'size()',\n        '[attr.icon-only]': 'iconOnly() || null',\n        '[attr.empty]': 'isEmpty() || null',\n        '[attr.data-e2e]': 'e2eAttr()',\n        '[attr.aria-label]': 'ariaLabel()',\n    },\n})\nexport class EdsBadge {\n    /**\n     * Semantic color of the badge.\n     *\n     * @default 'neutral'\n     */\n    color = input<EdsBadgeColor>('neutral');\n\n    /**\n     * Visual variant of the badge. `filled` uses a solid semantic surface; `outline`\n     * uses a transparent surface with a stronger border.\n     *\n     * @default 'filled'\n     */\n    variant = input<EdsBadgeVariant>('filled');\n\n    /**\n     * Size of the badge.\n     *\n     * @default 'm'\n     */\n    size = input<EdsBadgeSize>('m');\n\n    /**\n     * Whether the badge is a small dot indicator with no text content.\n     *\n     * @default false\n     */\n    iconOnly = input(false, { transform: booleanAttribute });\n\n    /**\n     * Maximum number of characters to display before truncating. When the content\n     * exceeds this limit it is replaced with `charReplacement`. `0` disables truncation.\n     *\n     * @default 0\n     */\n    maxCharCount = input(0, { transform: numberAttribute });\n\n    /**\n     * Text shown when the content is truncated by `maxCharCount`. Falls back to `'99+'`.\n     *\n     * @default ''\n     */\n    charReplacement = input('');\n\n    /**\n     * Data attribute for e2e testing.\n     *\n     * @default 'eds-badge'\n     */\n    e2eAttr = input('eds-badge');\n\n    /**\n     * ARIA label for accessibility. When `null`, the visible content serves as the\n     * accessible name.\n     *\n     * @default 'badge'\n     */\n    ariaLabel = input<string | null>('badge');\n\n    protected readonly content = viewChild<ElementRef<HTMLElement>>('contentRef');\n\n    /** Whether the projected content is empty (drives the dot/empty state). */\n    protected readonly isEmpty = signal(false);\n\n    /** Whether the content was truncated by `maxCharCount`. */\n    protected readonly hasContentUpdated = signal(false);\n\n    /** The replacement text shown when content is truncated. */\n    protected readonly updatedContent = computed(() => this.charReplacement() || '99+');\n\n    constructor() {\n        effect(() => {\n            const content = this.content();\n            if (content) {\n                this.isEmpty.set(content.nativeElement.childNodes.length === 0);\n                if (!this.isEmpty()) {\n                    this._checkContent();\n                }\n            }\n        });\n    }\n\n    /**\n     * Handles projected content changes and re-evaluates truncation.\n     */\n    onContentChanged(): void {\n        this._checkContent();\n    }\n\n    /**\n     * Checks whether the content exceeds `maxCharCount` and flags truncation.\n     */\n    private _checkContent(): void {\n        const maxCharCount = this.maxCharCount();\n        const contentEl = this.content();\n        if (maxCharCount !== 0 && contentEl) {\n            const contentText = contentEl.nativeElement.outerText;\n            this.hasContentUpdated.set(!!contentText && contentText.length > maxCharCount);\n        }\n    }\n}\n","@if (hasContentUpdated()) {\n    <span class=\"eds-badge__wrapper\">\n        {{ updatedContent() }}\n    </span>\n} @else {\n    <span class=\"eds-badge__wrapper\" #contentRef (cdkObserveContent)=\"onContentChanged()\">\n        <ng-content></ng-content>\n    </span>\n}\n","import { EdsBadge } from './eds-badge';\n\nexport * from './eds-badge';\n\nexport const EDS_BADGE = [\n    EdsBadge,\n] as const;\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/eui-eds-eds-icon.mjs

@@ -90,7 +90,7 @@ class EdsIcon {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsIcon, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: EdsIcon, isStandalone: true, selector: "eds-icon, span[edsIcon]", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, set: { classPropertyName: "set", publicName: "set", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, ariaHidden: { classPropertyName: "ariaHidden", publicName: "ariaHidden", isSignal: true, isRequired: false, transformFunction: null }, rounded: { classPropertyName: "rounded", publicName: "rounded", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.color": "color()", "attr.size": "size()", "attr.rounded": "rounded() || null", "attr.loading": "isLoading() || null", "attr.role": "ariaHidden() ? null : \"img\"", "attr.aria-label": "ariaLabel() || null", "attr.aria-hidden": "ariaHidden() || null" }, classAttribute: "eds-icon" }, ngImport: i0, template: "@if (isLoading()) {\n    <span class=\"eds-icon-spinner\" aria-hidden=\"true\"></span>\n} @else {\n    <svg\n        class=\"eds-icon-svg eds-sprite-{{iconName()}} eds-icon-set-{{resolvedSet()}}\"\n        aria-hidden=\"true\">\n        <use [attr.href]=\"assetsBaseUrl + '/eds/icons/sprites/' + resolvedSet() + '.svg#' + iconName()\"></use>\n    </svg>\n}\n<ng-content />\n", styles: [":host{--_eds-icon-size: var(--_icon-size, var(--eds-is-m));--_eds-icon-color: var(--_eds-icon-on-surface, var(--_on-surface, var(--eds-c-foreground)));display:inline-flex;position:relative}:host .eds-icon-svg{height:var(--_eds-icon-size);width:var(--_eds-icon-size);fill:var(--_eds-icon-color);color:var(--_eds-icon-color)}:host .eds-icon-svg.eds-icon-set-flags-1x1,:host .eds-icon-svg.eds-icon-set-flags-4x3{fill:none}:host([size=\"2xs\"]){--_eds-icon-size: var(--eds-is-2xs)}:host([size=xs]){--_eds-icon-size: var(--eds-is-xs)}:host([size=s]){--_eds-icon-size: var(--eds-is-s)}:host([size=m]){--_eds-icon-size: var(--eds-is-m)}:host([size=l]){--_eds-icon-size: var(--eds-is-l)}:host([size=xl]){--_eds-icon-size: var(--eds-is-xl)}:host([size=\"2xl\"]){--_eds-icon-size: var(--eds-is-2xl)}:host([size=\"3xl\"]){--_eds-icon-size: var(--eds-is-3xl)}:host([size=\"4xl\"]){--_eds-icon-size: var(--eds-is-4xl)}:host([color=neutral]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground))}:host([color=neutral-subtle]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-subtle))}:host([color=neutral-subtler]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-subtler))}:host([color=primary]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-primary))}:host([color=highlight]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-highlight))}:host([color=info]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-info))}:host([color=success]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-success))}:host([color=warning]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-warning))}:host([color=critical]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-critical))}:host([color=brand]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-on-surface-brand))}:host([color=disabled]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-disabled))}:host([rounded]){border-radius:50%;overflow:hidden}:host([rounded]) .eds-icon-svg{border-radius:50%}:host([loading]) .eds-icon-spinner{display:inline-block;width:var(--_eds-icon-size);height:var(--_eds-icon-size);border:3px solid var(--eds-c-border-neutral-subtle);border-top-color:var(--_eds-icon-color);border-radius:50%;animation:eds-icon-spin .6s linear infinite}@keyframes eds-icon-spin{to{transform:rotate(360deg)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: EdsIcon, isStandalone: true, selector: "eds-icon, span[edsIcon]", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, set: { classPropertyName: "set", publicName: "set", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, ariaHidden: { classPropertyName: "ariaHidden", publicName: "ariaHidden", isSignal: true, isRequired: false, transformFunction: null }, rounded: { classPropertyName: "rounded", publicName: "rounded", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.color": "color()", "attr.size": "size()", "attr.rounded": "rounded() || null", "attr.loading": "isLoading() || null", "attr.role": "ariaHidden() ? null : \"img\"", "attr.aria-label": "ariaLabel() || null", "attr.aria-hidden": "ariaHidden() || null" }, classAttribute: "eds-icon" }, ngImport: i0, template: "@if (isLoading()) {\n    <span class=\"eds-icon-spinner\" aria-hidden=\"true\"></span>\n} @else {\n    <svg\n        class=\"eds-icon-svg eds-sprite-{{iconName()}} eds-icon-set-{{resolvedSet()}}\"\n        aria-hidden=\"true\">\n        <use [attr.href]=\"assetsBaseUrl + '/eds/icons/sprites/' + resolvedSet() + '.svg#' + iconName()\"></use>\n    </svg>\n}\n<ng-content />\n", styles: [":host{--_eds-icon-size: var(--_icon-size, var(--eds-is-m));--_eds-icon-color: var(--_eds-icon-on-surface, var(--_on-surface, var(--eds-c-foreground)));display:inline-flex;position:relative}:host .eds-icon-svg{height:var(--_eds-icon-size);width:var(--_eds-icon-size);fill:var(--_eds-icon-color);color:var(--_eds-icon-color)}:host .eds-icon-svg.eds-icon-set-flags-1x1,:host .eds-icon-svg.eds-icon-set-flags-4x3{fill:none}:host([size=\"2xs\"]){--_eds-icon-size: var(--_icon-size, var(--eds-is-2xs))}:host([size=xs]){--_eds-icon-size: var(--_icon-size, var(--eds-is-xs))}:host([size=s]){--_eds-icon-size: var(--_icon-size, var(--eds-is-s))}:host([size=m]){--_eds-icon-size: var(--_icon-size, var(--eds-is-m))}:host([size=l]){--_eds-icon-size: var(--_icon-size, var(--eds-is-l))}:host([size=xl]){--_eds-icon-size: var(--_icon-size, var(--eds-is-xl))}:host([size=\"2xl\"]){--_eds-icon-size: var(--_icon-size, var(--eds-is-2xl))}:host([size=\"3xl\"]){--_eds-icon-size: var(--_icon-size, var(--eds-is-3xl))}:host([size=\"4xl\"]){--_eds-icon-size: var(--_icon-size, var(--eds-is-4xl))}:host([color=neutral]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground))}:host([color=neutral-subtle]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-subtle))}:host([color=neutral-subtler]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-subtler))}:host([color=primary]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-primary))}:host([color=highlight]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-highlight))}:host([color=info]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-info))}:host([color=success]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-success))}:host([color=warning]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-warning))}:host([color=critical]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-critical))}:host([color=brand]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-on-surface-brand))}:host([color=disabled]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-disabled))}:host([rounded]){border-radius:50%;overflow:hidden}:host([rounded]) .eds-icon-svg{border-radius:50%}:host([loading]) .eds-icon-spinner{display:inline-block;width:var(--_eds-icon-size);height:var(--_eds-icon-size);border:3px solid var(--eds-c-border-neutral-subtle);border-top-color:var(--_eds-icon-color);border-radius:50%;animation:eds-icon-spin .6s linear infinite}@keyframes eds-icon-spin{to{transform:rotate(360deg)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsIcon, decorators: [{
             type: Component,
@@ -103,7 +103,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImpor
                         '[attr.role]': 'ariaHidden() ? null : "img"',
                         '[attr.aria-label]': 'ariaLabel() || null',
                         '[attr.aria-hidden]': 'ariaHidden() || null',
-                    }, template: "@if (isLoading()) {\n    <span class=\"eds-icon-spinner\" aria-hidden=\"true\"></span>\n} @else {\n    <svg\n        class=\"eds-icon-svg eds-sprite-{{iconName()}} eds-icon-set-{{resolvedSet()}}\"\n        aria-hidden=\"true\">\n        <use [attr.href]=\"assetsBaseUrl + '/eds/icons/sprites/' + resolvedSet() + '.svg#' + iconName()\"></use>\n    </svg>\n}\n<ng-content />\n", styles: [":host{--_eds-icon-size: var(--_icon-size, var(--eds-is-m));--_eds-icon-color: var(--_eds-icon-on-surface, var(--_on-surface, var(--eds-c-foreground)));display:inline-flex;position:relative}:host .eds-icon-svg{height:var(--_eds-icon-size);width:var(--_eds-icon-size);fill:var(--_eds-icon-color);color:var(--_eds-icon-color)}:host .eds-icon-svg.eds-icon-set-flags-1x1,:host .eds-icon-svg.eds-icon-set-flags-4x3{fill:none}:host([size=\"2xs\"]){--_eds-icon-size: var(--eds-is-2xs)}:host([size=xs]){--_eds-icon-size: var(--eds-is-xs)}:host([size=s]){--_eds-icon-size: var(--eds-is-s)}:host([size=m]){--_eds-icon-size: var(--eds-is-m)}:host([size=l]){--_eds-icon-size: var(--eds-is-l)}:host([size=xl]){--_eds-icon-size: var(--eds-is-xl)}:host([size=\"2xl\"]){--_eds-icon-size: var(--eds-is-2xl)}:host([size=\"3xl\"]){--_eds-icon-size: var(--eds-is-3xl)}:host([size=\"4xl\"]){--_eds-icon-size: var(--eds-is-4xl)}:host([color=neutral]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground))}:host([color=neutral-subtle]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-subtle))}:host([color=neutral-subtler]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-subtler))}:host([color=primary]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-primary))}:host([color=highlight]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-highlight))}:host([color=info]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-info))}:host([color=success]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-success))}:host([color=warning]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-warning))}:host([color=critical]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-critical))}:host([color=brand]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-on-surface-brand))}:host([color=disabled]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-disabled))}:host([rounded]){border-radius:50%;overflow:hidden}:host([rounded]) .eds-icon-svg{border-radius:50%}:host([loading]) .eds-icon-spinner{display:inline-block;width:var(--_eds-icon-size);height:var(--_eds-icon-size);border:3px solid var(--eds-c-border-neutral-subtle);border-top-color:var(--_eds-icon-color);border-radius:50%;animation:eds-icon-spin .6s linear infinite}@keyframes eds-icon-spin{to{transform:rotate(360deg)}}\n"] }]
+                    }, template: "@if (isLoading()) {\n    <span class=\"eds-icon-spinner\" aria-hidden=\"true\"></span>\n} @else {\n    <svg\n        class=\"eds-icon-svg eds-sprite-{{iconName()}} eds-icon-set-{{resolvedSet()}}\"\n        aria-hidden=\"true\">\n        <use [attr.href]=\"assetsBaseUrl + '/eds/icons/sprites/' + resolvedSet() + '.svg#' + iconName()\"></use>\n    </svg>\n}\n<ng-content />\n", styles: [":host{--_eds-icon-size: var(--_icon-size, var(--eds-is-m));--_eds-icon-color: var(--_eds-icon-on-surface, var(--_on-surface, var(--eds-c-foreground)));display:inline-flex;position:relative}:host .eds-icon-svg{height:var(--_eds-icon-size);width:var(--_eds-icon-size);fill:var(--_eds-icon-color);color:var(--_eds-icon-color)}:host .eds-icon-svg.eds-icon-set-flags-1x1,:host .eds-icon-svg.eds-icon-set-flags-4x3{fill:none}:host([size=\"2xs\"]){--_eds-icon-size: var(--_icon-size, var(--eds-is-2xs))}:host([size=xs]){--_eds-icon-size: var(--_icon-size, var(--eds-is-xs))}:host([size=s]){--_eds-icon-size: var(--_icon-size, var(--eds-is-s))}:host([size=m]){--_eds-icon-size: var(--_icon-size, var(--eds-is-m))}:host([size=l]){--_eds-icon-size: var(--_icon-size, var(--eds-is-l))}:host([size=xl]){--_eds-icon-size: var(--_icon-size, var(--eds-is-xl))}:host([size=\"2xl\"]){--_eds-icon-size: var(--_icon-size, var(--eds-is-2xl))}:host([size=\"3xl\"]){--_eds-icon-size: var(--_icon-size, var(--eds-is-3xl))}:host([size=\"4xl\"]){--_eds-icon-size: var(--_icon-size, var(--eds-is-4xl))}:host([color=neutral]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground))}:host([color=neutral-subtle]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-subtle))}:host([color=neutral-subtler]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-subtler))}:host([color=primary]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-primary))}:host([color=highlight]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-highlight))}:host([color=info]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-info))}:host([color=success]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-success))}:host([color=warning]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-warning))}:host([color=critical]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-critical))}:host([color=brand]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-on-surface-brand))}:host([color=disabled]){--_eds-icon-color: var(--_eds-icon-on-surface, var(--eds-c-foreground-disabled))}:host([rounded]){border-radius:50%;overflow:hidden}:host([rounded]) .eds-icon-svg{border-radius:50%}:host([loading]) .eds-icon-spinner{display:inline-block;width:var(--_eds-icon-size);height:var(--_eds-icon-size);border:3px solid var(--eds-c-border-neutral-subtle);border-top-color:var(--_eds-icon-color);border-radius:50%;animation:eds-icon-spin .6s linear infinite}@keyframes eds-icon-spin{to{transform:rotate(360deg)}}\n"] }]
         }], propDecorators: { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], set: [{ type: i0.Input, args: [{ isSignal: true, alias: "set", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], ariaHidden: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaHidden", required: false }] }], rounded: [{ type: i0.Input, args: [{ isSignal: true, alias: "rounded", required: false }] }], isLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: false }] }] } });
 
 /**

package/fesm2022/eui-eds-eds-icon.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"eui-eds-eds-icon.mjs","sources":["../../eds-icon/eds-icon.ts","../../eds-icon/eds-icon.html","../../eds-icon/eds-icon-image.ts","../../eds-icon/eds-icon-image.html","../../eds-icon/index.ts","../../eds-icon/eui-eds-eds-icon.ts"],"sourcesContent":["import {\n    ChangeDetectionStrategy,\n    Component,\n    OnInit,\n    inject,\n    computed,\n    booleanAttribute,\n    input,\n} from '@angular/core';\nimport { EUI_CONFIG_TOKEN } from '@eui/core';\nimport { EuiConfig } from '@eui/core';\n\n/**\n * Local narrowed color union — the icon's color contract.\n * Maps the legacy `EdsColorDirective` semantic booleans to EDS semantic colors.\n */\nexport type EdsIconColor =\n    | 'neutral'\n    | 'neutral-subtle'\n    | 'neutral-subtler'\n    | 'primary'\n    | 'highlight'\n    | 'info'\n    | 'success'\n    | 'warning'\n    | 'critical'\n    | 'brand'\n    | 'disabled';\n\n/**\n * Local narrowed size union — the icon's size contract.\n */\nexport type EdsIconSize =\n    | '2xs'\n    | 'xs'\n    | 's'\n    | 'm'\n    | 'l'\n    | 'xl'\n    | '2xl'\n    | '3xl'\n    | '4xl';\n\n/**\n * @description\n * Displays a scalable vector icon from a sprite set. Supports semantic color and size via\n * string inputs reflected as host attributes, an optional circular clip, and a loading spinner.\n * Icons resolve from the configured assets path using the `iconName:setName` convention.\n *\n * @usageNotes\n * ```html\n * <eds-icon icon=\"check\" color=\"success\" size=\"m\" />\n * <eds-icon icon=\"warning\" color=\"warning\" size=\"l\" [ariaHidden]=\"false\" ariaLabel=\"Warning\" />\n * <eds-icon icon=\"check:core\" />\n * ```\n */\n@Component({\n    selector: 'eds-icon, span[edsIcon]',\n    templateUrl: './eds-icon.html',\n    styleUrls: ['./eds-icon.scss'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {\n        class: 'eds-icon',\n        '[attr.color]': 'color()',\n        '[attr.size]': 'size()',\n        '[attr.rounded]': 'rounded() || null',\n        '[attr.loading]': 'isLoading() || null',\n        '[attr.role]': 'ariaHidden() ? null : \"img\"',\n        '[attr.aria-label]': 'ariaLabel() || null',\n        '[attr.aria-hidden]': 'ariaHidden() || null',\n    },\n})\nexport class EdsIcon implements OnInit {\n    /**\n     * Name of the icon to display, optionally including the icon set using 'iconName:setName' format.\n     * When format includes colon separator, automatically splits into icon and set properties.\n     */\n    icon = input<string>('');\n\n    /**\n     * Icon set library to load the icon from.\n     * @default 'regular'\n     */\n    set = input('regular');\n\n    /**\n     * Semantic color of the icon.\n     * @default 'neutral'\n     */\n    color = input<EdsIconColor>('neutral');\n\n    /**\n     * Size of the icon.\n     * @default 'm'\n     */\n    size = input<EdsIconSize>('m');\n\n    /**\n     * Accessible label for screen readers describing the icon's purpose.\n     */\n    ariaLabel = input<string>('');\n\n    /**\n     * Hides the icon from assistive technologies when purely decorative.\n     * @default true\n     */\n    ariaHidden = input(true, { transform: booleanAttribute });\n\n    /**\n     * Applies a circular clip (border-radius: 50%) to the icon, useful for flag icons.\n     * @default false\n     */\n    rounded = input(false, { transform: booleanAttribute });\n\n    /**\n     * When true, replaces the icon with a spinning loading indicator.\n     * The spinner inherits the icon's size and color.\n     * @default false\n     */\n    isLoading = input(false, { transform: booleanAttribute });\n\n    /** Resolved icon name (parsed from 'icon:set' format). */\n    iconName = computed(() => {\n        const raw = this.icon();\n        if (raw && raw.indexOf(':') > -1) {\n            return raw.split(':')[0];\n        }\n        return raw;\n    });\n\n    /** Resolved icon set (parsed from 'icon:set' format or defaults to set input). */\n    resolvedSet = computed(() => {\n        const raw = this.icon();\n        if (raw && raw.indexOf(':') > -1) {\n            return raw.split(':')[1] || 'regular';\n        }\n        return this.set() || 'regular';\n    });\n\n    public assetsBaseUrl = 'assets';\n\n    private config = inject<EuiConfig>(EUI_CONFIG_TOKEN, { optional: true })!;\n\n    ngOnInit(): void {\n        const assetsBaseUrl = this.config?.appConfig?.global?.eui?.assetsBaseUrl;\n        if (assetsBaseUrl) {\n            this.assetsBaseUrl = assetsBaseUrl;\n        }\n    }\n}\n","@if (isLoading()) {\n    <span class=\"eds-icon-spinner\" aria-hidden=\"true\"></span>\n} @else {\n    <svg\n        class=\"eds-icon-svg eds-sprite-{{iconName()}} eds-icon-set-{{resolvedSet()}}\"\n        aria-hidden=\"true\">\n        <use [attr.href]=\"assetsBaseUrl + '/eds/icons/sprites/' + resolvedSet() + '.svg#' + iconName()\"></use>\n    </svg>\n}\n<ng-content />\n","import {\n    ChangeDetectionStrategy,\n    Component,\n    OnInit,\n    inject,\n    booleanAttribute,\n    input,\n} from '@angular/core';\nimport { EUI_CONFIG_TOKEN } from '@eui/core';\nimport { EuiConfig } from '@eui/core';\nimport { EdsIconSize } from './eds-icon';\n\n/**\n * @description\n * Displays a raster/vector image as an icon from a direct URL, bypassing sprite-set resolution.\n * Sized via the `size` string input reflected as a host attribute.\n *\n * @usageNotes\n * ```html\n * <eds-icon-image iconUrl=\"/assets/custom-icon.svg\" size=\"l\" ariaLabel=\"Custom icon\" />\n * ```\n */\n@Component({\n    selector: 'eds-icon-image, span[edsIconImage]',\n    templateUrl: './eds-icon-image.html',\n    styleUrls: ['./eds-icon-image.scss'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {\n        '[attr.size]': 'size()',\n        '[attr.role]': 'ariaHidden() ? null : \"img\"',\n        '[attr.aria-label]': 'ariaLabel() || null',\n        '[attr.aria-hidden]': 'ariaHidden() || null',\n    },\n})\nexport class EdsIconImage implements OnInit {\n    /**\n     * Direct URL to an SVG icon file, bypassing the icon set resolution.\n     * Useful for loading custom or external icons not in configured icon sets.\n     */\n    iconUrl = input<string>('');\n\n    /**\n     * Size of the icon.\n     * @default 'm'\n     */\n    size = input<EdsIconSize>('m');\n\n    /**\n     * Accessible label for screen readers describing the icon's purpose.\n     */\n    ariaLabel = input<string>('');\n\n    /**\n     * Hides the icon from assistive technologies when purely decorative.\n     * @default true\n     */\n    ariaHidden = input(true, { transform: booleanAttribute });\n\n    public assetsBaseUrl = 'assets';\n\n    private config = inject<EuiConfig>(EUI_CONFIG_TOKEN, { optional: true })!;\n\n    ngOnInit(): void {\n        const assetsBaseUrl = this.config?.appConfig?.global?.eui?.assetsBaseUrl;\n        if (assetsBaseUrl) {\n            this.assetsBaseUrl = assetsBaseUrl;\n        }\n    }\n}\n","<svg class=\"eds-icon-svg-image\" aria-hidden=\"true\" role=\"img\">\n    <image [attr.href]=\"iconUrl()\" class=\"eds-icon-svg-image\"></image>\n</svg>\n","import { EdsIcon } from './eds-icon';\nimport { EdsIconImage } from './eds-icon-image';\n\nexport * from './eds-icon';\nexport * from './eds-icon-image';\n\nexport const EDS_ICON = [\n    EdsIcon,\n    EdsIconImage,\n] as const;\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"eui-eds-eds-icon.mjs","sources":["../../eds-icon/eds-icon.ts","../../eds-icon/eds-icon.html","../../eds-icon/eds-icon-image.ts","../../eds-icon/eds-icon-image.html","../../eds-icon/index.ts","../../eds-icon/eui-eds-eds-icon.ts"],"sourcesContent":["import {\n    ChangeDetectionStrategy,\n    Component,\n    OnInit,\n    inject,\n    computed,\n    booleanAttribute,\n    input,\n} from '@angular/core';\nimport { EUI_CONFIG_TOKEN } from '@eui/core';\nimport { EuiConfig } from '@eui/core';\n\n/**\n * Local narrowed color union — the icon's color contract.\n * Maps the legacy `EdsColorDirective` semantic booleans to EDS semantic colors.\n */\nexport type EdsIconColor =\n    | 'neutral'\n    | 'neutral-subtle'\n    | 'neutral-subtler'\n    | 'primary'\n    | 'highlight'\n    | 'info'\n    | 'success'\n    | 'warning'\n    | 'critical'\n    | 'brand'\n    | 'disabled';\n\n/**\n * Local narrowed size union — the icon's size contract.\n */\nexport type EdsIconSize =\n    | '2xs'\n    | 'xs'\n    | 's'\n    | 'm'\n    | 'l'\n    | 'xl'\n    | '2xl'\n    | '3xl'\n    | '4xl';\n\n/**\n * @description\n * Displays a scalable vector icon from a sprite set. Supports semantic color and size via\n * string inputs reflected as host attributes, an optional circular clip, and a loading spinner.\n * Icons resolve from the configured assets path using the `iconName:setName` convention.\n *\n * @usageNotes\n * ```html\n * <eds-icon icon=\"check\" color=\"success\" size=\"m\" />\n * <eds-icon icon=\"warning\" color=\"warning\" size=\"l\" [ariaHidden]=\"false\" ariaLabel=\"Warning\" />\n * <eds-icon icon=\"check:core\" />\n * ```\n */\n@Component({\n    selector: 'eds-icon, span[edsIcon]',\n    templateUrl: './eds-icon.html',\n    styleUrls: ['./eds-icon.scss'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {\n        class: 'eds-icon',\n        '[attr.color]': 'color()',\n        '[attr.size]': 'size()',\n        '[attr.rounded]': 'rounded() || null',\n        '[attr.loading]': 'isLoading() || null',\n        '[attr.role]': 'ariaHidden() ? null : \"img\"',\n        '[attr.aria-label]': 'ariaLabel() || null',\n        '[attr.aria-hidden]': 'ariaHidden() || null',\n    },\n})\nexport class EdsIcon implements OnInit {\n    /**\n     * Name of the icon to display, optionally including the icon set using 'iconName:setName' format.\n     * When format includes colon separator, automatically splits into icon and set properties.\n     */\n    icon = input<string>('');\n\n    /**\n     * Icon set library to load the icon from.\n     * @default 'regular'\n     */\n    set = input('regular');\n\n    /**\n     * Semantic color of the icon.\n     * @default 'neutral'\n     */\n    color = input<EdsIconColor>('neutral');\n\n    /**\n     * Size of the icon.\n     * @default 'm'\n     */\n    size = input<EdsIconSize>('m');\n\n    /**\n     * Accessible label for screen readers describing the icon's purpose.\n     */\n    ariaLabel = input<string>('');\n\n    /**\n     * Hides the icon from assistive technologies when purely decorative.\n     * @default true\n     */\n    ariaHidden = input(true, { transform: booleanAttribute });\n\n    /**\n     * Applies a circular clip (border-radius: 50%) to the icon, useful for flag icons.\n     * @default false\n     */\n    rounded = input(false, { transform: booleanAttribute });\n\n    /**\n     * When true, replaces the icon with a spinning loading indicator.\n     * The spinner inherits the icon's size and color.\n     * @default false\n     */\n    isLoading = input(false, { transform: booleanAttribute });\n\n    /** Resolved icon name (parsed from 'icon:set' format). */\n    iconName = computed(() => {\n        const raw = this.icon();\n        if (raw && raw.indexOf(':') > -1) {\n            return raw.split(':')[0];\n        }\n        return raw;\n    });\n\n    /** Resolved icon set (parsed from 'icon:set' format or defaults to set input). */\n    resolvedSet = computed(() => {\n        const raw = this.icon();\n        if (raw && raw.indexOf(':') > -1) {\n            return raw.split(':')[1] || 'regular';\n        }\n        return this.set() || 'regular';\n    });\n\n    public assetsBaseUrl = 'assets';\n\n    private config = inject<EuiConfig>(EUI_CONFIG_TOKEN, { optional: true })!;\n\n    ngOnInit(): void {\n        const assetsBaseUrl = this.config?.appConfig?.global?.eui?.assetsBaseUrl;\n        if (assetsBaseUrl) {\n            this.assetsBaseUrl = assetsBaseUrl;\n        }\n    }\n}\n","@if (isLoading()) {\n    <span class=\"eds-icon-spinner\" aria-hidden=\"true\"></span>\n} @else {\n    <svg\n        class=\"eds-icon-svg eds-sprite-{{iconName()}} eds-icon-set-{{resolvedSet()}}\"\n        aria-hidden=\"true\">\n        <use [attr.href]=\"assetsBaseUrl + '/eds/icons/sprites/' + resolvedSet() + '.svg#' + iconName()\"></use>\n    </svg>\n}\n<ng-content />\n","import {\n    ChangeDetectionStrategy,\n    Component,\n    OnInit,\n    inject,\n    booleanAttribute,\n    input,\n} from '@angular/core';\nimport { EUI_CONFIG_TOKEN } from '@eui/core';\nimport { EuiConfig } from '@eui/core';\nimport { EdsIconSize } from './eds-icon';\n\n/**\n * @description\n * Displays a raster/vector image as an icon from a direct URL, bypassing sprite-set resolution.\n * Sized via the `size` string input reflected as a host attribute.\n *\n * @usageNotes\n * ```html\n * <eds-icon-image iconUrl=\"/assets/custom-icon.svg\" size=\"l\" ariaLabel=\"Custom icon\" />\n * ```\n */\n@Component({\n    selector: 'eds-icon-image, span[edsIconImage]',\n    templateUrl: './eds-icon-image.html',\n    styleUrls: ['./eds-icon-image.scss'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {\n        '[attr.size]': 'size()',\n        '[attr.role]': 'ariaHidden() ? null : \"img\"',\n        '[attr.aria-label]': 'ariaLabel() || null',\n        '[attr.aria-hidden]': 'ariaHidden() || null',\n    },\n})\nexport class EdsIconImage implements OnInit {\n    /**\n     * Direct URL to an SVG icon file, bypassing the icon set resolution.\n     * Useful for loading custom or external icons not in configured icon sets.\n     */\n    iconUrl = input<string>('');\n\n    /**\n     * Size of the icon.\n     * @default 'm'\n     */\n    size = input<EdsIconSize>('m');\n\n    /**\n     * Accessible label for screen readers describing the icon's purpose.\n     */\n    ariaLabel = input<string>('');\n\n    /**\n     * Hides the icon from assistive technologies when purely decorative.\n     * @default true\n     */\n    ariaHidden = input(true, { transform: booleanAttribute });\n\n    public assetsBaseUrl = 'assets';\n\n    private config = inject<EuiConfig>(EUI_CONFIG_TOKEN, { optional: true })!;\n\n    ngOnInit(): void {\n        const assetsBaseUrl = this.config?.appConfig?.global?.eui?.assetsBaseUrl;\n        if (assetsBaseUrl) {\n            this.assetsBaseUrl = assetsBaseUrl;\n        }\n    }\n}\n","<svg class=\"eds-icon-svg-image\" aria-hidden=\"true\" role=\"img\">\n    <image [attr.href]=\"iconUrl()\" class=\"eds-icon-svg-image\"></image>\n</svg>\n","import { EdsIcon } from './eds-icon';\nimport { EdsIconImage } from './eds-icon-image';\n\nexport * from './eds-icon';\nexport * from './eds-icon-image';\n\nexport const EDS_ICON = [\n    EdsIcon,\n    EdsIconImage,\n] as const;\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eui/eds",
-  "version": "22.0.0-alpha.20",
+  "version": "22.0.0-alpha.21",
   "tag": "next",
   "description": "eUI EDS components package",
   "homepage": "https://eui.ecdevops.eu",