npm - @eui/eds - Versions diffs - 22.0.0-alpha.43 → 22.0.0-alpha.44 - Mend

@eui/eds 22.0.0-alpha.43 → 22.0.0-alpha.44

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (16) hide show

package/docs/changelog.html +13 -0
package/docs/components/EdsInputButton.html +28 -3
package/docs/js/search/search_index.js +2 -2
package/docs/json/EdsInputButton.md +13 -2
package/docs/json/documentation.json +109 -23
package/docs/llms.txt +2 -2
package/docs/properties.html +1 -1
package/fesm2022/eui-eds-eds-avatar.mjs +6 -6
package/fesm2022/eui-eds-eds-avatar.mjs.map +1 -1
package/fesm2022/eui-eds-eds-badge.mjs +2 -2
package/fesm2022/eui-eds-eds-badge.mjs.map +1 -1
package/fesm2022/eui-eds-eds-input-button.mjs +128 -6
package/fesm2022/eui-eds-eds-input-button.mjs.map +1 -1
package/package.json +1 -1
package/types/eui-eds-eds-input-button.d.ts +52 -2
package/types/eui-eds-eds-input-button.d.ts.map +1 -1

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

	@@ -1 +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":";;;;;MAYa,cAAc,CAAA;AAV3B,IAAA,WAAA,GAAA;AAWI;;;AAGG;QACH,IAAA,CAAA,gBAAgB,GAAG,KAAK,CAAC,KAAK,wFAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AACnE,IAAA;8GANY,cAAc,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAd,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,cAAc,6WARb,eAAe,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,ofAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAQhB,cAAc,EAAA,UAAA,EAAA,CAAA;kBAV1B,SAAS;+BACI,kBAAkB,EAAA,QAAA,EAClB,eAAe,EAAA,IAAA,EAEnB;AACF,wBAAA,KAAK,EAAE,kBAAkB;AACzB,wBAAA,iBAAiB,EAAE,uCAAuC;qBAC7D,EAAA,eAAA,EACgB,uBAAuB,CAAC,MAAM,EAAA,MAAA,EAAA,CAAA,ofAAA,CAAA,EAAA;;;MCCtC,aAAa,CAAA;8GAAb,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAb,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,aAAa,wHAPZ,eAAe,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,8BAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAOhB,aAAa,EAAA,UAAA,EAAA,CAAA;kBATzB,SAAS;+BACI,iBAAiB,EAAA,QAAA,EACjB,eAAe,EAAA,IAAA,EAEnB;AACF,wBAAA,KAAK,EAAE,iBAAiB;qBAC3B,EAAA,eAAA,EACgB,uBAAuB,CAAC,MAAM,EAAA,MAAA,EAAA,CAAA,8BAAA,CAAA,EAAA;;;MCOtC,cAAc,CAAA;AAb3B,IAAA,WAAA,GAAA;AAcI;;;AAGG;QACH,IAAA,CAAA,QAAQ,GAAG,KAAK,CAAS,EAAE;qFAAC;;QAGlB,IAAA,CAAA,SAAS,GAAG,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,EAAE;sFAAC;AAEtD;;;AAGG;QACI,IAAA,CAAA,iBAAiB,GAAG,QAAQ;AACtC,IAAA;8GAfY,cAAc,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAd,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,cAAc,8TChB3B,wMAOA,EAAA,MAAA,EAAA,CAAA,gdAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,yBAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,MAAA,EAAA,WAAA,EAAA,YAAA,EAAA,SAAA,EAAA,WAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FDSa,cAAc,EAAA,UAAA,EAAA,CAAA;kBAb1B,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,kBAAkB,EAAA,OAAA,EAGnB;AACL,wBAAA,GAAG,QAAQ;qBACd,EAAA,IAAA,EACK;AACF,wBAAA,KAAK,EAAE,kBAAkB;AACzB,wBAAA,gBAAgB,EAAE,qBAAqB;qBAC1C,EAAA,eAAA,EACgB,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,wMAAA,EAAA,MAAA,EAAA,CAAA,gdAAA,CAAA,EAAA;;;MEHtC,gBAAgB,CAAA;8GAAhB,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAhB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,gBAAgB,8HCX7B,yGACkD,EAAA,MAAA,EAAA,CAAA,yDAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FDUrC,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAT5B,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,oBAAoB,EAAA,IAAA,EAGxB;AACF,wBAAA,KAAK,EAAE,oBAAoB;qBAC9B,EAAA,eAAA,EACgB,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,yGAAA,EAAA,MAAA,EAAA,CAAA,yDAAA,CAAA,EAAA;;;MEEtC,wBAAwB,CAAA;8GAAxB,wBAAwB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAxB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,wBAAwB,gJAPvB,gBAAgB,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,oDAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAOjB,wBAAwB,EAAA,UAAA,EAAA,CAAA;kBATpC,SAAS;+BACI,6BAA6B,EAAA,QAAA,EAC7B,gBAAgB,EAAA,IAAA,EAEpB;AACF,wBAAA,KAAK,EAAE,6BAA6B;qBACvC,EAAA,eAAA,EACgB,uBAAuB,CAAC,MAAM,EAAA,MAAA,EAAA,CAAA,oDAAA,CAAA,EAAA;;;MCEtC,qBAAqB,CAAA;8GAArB,qBAAqB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAArB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,qBAAqB,0IAPpB,gBAAgB,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,wFAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAOjB,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBATjC,SAAS;+BACI,0BAA0B,EAAA,QAAA,EAC1B,gBAAgB,EAAA,IAAA,EAEpB;AACF,wBAAA,KAAK,EAAE,0BAA0B;qBACpC,EAAA,eAAA,EACgB,uBAAuB,CAAC,MAAM,EAAA,MAAA,EAAA,CAAA,wFAAA,CAAA,EAAA;;;MCEtC,aAAa,CAAA;8GAAb,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAb,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,aAAa,wHAPZ,eAAe,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,2dAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAOhB,aAAa,EAAA,UAAA,EAAA,CAAA;kBATzB,SAAS;+BACI,iBAAiB,EAAA,QAAA,EACjB,eAAe,EAAA,IAAA,EAEnB;AACF,wBAAA,KAAK,EAAE,iBAAiB;qBAC3B,EAAA,eAAA,EACgB,uBAAuB,CAAC,MAAM,EAAA,MAAA,EAAA,CAAA,2dAAA,CAAA,EAAA;;;MCEtC,aAAa,CAAA;8GAAb,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAb,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,aAAa,wHAPZ,eAAe,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,sHAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAOhB,aAAa,EAAA,UAAA,EAAA,CAAA;kBATzB,SAAS;+BACI,iBAAiB,EAAA,QAAA,EACjB,eAAe,EAAA,IAAA,EAEnB;AACF,wBAAA,KAAK,EAAE,iBAAiB;qBAC3B,EAAA,eAAA,EACgB,uBAAuB,CAAC,MAAM,EAAA,MAAA,EAAA,CAAA,sHAAA,CAAA,EAAA;;;MCctC,SAAS,CAAA;AAftB,IAAA,WAAA,GAAA;AAgBI;;;AAGG;QACH,IAAA,CAAA,OAAO,GAAG,KAAK,CAAC,YAAY;oFAAC;AAE7B;;;AAGG;QACH,IAAA,CAAA,IAAI,GAAG,KAAK,CAAgB,GAAG;iFAAC;AAEhC;;;;;AAKG;QACH,IAAA,CAAA,SAAS,GAAG,KAAK,CAAgB,IAAI,iFAAI,KAAK,EAAE,YAAY,EAAA,CAAG;AAE/D;;;;AAIG;QACH,IAAA,CAAA,KAAK,GAAG,KAAK,CAAS,EAAE;kFAAC;;QAGf,IAAA,CAAA,WAAW,GAAG,YAAY,CAAC,cAAc;wFAAC;;QAG1C,IAAA,CAAA,QAAQ,GAAG,QAAQ,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,WAAW,EAAE;qFAAC;AAC5D,IAAA;8GAjCY,SAAS,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;kGAAT,SAAS,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,6CAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,YAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,MAAA,EAAA,KAAA,EAAA,EAAA,UAAA,EAAA,EAAA,WAAA,EAAA,QAAA,EAAA,YAAA,EAAA,iBAAA,EAAA,YAAA,EAAA,oBAAA,EAAA,eAAA,EAAA,WAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,EAAA,cAAA,EAAA,YAAA,EAAA,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,aAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EA6BmB,cAAc,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECpDvD,uRAQA,EAAA,MAAA,EAAA,CAAA,6xGAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FDea,SAAS,EAAA,UAAA,EAAA,CAAA;kBAfrB,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,6CAA6C,EAAA,eAAA,EAGtC,uBAAuB,CAAC,MAAM,EAAA,IAAA,EACzC;AACF,wBAAA,KAAK,EAAE,YAAY;AACnB,wBAAA,IAAI,EAAE,KAAK;AACX,wBAAA,aAAa,EAAE,QAAQ;AACvB,wBAAA,cAAc,EAAE,iBAAiB;AACjC,wBAAA,cAAc,EAAE,oBAAoB;AACpC,wBAAA,iBAAiB,EAAE,WAAW;AAC9B,wBAAA,mBAAmB,EAAE,aAAa;AACrC,qBAAA,EAAA,QAAA,EAAA,uRAAA,EAAA,MAAA,EAAA,CAAA,6xGAAA,CAAA,EAAA;mdA+BoC,cAAc,CAAA,EAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,EAAA,CAAA;;AEhChD,MAAM,UAAU,GAAG;IAClB,SAAS;IACT,aAAa;IACb,aAAa;IACb,cAAc;IACd,cAAc;IACd,aAAa;IACb,gBAAgB;IAChB,qBAAqB;IACrB,wBAAwB;;;AC7BhC;;AAEG;;;;"}
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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"}

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

@@ -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-m);--_eds-badge-font-weight: var(--eds-f-w-regular);--_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);font-weight:var(--_eds-badge-font-weight);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=light][color=primary]){--_eds-badge-surface: var(--eds-c-surface-primary-subtler);--_eds-badge-on-surface: var(--eds-c-on-surface-primary-subtler);--_eds-badge-border-color: var(--eds-c-border-primary-subtler)}:host([variant=light][color=neutral]){--_eds-badge-surface: var(--eds-c-surface-neutral-subtler);--_eds-badge-on-surface: var(--eds-c-on-surface-neutral-subtler);--_eds-badge-border-color: var(--eds-c-border-neutral-subtler)}:host([variant=light][color=success]){--_eds-badge-surface: var(--eds-c-surface-success-subtler);--_eds-badge-on-surface: var(--eds-c-on-surface-success-subtler);--_eds-badge-border-color: var(--eds-c-border-success-subtler)}:host([variant=light][color=info]){--_eds-badge-surface: var(--eds-c-surface-info-subtler);--_eds-badge-on-surface: var(--eds-c-on-surface-info-subtler);--_eds-badge-border-color: var(--eds-c-border-info-subtler)}:host([variant=light][color=warning]){--_eds-badge-surface: var(--eds-c-surface-warning-subtler);--_eds-badge-on-surface: var(--eds-c-on-surface-warning-subtler);--_eds-badge-border-color: var(--eds-c-border-warning-subtler)}:host([variant=light][color=critical]){--_eds-badge-surface: var(--eds-c-surface-critical-subtler);--_eds-badge-on-surface: var(--eds-c-on-surface-critical-subtler);--_eds-badge-border-color: var(--eds-c-border-critical-subtler)}:host([size=xs]){--_eds-badge-height: var(--eds-sp-s);--_eds-badge-min-width: var(--eds-sp-s);--_eds-badge-font: var(--eds-f-supportive-m);--_eds-badge-font-weight: var(--eds-f-w-regular);--_eds-badge-empty-size: var(--eds-sp-2xs)}:host([size=s]){--_eds-badge-height: var(--eds-sp-m);--_eds-badge-min-width: var(--eds-sp-m);--_eds-badge-font: var(--eds-f-supportive-m);--_eds-badge-font-weight: var(--eds-f-w-regular)}:host([size=l]){--_eds-badge-height: calc(var(--eds-sp-m) + var(--eds-sp-2xs));--_eds-badge-min-width: calc(var(--eds-sp-m) + var(--eds-sp-2xs));--_eds-badge-font: var(--eds-f-microcopy-m);--_eds-badge-font-weight: var(--eds-f-w-regular);--_eds-badge-empty-size: var(--eds-sp-m)}: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-m);--_eds-badge-font-weight: var(--eds-f-w-regular);--_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);font-weight:var(--_eds-badge-font-weight);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=light][color=primary]){--_eds-badge-surface: var(--eds-c-surface-primary-subtler);--_eds-badge-on-surface: var(--eds-c-on-surface-primary-subtler);--_eds-badge-border-color: var(--eds-c-border-primary-subtler)}:host([variant=light][color=neutral]){--_eds-badge-surface: var(--eds-c-surface-neutral-subtler);--_eds-badge-on-surface: var(--eds-c-on-surface-neutral-subtler);--_eds-badge-border-color: var(--eds-c-border-neutral-subtler)}:host([variant=light][color=success]){--_eds-badge-surface: var(--eds-c-surface-success-subtler);--_eds-badge-on-surface: var(--eds-c-on-surface-success-subtler);--_eds-badge-border-color: var(--eds-c-border-success-subtler)}:host([variant=light][color=info]){--_eds-badge-surface: var(--eds-c-surface-info-subtler);--_eds-badge-on-surface: var(--eds-c-on-surface-info-subtler);--_eds-badge-border-color: var(--eds-c-border-info-subtler)}:host([variant=light][color=warning]){--_eds-badge-surface: var(--eds-c-surface-warning-subtler);--_eds-badge-on-surface: var(--eds-c-on-surface-warning-subtler);--_eds-badge-border-color: var(--eds-c-border-warning-subtler)}:host([variant=light][color=critical]){--_eds-badge-surface: var(--eds-c-surface-critical-subtler);--_eds-badge-on-surface: var(--eds-c-on-surface-critical-subtler);--_eds-badge-border-color: var(--eds-c-border-critical-subtler)}:host([size=xs]){--_eds-badge-height: var(--eds-sp-s);--_eds-badge-min-width: var(--eds-sp-s);--_eds-badge-font: var(--eds-f-supportive-m);--_eds-badge-font-weight: var(--eds-f-w-regular);--_eds-badge-empty-size: var(--eds-sp-2xs)}:host([size=s]){--_eds-badge-height: var(--eds-sp-m);--_eds-badge-min-width: var(--eds-sp-m);--_eds-badge-font: var(--eds-f-supportive-m);--_eds-badge-font-weight: var(--eds-f-w-regular)}:host([size=l]){--_eds-badge-height: calc(var(--eds-sp-m) + var(--eds-sp-2xs));--_eds-badge-min-width: calc(var(--eds-sp-m) + var(--eds-sp-2xs));--_eds-badge-font: var(--eds-f-microcopy-m);--_eds-badge-font-weight: var(--eds-f-w-regular);--_eds-badge-empty-size: var(--eds-sp-m)}: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){box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;width:var(--_eds-avatar-badge-size);min-width:var(--_eds-avatar-badge-size);height:var(--_eds-avatar-badge-size);padding:0;border:var(--_eds-avatar-badge-ring-width, var(--eds-bw-s)) solid var(--eds-c-border-inverted);--_icon-size: var(--_eds-avatar-badge-icon-size)}:host-context(.eds-avatar) .eds-badge__wrapper{display:flex;flex:1 1 auto;align-items:center;justify-content:center;width:100%;min-width:0;height:100%;padding:0;line-height:0}\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-m);--_eds-badge-font-weight: var(--eds-f-w-regular);--_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);font-weight:var(--_eds-badge-font-weight);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=light][color=primary]){--_eds-badge-surface: var(--eds-c-surface-primary-subtler);--_eds-badge-on-surface: var(--eds-c-on-surface-primary-subtler);--_eds-badge-border-color: var(--eds-c-border-primary-subtler)}:host([variant=light][color=neutral]){--_eds-badge-surface: var(--eds-c-surface-neutral-subtler);--_eds-badge-on-surface: var(--eds-c-on-surface-neutral-subtler);--_eds-badge-border-color: var(--eds-c-border-neutral-subtler)}:host([variant=light][color=success]){--_eds-badge-surface: var(--eds-c-surface-success-subtler);--_eds-badge-on-surface: var(--eds-c-on-surface-success-subtler);--_eds-badge-border-color: var(--eds-c-border-success-subtler)}:host([variant=light][color=info]){--_eds-badge-surface: var(--eds-c-surface-info-subtler);--_eds-badge-on-surface: var(--eds-c-on-surface-info-subtler);--_eds-badge-border-color: var(--eds-c-border-info-subtler)}:host([variant=light][color=warning]){--_eds-badge-surface: var(--eds-c-surface-warning-subtler);--_eds-badge-on-surface: var(--eds-c-on-surface-warning-subtler);--_eds-badge-border-color: var(--eds-c-border-warning-subtler)}:host([variant=light][color=critical]){--_eds-badge-surface: var(--eds-c-surface-critical-subtler);--_eds-badge-on-surface: var(--eds-c-on-surface-critical-subtler);--_eds-badge-border-color: var(--eds-c-border-critical-subtler)}:host([size=xs]){--_eds-badge-height: var(--eds-sp-s);--_eds-badge-min-width: var(--eds-sp-s);--_eds-badge-font: var(--eds-f-supportive-m);--_eds-badge-font-weight: var(--eds-f-w-regular);--_eds-badge-empty-size: var(--eds-sp-2xs)}:host([size=s]){--_eds-badge-height: var(--eds-sp-m);--_eds-badge-min-width: var(--eds-sp-m);--_eds-badge-font: var(--eds-f-supportive-m);--_eds-badge-font-weight: var(--eds-f-w-regular)}:host([size=l]){--_eds-badge-height: calc(var(--eds-sp-m) + var(--eds-sp-2xs));--_eds-badge-min-width: calc(var(--eds-sp-m) + var(--eds-sp-2xs));--_eds-badge-font: var(--eds-f-microcopy-m);--_eds-badge-font-weight: var(--eds-f-w-regular);--_eds-badge-empty-size: var(--eds-sp-m)}: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-m);--_eds-badge-font-weight: var(--eds-f-w-regular);--_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);font-weight:var(--_eds-badge-font-weight);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=light][color=primary]){--_eds-badge-surface: var(--eds-c-surface-primary-subtler);--_eds-badge-on-surface: var(--eds-c-on-surface-primary-subtler);--_eds-badge-border-color: var(--eds-c-border-primary-subtler)}:host([variant=light][color=neutral]){--_eds-badge-surface: var(--eds-c-surface-neutral-subtler);--_eds-badge-on-surface: var(--eds-c-on-surface-neutral-subtler);--_eds-badge-border-color: var(--eds-c-border-neutral-subtler)}:host([variant=light][color=success]){--_eds-badge-surface: var(--eds-c-surface-success-subtler);--_eds-badge-on-surface: var(--eds-c-on-surface-success-subtler);--_eds-badge-border-color: var(--eds-c-border-success-subtler)}:host([variant=light][color=info]){--_eds-badge-surface: var(--eds-c-surface-info-subtler);--_eds-badge-on-surface: var(--eds-c-on-surface-info-subtler);--_eds-badge-border-color: var(--eds-c-border-info-subtler)}:host([variant=light][color=warning]){--_eds-badge-surface: var(--eds-c-surface-warning-subtler);--_eds-badge-on-surface: var(--eds-c-on-surface-warning-subtler);--_eds-badge-border-color: var(--eds-c-border-warning-subtler)}:host([variant=light][color=critical]){--_eds-badge-surface: var(--eds-c-surface-critical-subtler);--_eds-badge-on-surface: var(--eds-c-on-surface-critical-subtler);--_eds-badge-border-color: var(--eds-c-border-critical-subtler)}:host([size=xs]){--_eds-badge-height: var(--eds-sp-s);--_eds-badge-min-width: var(--eds-sp-s);--_eds-badge-font: var(--eds-f-supportive-m);--_eds-badge-font-weight: var(--eds-f-w-regular);--_eds-badge-empty-size: var(--eds-sp-2xs)}:host([size=s]){--_eds-badge-height: var(--eds-sp-m);--_eds-badge-min-width: var(--eds-sp-m);--_eds-badge-font: var(--eds-f-supportive-m);--_eds-badge-font-weight: var(--eds-f-w-regular)}:host([size=l]){--_eds-badge-height: calc(var(--eds-sp-m) + var(--eds-sp-2xs));--_eds-badge-min-width: calc(var(--eds-sp-m) + var(--eds-sp-2xs));--_eds-badge-font: var(--eds-f-microcopy-m);--_eds-badge-font-weight: var(--eds-f-w-regular);--_eds-badge-empty-size: var(--eds-sp-m)}: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){box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;width:var(--_eds-avatar-badge-size);min-width:var(--_eds-avatar-badge-size);height:var(--_eds-avatar-badge-size);padding:0;border:var(--_eds-avatar-badge-ring-width, var(--eds-bw-s)) solid var(--eds-c-border-inverted);--_icon-size: var(--_eds-avatar-badge-icon-size)}:host-context(.eds-avatar) .eds-badge__wrapper{display:flex;flex:1 1 auto;align-items:center;justify-content:center;width:100%;min-width:0;height:100%;padding:0;line-height:0}\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 CHANGED Viewed

	@@ -1 +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' \| 'light';\nexport type EdsBadgeSize = 'xs' \| 's' \| 'm' \| 'l';\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=\"light\">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; `light`\n * uses a subtle semantic surface with a matching subtler foreground.\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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~~0hKAAA~~,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDkDc,eAAe,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,iBAAA,EAAA,QAAA,EAAA,qBAAA,EAAA,MAAA,EAAA,CAAA,2BAAA,EAAA,UAAA,CAAA,EAAA,OAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAYhB,QAAQ,EAAA,UAAA,EAAA,CAAA;kBAjBpB,SAAS;+BACI,2BAA2B,EAAA,eAAA,EAGpB,uBAAuB,CAAC,MAAM,WACtC,CAAC,eAAe,CAAC,EAAA,IAAA,EACpB;AACF,wBAAA,IAAI,EAAE,QAAQ;AACd,wBAAA,cAAc,EAAE,SAAS;AACzB,wBAAA,gBAAgB,EAAE,WAAW;AAC7B,wBAAA,aAAa,EAAE,QAAQ;AACvB,wBAAA,kBAAkB,EAAE,oBAAoB;AACxC,wBAAA,cAAc,EAAE,mBAAmB;AACnC,wBAAA,iBAAiB,EAAE,WAAW;AAC9B,wBAAA,mBAAmB,EAAE,aAAa;AACrC,qBAAA,EAAA,QAAA,EAAA,mRAAA,EAAA,MAAA,EAAA,CAAA,~~0hKAAA~~,CAAA,EAAA;q2BA8D+D,YAAY,EAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,EAAA,CAAA;;AE/HzE,MAAM,SAAS,GAAG;IACrB,QAAQ;;;ACLZ;;AAEG;;;;"}
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' \| 'light';\nexport type EdsBadgeSize = 'xs' \| 's' \| 'm' \| 'l';\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=\"light\">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; `light`\n * uses a subtle semantic surface with a matching subtler foreground.\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-input-button.mjs CHANGED Viewed

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { input, booleanAttribute, computed, ChangeDetectionStrategy, Component } from '@angular/core';
+import { inject, ElementRef, input, booleanAttribute, computed, signal, afterNextRender, ChangeDetectionStrategy, Component } from '@angular/core';
 /**
  * A layout component that positions button elements relative to input fields.
@@ -23,9 +23,20 @@ import { input, booleanAttribute, computed, ChangeDetectionStrategy, Component }
  * </eds-input-button>
  * ```
  *
+ * ### Focus model (roving tabindex)
+ * - `Tab` moves focus directly onto the input field (the primary control); the
+ *   focus ring covers the whole host (the group). `Tab` again leaves the group.
+ * - `ArrowLeft` / `ArrowRight` rove focus between the group's controls in visual
+ *   order — the input, the clearable "✕" icon (when present), and the button —
+ *   wrapping at the ends; `Home` / `End` jump to the first / last control.
+ * - Only the active control is in the tab order, so `Tab` leaves the group from
+ *   wherever focus currently is. Focusing a child directly (click) adopts it as
+ *   the active roving target.
+ *
  * ### Accessibility
- * - Button and input maintain separate focus states
- * - Ensure button has descriptive label or aria-label
+ * - Single tab stop with arrow-key navigation between the controls
+ * - The clearable icon participates in the arrow-key cycle when it is shown
+ * - Ensure button has a descriptive label or aria-label
  * - Tab order follows visual layout
  *
  * ### Notes
@@ -36,6 +47,7 @@ import { input, booleanAttribute, computed, ChangeDetectionStrategy, Component }
  */
 class EdsInputButton {
     constructor() {
+        this.host = inject(ElementRef);
         /**
          * Data attribute value for end-to-end testing identification.
          * Applied as data-e2e attribute on the host element.
@@ -59,18 +71,128 @@ class EdsInputButton {
          */
         this.position = computed(() => this.edsButtonPositionStart() ? 'start' : 'end', /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "position" }] : /* istanbul ignore next */ []));
+        /** Index (within {@link managedChildren}) of the roving active control. */
+        this.activeIndex = signal(0, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "activeIndex" }] : /* istanbul ignore next */ []));
+        afterNextRender(() => this.resetRovingTabStop());
+    }
+    /**
+     * The group's controls that participate in arrow-key roving, in DOM order:
+     * the projected input/button plus the clearable "✕" icon (a `[tabindex]`
+     * element the eds-input-text clearable directive injects). Disabled and
+     * not-currently-rendered controls (e.g. the hidden clearable icon when the
+     * field is empty) are excluded so the cycle only visits reachable targets.
+     */
+    managedChildren() {
+        const selector = 'input, button, select, textarea, .eds-clearable-icon';
+        return Array.from(this.host.nativeElement.querySelectorAll(selector)).filter((el) => {
+            if (el === this.host.nativeElement || el.hasAttribute('disabled')) {
+                return false;
+            }
+            // Skip controls that are not actually visible/rendered — notably the
+            // clearable icon, which is hidden (visibility:hidden) when empty.
+            if (getComputedStyle(el).visibility === 'hidden') {
+                return false;
+            }
+            return el.offsetParent !== null || getComputedStyle(el).position === 'fixed';
+        });
+    }
+    /**
+     * Index of the primary control that owns the natural tab stop — the input
+     * field (first `input`/`textarea`/`select`), so `Tab` lands directly on it.
+     * Falls back to the first child when there is no input-like control.
+     */
+    primaryIndex() {
+        const children = this.managedChildren();
+        const inputIndex = children.findIndex((el) => /^(input|textarea|select)$/i.test(el.tagName));
+        return inputIndex >= 0 ? inputIndex : 0;
+    }
+    /**
+     * Roving tabindex: the primary (input) control stays in the natural tab
+     * order so `Tab` focuses it directly; every other control is reachable only
+     * via the arrow keys.
+     */
+    resetRovingTabStop() {
+        const primary = this.primaryIndex();
+        this.activeIndex.set(primary);
+        this.managedChildren().forEach((el, index) => el.setAttribute('tabindex', index === primary ? '0' : '-1'));
+    }
+    /**
+     * Track focus entering a projected control so the arrow keys continue from
+     * the control the user is actually on (e.g. after a click), and keep the
+     * roving tab stop in sync so a subsequent `Tab` leaves from here.
+     */
+    onFocusIn(event) {
+        const target = event.target;
+        const index = this.managedChildren().indexOf(target);
+        if (index >= 0) {
+            this.setActive(index);
+        }
+    }
+    onKeydown(event) {
+        const children = this.managedChildren();
+        if (children.length === 0) {
+            return;
+        }
+        switch (event.key) {
+            case 'ArrowRight':
+            case 'ArrowDown':
+                event.preventDefault();
+                this.focusChild(this.nextIndex(1));
+                break;
+            case 'ArrowLeft':
+            case 'ArrowUp':
+                event.preventDefault();
+                this.focusChild(this.nextIndex(-1));
+                break;
+            case 'Home':
+                event.preventDefault();
+                this.focusChild(0);
+                break;
+            case 'End':
+                event.preventDefault();
+                this.focusChild(children.length - 1);
+                break;
+            default:
+                break;
+        }
+    }
+    nextIndex(delta) {
+        const count = this.managedChildren().length;
+        const current = this.activeIndex();
+        return (current + delta + count) % count;
+    }
+    focusChild(index) {
+        const target = this.managedChildren()[index];
+        if (!target) {
+            return;
+        }
+        this.setActive(index);
+        target.focus();
+    }
+    /**
+     * Move the single roving tab stop (`tabindex="0"`) onto the active control
+     * and set every other control to `tabindex="-1"`, so after arrow navigation
+     * `Tab` leaves the group from wherever focus currently is.
+     */
+    setActive(index) {
+        this.activeIndex.set(index);
+        this.managedChildren().forEach((el, i) => el.setAttribute('tabindex', i === index ? '0' : '-1'));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsInputButton, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.2", type: EdsInputButton, isStandalone: true, selector: "eds-input-button", inputs: { e2eAttr: { classPropertyName: "e2eAttr", publicName: "e2eAttr", isSignal: true, isRequired: false, transformFunction: null }, edsButtonPositionStart: { classPropertyName: "edsButtonPositionStart", publicName: "edsButtonPositionStart", isSignal: true, isRequired: false, transformFunction: null }, edsButtonPositionEnd: { classPropertyName: "edsButtonPositionEnd", publicName: "edsButtonPositionEnd", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.position": "position()", "attr.data-e2e": "e2eAttr()" }, classAttribute: "eds-input-button" }, ngImport: i0, template: "<ng-content />\n<ng-content select=\"button\"/>\n", styles: [".eui-21 :host{display:flex;width:100%;border-radius:var(--eds-br-s)}.eui-21 :host ::ng-deep .eds-button{border:var(--eds-bw-xs) solid var(--eds-c-border-neutral);background-color:var(--eds-c-surface-elevation);position:relative}.eui-21 :host([position=start]){flex-direction:row-reverse}.eui-21 :host([position=start]) ::ng-deep .eds-button{border-right:none;border-top-right-radius:0;border-bottom-right-radius:0}.eui-21 :host([position=start]) ::ng-deep .eds-button:after{background-color:var(--eds-c-border-divider);content:\"\";display:block;height:1.75rem;right:-1px;position:absolute;top:var(--eds-sp-2xs);width:1px}.eui-21 :host([position=start]) ::ng-deep .eds-input-text{border-left:none;border-top-left-radius:0;border-bottom-left-radius:0}.eui-21 :host([position=end]) ::ng-deep .eds-button{border-left:none;border-top-left-radius:0;border-bottom-left-radius:0}.eui-21 :host([position=end]) ::ng-deep .eds-button:before{background-color:var(--eds-c-border-divider);content:\"\";display:block;height:1.75rem;left:-1px;position:absolute;top:var(--eds-sp-2xs);width:1px}.eui-21 :host([position=end]) ::ng-deep .eds-input-text{border-right:none;border-top-right-radius:0;border-bottom-right-radius:0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.2", type: EdsInputButton, isStandalone: true, selector: "eds-input-button", inputs: { e2eAttr: { classPropertyName: "e2eAttr", publicName: "e2eAttr", isSignal: true, isRequired: false, transformFunction: null }, edsButtonPositionStart: { classPropertyName: "edsButtonPositionStart", publicName: "edsButtonPositionStart", isSignal: true, isRequired: false, transformFunction: null }, edsButtonPositionEnd: { classPropertyName: "edsButtonPositionEnd", publicName: "edsButtonPositionEnd", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "group" }, listeners: { "focusin": "onFocusIn($event)", "keydown": "onKeydown($event)" }, properties: { "attr.position": "position()", "attr.data-e2e": "e2eAttr()" }, classAttribute: "eds-input-button" }, ngImport: i0, template: "<ng-content />\n<ng-content select=\"button\"/>\n", styles: [".eui-21 :host{display:flex;width:100%;border-radius:var(--eds-br-s);outline:none;position:relative}.eui-21 :host>::ng-deep .eds-input-text,.eui-21 :host>::ng-deep input{flex:1 1 auto;min-width:0;order:1}.eui-21 :host>::ng-deep .eds-button,.eui-21 :host>::ng-deep button{flex:0 0 auto;order:3}.eui-21 :host>::ng-deep div:has(input),.eui-21 :host>::ng-deep div:has(.eds-input-text){flex:1 1 auto!important;width:auto!important;min-width:0;order:1}.eui-21 :host>::ng-deep div:not(:has(input)):not(:has(.eds-input-text)){flex:0 0 0!important;width:0!important;min-width:0;order:2}.eui-21 :host:focus-within{outline:var(--eds-bw-s) solid var(--eds-c-border-focus);outline-offset:var(--eds-bw-s)}.eui-21 :host:focus-within ::ng-deep .eds-input-text:focus-visible:not([readonly]),.eui-21 :host:focus-within ::ng-deep .eds-input-text:focus:not([readonly]),.eui-21 :host:focus-within ::ng-deep input:focus-visible{outline:none!important;outline-offset:0!important;box-shadow:none!important}.eui-21 :host:focus-within ::ng-deep .eds-button:focus-visible,.eui-21 :host:focus-within ::ng-deep .eds-button:focus,.eui-21 :host:focus-within ::ng-deep .eds-icon-button:focus-visible,.eui-21 :host:focus-within ::ng-deep .eds-icon-button:focus{outline:var(--eds-bw-s) solid var(--eds-c-border-focus)!important;outline-offset:calc(-1 * var(--eds-bw-s))!important}.eui-21 :host:focus-within:has(input[invalid]),.eui-21 :host:focus-within:has(.eds-input-text[invalid]){outline-color:var(--eds-c-focus-critical)}.eui-21 :host:focus-within:has(input[invalid]) ::ng-deep .eds-button:focus-visible,.eui-21 :host:focus-within:has(input[invalid]) ::ng-deep .eds-button:focus,.eui-21 :host:focus-within:has(input[invalid]) ::ng-deep .eds-icon-button:focus-visible,.eui-21 :host:focus-within:has(input[invalid]) ::ng-deep .eds-icon-button:focus,.eui-21 :host:focus-within:has(.eds-input-text[invalid]) ::ng-deep .eds-button:focus-visible,.eui-21 :host:focus-within:has(.eds-input-text[invalid]) ::ng-deep .eds-button:focus,.eui-21 :host:focus-within:has(.eds-input-text[invalid]) ::ng-deep .eds-icon-button:focus-visible,.eui-21 :host:focus-within:has(.eds-input-text[invalid]) ::ng-deep .eds-icon-button:focus{outline-color:var(--eds-c-focus-critical)!important}.eui-21 :host ::ng-deep .eds-button{border:var(--eds-bw-xs) solid var(--eds-c-border-neutral);background-color:var(--eds-c-surface-elevation)!important;position:relative}.eui-21 :host([invalid]):focus-within{outline-color:var(--eds-c-focus-critical)}.eui-21 :host([invalid]):focus-within ::ng-deep .eds-button:focus-visible,.eui-21 :host([invalid]):focus-within ::ng-deep .eds-button:focus,.eui-21 :host([invalid]):focus-within ::ng-deep .eds-icon-button:focus-visible,.eui-21 :host([invalid]):focus-within ::ng-deep .eds-icon-button:focus{outline-color:var(--eds-c-focus-critical)!important}.eui-21 :host([position=start]){flex-direction:row-reverse}.eui-21 :host([position=start]) ::ng-deep .eds-button{border-right:none;border-top-right-radius:0;border-bottom-right-radius:0}.eui-21 :host([position=start]) ::ng-deep .eds-button:after{background-color:var(--eds-c-border-divider);content:\"\";display:block;height:1.75rem;right:-1px;position:absolute;top:var(--eds-sp-2xs);width:1px}.eui-21 :host([position=start]) ::ng-deep .eds-input-text{border-left:none;border-top-left-radius:0;border-bottom-left-radius:0}.eui-21 :host([position=end]) ::ng-deep .eds-button{border-left:none;border-top-left-radius:0;border-bottom-left-radius:0}.eui-21 :host([position=end]) ::ng-deep .eds-button:before{background-color:var(--eds-c-border-divider);content:\"\";display:block;height:1.75rem;left:-1px;position:absolute;top:var(--eds-sp-2xs);width:1px}.eui-21 :host([position=end]) ::ng-deep .eds-input-text{border-right:none;border-top-right-radius:0;border-bottom-right-radius:0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsInputButton, decorators: [{
             type: Component,
             args: [{ selector: 'eds-input-button', changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: 'eds-input-button',
+                        role: 'group',
                         '[attr.position]': 'position()',
                         '[attr.data-e2e]': 'e2eAttr()',
-                    }, template: "<ng-content />\n<ng-content select=\"button\"/>\n", styles: [".eui-21 :host{display:flex;width:100%;border-radius:var(--eds-br-s)}.eui-21 :host ::ng-deep .eds-button{border:var(--eds-bw-xs) solid var(--eds-c-border-neutral);background-color:var(--eds-c-surface-elevation);position:relative}.eui-21 :host([position=start]){flex-direction:row-reverse}.eui-21 :host([position=start]) ::ng-deep .eds-button{border-right:none;border-top-right-radius:0;border-bottom-right-radius:0}.eui-21 :host([position=start]) ::ng-deep .eds-button:after{background-color:var(--eds-c-border-divider);content:\"\";display:block;height:1.75rem;right:-1px;position:absolute;top:var(--eds-sp-2xs);width:1px}.eui-21 :host([position=start]) ::ng-deep .eds-input-text{border-left:none;border-top-left-radius:0;border-bottom-left-radius:0}.eui-21 :host([position=end]) ::ng-deep .eds-button{border-left:none;border-top-left-radius:0;border-bottom-left-radius:0}.eui-21 :host([position=end]) ::ng-deep .eds-button:before{background-color:var(--eds-c-border-divider);content:\"\";display:block;height:1.75rem;left:-1px;position:absolute;top:var(--eds-sp-2xs);width:1px}.eui-21 :host([position=end]) ::ng-deep .eds-input-text{border-right:none;border-top-right-radius:0;border-bottom-right-radius:0}\n"] }]
-        }], propDecorators: { e2eAttr: [{ type: i0.Input, args: [{ isSignal: true, alias: "e2eAttr", required: false }] }], edsButtonPositionStart: [{ type: i0.Input, args: [{ isSignal: true, alias: "edsButtonPositionStart", required: false }] }], edsButtonPositionEnd: [{ type: i0.Input, args: [{ isSignal: true, alias: "edsButtonPositionEnd", required: false }] }] } });
+                        '(focusin)': 'onFocusIn($event)',
+                        '(keydown)': 'onKeydown($event)',
+                    }, template: "<ng-content />\n<ng-content select=\"button\"/>\n", styles: [".eui-21 :host{display:flex;width:100%;border-radius:var(--eds-br-s);outline:none;position:relative}.eui-21 :host>::ng-deep .eds-input-text,.eui-21 :host>::ng-deep input{flex:1 1 auto;min-width:0;order:1}.eui-21 :host>::ng-deep .eds-button,.eui-21 :host>::ng-deep button{flex:0 0 auto;order:3}.eui-21 :host>::ng-deep div:has(input),.eui-21 :host>::ng-deep div:has(.eds-input-text){flex:1 1 auto!important;width:auto!important;min-width:0;order:1}.eui-21 :host>::ng-deep div:not(:has(input)):not(:has(.eds-input-text)){flex:0 0 0!important;width:0!important;min-width:0;order:2}.eui-21 :host:focus-within{outline:var(--eds-bw-s) solid var(--eds-c-border-focus);outline-offset:var(--eds-bw-s)}.eui-21 :host:focus-within ::ng-deep .eds-input-text:focus-visible:not([readonly]),.eui-21 :host:focus-within ::ng-deep .eds-input-text:focus:not([readonly]),.eui-21 :host:focus-within ::ng-deep input:focus-visible{outline:none!important;outline-offset:0!important;box-shadow:none!important}.eui-21 :host:focus-within ::ng-deep .eds-button:focus-visible,.eui-21 :host:focus-within ::ng-deep .eds-button:focus,.eui-21 :host:focus-within ::ng-deep .eds-icon-button:focus-visible,.eui-21 :host:focus-within ::ng-deep .eds-icon-button:focus{outline:var(--eds-bw-s) solid var(--eds-c-border-focus)!important;outline-offset:calc(-1 * var(--eds-bw-s))!important}.eui-21 :host:focus-within:has(input[invalid]),.eui-21 :host:focus-within:has(.eds-input-text[invalid]){outline-color:var(--eds-c-focus-critical)}.eui-21 :host:focus-within:has(input[invalid]) ::ng-deep .eds-button:focus-visible,.eui-21 :host:focus-within:has(input[invalid]) ::ng-deep .eds-button:focus,.eui-21 :host:focus-within:has(input[invalid]) ::ng-deep .eds-icon-button:focus-visible,.eui-21 :host:focus-within:has(input[invalid]) ::ng-deep .eds-icon-button:focus,.eui-21 :host:focus-within:has(.eds-input-text[invalid]) ::ng-deep .eds-button:focus-visible,.eui-21 :host:focus-within:has(.eds-input-text[invalid]) ::ng-deep .eds-button:focus,.eui-21 :host:focus-within:has(.eds-input-text[invalid]) ::ng-deep .eds-icon-button:focus-visible,.eui-21 :host:focus-within:has(.eds-input-text[invalid]) ::ng-deep .eds-icon-button:focus{outline-color:var(--eds-c-focus-critical)!important}.eui-21 :host ::ng-deep .eds-button{border:var(--eds-bw-xs) solid var(--eds-c-border-neutral);background-color:var(--eds-c-surface-elevation)!important;position:relative}.eui-21 :host([invalid]):focus-within{outline-color:var(--eds-c-focus-critical)}.eui-21 :host([invalid]):focus-within ::ng-deep .eds-button:focus-visible,.eui-21 :host([invalid]):focus-within ::ng-deep .eds-button:focus,.eui-21 :host([invalid]):focus-within ::ng-deep .eds-icon-button:focus-visible,.eui-21 :host([invalid]):focus-within ::ng-deep .eds-icon-button:focus{outline-color:var(--eds-c-focus-critical)!important}.eui-21 :host([position=start]){flex-direction:row-reverse}.eui-21 :host([position=start]) ::ng-deep .eds-button{border-right:none;border-top-right-radius:0;border-bottom-right-radius:0}.eui-21 :host([position=start]) ::ng-deep .eds-button:after{background-color:var(--eds-c-border-divider);content:\"\";display:block;height:1.75rem;right:-1px;position:absolute;top:var(--eds-sp-2xs);width:1px}.eui-21 :host([position=start]) ::ng-deep .eds-input-text{border-left:none;border-top-left-radius:0;border-bottom-left-radius:0}.eui-21 :host([position=end]) ::ng-deep .eds-button{border-left:none;border-top-left-radius:0;border-bottom-left-radius:0}.eui-21 :host([position=end]) ::ng-deep .eds-button:before{background-color:var(--eds-c-border-divider);content:\"\";display:block;height:1.75rem;left:-1px;position:absolute;top:var(--eds-sp-2xs);width:1px}.eui-21 :host([position=end]) ::ng-deep .eds-input-text{border-right:none;border-top-right-radius:0;border-bottom-right-radius:0}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { e2eAttr: [{ type: i0.Input, args: [{ isSignal: true, alias: "e2eAttr", required: false }] }], edsButtonPositionStart: [{ type: i0.Input, args: [{ isSignal: true, alias: "edsButtonPositionStart", required: false }] }], edsButtonPositionEnd: [{ type: i0.Input, args: [{ isSignal: true, alias: "edsButtonPositionEnd", required: false }] }] } });
 /** Convenience array for importing all eds-input-button components. */
 const EDS_INPUT_BUTTON = [

package/fesm2022/eui-eds-eds-input-button.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"eui-eds-eds-input-button.mjs","sources":["../../eds-input-button/eds-input-button.ts","../../eds-input-button/eds-input-button.html","../../eds-input-button/index.ts","../../eds-input-button/eui-eds-eds-input-button.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, booleanAttribute, input, computed } from '@angular/core';\n\n/*\n A layout component that positions button elements relative to input fields.\n * Enables the creation of input groups with leading or trailing action buttons,\n * commonly used for search inputs, password visibility toggles, or clear actions.\n \n @usageNotes\n * ### Button at end of input (default)\n * ```html\n * <eds-input-button>\n * <input edsInputText placeholder=\"Search...\" />\n * <button edsButton>Search</button>\n * </eds-input-button>\n * ```\n \n ### Button at start of input\n * ```html\n * <eds-input-button [edsButtonPositionStart]=\"true\">\n * <button edsIconButton icon=\"filter\" ariaLabel=\"Filter\"></button>\n * <input edsInputText placeholder=\"Filter results...\" />\n * </eds-input-button>\n * ```\n \n ### Accessibility\n * - Button and input maintain separate focus states\n * - Ensure button has descriptive label or aria-label\n * - Tab order follows visual layout\n \n ### Notes\n * - Default position is end (right in LTR)\n * - When `edsButtonPositionStart` is true, it overrides end positioning\n * - Works with all button variants (edsButton, edsIconButton)\n * - Commonly used for search, clear, and submit actions\n /\n@Component({\n selector: 'eds-input-button',\n templateUrl: './eds-input-button.html',\n styleUrl: './eds-input-button.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n class: 'eds-input-button',\n '[attr.position]': 'position()',\n '[attr.data-e2e]': 'e2eAttr()',\n },\n})\nexport class EdsInputButton {\n /\n Data attribute value for end-to-end testing identification.\n * Applied as data-e2e attribute on the host element.\n * @default 'eds-input-button'\n /\n e2eAttr = input('eds-input-button');\n\n /\n Positions the button at the start (left in LTR, right in RTL) of the input field.\n * When true, overrides edsButtonPositionEnd. Defaults to false.\n /\n edsButtonPositionStart = input(false, { transform: booleanAttribute });\n\n /\n Positions the button at the end (right in LTR, left in RTL) of the input field.\n * Ignored when edsButtonPositionStart is true. Defaults to true.\n /\n edsButtonPositionEnd = input(true, { transform: booleanAttribute });\n\n /\n Resolved button position, reflected as the `position` host attribute.\n * `start` takes precedence when both inputs are set.\n /\n protected readonly position = computed<'start' \| 'end'>(() =>\n this.edsButtonPositionStart() ? 'start' : 'end',\n );\n}\n","<ng-content />\n<ng-content select=\"button\"/>\n","import { EdsInputButton } from './eds-input-button';\n\nexport { EdsInputButton };\n\n/* Convenience array for importing all eds-input-button components. /\nexport const EDS_INPUT_BUTTON = [\n EdsInputButton,\n] as const;\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":";;;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgCG;MAYU,cAAc,CAAA;AAX3B,IAAA,WAAA,GAAA;AAYI;;;;AAIG;QACH,IAAA,CAAA,OAAO,GAAG,KAAK,CAAC,kBAAkB;oFAAC;AAEnC;;;AAGG;QACH,IAAA,CAAA,sBAAsB,GAAG,KAAK,CAAC,KAAK,8FAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AAEtE;;;AAGG;QACH,IAAA,CAAA,oBAAoB,GAAG,KAAK,CAAC,IAAI,4FAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AAEnE;;;AAGG;AACgB,QAAA,IAAA,CAAA,QAAQ,GAAG,QAAQ,CAAkB,MACpD,IAAI,CAAC,sBAAsB,EAAE,GAAG,OAAO,GAAG,KAAK;qFAClD;AACJ,IAAA;8GA3BY,cAAc,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAd,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,cAAc,iqBC9C3B,mDAEA,EAAA,MAAA,EAAA,CAAA,2rCAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FD4Ca,cAAc,EAAA,UAAA,EAAA,CAAA;kBAX1B,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,kBAAkB,EAAA,eAAA,EAGX,uBAAuB,CAAC,MAAM,EAAA,IAAA,EACzC;AACF,wBAAA,KAAK,EAAE,kBAAkB;AACzB,wBAAA,iBAAiB,EAAE,YAAY;AAC/B,wBAAA,iBAAiB,EAAE,WAAW;AACjC,qBAAA,EAAA,QAAA,EAAA,mDAAA,EAAA,MAAA,EAAA,CAAA,2rCAAA,CAAA,EAAA;;;AExCL;AACO,MAAM,gBAAgB,GAAG;IAC5B,cAAc;;;ACNlB;;AAEG;;;;"}
1	+ {"version":3,"file":"eui-eds-eds-input-button.mjs","sources":["../../eds-input-button/eds-input-button.ts","../../eds-input-button/eds-input-button.html","../../eds-input-button/index.ts","../../eds-input-button/eui-eds-eds-input-button.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n afterNextRender,\n booleanAttribute,\n computed,\n inject,\n input,\n signal,\n} from '@angular/core';\n\n/*\n A layout component that positions button elements relative to input fields.\n * Enables the creation of input groups with leading or trailing action buttons,\n * commonly used for search inputs, password visibility toggles, or clear actions.\n \n @usageNotes\n * ### Button at end of input (default)\n * ```html\n * <eds-input-button>\n * <input edsInputText placeholder=\"Search...\" />\n * <button edsButton>Search</button>\n * </eds-input-button>\n * ```\n \n ### Button at start of input\n * ```html\n * <eds-input-button [edsButtonPositionStart]=\"true\">\n * <button edsIconButton icon=\"filter\" ariaLabel=\"Filter\"></button>\n * <input edsInputText placeholder=\"Filter results...\" />\n * </eds-input-button>\n * ```\n \n ### Focus model (roving tabindex)\n * - `Tab` moves focus directly onto the input field (the primary control); the\n * focus ring covers the whole host (the group). `Tab` again leaves the group.\n * - `ArrowLeft` / `ArrowRight` rove focus between the group's controls in visual\n * order — the input, the clearable \"✕\" icon (when present), and the button —\n * wrapping at the ends; `Home` / `End` jump to the first / last control.\n * - Only the active control is in the tab order, so `Tab` leaves the group from\n * wherever focus currently is. Focusing a child directly (click) adopts it as\n * the active roving target.\n \n ### Accessibility\n * - Single tab stop with arrow-key navigation between the controls\n * - The clearable icon participates in the arrow-key cycle when it is shown\n * - Ensure button has a descriptive label or aria-label\n * - Tab order follows visual layout\n \n ### Notes\n * - Default position is end (right in LTR)\n * - When `edsButtonPositionStart` is true, it overrides end positioning\n * - Works with all button variants (edsButton, edsIconButton)\n * - Commonly used for search, clear, and submit actions\n /\n@Component({\n selector: 'eds-input-button',\n templateUrl: './eds-input-button.html',\n styleUrl: './eds-input-button.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n class: 'eds-input-button',\n role: 'group',\n '[attr.position]': 'position()',\n '[attr.data-e2e]': 'e2eAttr()',\n '(focusin)': 'onFocusIn($event)',\n '(keydown)': 'onKeydown($event)',\n },\n})\nexport class EdsInputButton {\n private readonly host = inject<ElementRef<HTMLElement>>(ElementRef);\n\n /\n Data attribute value for end-to-end testing identification.\n * Applied as data-e2e attribute on the host element.\n * @default 'eds-input-button'\n /\n e2eAttr = input('eds-input-button');\n\n /\n Positions the button at the start (left in LTR, right in RTL) of the input field.\n * When true, overrides edsButtonPositionEnd. Defaults to false.\n /\n edsButtonPositionStart = input(false, { transform: booleanAttribute });\n\n /\n Positions the button at the end (right in LTR, left in RTL) of the input field.\n * Ignored when edsButtonPositionStart is true. Defaults to true.\n /\n edsButtonPositionEnd = input(true, { transform: booleanAttribute });\n\n /\n Resolved button position, reflected as the `position` host attribute.\n * `start` takes precedence when both inputs are set.\n /\n protected readonly position = computed<'start' \| 'end'>(() =>\n this.edsButtonPositionStart() ? 'start' : 'end',\n );\n\n /* Index (within {@link managedChildren}) of the roving active control. /\n private readonly activeIndex = signal(0);\n\n constructor() {\n afterNextRender(() => this.resetRovingTabStop());\n }\n\n /\n The group's controls that participate in arrow-key roving, in DOM order:\n * the projected input/button plus the clearable \"✕\" icon (a `[tabindex]`\n * element the eds-input-text clearable directive injects). Disabled and\n * not-currently-rendered controls (e.g. the hidden clearable icon when the\n * field is empty) are excluded so the cycle only visits reachable targets.\n /\n private managedChildren(): HTMLElement[] {\n const selector = 'input, button, select, textarea, .eds-clearable-icon';\n return Array.from(\n this.host.nativeElement.querySelectorAll<HTMLElement>(selector),\n ).filter((el) => {\n if (el === this.host.nativeElement \|\| el.hasAttribute('disabled')) {\n return false;\n }\n // Skip controls that are not actually visible/rendered — notably the\n // clearable icon, which is hidden (visibility:hidden) when empty.\n if (getComputedStyle(el).visibility === 'hidden') {\n return false;\n }\n return el.offsetParent !== null \|\| getComputedStyle(el).position === 'fixed';\n });\n }\n\n /\n Index of the primary control that owns the natural tab stop — the input\n * field (first `input`/`textarea`/`select`), so `Tab` lands directly on it.\n * Falls back to the first child when there is no input-like control.\n /\n private primaryIndex(): number {\n const children = this.managedChildren();\n const inputIndex = children.findIndex((el) =>\n /^(input\|textarea\|select)$/i.test(el.tagName),\n );\n return inputIndex >= 0 ? inputIndex : 0;\n }\n\n /\n Roving tabindex: the primary (input) control stays in the natural tab\n * order so `Tab` focuses it directly; every other control is reachable only\n * via the arrow keys.\n /\n private resetRovingTabStop(): void {\n const primary = this.primaryIndex();\n this.activeIndex.set(primary);\n this.managedChildren().forEach((el, index) =>\n el.setAttribute('tabindex', index === primary ? '0' : '-1'),\n );\n }\n\n /\n Track focus entering a projected control so the arrow keys continue from\n * the control the user is actually on (e.g. after a click), and keep the\n * roving tab stop in sync so a subsequent `Tab` leaves from here.\n /\n protected onFocusIn(event: FocusEvent): void {\n const target = event.target as HTMLElement;\n const index = this.managedChildren().indexOf(target);\n if (index >= 0) {\n this.setActive(index);\n }\n }\n\n protected onKeydown(event: KeyboardEvent): void {\n const children = this.managedChildren();\n if (children.length === 0) {\n return;\n }\n\n switch (event.key) {\n case 'ArrowRight':\n case 'ArrowDown':\n event.preventDefault();\n this.focusChild(this.nextIndex(1));\n break;\n case 'ArrowLeft':\n case 'ArrowUp':\n event.preventDefault();\n this.focusChild(this.nextIndex(-1));\n break;\n case 'Home':\n event.preventDefault();\n this.focusChild(0);\n break;\n case 'End':\n event.preventDefault();\n this.focusChild(children.length - 1);\n break;\n default:\n break;\n }\n }\n\n private nextIndex(delta: number): number {\n const count = this.managedChildren().length;\n const current = this.activeIndex();\n return (current + delta + count) % count;\n }\n\n private focusChild(index: number): void {\n const target = this.managedChildren()[index];\n if (!target) {\n return;\n }\n this.setActive(index);\n target.focus();\n }\n\n /\n Move the single roving tab stop (`tabindex=\"0\"`) onto the active control\n * and set every other control to `tabindex=\"-1\"`, so after arrow navigation\n * `Tab` leaves the group from wherever focus currently is.\n /\n private setActive(index: number): void {\n this.activeIndex.set(index);\n this.managedChildren().forEach((el, i) =>\n el.setAttribute('tabindex', i === index ? '0' : '-1'),\n );\n }\n}\n","<ng-content />\n<ng-content select=\"button\"/>\n","import { EdsInputButton } from './eds-input-button';\n\nexport { EdsInputButton };\n\n/* Convenience array for importing all eds-input-button components. /\nexport const EDS_INPUT_BUTTON = [\n EdsInputButton,\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 CHANGED Viewed

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

package/types/eui-eds-eds-input-button.d.ts CHANGED Viewed

@@ -22,9 +22,20 @@ import * as _angular_core from '@angular/core';
  * </eds-input-button>
  * ```
  *
+ * ### Focus model (roving tabindex)
+ * - `Tab` moves focus directly onto the input field (the primary control); the
+ *   focus ring covers the whole host (the group). `Tab` again leaves the group.
+ * - `ArrowLeft` / `ArrowRight` rove focus between the group's controls in visual
+ *   order — the input, the clearable "✕" icon (when present), and the button —
+ *   wrapping at the ends; `Home` / `End` jump to the first / last control.
+ * - Only the active control is in the tab order, so `Tab` leaves the group from
+ *   wherever focus currently is. Focusing a child directly (click) adopts it as
+ *   the active roving target.
+ *
  * ### Accessibility
- * - Button and input maintain separate focus states
- * - Ensure button has descriptive label or aria-label
+ * - Single tab stop with arrow-key navigation between the controls
+ * - The clearable icon participates in the arrow-key cycle when it is shown
+ * - Ensure button has a descriptive label or aria-label
  * - Tab order follows visual layout
  *
  * ### Notes
@@ -34,6 +45,7 @@ import * as _angular_core from '@angular/core';
  * - Commonly used for search, clear, and submit actions
  */
 declare class EdsInputButton {
+    private readonly host;
     /**
      * Data attribute value for end-to-end testing identification.
      * Applied as data-e2e attribute on the host element.
@@ -55,6 +67,44 @@ declare class EdsInputButton {
      * `start` takes precedence when both inputs are set.
      */
     protected readonly position: _angular_core.Signal<"start" | "end">;
+    /** Index (within {@link managedChildren}) of the roving active control. */
+    private readonly activeIndex;
+    constructor();
+    /**
+     * The group's controls that participate in arrow-key roving, in DOM order:
+     * the projected input/button plus the clearable "✕" icon (a `[tabindex]`
+     * element the eds-input-text clearable directive injects). Disabled and
+     * not-currently-rendered controls (e.g. the hidden clearable icon when the
+     * field is empty) are excluded so the cycle only visits reachable targets.
+     */
+    private managedChildren;
+    /**
+     * Index of the primary control that owns the natural tab stop — the input
+     * field (first `input`/`textarea`/`select`), so `Tab` lands directly on it.
+     * Falls back to the first child when there is no input-like control.
+     */
+    private primaryIndex;
+    /**
+     * Roving tabindex: the primary (input) control stays in the natural tab
+     * order so `Tab` focuses it directly; every other control is reachable only
+     * via the arrow keys.
+     */
+    private resetRovingTabStop;
+    /**
+     * Track focus entering a projected control so the arrow keys continue from
+     * the control the user is actually on (e.g. after a click), and keep the
+     * roving tab stop in sync so a subsequent `Tab` leaves from here.
+     */
+    protected onFocusIn(event: FocusEvent): void;
+    protected onKeydown(event: KeyboardEvent): void;
+    private nextIndex;
+    private focusChild;
+    /**
+     * Move the single roving tab stop (`tabindex="0"`) onto the active control
+     * and set every other control to `tabindex="-1"`, so after arrow navigation
+     * `Tab` leaves the group from wherever focus currently is.
+     */
+    private setActive;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<EdsInputButton, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<EdsInputButton, "eds-input-button", never, { "e2eAttr": { "alias": "e2eAttr"; "required": false; "isSignal": true; }; "edsButtonPositionStart": { "alias": "edsButtonPositionStart"; "required": false; "isSignal": true; }; "edsButtonPositionEnd": { "alias": "edsButtonPositionEnd"; "required": false; "isSignal": true; }; }, {}, never, ["*", "button"], true, never>;
 }

package/types/eui-eds-eds-input-button.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"eui-eds-eds-input-button.d.ts","sources":["../../eds-input-button/eds-input-button.ts","../../eds-input-button/index.ts"],"mappings":";;~~AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgCG~~;AACH,~~cAWa~~,cAAc;AACvB;;;;AAIG;AACH,aAAO,aAAA,CAAA,WAAA;AAEP;;;AAGG;AACH,4BAAsB,aAAA,CAAA,wBAAA;AAEtB;;;AAGG;AACH,0BAAoB,aAAA,CAAA,wBAAA;AAEpB;;;AAGG;AACH,iCAA2B,aAAA,CAAA,MAAA;~~oDAxBlB~~,cAAc;sDAAd,cAAc;~~AA2B1B~~;;~~ACrED~~;AACA,cAAa,gBAAgB,mBAAA,cAAA;;;;","names":[]}
1	+ {"version":3,"file":"eui-eds-eds-input-button.d.ts","sources":["../../eds-input-button/eds-input-button.ts","../../eds-input-button/index.ts"],"mappings":";;AAYA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2CG;AACH,cAca,cAAc;AACvB;AAEA;;;;AAIG;AACH,aAAO,aAAA,CAAA,WAAA;AAEP;;;AAGG;AACH,4BAAsB,aAAA,CAAA,wBAAA;AAEtB;;;AAGG;AACH,0BAAoB,aAAA,CAAA,wBAAA;AAEpB;;;AAGG;AACH,iCAA2B,aAAA,CAAA,MAAA;;AAK3B;;AAMA;;;;;;AAMG;AACH;AAiBA;;;;AAIG;AACH;AAQA;;;;AAIG;AACH;AAQA;;;;AAIG;AACH,+BAA2B,UAAU;AAQrC,+BAA2B,aAAa;AA8BxC;AAMA;AASA;;;;AAIG;AACH;oDAtJS,cAAc;sDAAd,cAAc;AA4J1B;;AC9ND;AACA,cAAa,gBAAgB,mBAAA,cAAA;;;;","names":[]}