npm - @ember-eui/core - Versions diffs - 15.0.0 → 16.0.1 - Mend

@ember-eui/core 15.0.0 → 16.0.1

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 (4457) hide show

package/dist/components/eui-avatar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"eui-avatar.js","sources":["../../src/components/eui-avatar.gts"],"sourcesContent":["import { get,hash } from '@ember/helper';\n\nimport { and, eq,not, or } from 'ember-truth-helpers';\n\nimport argOrDefault from '../helpers/arg-or-default.ts';\nimport classNames from '../helpers/class-names.ts';\nimport inlineStyles from '../helpers/inline-styles.ts';\nimport { toInitials } from '../helpers/to-initials.ts';\nimport simpleStyle from '../modifiers/simple-style.ts';\nimport EuiIcon from './eui-icon.gts';\n\nimport type { sizeMapping, typeMapping } from '../utils/css-mappings/eui-avatar.ts';\nimport type { EuiIconSignature } from './eui-icon';\nimport type { TemplateOnlyComponent } from '@ember/component/template-only';\n\nexport interface EuiAvatarSignature {\n Element: HTMLDivElement;\n Args: {\n /*\n Full name of the user or space. Used as the accessible label and the\n * hover title, for the initials and to pick a background color.\n /\n name?: string;\n /\n Background color as a hex value (`'#DA8B45'`), or `'plain'` for the\n * page's background color. Defaults to one of EUI's visualization colors,\n * picked from `@name`; the text color is chosen for contrast.\n /\n color?: EuiIconSignature['Args']['color'];\n /\n Color of the `@iconType` icon, any `EuiIcon` color. Defaults to the\n * text color picked for the background; `null` keeps the icon's own\n * colors (for multi-color logos).\n /\n iconColor?: string;\n /\n Size of the `@iconType` icon. Defaults to `@size`.\n /\n iconSize?: EuiIconSignature['Args']['size'];\n /\n Shows an icon instead of initials, e.g. `'logoElastic'` for a space.\n * Anything `EuiIcon`'s `@type` accepts.\n /\n iconType?: EuiIconSignature['Args']['type'];\n /\n Image shown as the avatar (as a background image), instead of initials.\n /\n imageUrl?: string;\n /\n Custom initials (max 2 characters) instead of the ones computed from\n * `@name`. Only shown when `@name` is set.\n /\n initials?: string;\n /\n Greys the avatar out and hides it from assistive technology.\n /\n isDisabled?: boolean;\n /\n `'s'`, `'m'`, `'l'` or `'xl'`. Defaults to `'m'`.\n /\n size?: keyof typeof sizeMapping;\n /\n `'user'` renders a circle, `'space'` a rounded square.\n * Defaults to `'user'`.\n /\n type?: keyof typeof typeMapping;\n /\n Number of initials to compute from `@name`, `1` or `2`. Defaults to\n * the number of words in the name, up to 2.\n */\n initialLength?: 1 \| 2;\n };\n}\n\nconst EuiAvatar: TemplateOnlyComponent<EuiAvatarSignature> = <template>\n {{#let\n (inlineStyles\n componentName=\"EuiAvatar\"\n componentArgs=(hash\n name=@name\n color=@color\n iconColor=@iconColor\n iconSize=@iconSize\n iconType=@iconType\n imageUrl=@imageUrl\n initials=@initials\n )\n )\n as \|inlineStyles\|\n }}\n <div\n class={{classNames\n (if @isDisabled \"euiAvatar-isDisabled\")\n (if (eq @color \"plain\") \"euiAvatar--plain\")\n componentName=\"EuiAvatar\"\n size=(argOrDefault @size \"m\")\n type=(argOrDefault @type \"user\")\n }}\n aria-label={{if @isDisabled undefined @name}}\n title={{@name}}\n role={{if @isDisabled \"presentation\" \"img\"}}\n ...attributes\n {{simpleStyle inlineStyles}}\n >\n {{#if (and (not @imageUrl) (not @iconType))}}\n <span aria-hidden=\"true\">\n {{#if @name}}\n {{toInitials @name @initialLength @initials}}\n {{/if}}\n </span>\n {{else if @iconType}}\n <EuiIcon\n @iconClasses=\"euiAvatar__icon\"\n @size={{or @iconSize @size}}\n @type={{@iconType}}\n aria-label={{@name}}\n role={{if @isDisabled \"presentation\" \"img\"}}\n @color={{or\n @iconColor\n (if (eq @iconColor null) @iconColor (get inlineStyles \"color\"))\n }}\n />\n {{/if}}\n </div>\n {{/let}}\n</template>;\n\nexport default EuiAvatar;\n"],"names":["EuiAvatar","setComponentTemplate","precompileTemplate","strictMode","scope","inlineStyles","hash","classNames","eq","argOrDefault","simpleStyle","and","not","toInitials","EuiIcon","or","get","templateOnly"],"mappings":";;;;;;;;;;;;AA0EA,MAAMA,SAAiC,GAAAC,oBAAA,CAAsBC,kBAAA,CAAA,8kCAAA,EAmD7D;EAAAC,UAAA,EAAA,IAAA;AAAAC,EAAAA,KAAA,EAAAA,OAAA;IAAAC,YAAA;IAAAC,IAAA;IAAAC,UAAA;IAAAC,EAAA;IAAAC,YAAA;IAAAC,WAAA;IAAAC,GAAA;IAAAC,GAAA;IAAAC,UAAA;IAAAC,OAAA;IAAAC,EAAA;AAAAC,IAAAA;AAAA,GAAA;AAAU,CAAA,CAAA,EAAAC,YAAA,EAAA;;"}
1	+ {"version":3,"file":"eui-avatar.js","sources":["../../src/components/eui-avatar.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { cached } from '@glimmer/tracking';\nimport { warn } from '@ember/debug';\n\nimport { hexToRgb } from '../helpers/hex-to-rgb.ts';\nimport { isColorDark } from '../helpers/is-color-dark.ts';\nimport { isValidHex } from '../helpers/is-valid-hex.ts';\nimport { toInitials } from '../helpers/to-initials.ts';\nimport { getEuiThemeContext } from '../utils/emotion/consume.ts';\nimport { useEuiPaletteColorBlindBehindText } from '../utils/color/eui_palettes.ts';\nimport { euiClass, useEuiBorealisStyles } from '../utils/eui/styles.ts';\nimport type { EuiCss } from '../utils/eui/styles.ts';\nimport { euiAvatarStyles } from '../utils/eui/styles.generated.ts';\nimport EuiIcon from './eui-icon.gts';\nimport EuiToolTip from './eui-tool-tip.gts';\n\nimport type { TOC } from '@ember/component/template-only';\nimport type { CSSObject } from '@emotion/css/create-instance';\nimport type { SerializedStyles } from '@emotion/serialize';\nimport type { EuiIconSignature } from './eui-icon';\n\nexport const SIZES = ['s', 'm', 'l', 'xl'] as const;\nexport const TYPES = ['space', 'user'] as const;\nexport const CASING = ['capitalize', 'uppercase', 'lowercase', 'none'] as const;\n\nexport type EuiAvatarSize = (typeof SIZES)[number];\nexport type EuiAvatarType = (typeof TYPES)[number];\nexport type EuiAvatarCasing = (typeof CASING)[number];\n\ntype AvatarStyles = Record<string, SerializedStyles> & {\n tooltip: Record<string, SerializedStyles>;\n};\n\nfunction oneOf<T extends string>(\n values: readonly T[],\n value: unknown,\n fallback: T\n): T {\n return (values as readonly unknown[]).includes(value) ? (value as T) : fallback;\n}\n\nexport interface EuiAvatarSignature {\n Element: HTMLDivElement;\n Args: {\n /*\n Full name of the user or space. Used as the accessible label and the\n * tooltip content, for the initials and to pick a background color.\n /\n name?: string;\n /\n Background color as a hex value (`'#DA8B45'`), `'plain'` (the page's\n * background color), `'subdued'` (a light gray), or `null` (the default\n * gray). Defaults to one of the theme's visualization colors, picked\n * from `@name`; the text color is chosen for contrast.\n /\n color?: string \| null;\n /\n Color of the `@iconType` icon, any `EuiIcon` color. Defaults to the\n * text color picked for the background; `null` keeps the icon's own\n * colors (for multi-color logos).\n /\n iconColor?: string \| null;\n /\n Size of the `@iconType` icon. Defaults to `@size`.\n /\n iconSize?: EuiIconSignature['Args']['size'];\n /\n Shows an icon instead of initials, e.g. `'logoElastic'` for a space.\n * Anything `EuiIcon`'s `@type` accepts.\n /\n iconType?: EuiIconSignature['Args']['type'];\n /\n Image shown as the avatar (as a background image), instead of initials.\n /\n imageUrl?: string;\n /\n Custom initials (max 2 characters) instead of the ones computed from\n * `@name`.\n /\n initials?: string;\n /\n Greys the avatar out and hides it from assistive technology.\n /\n isDisabled?: boolean;\n /\n `'s'` (24px), `'m'` (32px), `'l'` (40px) or `'xl'` (64px). Defaults\n * to `'m'`.\n /\n size?: EuiAvatarSize;\n /\n `'user'` renders a circle, `'space'` a rounded square.\n * Defaults to `'user'`.\n /\n type?: EuiAvatarType;\n /\n Text transform of the initials: `'capitalize'`, `'uppercase'`,\n * `'lowercase'` or `'none'`. Defaults to `'uppercase'` for users and\n * `'none'` for spaces.\n /\n casing?: EuiAvatarCasing;\n /\n Number of initials to compute from `@name`, `1` or `2`. Defaults to\n * the number of words in the name, up to 2.\n /\n initialsLength?: 1 \| 2;\n /* Same as `@initialsLength` (the former name). /\n initialLength?: 1 \| 2;\n /\n Extra styles composed last into this component's class (like upstream's\n * `css` prop). Prefer this to an extra class when styling it from a parent.\n /\n css?: EuiCss;\n };\n}\n\n/* Native Ember avatar using the upstream EUI 123 / Borealis styles. /\nexport default class EuiAvatar extends Component<EuiAvatarSignature> {\n get context() {\n return getEuiThemeContext(this);\n }\n\n get type(): EuiAvatarType {\n return oneOf(TYPES, this.args.type, 'user');\n }\n\n get initials(): string \| null {\n const { initials } = this.args;\n\n if (initials && initials.length > 2) {\n warn(\n 'EuiAvatar only accepts a max of 2 characters for the initials as a string. It is displaying only the first 2 characters.',\n { id: 'EuiAvatar-initials-excedeed' }\n );\n }\n\n return toInitials(\n this.args.name ?? '',\n this.args.initialsLength ?? this.args.initialLength,\n initials\n );\n }\n\n /\n Upstream `avatarStyle`: the image, or a background color (by default a\n * visualization color picked from the name) with a contrasting text color.\n /\n get avatarStyle(): { backgroundImage?: string; backgroundColor?: string; color?: string } \| undefined {\n const { color, imageUrl } = this.args;\n\n if (imageUrl) return { backgroundImage: `url(${imageUrl})` };\n\n if (color === 'plain' \|\| color === 'subdued' \|\| color === null) {\n return undefined;\n }\n\n if (color && !isValidHex(color)) {\n warn(\n 'EuiAvatar needs to pass a valid color. This can either be a three or six character hex value',\n false,\n { id: 'EuiAvatar-invalid-color' }\n );\n }\n\n const visColors = useEuiPaletteColorBlindBehindText(this.context.upstream);\n const name = this.args.name ?? '';\n const assignedColor =\n color \|\| (visColors[Math.floor(name.length % visColors.length)] as string);\n const textColor = isColorDark(...hexToRgb(assignedColor))\n ? '#FFFFFF'\n : '#000000';\n\n return { backgroundColor: assignedColor, color: textColor };\n }\n\n get isForcedColors(): boolean {\n return this.context.upstream.highContrastMode === 'forced';\n }\n\n /* Upstream `styles.tooltip[type]`: the anchor rounds like the avatar. /\n @cached\n get tooltipCss(): EuiCss {\n const styles = useEuiBorealisStyles(\n this.context,\n euiAvatarStyles as unknown as (\n ...args: Parameters<typeof euiAvatarStyles>\n ) => AvatarStyles\n );\n\n return styles['tooltip']![this.type];\n }\n\n @cached\n get classes(): string {\n const context = this.context;\n const styles = useEuiBorealisStyles(\n context,\n euiAvatarStyles as unknown as (\n ...args: Parameters<typeof euiAvatarStyles>\n ) => AvatarStyles\n );\n const type = this.type;\n const size = oneOf(SIZES, this.args.size, 'm');\n const casing = oneOf(\n CASING,\n this.args.casing,\n type === 'space' ? 'none' : 'uppercase'\n );\n const { color, isDisabled } = this.args;\n // The React global reset makes every element border-box; without it the\n // forced-colors border would grow the avatar.\n const reset: CSSObject = { boxSizing: 'border-box' };\n // Upstream sets these inline; a class keeps the caller's `style` intact.\n const avatarStyle = this.avatarStyle as CSSObject \| undefined;\n // Background colors are ignored in Windows forced-colors themes.\n const highContrastBorder: CSSObject \| undefined = this.isForcedColors\n ? { border: context.upstream.euiTheme.border.thin }\n : undefined;\n\n return `euiAvatar ${euiClass(\n context,\n reset,\n styles['euiAvatar'],\n styles[type],\n styles[size],\n styles[casing],\n color === 'plain' && styles['plain'],\n color === 'subdued' && styles['subdued'],\n isDisabled && styles['isDisabled'],\n avatarStyle,\n highContrastBorder,\n this.args.css\n )}`;\n }\n\n get iconSize(): EuiIconSignature['Args']['size'] {\n return this.args.iconSize ?? oneOf(SIZES, this.args.size, 'm');\n }\n\n /* Upstream `iconCustomColor`. /\n get iconColor(): string \| undefined {\n if (this.isForcedColors) {\n return this.context.upstream.euiTheme.colors.fullShade;\n }\n\n const { iconColor } = this.args;\n\n if (iconColor === null) return undefined;\n if (iconColor) return iconColor;\n\n return this.avatarStyle?.color;\n }\n\n <template>\n {{#if @name}}\n {{! upstream: the name is a visual tooltip; the avatar already has an\n aria-label }}\n <EuiToolTip\n @content={{@name}}\n @anchorCss={{this.tooltipCss}}\n @disableScreenReaderOutput={{true}}\n >\n <AvatarNode @avatar={{this}} ...attributes />\n </EuiToolTip>\n {{else}}\n <AvatarNode @avatar={{this}} ...attributes />\n {{/if}}\n </template>\n}\n\n/* The avatar element, with or without its tooltip anchor. */\nconst AvatarNode: TOC<{\n Element: HTMLDivElement;\n Args: { avatar: EuiAvatar };\n}> = <template>\n <div\n class={{@avatar.classes}}\n aria-label={{if @avatar.args.isDisabled undefined @avatar.args.name}}\n role={{if @avatar.args.isDisabled \"presentation\" \"img\"}}\n ...attributes\n >\n {{#unless @avatar.args.imageUrl}}\n {{#if @avatar.args.iconType}}\n <EuiIcon\n @iconClasses=\"euiAvatar__icon\"\n @size={{@avatar.iconSize}}\n @type={{@avatar.args.iconType}}\n @color={{@avatar.iconColor}}\n aria-hidden=\"true\"\n />\n {{else}}\n <span aria-hidden=\"true\">{{@avatar.initials}}</span>\n {{/if}}\n {{/unless}}\n </div>\n</template>;\n"],"names":["SIZES","TYPES","CASING","oneOf","values","value","fallback","includes","EuiAvatar","Component","context","getEuiThemeContext","type","args","initials","length","warn","id","toInitials","name","initialsLength","initialLength","avatarStyle","color","imageUrl","backgroundImage","undefined","isValidHex","visColors","useEuiPaletteColorBlindBehindText","upstream","assignedColor","Math","floor","textColor","isColorDark","hexToRgb","backgroundColor","isForcedColors","highContrastMode","tooltipCss","styles","useEuiBorealisStyles","euiAvatarStyles","n","prototype","cached","classes","size","casing","isDisabled","reset","boxSizing","highContrastBorder","border","euiTheme","thin","euiClass","css","iconSize","iconColor","colors","fullShade","setComponentTemplate","precompileTemplate","strictMode","scope","EuiToolTip","AvatarNode","EuiIcon","templateOnly"],"mappings":"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"}

package/dist/components/eui-badge-group.js CHANGED Viewed

@@ -1,22 +1,48 @@
+import Component from '@glimmer/component';
+import { cached } from '@glimmer/tracking';
 import { hash } from '@ember/helper';
-import argOrDefault from '../helpers/arg-or-default.js';
-import classNames from '../helpers/class-names.js';
+import { getEuiThemeContext } from '../utils/emotion/consume.js';
+import { useEuiBorealisStyles, euiClass } from '../utils/eui/styles.js';
+import { P as euiBadgeGroupStyles } from '../styles.generated-SYAxYhey.js';
 import { precompileTemplate } from '@ember/template-compilation';
 import { setComponentTemplate } from '@ember/component';
 import templateOnly from '@ember/component/template-only';
+import { n } from 'decorator-transforms/runtime-esm';
-const BadgeGroupItem = setComponentTemplate(precompileTemplate("<span class=\"euiBadgeGroup__item\">\n  {{yield}}\n</span>", {
+const BadgeGroupItem = setComponentTemplate(precompileTemplate("<span class=\"euiBadgeGroup__item {{@class}}\">\n  {{yield}}\n</span>", {
   strictMode: true
 }), templateOnly());
-const EuiBadgeGroup = setComponentTemplate(precompileTemplate("<div class={{classNames componentName=\"EuiBadgeGroup\" gutterSize=(argOrDefault @gutterSize \"xs\")}} ...attributes>\n  {{yield (hash item=BadgeGroupItem)}}\n</div>", {
-  strictMode: true,
-  scope: () => ({
-    classNames,
-    argOrDefault,
-    hash,
-    BadgeGroupItem
-  })
-}), templateOnly());
+class EuiBadgeGroup extends Component {
+  get classes() {
+    const context = getEuiThemeContext(this);
+    const styles = useEuiBorealisStyles(context, euiBadgeGroupStyles);
+    return euiClass(context, {
+      boxSizing: 'border-box'
+    }, styles.euiBadgeGroup, styles[this.args.gutterSize ?? 'xs']);
+  }
+  static {
+    n(this.prototype, "classes", [cached]);
+  }
+  get itemClass() {
+    return euiClass(getEuiThemeContext(this), {
+      boxSizing: 'border-box',
+      minInlineSize: 0,
+      maxInlineSize: '100%'
+    });
+  }
+  static {
+    n(this.prototype, "itemClass", [cached]);
+  }
+  static {
+    setComponentTemplate(precompileTemplate("<div class=\"euiBadgeGroup {{this.classes}}\" ...attributes>\n  {{yield (hash item=(component BadgeGroupItem class=this.itemClass))}}\n</div>", {
+      strictMode: true,
+      scope: () => ({
+        hash,
+        BadgeGroupItem
+      })
+    }), this);
+  }
+}
 export { EuiBadgeGroup as default };
 //# sourceMappingURL=eui-badge-group.js.map

package/dist/components/eui-badge-group.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"eui-badge-group.js","sources":["../../src/components/eui-badge-group.gts"],"sourcesContent":["import { hash } from '@ember/helper';\n\nimport ~~argOrDefault~~ from '../~~helpers~~/~~arg-or-default~~.ts';\nimport ~~classNames~~ from '../~~helpers~~/~~class-names~~.ts';\n\nimport ~~type~~ { ~~gutterSize~~ } from '../utils/~~css-mappings~~/~~eui-badge-group~~.ts';\nimport type { TemplateOnlyComponent } from '@ember/component/template-only';\n\nconst BadgeGroupItem: TemplateOnlyComponent<{\n Blocks: {\n default: [];\n };\n}> = <template>\n <span class=\"euiBadgeGroup__item\">\n {{yield}}\n </span>\n</template>;\n\nexport interface EuiBadgeGroupSignature {\n Element: HTMLDivElement;\n Args: {\n /*\n Space between the badges, `'xs'` or `'s'`. Defaults to `'xs'`.\n /\n gutterSize?: ~~keyof~~ ~~typeof~~ ~~gutterSize~~;\n };\n Blocks: {\n /\n Wrap each badge in the yielded `item` so the group can space and wrap\n * them: `<group.item><EuiBadge>…</EuiBadge></group.item>`.\n */\n default: [\n {\n item: typeof BadgeGroupItem;\n }\n ];\n };\n}\n\~~nconst~~ EuiBadgeGroup: ~~TemplateOnlyComponent~~<EuiBadgeGroupSignature> ~~= <template>\~~n ~~<div~~\n ~~class~~=~~{{classNames~~\n ~~componentName=\"EuiBadgeGroup\"\~~n ~~gutterSize=(argOrDefault~~ @gutterSize \"xs\")\n }}\n ~~...attributes~~\n >\n {{yield (hash item=BadgeGroupItem)}}\n </div>\n</template~~>;\~~n\~~nexport default EuiBadgeGroup;\~~n"],"names":["BadgeGroupItem","setComponentTemplate","precompileTemplate","strictMode","templateOnly","EuiBadgeGroup","~~scope~~","~~classNames~~","~~argOrDefault~~","hash"],"mappings":"~~;;;;;;;AAQA~~,MAAMA,~~cAID~~,GAAAC,oBAAA,CAAAC,kBAAA,CAAA,~~4DAAA~~,EAIL;EAAAC,UAAA,EAAA;AAAU,CAAA,CAAA,EAAAC,YAAA,EAAA,CAAA;~~AAuBV~~,MAAMC,~~aAAqC~~,~~GAAAJ~~,~~oBAAA~~,~~CAA0BC~~,~~kBAAA~~,CAAA,~~uKAAA~~,~~EAUrE~~;~~EAAAC~~,~~UAAA~~,~~EAAA~~,~~IAAA~~;~~AAAAG~~,~~EAAAA~~,KAAA,~~EAAAA~~,~~OAAA~~;~~IAAAC~~,~~UAAA~~;~~IAAAC~~,~~YAAA~~;IAAAC,IAAA;~~AAAAT~~,~~IAAAA~~;AAAA,~~GAAA~~;~~AAAU~~,CAAA,CAAA,~~EAAAI~~,~~YAAA~~,EAAA;;"}
1	+ {"version":3,"file":"eui-badge-group.js","sources":["../../src/components/eui-badge-group.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { cached } from '@glimmer/tracking';\nimport { hash } from '@ember/helper';\n\nimport { getEuiThemeContext } from '../utils/emotion/consume.ts';\nimport { euiClass, useEuiBorealisStyles } from '../utils/eui/styles.ts';\nimport { euiBadgeGroupStyles } from '../utils/eui/styles.generated.ts';\n\nimport type { TemplateOnlyComponent } from '@ember/component/template-only';\nimport type { WithBoundArgs } from '@glint/template';\n\n/*\n Ember-only wrapper (upstream groups the badges directly). It may shrink to\n * the group's width so long badges truncate instead of overflowing.\n /\nconst BadgeGroupItem: TemplateOnlyComponent<{\n Args: { class: string };\n Blocks: {\n default: [];\n };\n}> = <template>\n <span class=\"euiBadgeGroup__item {{@class}}\">\n {{yield}}\n </span>\n</template>;\n\nexport interface EuiBadgeGroupSignature {\n Element: HTMLDivElement;\n Args: {\n /\n Space between the badges, `'none'`, `'xs'` or `'s'`. Defaults to\n * `'xs'`.\n /\n gutterSize?: 'none' \| 'xs' \| 's';\n };\n Blocks: {\n /\n Wrap each badge in the yielded `item` so the group can space and wrap\n * them: `<group.item><EuiBadge>…</EuiBadge></group.item>`.\n */\n default: [\n {\n item: WithBoundArgs<typeof BadgeGroupItem, 'class'>;\n }\n ];\n };\n}\n\nexport default class EuiBadgeGroup extends Component<EuiBadgeGroupSignature> {\n @cached\n get classes(): string {\n const context = getEuiThemeContext(this);\n const styles = useEuiBorealisStyles(context, euiBadgeGroupStyles);\n return euiClass(\n context,\n { boxSizing: 'border-box' },\n styles.euiBadgeGroup,\n styles[this.args.gutterSize ?? 'xs']\n );\n }\n\n @cached\n get itemClass(): string {\n return euiClass(getEuiThemeContext(this), {\n boxSizing: 'border-box',\n minInlineSize: 0,\n maxInlineSize: '100%'\n });\n }\n\n <template>\n <div class=\"euiBadgeGroup {{this.classes}}\" ...attributes>\n {{yield (hash item=(component BadgeGroupItem class=this.itemClass))}}\n </div>\n </template>\n}\n"],"names":["BadgeGroupItem","setComponentTemplate","precompileTemplate","strictMode","templateOnly","EuiBadgeGroup","Component","classes","context","getEuiThemeContext","styles","useEuiBorealisStyles","euiBadgeGroupStyles","euiClass","boxSizing","euiBadgeGroup","args","gutterSize","n","prototype","cached","itemClass","minInlineSize","maxInlineSize","scope","hash"],"mappings":";;;;;;;;;;;AAeA,MAAMA,cAKD,GAAAC,oBAAA,CAAAC,kBAAA,CAAA,uEAAA,EAIL;EAAAC,UAAA,EAAA;AAAU,CAAA,CAAA,EAAAC,YAAA,EAAA,CAAA;AAwBK,MAAMC,sBAAsBC,SAAA,CAAU;EACnD,IACIC,OAAAA,GAAkB;AACpB,IAAA,MAAMC,OAAA,GAAUC,mBAAmB,IAAI,CAAA;AACvC,IAAA,MAAMC,MAAA,GAASC,qBAAqBH,OAAA,EAASI,mBAAA,CAAA;IAC7C,OAAOC,SACLL,OAAA,EACA;AAAEM,MAAAA,SAAA,EAAW;AAAa,KAAA,EAC1BJ,MAAA,CAAOK,aAAa,EACpBL,MAAM,CAAC,IAAI,CAACM,IAAI,CAACC,UAAU,IAAI,IAAA,CAAK,CAAA;AAExC,EAAA;AAAA,EAAA;IAAAC,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,SAAA,EAAA,CAVCC,MAAA,CAAA,CAAA;AAAA;EAYD,IACIC,SAAAA,GAAoB;AACtB,IAAA,OAAOR,QAAA,CAASJ,kBAAA,CAAmB,IAAI,CAAA,EAAG;AACxCK,MAAAA,SAAA,EAAW,YAAA;AACXQ,MAAAA,aAAA,EAAe,CAAA;AACfC,MAAAA,aAAA,EAAe;AACjB,KAAA,CAAA;AACF,EAAA;AAAA,EAAA;IAAAL,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,WAAA,EAAA,CAPCC,MAAA,CAAA,CAAA;AAAA;AASD,EAAA;IAAAnB,oBAAA,CAAAC,kBAAA,CAAA,+IAAA,EAIA;MAAAC,UAAA,EAAA,IAAA;AAAAqB,MAAAA,KAAA,EAAAA,OAAA;QAAAC,IAAA;AAAAzB,QAAAA;AAAA,OAAA;KAAU,CAAA,EAAV,IAAW,CAAA;AAAD;AACZ;;"}

package/dist/components/eui-badge.js CHANGED Viewed

@@ -1,32 +1,246 @@
-import { hash } from '@ember/helper';
+import Component from '@glimmer/component';
+import { cached } from '@glimmer/tracking';
+import { warn } from '@ember/debug';
 import { on } from '@ember/modifier';
+import didInsert from '@ember/render-modifiers/modifiers/did-insert';
 import optional from '@nullvoxpopuli/ember-composable-helpers/helpers/optional';
-import { not, or, and } from 'ember-truth-helpers';
-import argOrDefault from '../helpers/arg-or-default.js';
-import classNames from '../helpers/class-names.js';
-import inlineStyles from '../helpers/inline-styles.js';
-import simpleStyle from '../modifiers/simple-style.js';
+import { modifier } from 'ember-modifier';
+import { not, eq, and } from 'ember-truth-helpers';
+import { getEuiThemeContext } from '../utils/emotion/consume.js';
+import { useEuiBorealisStyles, euiClass } from '../utils/eui/styles.js';
+import { L as getTextColor, M as getCustomInteractiveColors, N as getIsValidColor, O as euiBadgeStyles } from '../styles.generated-SYAxYhey.js';
 import EuiIcon from './eui-icon.js';
+import EuiImage$1 from './eui-inner-text.js';
 import { precompileTemplate } from '@ember/template-compilation';
 import { setComponentTemplate } from '@ember/component';
 import templateOnly from '@ember/component/template-only';
+import { n } from 'decorator-transforms/runtime-esm';
-const EuiBadge = setComponentTemplate(precompileTemplate("{{#if (and (or @onClick @href) (not @iconType))}}\n  {{!-- like EUI: a disabled badge is a disabled button, as <a> cannot be disabled --}}\n  {{#if (or @onClick @isDisabled)}}\n    <button type=\"button\" class={{classNames \"euiBadge-isClickable\" (if @isDisabled \"euiBadge-isDisabled\") componentName=\"EuiBadge\" color=(argOrDefault @color \"default\")}} aria-label={{@onClickAriaLabel}} disabled={{@isDisabled}} ...attributes {{simpleStyle (inlineStyles componentName=\"EuiBadge\" componentArgs=(hash badgeColor=(argOrDefault @color \"default\")))}} {{on \"click\" (optional @onClick)}}>\n      <span class=\"euiBadge__content\">\n        <span class=\"euiBadge__text\">\n          {{yield}}\n        </span>\n      </span>\n    </button>\n  {{else}}\n    <a class={{classNames \"euiBadge-isClickable\" (if @isDisabled \"euiBadge-isDisabled\") componentName=\"EuiBadge\" color=(argOrDefault @color \"default\")}} target={{@target}} href={{@href}} ...attributes {{simpleStyle (inlineStyles componentName=\"EuiBadge\" componentArgs=(hash badgeColor=(argOrDefault @color \"default\")))}}>\n      <span class=\"euiBadge__content\">\n        <span class=\"euiBadge__text\">\n          {{yield}}\n        </span>\n      </span>\n    </a>\n  {{/if}}\n{{else if @iconType}}\n  <span class={{classNames (if @isDisabled \"euiBadge-isDisabled\") componentName=\"EuiBadge\" iconSide=(argOrDefault @iconSide \"left\") color=(argOrDefault @color \"default\")}} ...attributes {{simpleStyle (inlineStyles componentName=\"EuiBadge\" componentArgs=(hash badgeColor=(argOrDefault @color \"default\")))}}>\n    <span class=\"euiBadge__content\">\n      {{#if (has-block)}}\n        {{#if (or @onClick @isDisabled)}}\n          <button class=\"euiBadge__childButton\" type=\"button\" disabled={{@isDisabled}} {{on \"click\" (optional @onClick)}}>\n            {{yield}}\n          </button>\n        {{else if @href}}\n          <a class=\"euiBadge__childButton\" href={{@href}} target={{@target}}>\n            {{yield}}\n          </a>\n        {{else}}\n          <span class=\"euiBadge__text\">\n            {{yield}}\n          </span>\n        {{/if}}\n      {{/if}}\n      {{#if @iconOnClick}}\n        {{!-- template-lint-disable --}}\n        <button type=\"button\" class=\"euiBadge__iconButton\" aria-label={{@iconOnClickAriaLabel}} disabled={{@isDisabled}} title={{@iconOnClickAriaLabel}} tabindex={{@closeButtonProps.tabIndex}} data-selected-index={{@closeButtonProps.dataSelectedIconIndex}} {{on \"click\" (optional @iconOnClick)}}>\n          <EuiIcon @color=\"inherit\" @iconClasses={{classNames \"euiBadge__icon\" @closeButtonProps.iconClasses}} @type={{@iconType}} @useSvg={{@iconUseSvg}} @size={{if (has-block) \"s\" \"m\"}} />\n        </button>\n        {{!-- tempalte-lint-enable--}}\n      {{else}}\n        <EuiIcon @color=\"inherit\" @type={{@iconType}} @useSvg={{@iconUseSvg}} @size={{if (has-block) \"s\" \"m\"}} @iconClasses=\"euiBadge__icon\" />\n      {{/if}}\n    </span>\n  </span>\n{{else}}\n  <span class={{classNames (if @isDisabled \"euiBadge-isDisabled\") componentName=\"EuiBadge\" iconSide=(argOrDefault @iconSide \"left\") color=(argOrDefault @color \"default\")}} ...attributes {{simpleStyle (inlineStyles componentName=\"EuiBadge\" componentArgs=(hash badgeColor=(argOrDefault @color \"default\")))}}>\n    <span class=\"euiBadge__content\">\n      <span class=\"euiBadge__text\">\n        {{yield}}\n      </span>\n    </span>\n  </span>\n{{/if}}", {
+const BADGE_COLORS = ['default', 'hollow', 'primary', 'accent', 'neutral', 'success', 'warning', 'risk', 'danger'];
+function isNamedColor(color) {
+  return BADGE_COLORS.includes(color);
+}
+/**
+ * Upstream `getSecureRelForTarget`: links always get `noreferrer`, and
+ * `noopener` when they open a new window.
+ */
+function secureRel(target, rel) {
+  const parts = rel ? rel.split(' ').filter(part => part.length && part !== 'noreferrer') : [];
+  parts.push('noreferrer');
+  if ((target ?? '').includes('_blank') && !parts.includes('noopener')) {
+    parts.push('noopener');
+  }
+  return parts.sort().join(' ').trim();
+}
+/** Upstream `validateHref`: `javascript:` URLs disable the badge. */
+function isHrefValid(href) {
+  try {
+    // A base keeps relative hrefs valid (upstream assumes absolute URLs).
+    return new URL(href, 'http://localhost').protocol !== 'javascript:';
+  } catch {
+    return true;
+  }
+}
+/**
+ * The bits of React EUI's global reset (`*` box sizing, `button` reset and
+ * the body font) that badges rely on. Composed before the upstream styles,
+ * so every upstream declaration wins.
+ */
+function euiBadgeReset({
+  euiTheme
+}) {
+  return {
+    boxSizing: 'border-box',
+    margin: 0,
+    font: 'inherit',
+    fontFamily: euiTheme.font.family,
+    '& :where(*, *::before, *::after)': {
+      boxSizing: 'border-box'
+    }
+  };
+}
+/** Attributes that stay on the root with both click handlers (upstream `className`, `style`). */
+const ROOT_ATTRIBUTES = new Set(['class', 'style']);
+/**
+ * Upstream: with `iconOnClick` and `onClick`/`href`, `className` and
+ * `style` stay on the outer span while the other props (`...rest`) go on the
+ * text button or link. Ember passes them all through `...attributes`, so the
+ * other attributes are moved from the root to the child after render and
+ * whenever they change.
+ */
+const restToChildButton = modifier(root => {
+  const move = () => {
+    const child = root.querySelector(':scope > .euiBadge__content > .euiBadge__childButton');
+    if (!child) return;
+    for (const {
+      name,
+      value
+    } of [...root.attributes]) {
+      if (ROOT_ATTRIBUTES.has(name)) continue;
+      child.setAttribute(name, value);
+      root.removeAttribute(name);
+    }
+  };
+  move();
+  const observer = new MutationObserver(move);
+  observer.observe(root, {
+    attributes: true
+  });
+  return () => observer.disconnect();
+});
+const buttonReset = {
+  background: 'none',
+  border: 'none',
+  padding: 0,
+  margin: 0,
+  color: 'inherit',
+  borderRadius: 0,
+  font: 'inherit',
+  cursor: 'pointer'
+};
+/** A small label: `<EuiBadge @color="success">Done</EuiBadge>`. */class EuiBadge extends Component {
+  get context() {
+    return getEuiThemeContext(this);
+  }
+  get styles() {
+    return useEuiBorealisStyles(this.context, euiBadgeStyles);
+  }
+  static {
+    n(this.prototype, "styles", [cached]);
+  }
+  get color() {
+    return this.args.color ?? 'default';
+  }
+  get isNamedColor() {
+    return isNamedColor(this.color);
+  }
+  get isDisabled() {
+    return Boolean(this.args.isDisabled || this.args.href && !isHrefValid(this.args.href));
+  }
+  get isClickable() {
+    return Boolean(this.args.onClick || this.args.href);
+  }
+  /** `a` for enabled links, `button` otherwise (links cannot be disabled). */
+  get isLink() {
+    return Boolean(this.args.href && !this.isDisabled);
+  }
+  get rel() {
+    return this.isLink ? secureRel(this.args.target, this.args.rel) : undefined;
+  }
+  get iconSide() {
+    return this.args.iconSide ?? 'left';
+  }
+  /**
+  * Upstream sets these as inline custom properties; a class keeps the
+  * caller's `style` attribute intact.
+  */
+  get customColorCss() {
+    if (this.isDisabled || this.isNamedColor) return undefined;
+    const color = this.color;
+    const upstream = this.context.upstream;
+    try {
+      const textColor = getTextColor(upstream, color);
+      const interactive = getCustomInteractiveColors(upstream, color);
+      return {
+        '--euiBadgeBackgroundColor': color,
+        '--euiBadgeTextColor': textColor,
+        '--euiBadgeBackgroundHoverColor': interactive.backgroundHover,
+        '--euiBadgeBackgroundActiveColor': interactive.backgroundActive
+      };
+    } catch {
+      warn(`EuiBadge expects a valid color: a hex, rgb(a) or hsv value, or one of ${BADGE_COLORS.join(', ')}. Instead got ${color}.`, Boolean(getIsValidColor(color)), {
+        id: 'ember-eui.eui-badge.invalid-color'
+      });
+      return undefined;
+    }
+  }
+  rootClass = hasText => {
+    const {
+      styles,
+      color,
+      isNamedColor
+    } = this;
+    const {
+      iconOnClick,
+      iconType,
+      fill
+    } = this.args;
+    const isRootButton = this.isClickable && !iconOnClick;
+    const variant = isNamedColor ? color === 'hollow' ? 'hollow' : fill ? 'fill' : 'base' : 'custom';
+    const named = color;
+    return euiClass(this.context, euiBadgeReset(this.context.upstream), isRootButton && !this.isLink ? buttonReset : undefined, styles.euiBadge, !hasText && iconType ? styles.iconOnly : undefined, ...(this.isDisabled ? [styles.disabled] : [isNamedColor && fill ? styles.colors.fill[named] : undefined, isNamedColor && !fill ? styles.colors.base[named] : undefined, isRootButton ? styles.clickable[variant] : undefined, iconOnClick && !this.isClickable ? styles.iconClickable[variant] : undefined]), this.customColorCss, this.args.css);
+  };
+  get contentClass() {
+    return euiClass(this.context, this.styles.euiBadge__content);
+  }
+  static {
+    n(this.prototype, "contentClass", [cached]);
+  }
+  get textClass() {
+    const {
+      text
+    } = this.styles;
+    return euiClass(this.context, text.euiBadge__text, this.isClickable && !this.isDisabled ? text.clickable : undefined);
+  }
+  static {
+    n(this.prototype, "textClass", [cached]);
+  }
+  get iconCss() {
+    const {
+      icon
+    } = this.styles;
+    return [icon.euiBadge__icon, icon[this.iconSide]];
+  }
+  static {
+    n(this.prototype, "iconCss", [cached]);
+  }
+  get iconButtonClass() {
+    const {
+      iconButton
+    } = this.styles;
+    return euiClass(this.context, buttonReset, iconButton.euiBadge__iconButton, iconButton[this.iconSide]);
+  }
+  static {
+    n(this.prototype, "iconButtonClass", [cached]);
+  }
+  get childButtonClass() {
+    return euiClass(this.context, this.isLink ? undefined : buttonReset, this.styles.euiBadge__childButton);
+  }
+  static {
+    n(this.prototype, "childButtonClass", [cached]);
+  }
+  static {
+    setComponentTemplate(precompileTemplate("{{#let (if (has-block) true false) as |hasText|}}\n  <EuiInnerText as |ref innerText|>\n    {{#if (and @iconOnClick this.isClickable)}}\n      {{!-- icon button and text button/link side by side --}}\n      <span class=\"euiBadge {{this.rootClass hasText}}\" ...attributes {{restToChildButton}}>\n        <span class=\"euiBadge__content {{this.contentClass}}\">\n          {{#if @iconType}}\n          {{#if (eq this.iconSide \"left\")}}\n            <BadgeIcon @type={{@iconType}} @useSvg={{@iconUseSvg}} @iconCss={{this.iconCss}} @buttonClass={{this.iconButtonClass}} @onClick={{@iconOnClick}} @ariaLabel={{@iconOnClickAriaLabel}} @disabled={{this.isDisabled}} @closeButtonProps={{@closeButtonProps}} />\n          {{/if}}\n          {{/if}}\n          {{#if this.isLink}}\n            <a class=\"euiBadge__childButton {{this.childButtonClass}}\" aria-label={{@onClickAriaLabel}} title={{innerText}} href={{@href}} target={{@target}} rel={{this.rel}} {{didInsert ref}} {{on \"click\" (optional @onClick)}}>{{yield}}</a>\n          {{else}}\n            <button type=\"button\" class=\"euiBadge__childButton {{this.childButtonClass}}\" aria-label={{@onClickAriaLabel}} title={{innerText}} disabled={{this.isDisabled}} {{didInsert ref}} {{on \"click\" (optional @onClick)}}>{{yield}}</button>\n          {{/if}}\n          {{#if @iconType}}\n          {{#if (eq this.iconSide \"right\")}}\n            <BadgeIcon @type={{@iconType}} @useSvg={{@iconUseSvg}} @iconCss={{this.iconCss}} @buttonClass={{this.iconButtonClass}} @onClick={{@iconOnClick}} @ariaLabel={{@iconOnClickAriaLabel}} @disabled={{this.isDisabled}} @closeButtonProps={{@closeButtonProps}} />\n          {{/if}}\n          {{/if}}\n        </span>\n      </span>\n    {{else}}\n      {{#let (component BadgeContent contentClass=this.contentClass textClass=this.textClass hasText=hasText iconSide=this.iconSide iconType=@iconType iconUseSvg=@iconUseSvg iconCss=this.iconCss iconButtonClass=this.iconButtonClass iconOnClick=@iconOnClick iconOnClickAriaLabel=@iconOnClickAriaLabel isDisabled=this.isDisabled closeButtonProps=@closeButtonProps) as |Content|}}\n        {{#if (and (not @iconOnClick) this.isLink)}}\n          <a class=\"euiBadge {{this.rootClass hasText}}\" aria-label={{@onClickAriaLabel}} title={{innerText}} href={{@href}} target={{@target}} rel={{this.rel}} ...attributes {{didInsert ref}} {{on \"click\" (optional @onClick)}}><Content>{{yield}}</Content></a>\n        {{else if (and (not @iconOnClick) this.isClickable)}}\n          <button type=\"button\" class=\"euiBadge {{this.rootClass hasText}}\" aria-label={{@onClickAriaLabel}} title={{innerText}} disabled={{this.isDisabled}} ...attributes {{didInsert ref}} {{on \"click\" (optional @onClick)}}><Content>{{yield}}</Content></button>\n        {{else}}\n          <span class=\"euiBadge {{this.rootClass hasText}}\" title={{innerText}} ...attributes {{didInsert ref}}><Content>{{yield}}</Content></span>\n        {{/if}}\n      {{/let}}\n    {{/if}}\n  </EuiInnerText>\n{{/let}}", {
+      strictMode: true,
+      scope: () => ({
+        EuiInnerText: EuiImage$1,
+        and,
+        restToChildButton,
+        eq,
+        BadgeIcon,
+        didInsert,
+        on,
+        optional,
+        BadgeContent,
+        not
+      })
+    }), this);
+  }
+}
+const BadgeIcon = setComponentTemplate(precompileTemplate("{{#if @onClick}}\n  <button type=\"button\" class=\"euiBadge__iconButton {{@buttonClass}}\" aria-label={{@ariaLabel}} disabled={{@disabled}} title={{@ariaLabel}} tabindex={{@closeButtonProps.tabIndex}} data-selected-index={{@closeButtonProps.dataSelectedIconIndex}} {{on \"click\" @onClick}}>\n    <EuiIcon @color=\"inherit\" @iconClasses=\"euiBadge__icon {{@closeButtonProps.iconClasses}}\" @css={{@iconCss}} @type={{@type}} @useSvg={{@useSvg}} @size=\"s\" />\n  </button>\n{{else}}\n  <EuiIcon @color=\"inherit\" @iconClasses=\"euiBadge__icon\" @css={{@iconCss}} @type={{@type}} @useSvg={{@useSvg}} @size=\"s\" />\n{{/if}}", {
   strictMode: true,
   scope: () => ({
-    and,
-    or,
-    not,
-    classNames,
-    argOrDefault,
-    simpleStyle,
-    inlineStyles,
-    hash,
     on,
-    optional,
     EuiIcon
   })
 }), templateOnly());
+const BadgeContent = setComponentTemplate(precompileTemplate("<span class=\"euiBadge__content {{@contentClass}}\">\n  {{#if @iconType}}\n  {{#if (eq @iconSide \"left\")}}\n    <BadgeIcon @type={{@iconType}} @useSvg={{@iconUseSvg}} @iconCss={{@iconCss}} @buttonClass={{@iconButtonClass}} @onClick={{@iconOnClick}} @ariaLabel={{@iconOnClickAriaLabel}} @disabled={{@isDisabled}} @closeButtonProps={{@closeButtonProps}} />\n  {{/if}}\n  {{/if}}\n  {{#if @hasText}}\n    <span class=\"euiBadge__text {{@textClass}}\">{{yield}}</span>\n  {{/if}}\n  {{#if @iconType}}\n  {{#if (eq @iconSide \"right\")}}\n    <BadgeIcon @type={{@iconType}} @useSvg={{@iconUseSvg}} @iconCss={{@iconCss}} @buttonClass={{@iconButtonClass}} @onClick={{@iconOnClick}} @ariaLabel={{@iconOnClickAriaLabel}} @disabled={{@isDisabled}} @closeButtonProps={{@closeButtonProps}} />\n  {{/if}}\n  {{/if}}\n</span>", {
+  strictMode: true,
+  scope: () => ({
+    eq,
+    BadgeIcon
+  })
+}), templateOnly());
-export { EuiBadge as default };
+export { BADGE_COLORS, EuiBadge as default, euiBadgeReset, secureRel };
 //# sourceMappingURL=eui-badge.js.map

package/dist/components/eui-badge.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"eui-badge.js","sources":["../../src/components/eui-badge.gts"],"sourcesContent":["import { hash } from '@ember/helper';\nimport { on } from '@ember/modifier';\n\nimport optional from '@nullvoxpopuli/ember-composable-helpers/helpers/optional';\nimport { and, not, or } from 'ember-truth-helpers';\n\nimport argOrDefault from '../helpers/arg-or-default.ts';\nimport classNames from '../helpers/class-names.ts';\nimport inlineStyles from '../helpers/inline-styles.ts';\nimport simpleStyle from '../modifiers/simple-style.ts';\nimport EuiIcon from './eui-icon.gts';\n\nimport type {\n colorMapping,\n EuiBadgeColorType\n} from '../utils/css-mappings/eui-badge.ts';\nimport type { EuiIconSignature } from './eui-icon';\nimport type { TemplateOnlyComponent } from '@ember/component/template-only';\n\nexport interface EuiBadgeSignature {\n Element: HTMLButtonElement \| HTMLAnchorElement \| HTMLSpanElement;\n Args: {\n /*\n `'default'`, `'hollow'`, `'primary'`, `'success'`, `'accent'`,\n * `'warning'`, `'danger'` or any hex color (`'#DA8B45'`); the text color\n * is picked for contrast. Defaults to `'default'`.\n /\n color?: keyof typeof colorMapping \| EuiBadgeColorType \| string;\n /\n Icon shown in the badge, anything `EuiIcon`'s `@type` accepts.\n /\n iconType?: EuiIconSignature['Args']['type'];\n /\n Side of the text the icon is on. Defaults to `'left'`.\n /\n iconSide?: 'left' \| 'right';\n /\n Makes the icon a separate button calling this function, e.g. an \"x\" to\n * remove the badge. Requires `@iconType` and `@iconOnClickAriaLabel`.\n /\n iconOnClick?: () => void;\n /\n Accessible label (and hover title) of the `@iconOnClick` button.\n /\n iconOnClickAriaLabel?: string;\n /\n @deprecated Has no effect, see `EuiIcon`.\n /\n iconUseSvg?: boolean;\n /\n Disables the badge's buttons and links and greys it out.\n /\n isDisabled?: boolean;\n /\n Makes the badge (or its text, when it has an `@iconType`) a button\n * calling this function.\n /\n onClick?: () => void;\n /\n Accessible label of the `@onClick` button, when the text alone does not\n * describe the action.\n /\n onClickAriaLabel?: string;\n /\n Makes the badge (or its text, when it has an `@iconType`) a link.\n /\n href?: string;\n /\n `target` of the `@href` link, e.g. `'_blank'`.\n /\n target?: string;\n /\n Extra props for the `@iconOnClick` button.\n /\n closeButtonProps?: {\n tabIndex?: number;\n dataSelectedIconIndex?: number;\n iconClasses?: string;\n };\n };\n Blocks: {\n /* The badge's text. */\n default: [];\n };\n}\n\nconst EuiBadge: TemplateOnlyComponent<EuiBadgeSignature> = <template>\n {{#if (and (or @onClick @href) (not @iconType))}}\n {{! like EUI: a disabled badge is a disabled button, as <a> cannot be disabled }}\n {{#if (or @onClick @isDisabled)}}\n <button\n type=\"button\"\n class={{classNames\n \"euiBadge-isClickable\"\n (if @isDisabled \"euiBadge-isDisabled\")\n componentName=\"EuiBadge\"\n color=(argOrDefault @color \"default\")\n }}\n aria-label={{@onClickAriaLabel}}\n disabled={{@isDisabled}}\n ...attributes\n {{simpleStyle\n (inlineStyles\n componentName=\"EuiBadge\"\n componentArgs=(hash badgeColor=(argOrDefault @color \"default\"))\n )\n }}\n {{on \"click\" (optional @onClick)}}\n >\n <span class=\"euiBadge__content\">\n <span class=\"euiBadge__text\">\n {{yield}}\n </span>\n </span>\n </button>\n {{else}}\n <a\n class={{classNames\n \"euiBadge-isClickable\"\n (if @isDisabled \"euiBadge-isDisabled\")\n componentName=\"EuiBadge\"\n color=(argOrDefault @color \"default\")\n }}\n target={{@target}}\n href={{@href}}\n ...attributes\n {{simpleStyle\n (inlineStyles\n componentName=\"EuiBadge\"\n componentArgs=(hash badgeColor=(argOrDefault @color \"default\"))\n )\n }}\n >\n <span class=\"euiBadge__content\">\n <span class=\"euiBadge__text\">\n {{yield}}\n </span>\n </span>\n </a>\n {{/if}}\n {{else if @iconType}}\n <span\n class={{classNames\n (if @isDisabled \"euiBadge-isDisabled\")\n componentName=\"EuiBadge\"\n iconSide=(argOrDefault @iconSide \"left\")\n color=(argOrDefault @color \"default\")\n }}\n ...attributes\n {{simpleStyle\n (inlineStyles\n componentName=\"EuiBadge\"\n componentArgs=(hash badgeColor=(argOrDefault @color \"default\"))\n )\n }}\n >\n <span class=\"euiBadge__content\">\n {{#if (has-block)}}\n {{#if (or @onClick @isDisabled)}}\n <button\n class=\"euiBadge__childButton\"\n type=\"button\"\n disabled={{@isDisabled}}\n {{on \"click\" (optional @onClick)}}\n >\n {{yield}}\n </button>\n {{else if @href}}\n <a\n class=\"euiBadge__childButton\"\n href={{@href}}\n target={{@target}}\n >\n {{yield}}\n </a>\n {{else}}\n <span class=\"euiBadge__text\">\n {{yield}}\n </span>\n {{/if}}\n {{/if}}\n {{#if @iconOnClick}}\n {{! template-lint-disable }}\n <button\n type=\"button\"\n class=\"euiBadge__iconButton\"\n aria-label={{@iconOnClickAriaLabel}}\n disabled={{@isDisabled}}\n title={{@iconOnClickAriaLabel}}\n tabindex={{@closeButtonProps.tabIndex}}\n data-selected-index={{@closeButtonProps.dataSelectedIconIndex}}\n {{on \"click\" (optional @iconOnClick)}}\n >\n <EuiIcon\n @color=\"inherit\"\n @iconClasses={{classNames\n \"euiBadge__icon\"\n @closeButtonProps.iconClasses\n }}\n @type={{@iconType}}\n @useSvg={{@iconUseSvg}}\n @size={{if (has-block) \"s\" \"m\"}}\n />\n </button>\n {{! tempalte-lint-enable}}\n {{else}}\n <EuiIcon\n @color=\"inherit\"\n @type={{@iconType}}\n @useSvg={{@iconUseSvg}}\n @size={{if (has-block) \"s\" \"m\"}}\n @iconClasses=\"euiBadge__icon\"\n />\n {{/if}}\n </span>\n </span>\n {{else}}\n <span\n class={{classNames\n (if @isDisabled \"euiBadge-isDisabled\")\n componentName=\"EuiBadge\"\n iconSide=(argOrDefault @iconSide \"left\")\n color=(argOrDefault @color \"default\")\n }}\n ...attributes\n {{simpleStyle\n (inlineStyles\n componentName=\"EuiBadge\"\n componentArgs=(hash badgeColor=(argOrDefault @color \"default\"))\n )\n }}\n >\n <span class=\"euiBadge__content\">\n <span class=\"euiBadge__text\">\n {{yield}}\n </span>\n </span>\n </span>\n {{/if}}\n</template>;\n\nexport default EuiBadge;\n"],"names":["EuiBadge","setComponentTemplate","precompileTemplate","strictMode","scope","and","or","not","classNames","argOrDefault","simpleStyle","inlineStyles","hash","on","optional","EuiIcon","templateOnly"],"mappings":";;;;;;;;;;;;;AAsFA,MAAMA,QAAgC,GAAAC,oBAAA,CAAqBC,kBAAA,CAAA,m5GAAA,EAyJ3D;EAAAC,UAAA,EAAA,IAAA;AAAAC,EAAAA,KAAA,EAAAA,OAAA;IAAAC,GAAA;IAAAC,EAAA;IAAAC,GAAA;IAAAC,UAAA;IAAAC,YAAA;IAAAC,WAAA;IAAAC,YAAA;IAAAC,IAAA;IAAAC,EAAA;IAAAC,QAAA;AAAAC,IAAAA;AAAA,GAAA;AAAU,CAAA,CAAA,EAAAC,YAAA,EAAA;;"}
1	+ {"version":3,"file":"eui-badge.js","sources":["../../src/components/eui-badge.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { cached } from '@glimmer/tracking';\nimport { warn } from '@ember/debug';\nimport { on } from '@ember/modifier';\nimport didInsert from '@ember/render-modifiers/modifiers/did-insert';\n\nimport optional from '@nullvoxpopuli/ember-composable-helpers/helpers/optional';\nimport { modifier } from 'ember-modifier';\nimport { and, eq, not } from 'ember-truth-helpers';\n\nimport { getEuiThemeContext } from '../utils/emotion/consume.ts';\nimport { euiClass, useEuiBorealisStyles } from '../utils/eui/styles.ts';\nimport type { EuiCss } from '../utils/eui/styles.ts';\nimport {\n euiBadgeStyles,\n getCustomInteractiveColors,\n getIsValidColor,\n getTextColor\n} from '../utils/eui/styles.generated.ts';\nimport EuiIcon from './eui-icon.gts';\nimport EuiInnerText from './eui-inner-text.gts';\n\nimport type { CSSObject } from '@emotion/css/create-instance';\nimport type { EuiThemeContext } from '../utils/emotion/context.ts';\nimport type { EuiBorealisContext } from '../utils/eui/theme.ts';\nimport type { EuiIconSignature } from './eui-icon';\nimport type { TemplateOnlyComponent } from '@ember/component/template-only';\n\n/** Named badge colors of EUI 123 (Borealis). /\nexport const BADGE_COLORS = [\n 'default',\n 'hollow',\n 'primary',\n 'accent',\n 'neutral',\n 'success',\n 'warning',\n 'risk',\n 'danger'\n] as const;\n\nexport type EuiBadgeNamedColor = (typeof BADGE_COLORS)[number];\n\nfunction isNamedColor(color: string): color is EuiBadgeNamedColor {\n return (BADGE_COLORS as readonly string[]).includes(color);\n}\n\n/\n Upstream `getSecureRelForTarget`: links always get `noreferrer`, and\n * `noopener` when they open a new window.\n /\nexport function secureRel(target?: string, rel?: string): string {\n const parts = rel\n ? rel.split(' ').filter((part) => part.length && part !== 'noreferrer')\n : [];\n parts.push('noreferrer');\n if ((target ?? '').includes('_blank') && !parts.includes('noopener')) {\n parts.push('noopener');\n }\n return parts.sort().join(' ').trim();\n}\n\n/* Upstream `validateHref`: `javascript:` URLs disable the badge. /\nfunction isHrefValid(href: string): boolean {\n try {\n // A base keeps relative hrefs valid (upstream assumes absolute URLs).\n return new URL(href, 'http://localhost').protocol !== 'javascript:';\n } catch {\n return true;\n }\n}\n\n/\n The bits of React EUI's global reset (`` box sizing, `button` reset and\n the body font) that badges rely on. Composed before the upstream styles,\n * so every upstream declaration wins.\n /\nexport function euiBadgeReset({ euiTheme }: EuiBorealisContext): CSSObject {\n return {\n boxSizing: 'border-box',\n margin: 0,\n font: 'inherit',\n fontFamily: euiTheme.font.family,\n '& :where(, ::before, ::after)': { boxSizing: 'border-box' }\n };\n}\n\n/** Attributes that stay on the root with both click handlers (upstream `className`, `style`). /\nconst ROOT_ATTRIBUTES = new Set(['class', 'style']);\n\n/\n Upstream: with `iconOnClick` and `onClick`/`href`, `className` and\n * `style` stay on the outer span while the other props (`...rest`) go on the\n * text button or link. Ember passes them all through `...attributes`, so the\n * other attributes are moved from the root to the child after render and\n * whenever they change.\n /\nconst restToChildButton = modifier((root: HTMLElement) => {\n const move = () => {\n const child = root.querySelector(':scope > .euiBadge__content > .euiBadge__childButton');\n if (!child) return;\n for (const { name, value } of [...root.attributes]) {\n if (ROOT_ATTRIBUTES.has(name)) continue;\n child.setAttribute(name, value);\n root.removeAttribute(name);\n }\n };\n move();\n const observer = new MutationObserver(move);\n observer.observe(root, { attributes: true });\n return () => observer.disconnect();\n});\n\nconst buttonReset: CSSObject = {\n background: 'none',\n border: 'none',\n padding: 0,\n margin: 0,\n color: 'inherit',\n borderRadius: 0,\n font: 'inherit',\n cursor: 'pointer'\n};\n\nexport interface EuiBadgeSignature {\n Element: HTMLButtonElement \| HTMLAnchorElement \| HTMLSpanElement;\n Args: {\n /\n `'default'`, `'hollow'`, `'primary'`, `'accent'`, `'neutral'`,\n * `'success'`, `'warning'`, `'risk'`, `'danger'` or any CSS color\n * (`'#DA8B45'`, `'rgb(…)'`); custom colors get a text color picked for\n * contrast. Defaults to `'default'`.\n /\n color?: EuiBadgeNamedColor \| string;\n /\n Named colors only: the stronger, filled variant of the color.\n * Defaults to `false`.\n /\n fill?: boolean;\n /\n Icon shown in the badge, anything `EuiIcon`'s `@type` accepts.\n /\n iconType?: EuiIconSignature['Args']['type'];\n /\n Side of the text the icon is on (logical, so it flips in RTL).\n * Defaults to `'left'`.\n /\n iconSide?: 'left' \| 'right';\n /\n Makes the icon a separate button calling this function, e.g. an \"x\" to\n * remove the badge. Requires `@iconType` and `@iconOnClickAriaLabel`.\n * With `@onClick` or `@href` too, attributes other than `class` and\n * `style` go on the text button or link (upstream `...rest`).\n /\n iconOnClick?: (event: MouseEvent) => void;\n /\n Accessible label (and hover title) of the `@iconOnClick` button.\n /\n iconOnClickAriaLabel?: string;\n /\n @deprecated Has no effect, see `EuiIcon`.\n /\n iconUseSvg?: boolean;\n /\n Disables the badge's buttons and links and greys it out.\n /\n isDisabled?: boolean;\n /\n Makes the badge (or its text, with `@iconOnClick`) a button calling\n * this function.\n /\n onClick?: (event: MouseEvent) => void;\n /\n Accessible label of the `@onClick` button, when the text alone does not\n * describe the action.\n /\n onClickAriaLabel?: string;\n /\n Makes the badge (or its text, with `@iconOnClick`) a link.\n /\n href?: string;\n /\n `target` of the `@href` link, e.g. `'_blank'`.\n /\n target?: string;\n /\n `rel` of the `@href` link. `noreferrer` (and `noopener` for\n * `_blank`) is always added.\n /\n rel?: string;\n /\n Extra props for the `@iconOnClick` button.\n /\n closeButtonProps?: {\n tabIndex?: number;\n dataSelectedIconIndex?: number;\n iconClasses?: string;\n };\n /\n Extra styles composed last into this component's class (like upstream's\n * `css` prop). Prefer this to an extra class when styling it from a parent.\n /\n css?: EuiCss;\n };\n Blocks: {\n /* The badge's text. /\n default: [];\n };\n}\n\n/* A small label: `<EuiBadge @color=\"success\">Done</EuiBadge>`. /\nexport default class EuiBadge extends Component<EuiBadgeSignature> {\n get context(): EuiThemeContext {\n return getEuiThemeContext(this);\n }\n\n @cached\n get styles() {\n return useEuiBorealisStyles(this.context, euiBadgeStyles);\n }\n\n get color(): string {\n return this.args.color ?? 'default';\n }\n\n get isNamedColor(): boolean {\n return isNamedColor(this.color);\n }\n\n get isDisabled(): boolean {\n return Boolean(\n this.args.isDisabled \|\| (this.args.href && !isHrefValid(this.args.href))\n );\n }\n\n get isClickable(): boolean {\n return Boolean(this.args.onClick \|\| this.args.href);\n }\n\n /* `a` for enabled links, `button` otherwise (links cannot be disabled). /\n get isLink(): boolean {\n return Boolean(this.args.href && !this.isDisabled);\n }\n\n get rel(): string \| undefined {\n return this.isLink ? secureRel(this.args.target, this.args.rel) : undefined;\n }\n\n get iconSide(): 'left' \| 'right' {\n return this.args.iconSide ?? 'left';\n }\n\n /\n Upstream sets these as inline custom properties; a class keeps the\n * caller's `style` attribute intact.\n /\n get customColorCss(): CSSObject \| undefined {\n if (this.isDisabled \|\| this.isNamedColor) return undefined;\n const color = this.color;\n const upstream = this.context.upstream;\n try {\n const textColor = getTextColor(upstream, color) as string;\n const interactive = getCustomInteractiveColors(upstream, color) as {\n backgroundHover: string;\n backgroundActive: string;\n };\n return {\n '--euiBadgeBackgroundColor': color,\n '--euiBadgeTextColor': textColor,\n '--euiBadgeBackgroundHoverColor': interactive.backgroundHover,\n '--euiBadgeBackgroundActiveColor': interactive.backgroundActive\n };\n } catch {\n warn(\n `EuiBadge expects a valid color: a hex, rgb(a) or hsv value, or one of ${BADGE_COLORS.join(', ')}. Instead got ${color}.`,\n Boolean(getIsValidColor(color)),\n { id: 'ember-eui.eui-badge.invalid-color' }\n );\n return undefined;\n }\n }\n\n rootClass = (hasText: boolean): string => {\n const { styles, color, isNamedColor } = this;\n const { iconOnClick, iconType, fill } = this.args;\n const isRootButton = this.isClickable && !iconOnClick;\n const variant = isNamedColor\n ? color === 'hollow'\n ? 'hollow'\n : fill\n ? 'fill'\n : 'base'\n : 'custom';\n const named = color as EuiBadgeNamedColor;\n return euiClass(\n this.context,\n euiBadgeReset(this.context.upstream),\n isRootButton && !this.isLink ? buttonReset : undefined,\n styles.euiBadge,\n !hasText && iconType ? styles.iconOnly : undefined,\n ...(this.isDisabled\n ? [styles.disabled]\n : [\n isNamedColor && fill ? styles.colors.fill[named] : undefined,\n isNamedColor && !fill ? styles.colors.base[named] : undefined,\n isRootButton ? styles.clickable[variant] : undefined,\n iconOnClick && !this.isClickable\n ? styles.iconClickable[variant]\n : undefined\n ]),\n this.customColorCss,\n this.args.css\n );\n };\n\n @cached\n get contentClass(): string {\n return euiClass(this.context, this.styles.euiBadge__content);\n }\n\n @cached\n get textClass(): string {\n const { text } = this.styles;\n return euiClass(\n this.context,\n text.euiBadge__text,\n this.isClickable && !this.isDisabled ? text.clickable : undefined\n );\n }\n\n @cached\n /* Composed into EuiIcon's own class via `@css`. */\n get iconCss(): EuiCss {\n const { icon } = this.styles;\n return [icon.euiBadge__icon, icon[this.iconSide]];\n }\n\n @cached\n get iconButtonClass(): string {\n const { iconButton } = this.styles;\n return euiClass(\n this.context,\n buttonReset,\n iconButton.euiBadge__iconButton,\n iconButton[this.iconSide]\n );\n }\n\n @cached\n get childButtonClass(): string {\n return euiClass(\n this.context,\n this.isLink ? undefined : buttonReset,\n this.styles.euiBadge__childButton\n );\n }\n\n <template>\n {{#let (if (has-block) true false) as \|hasText\|}}\n <EuiInnerText as \|ref innerText\|>\n {{#if (and @iconOnClick this.isClickable)}}\n {{! icon button and text button/link side by side }}\n <span\n class=\"euiBadge {{this.rootClass hasText}}\"\n ...attributes\n {{restToChildButton}}\n >\n <span class=\"euiBadge__content {{this.contentClass}}\">\n {{#if @iconType}}\n {{#if (eq this.iconSide \"left\")}}\n <BadgeIcon\n @type={{@iconType}}\n @useSvg={{@iconUseSvg}}\n @iconCss={{this.iconCss}}\n @buttonClass={{this.iconButtonClass}}\n @onClick={{@iconOnClick}}\n @ariaLabel={{@iconOnClickAriaLabel}}\n @disabled={{this.isDisabled}}\n @closeButtonProps={{@closeButtonProps}}\n />\n {{/if}}\n {{/if}}\n {{#if this.isLink}}\n <a\n class=\"euiBadge__childButton {{this.childButtonClass}}\"\n aria-label={{@onClickAriaLabel}}\n title={{innerText}}\n href={{@href}}\n target={{@target}}\n rel={{this.rel}}\n {{didInsert ref}}\n {{on \"click\" (optional @onClick)}}\n >{{yield}}</a>\n {{else}}\n <button\n type=\"button\"\n class=\"euiBadge__childButton {{this.childButtonClass}}\"\n aria-label={{@onClickAriaLabel}}\n title={{innerText}}\n disabled={{this.isDisabled}}\n {{didInsert ref}}\n {{on \"click\" (optional @onClick)}}\n >{{yield}}</button>\n {{/if}}\n {{#if @iconType}}\n {{#if (eq this.iconSide \"right\")}}\n <BadgeIcon\n @type={{@iconType}}\n @useSvg={{@iconUseSvg}}\n @iconCss={{this.iconCss}}\n @buttonClass={{this.iconButtonClass}}\n @onClick={{@iconOnClick}}\n @ariaLabel={{@iconOnClickAriaLabel}}\n @disabled={{this.isDisabled}}\n @closeButtonProps={{@closeButtonProps}}\n />\n {{/if}}\n {{/if}}\n </span>\n </span>\n {{else}}\n {{#let\n (component\n BadgeContent\n contentClass=this.contentClass\n textClass=this.textClass\n hasText=hasText\n iconSide=this.iconSide\n iconType=@iconType\n iconUseSvg=@iconUseSvg\n iconCss=this.iconCss\n iconButtonClass=this.iconButtonClass\n iconOnClick=@iconOnClick\n iconOnClickAriaLabel=@iconOnClickAriaLabel\n isDisabled=this.isDisabled\n closeButtonProps=@closeButtonProps\n )\n as \|Content\|\n }}\n {{#if (and (not @iconOnClick) this.isLink)}}\n <a\n class=\"euiBadge {{this.rootClass hasText}}\"\n aria-label={{@onClickAriaLabel}}\n title={{innerText}}\n href={{@href}}\n target={{@target}}\n rel={{this.rel}}\n ...attributes\n {{didInsert ref}}\n {{on \"click\" (optional @onClick)}}\n ><Content>{{yield}}</Content></a>\n {{else if (and (not @iconOnClick) this.isClickable)}}\n <button\n type=\"button\"\n class=\"euiBadge {{this.rootClass hasText}}\"\n aria-label={{@onClickAriaLabel}}\n title={{innerText}}\n disabled={{this.isDisabled}}\n ...attributes\n {{didInsert ref}}\n {{on \"click\" (optional @onClick)}}\n ><Content>{{yield}}</Content></button>\n {{else}}\n <span\n class=\"euiBadge {{this.rootClass hasText}}\"\n title={{innerText}}\n ...attributes\n {{didInsert ref}}\n ><Content>{{yield}}</Content></span>\n {{/if}}\n {{/let}}\n {{/if}}\n </EuiInnerText>\n {{/let}}\n </template>\n}\n\ninterface BadgeIconSignature {\n Args: {\n type: EuiIconSignature['Args']['type'];\n useSvg?: boolean;\n iconCss: EuiCss;\n buttonClass: string;\n onClick?: (event: MouseEvent) => void;\n ariaLabel?: string;\n disabled: boolean;\n closeButtonProps?: EuiBadgeSignature['Args']['closeButtonProps'];\n };\n}\n\nconst BadgeIcon: TemplateOnlyComponent<BadgeIconSignature> = <template>\n {{#if @onClick}}\n <button\n type=\"button\"\n class=\"euiBadge__iconButton {{@buttonClass}}\"\n aria-label={{@ariaLabel}}\n disabled={{@disabled}}\n title={{@ariaLabel}}\n tabindex={{@closeButtonProps.tabIndex}}\n data-selected-index={{@closeButtonProps.dataSelectedIconIndex}}\n {{on \"click\" @onClick}}\n >\n <EuiIcon\n @color=\"inherit\"\n @iconClasses=\"euiBadge__icon {{@closeButtonProps.iconClasses}}\"\n @css={{@iconCss}}\n @type={{@type}}\n @useSvg={{@useSvg}}\n @size=\"s\"\n />\n </button>\n {{else}}\n <EuiIcon\n @color=\"inherit\"\n @iconClasses=\"euiBadge__icon\"\n @css={{@iconCss}}\n @type={{@type}}\n @useSvg={{@useSvg}}\n @size=\"s\"\n />\n {{/if}}\n</template>;\n\ninterface BadgeContentSignature {\n Args: {\n contentClass: string;\n textClass: string;\n hasText: boolean;\n iconSide: 'left' \| 'right';\n iconType?: EuiIconSignature['Args']['type'];\n iconUseSvg?: boolean;\n iconCss: EuiCss;\n iconButtonClass: string;\n iconOnClick?: (event: MouseEvent) => void;\n iconOnClickAriaLabel?: string;\n isDisabled: boolean;\n closeButtonProps?: EuiBadgeSignature['Args']['closeButtonProps'];\n };\n Blocks: { default: [] };\n}\n\nconst BadgeContent: TemplateOnlyComponent<BadgeContentSignature> = <template>\n <span class=\"euiBadge__content {{@contentClass}}\">\n {{#if @iconType}}\n {{#if (eq @iconSide \"left\")}}\n <BadgeIcon\n @type={{@iconType}}\n @useSvg={{@iconUseSvg}}\n @iconCss={{@iconCss}}\n @buttonClass={{@iconButtonClass}}\n @onClick={{@iconOnClick}}\n @ariaLabel={{@iconOnClickAriaLabel}}\n @disabled={{@isDisabled}}\n @closeButtonProps={{@closeButtonProps}}\n />\n {{/if}}\n {{/if}}\n {{#if @hasText}}\n <span class=\"euiBadge__text {{@textClass}}\">{{yield}}</span>\n {{/if}}\n {{#if @iconType}}\n {{#if (eq @iconSide \"right\")}}\n <BadgeIcon\n @type={{@iconType}}\n @useSvg={{@iconUseSvg}}\n @iconCss={{@iconCss}}\n @buttonClass={{@iconButtonClass}}\n @onClick={{@iconOnClick}}\n @ariaLabel={{@iconOnClickAriaLabel}}\n @disabled={{@isDisabled}}\n @closeButtonProps={{@closeButtonProps}}\n />\n {{/if}}\n {{/if}}\n </span>\n</template>;\n"],"names":["BADGE_COLORS","isNamedColor","color","includes","secureRel","target","rel","parts","split","filter","part","length","push","sort","join","trim","isHrefValid","href","URL","protocol","euiBadgeReset","euiTheme","boxSizing","margin","font","fontFamily","family","ROOT_ATTRIBUTES","Set","restToChildButton","modifier","root","move","child","querySelector","name","value","attributes","has","setAttribute","removeAttribute","observer","MutationObserver","observe","disconnect","buttonReset","background","border","padding","borderRadius","cursor","EuiBadge","Component","context","getEuiThemeContext","styles","useEuiBorealisStyles","euiBadgeStyles","n","prototype","cached","args","isDisabled","Boolean","isClickable","onClick","isLink","undefined","iconSide","customColorCss","upstream","textColor","getTextColor","interactive","getCustomInteractiveColors","backgroundHover","backgroundActive","warn","getIsValidColor","id","rootClass","hasText","iconOnClick","iconType","fill","isRootButton","variant","named","euiClass","euiBadge","iconOnly","disabled","colors","base","clickable","iconClickable","css","contentClass","euiBadge__content","textClass","text","euiBadge__text","iconCss","icon","euiBadge__icon","iconButtonClass","iconButton","euiBadge__iconButton","childButtonClass","euiBadge__childButton","setComponentTemplate","precompileTemplate","strictMode","scope","EuiInnerText","and","eq","BadgeIcon","didInsert","on","optional","BadgeContent","not","EuiIcon","templateOnly"],"mappings":";;;;;;;;;;;;;;;;;;AA6BO,MAAMA,YAAA,GAAe,CAC1B,SAAA,EACA,QAAA,EACA,SAAA,EACA,QAAA,EACA,SAAA,EACA,SAAA,EACA,SAAA,EACA,MAAA,EACA,QAAA;AAKF,SAASC,YAAAA,CAAaC,KAAa,EAAY;AAC7C,EAAA,OAAQF,YAAA,CAAmCG,QAAQ,CAACD,KAAA,CAAA;AACtD;AAEA;;;;AAIO,SAASE,SAAAA,CAAUC,MAAe,EAAEC,GAAY,EAAS;EAC9D,MAAMC,KAAA,GAAQD,GAAA,GACVA,GAAA,CAAIE,KAAK,CAAC,GAAA,CAAA,CAAKC,MAAM,CAAEC,QAASA,IAAA,CAAKC,MAAM,IAAID,IAAA,KAAS,gBACxD,EAAE;AACNH,EAAAA,KAAA,CAAMK,IAAI,CAAC,YAAA,CAAA;AACX,EAAA,IAAI,CAACP,MAAA,IAAU,EAAE,EAAEF,QAAQ,CAAC,QAAA,CAAA,IAAa,CAACI,KAAA,CAAMJ,QAAQ,CAAC,UAAA,CAAA,EAAa;AACpEI,IAAAA,KAAA,CAAMK,IAAI,CAAC,UAAA,CAAA;AACb,EAAA;AACA,EAAA,OAAOL,MAAMM,IAAI,EAAA,CAAGC,IAAI,CAAC,KAAKC,IAAI,EAAA;AACpC;AAEA;AACA,SAASC,WAAAA,CAAYC,IAAY,EAAU;EACzC,IAAI;AACF;IACA,OAAO,IAAIC,GAAA,CAAID,IAAA,EAAM,kBAAA,CAAA,CAAoBE,QAAQ,KAAK,aAAA;AACxD,EAAA,CAAA,CAAE,MAAM;AACN,IAAA,OAAO,IAAA;AACT,EAAA;AACF;AAEA;;;;AAIC;AACM,SAASC,aAAAA,CAAc;AAAEC,EAAAA;CAA8B,EAAG;EAC/D,OAAO;AACLC,IAAAA,SAAA,EAAW,YAAA;AACXC,IAAAA,MAAA,EAAQ,CAAA;AACRC,IAAAA,IAAA,EAAM,SAAA;AACNC,IAAAA,UAAA,EAAYJ,QAAA,CAASG,IAAI,CAACE,MAAM;AAChC,IAAA,kCAAA,EAAoC;AAAEJ,MAAAA,SAAA,EAAW;AAAa;GAChE;AACF;AAEA;AACA,MAAMK,eAAA,GAAkB,IAAIC,GAAA,CAAI,CAAC,OAAA,EAAS,OAAA,CAAQ,CAAA;AAElD;;;;;;AAMC;AACD,MAAMC,iBAAA,GAAoBC,QAAA,CAAUC,IAAM,IAAA;EACxC,MAAMC,IAAA,GAAOA,MAAA;AACX,IAAA,MAAMC,KAAA,GAAQF,IAAA,CAAKG,aAAa,CAAC,sDAAA,CAAA;IACjC,IAAI,CAACD,KAAA,EAAO;AACZ,IAAA,KAAK,MAAM;MAAEE,IAAI;AAAEC,MAAAA;KAAO,IAAI,CAAI,GAAAL,IAAA,CAAKM,UAAU,CAAC,EAAE;AAClD,MAAA,IAAIV,eAAA,CAAgBW,GAAG,CAACH,IAAA,CAAA,EAAO;AAC/BF,MAAAA,KAAA,CAAMM,YAAY,CAACJ,IAAA,EAAMC,KAAA,CAAA;AACzBL,MAAAA,IAAA,CAAKS,eAAe,CAACL,IAAA,CAAA;AACvB,IAAA;EACF,CAAA;AACAH,EAAAA,IAAA,EAAA;AACA,EAAA,MAAMS,QAAA,GAAW,IAAIC,gBAAA,CAAiBV,IAAA,CAAA;AACtCS,EAAAA,QAAA,CAASE,OAAO,CAACZ,IAAA,EAAM;AAAEM,IAAAA,UAAA,EAAY;AAAK,GAAA,CAAA;AAC1C,EAAA,OAAO,MAAMI,SAASG,UAAU,EAAA;AAClC,CAAA,CAAA;AAEA,MAAMC,WAAa,GAAY;AAC7BC,EAAAA,UAAA,EAAY,MAAA;AACZC,EAAAA,MAAA,EAAQ,MAAA;AACRC,EAAAA,OAAA,EAAS,CAAA;AACTzB,EAAAA,MAAA,EAAQ,CAAA;AACRrB,EAAAA,KAAA,EAAO,SAAA;AACP+C,EAAAA,YAAA,EAAc,CAAA;AACdzB,EAAAA,IAAA,EAAM,SAAA;AACN0B,EAAAA,MAAA,EAAQ;AACV,CAAA;AAwFA,mEACe,MAAMC,QAAA,SAAiBC,SAAA,CAAU;EAC9C,IAAIC,UAA2B;IAC7B,OAAOC,mBAAmB,IAAI,CAAA;AAChC,EAAA;EAEA,IACIC,MAAAA,GAAS;AACX,IAAA,OAAOC,oBAAA,CAAqB,IAAI,CAACH,OAAO,EAAEI,cAAA,CAAA;AAC5C,EAAA;AAAA,EAAA;IAAAC,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,QAAA,EAAA,CAHCC,MAAA,CAAA,CAAA;AAAA;EAKD,IAAI1D,KAAAA,GAAgB;AAClB,IAAA,OAAO,IAAI,CAAC2D,IAAI,CAAC3D,KAAK,IAAI,SAAA;AAC5B,EAAA;EAEA,IAAID,YAAAA,GAAwB;AAC1B,IAAA,OAAOA,YAAA,CAAa,IAAI,CAACC,KAAK,CAAA;AAChC,EAAA;EAEA,IAAI4D,UAAAA,GAAsB;IACxB,OAAOC,OAAA,CACL,IAAI,CAACF,IAAI,CAACC,UAAU,IAAK,IAAI,CAACD,IAAI,CAAC5C,IAAI,IAAI,CAACD,WAAA,CAAY,IAAI,CAAC6C,IAAI,CAAC5C,IAAI,CAAC,CAAA;AAE3E,EAAA;EAEA,IAAI+C,WAAAA,GAAuB;AACzB,IAAA,OAAOD,OAAA,CAAQ,IAAI,CAACF,IAAI,CAACI,OAAO,IAAI,IAAI,CAACJ,IAAI,CAAC5C,IAAI,CAAA;AACpD,EAAA;AAEA;EACA,IAAIiD,MAAAA,GAAkB;AACpB,IAAA,OAAOH,OAAA,CAAQ,IAAI,CAACF,IAAI,CAAC5C,IAAI,IAAI,CAAC,IAAI,CAAC6C,UAAU,CAAA;AACnD,EAAA;EAEA,IAAIxD,GAAAA,GAA0B;AAC5B,IAAA,OAAO,IAAI,CAAC4D,MAAM,GAAG9D,SAAA,CAAU,IAAI,CAACyD,IAAI,CAACxD,MAAM,EAAE,IAAI,CAACwD,IAAI,CAACvD,GAAG,CAAA,GAAI6D,SAAA;AACpE,EAAA;EAEA,IAAIC,QAAAA,GAA6B;AAC/B,IAAA,OAAO,IAAI,CAACP,IAAI,CAACO,QAAQ,IAAI,MAAA;AAC/B,EAAA;AAEA;;;AAGC;EACD,IAAIC,cAAAA,GAAwC;IAC1C,IAAI,IAAI,CAACP,UAAU,IAAI,IAAI,CAAC7D,YAAY,EAAE,OAAOkE,SAAA;AACjD,IAAA,MAAMjE,KAAA,GAAQ,IAAI,CAACA,KAAK;AACxB,IAAA,MAAMoE,QAAA,GAAW,IAAI,CAACjB,OAAO,CAACiB,QAAQ;IACtC,IAAI;AACF,MAAA,MAAMC,SAAA,GAAYC,YAAA,CAAaF,QAAA,EAAUpE,KAAA,CAAgB;AACzD,MAAA,MAAMuE,WAAA,GAAcC,2BAA2BJ,QAAA,EAAUpE,KAAA;MAIzD,OAAO;AACL,QAAA,2BAAA,EAA6BA,KAAA;AAC7B,QAAA,qBAAA,EAAuBqE,SAAA;QACvB,gCAAA,EAAkCE,YAAYE,eAAe;QAC7D,iCAAA,EAAmCF,YAAYG;OACjD;AACF,IAAA,CAAA,CAAE,MAAM;AACNC,MAAAA,IAAA,CACE,CAAA,sEAAA,EAAyE7E,YAAA,CAAac,IAAI,CAAC,IAAA,CAAA,CAAA,cAAA,EAAsBZ,QAAQ,EACzH6D,OAAA,CAAQe,gBAAgB5E,KAAA,CAAA,CAAA,EACxB;AAAE6E,QAAAA,EAAA,EAAI;AAAoC,OAAA,CAAA;AAE5C,MAAA,OAAOZ,SAAA;AACT,IAAA;AACF,EAAA;EAEAa,SAAA,GAAaC,OAAgB,IAAS;IACpC,MAAM;MAAE1B,MAAM;MAAErD,KAAK;AAAED,MAAAA;AAAY,KAAE,GAAG,IAAI;IAC5C,MAAM;MAAEiF,WAAW;MAAEC,QAAQ;AAAEC,MAAAA;KAAM,GAAG,IAAI,CAACvB,IAAI;AACjD,IAAA,MAAMwB,YAAA,GAAe,IAAI,CAACrB,WAAW,IAAI,CAACkB,WAAA;AAC1C,IAAA,MAAMI,UAAUrF,YAAA,GACZC,KAAA,KAAU,WACR,QAAA,GACAkF,IAAA,GACE,SACA,MAAA,GACJ,QAAA;IACJ,MAAMG,QAAQrF,KAAS;IACvB,OAAOsF,QAAA,CACL,IAAI,CAACnC,OAAO,EACZjC,aAAA,CAAc,IAAI,CAACiC,OAAO,CAACiB,QAAQ,CAAA,EACnCe,YAAA,IAAgB,CAAC,IAAI,CAACnB,MAAM,GAAGrB,WAAA,GAAcsB,SAAA,EAC7CZ,MAAA,CAAOkC,QAAQ,EACf,CAACR,OAAA,IAAWE,QAAA,GAAW5B,MAAA,CAAOmC,QAAQ,GAAGvB,SAAA,EAAA,IACrC,IAAI,CAACL,UAAU,GACf,CAACP,MAAA,CAAOoC,QAAQ,CAAC,GACjB,CACE1F,YAAA,IAAgBmF,OAAO7B,MAAA,CAAOqC,MAAM,CAACR,IAAI,CAACG,MAAM,GAAGpB,SAAA,EACnDlE,YAAA,IAAgB,CAACmF,OAAO7B,MAAA,CAAOqC,MAAM,CAACC,IAAI,CAACN,MAAM,GAAGpB,SAAA,EACpDkB,YAAA,GAAe9B,MAAA,CAAOuC,SAAS,CAACR,OAAA,CAAQ,GAAGnB,SAAA,EAC3Ce,WAAA,IAAe,CAAC,IAAI,CAAClB,WAAW,GAC5BT,MAAA,CAAOwC,aAAa,CAACT,OAAA,CAAQ,GAC7BnB,SAAA,CACL,CAAA,EACL,IAAI,CAACE,cAAc,EACnB,IAAI,CAACR,IAAI,CAACmC,GAAG,CAAA;EAEjB,CAAA;EAEA,IACIC,YAAAA,GAAuB;IACzB,OAAOT,QAAA,CAAS,IAAI,CAACnC,OAAO,EAAE,IAAI,CAACE,MAAM,CAAC2C,iBAAiB,CAAA;AAC7D,EAAA;AAAA,EAAA;IAAAxC,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,cAAA,EAAA,CAHCC,MAAA,CAAA,CAAA;AAAA;EAKD,IACIuC,SAAAA,GAAoB;IACtB,MAAM;AAAEC,MAAAA;KAAM,GAAG,IAAI,CAAC7C,MAAM;IAC5B,OAAOiC,SACL,IAAI,CAACnC,OAAO,EACZ+C,IAAA,CAAKC,cAAc,EACnB,IAAI,CAACrC,WAAW,IAAI,CAAC,IAAI,CAACF,UAAU,GAAGsC,IAAA,CAAKN,SAAS,GAAG3B,SAAA,CAAA;AAE5D,EAAA;AAAA,EAAA;IAAAT,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,WAAA,EAAA,CARCC,MAAA,CAAA,CAAA;AAAA;EAUD,IAEI0C,UAAkB;IACpB,MAAM;AAAEC,MAAAA;KAAM,GAAG,IAAI,CAAChD,MAAM;IAC5B,OAAO,CAACgD,IAAA,CAAKC,cAAc,EAAED,IAAI,CAAC,IAAI,CAACnC,QAAQ,CAAC,CAAC;AACnD,EAAA;AAAA,EAAA;IAAAV,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,SAAA,EAAA,CALCC,MAAA,CAAA,CAAA;AAAA;EAOD,IACI6C,eAAAA,GAA0B;IAC5B,MAAM;AAAEC,MAAAA;KAAY,GAAG,IAAI,CAACnD,MAAM;AAClC,IAAA,OAAOiC,QAAA,CACL,IAAI,CAACnC,OAAO,EACZR,WAAA,EACA6D,UAAA,CAAWC,oBAAoB,EAC/BD,UAAU,CAAC,IAAI,CAACtC,QAAQ,CAAC,CAAA;AAE7B,EAAA;AAAA,EAAA;IAAAV,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,iBAAA,EAAA,CATCC,MAAA,CAAA,CAAA;AAAA;EAWD,IACIgD,gBAAAA,GAA2B;AAC7B,IAAA,OAAOpB,QAAA,CACL,IAAI,CAACnC,OAAO,EACZ,IAAI,CAACa,MAAM,GAAGC,YAAYtB,WAAA,EAC1B,IAAI,CAACU,MAAM,CAACsD,qBAAqB,CAAA;AAErC,EAAA;AAAA,EAAA;IAAAnD,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,kBAAA,EAAA,CAPCC,MAAA,CAAA,CAAA;AAAA;AASD,EAAA;IAAAkD,oBAAA,CAAAC,kBAAA,CAAA,08FAAA,EAqHA;MAAAC,UAAA,EAAA,IAAA;AAAAC,MAAAA,KAAA,EAAAA,OAAA;sBAAAC,UAAA;QAAAC,GAAA;QAAAtF,iBAAA;QAAAuF,EAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,EAAA;QAAAC,QAAA;QAAAC,YAAA;AAAAC,QAAAA;AAAA,OAAA;KAAU,CAAA,EAAV,IAAW,CAAA;AAAD;AACZ;AAeA,MAAML,SAAiC,GAAAP,oBAAA,CAAsBC,kBAAA,CAAA,knBAAA,EA+B7D;EAAAC,UAAA,EAAA,IAAA;AAAAC,EAAAA,KAAA,EAAAA,OAAA;IAAAM,EAAA;AAAAI,IAAAA;AAAA,GAAA;AAAU,CAAA,CAAA,EAAAC,YAAA,EAAA,CAAA;AAoBV,MAAMH,YAAoC,GAAAX,oBAAA,CAAyBC,kBAAA,CAAA,+yBAAA,EAkCnE;EAAAC,UAAA,EAAA,IAAA;AAAAC,EAAAA,KAAA,EAAAA,OAAA;IAAAG,EAAA;AAAAC,IAAAA;AAAA,GAAA;AAAU,CAAA,CAAA,EAAAO,YAAA,EAAA,CAAA;;"}

package/dist/components/eui-banner.js ADDED Viewed

@@ -0,0 +1,130 @@
+import Component from '@glimmer/component';
+import { cached } from '@glimmer/tracking';
+import { on } from '@ember/modifier';
+import { service } from '@ember/service';
+import { and, or } from 'ember-truth-helpers';
+import { getEuiThemeContext } from '../utils/emotion/consume.js';
+import { useEuiBorealisStyles, euiClass } from '../utils/eui/styles.js';
+import { i as euiBackgroundColor, Q as euiBannerStyles } from '../styles.generated-SYAxYhey.js';
+import EuiButton from './eui-button.js';
+import EuiButtonEmpty from './eui-button-empty.js';
+import EuiButtonIcon from './eui-button-icon.js';
+import EuiLiveAnnouncer from './eui-live-announcer.js';
+import EuiText from './eui-text.js';
+import EuiTitle from './eui-title.js';
+import { precompileTemplate } from '@ember/template-compilation';
+import { setComponentTemplate } from '@ember/component';
+import { g, i, n } from 'decorator-transforms/runtime-esm';
+class EuiBanner extends Component {
+  static {
+    g(this.prototype, "euiI18n", [service]);
+  }
+  #euiI18n = (i(this, "euiI18n"), void 0);
+  get context() {
+    return getEuiThemeContext(this);
+  }
+  static {
+    n(this.prototype, "context", [cached]);
+  }
+  get styles() {
+    return useEuiBorealisStyles(this.context, euiBannerStyles);
+  }
+  static {
+    n(this.prototype, "styles", [cached]);
+  }
+  get size() {
+    return this.args.size ?? 'm';
+  }
+  get color() {
+    return this.args.color ?? 'highlighted';
+  }
+  get headingElement() {
+    return this.args.headingElement ?? 'h2';
+  }
+  get headingSize() {
+    return this.size === 's' ? 'xxs' : 'xs';
+  }
+  get classes() {
+    return euiClass(this.context, this.styles.euiBanner, {
+      backgroundColor: euiBackgroundColor(this.context.upstream, this.color)
+    }, this.args.css);
+  }
+  static {
+    n(this.prototype, "classes", [cached]);
+  }
+  get containerClass() {
+    return euiClass(this.context, this.styles.container, this.args.onDismiss && this.styles.hasDismiss);
+  }
+  static {
+    n(this.prototype, "containerClass", [cached]);
+  }
+  get mediaClass() {
+    return euiClass(this.context, this.styles.media);
+  }
+  static {
+    n(this.prototype, "mediaClass", [cached]);
+  }
+  get bodyClass() {
+    return euiClass(this.context, this.styles.body);
+  }
+  static {
+    n(this.prototype, "bodyClass", [cached]);
+  }
+  get contentClass() {
+    return euiClass(this.context, this.styles.content);
+  }
+  static {
+    n(this.prototype, "contentClass", [cached]);
+  }
+  get actionsClass() {
+    return euiClass(this.context, this.styles.actions);
+  }
+  static {
+    n(this.prototype, "actionsClass", [cached]);
+  }
+  get titleCss() {
+    return this.styles.title;
+  }
+  get textCss() {
+    return this.styles.text;
+  }
+  get dismissCss() {
+    return [this.styles.dismiss, this.args.dismissButtonProps?.css];
+  }
+  static {
+    n(this.prototype, "dismissCss", [cached]);
+  }
+  get dismissLabel() {
+    return this.args.dismissButtonProps?.['aria-label'] ?? this.euiI18n.lookupToken('euiBanner.dismissAriaLabel', ({
+      title
+    }) => `Dismiss "${String(title)}" announcement`, {
+      title: this.args.title
+    });
+  }
+  onPrimary = event => {
+    this.args.actionProps?.primary?.onClick?.(event);
+  };
+  onSecondary = event => {
+    this.args.actionProps?.secondary?.onClick?.(event);
+  };
+  static {
+    setComponentTemplate(precompileTemplate("<div class=\"euiBanner {{this.classes}}\" data-size={{this.size}} data-color={{this.color}} data-test-subj=\"euiBanner\" ...attributes>\n  <div class=\"euiBanner__container {{this.containerClass}}\">\n    {{#if (has-block \"media\")}}\n      <div class=\"euiBanner__media {{this.mediaClass}}\" data-test-subj=\"euiBanner-media\">{{yield to=\"media\"}}</div>\n    {{/if}}\n    <div class=\"euiBanner__body {{this.bodyClass}}\">\n      <div class=\"euiBanner__content {{this.contentClass}}\">\n        <EuiTitle @size={{this.headingSize}} @tagName={{this.headingElement}} @css={{this.titleCss}} data-test-subj=\"euiBanner-title\">{{@title}}</EuiTitle>\n        {{#if @onDismiss}}\n          <EuiButtonIcon @iconType=\"cross\" @color=\"text\" @size={{@dismissButtonProps.size}} @iconSize={{@dismissButtonProps.iconSize}} @isDisabled={{@dismissButtonProps.isDisabled}} @css={{this.dismissCss}} aria-label={{this.dismissLabel}} data-test-subj={{if @dismissButtonProps.data-test-subj @dismissButtonProps.data-test-subj \"euiBanner-dismiss\"}} {{on \"click\" @onDismiss}} />\n        {{/if}}\n        {{#if @text}}\n          <EuiText @css={{this.textCss}} @size=\"s\" @color=\"subdued\" data-test-subj=\"euiBanner-text\">{{@text}}</EuiText>\n        {{/if}}\n        {{yield}}\n      </div>\n      {{#if (or @actionProps.primary @actionProps.secondary)}}\n        <div class=\"euiBanner__actions {{this.actionsClass}}\" data-test-subj=\"euiBanner-actions\">\n          {{#if @actionProps.primary}}\n            <EuiButton @color=\"primary\" @size=\"s\" @href={{@actionProps.primary.href}} @target={{@actionProps.primary.target}} @iconType={{@actionProps.primary.iconType}} @isDisabled={{@actionProps.primary.isDisabled}} @isLoading={{@actionProps.primary.isLoading}} data-test-subj={{if @actionProps.primary.data-test-subj @actionProps.primary.data-test-subj \"euiBanner-primaryAction\"}} {{on \"click\" this.onPrimary}}>{{@actionProps.primary.children}}</EuiButton>\n          {{/if}}\n          {{#if @actionProps.secondary}}\n            <EuiButtonEmpty @color=\"primary\" @size=\"s\" @href={{@actionProps.secondary.href}} @target={{@actionProps.secondary.target}} @iconType={{@actionProps.secondary.iconType}} @isDisabled={{@actionProps.secondary.isDisabled}} @isLoading={{@actionProps.secondary.isLoading}} data-test-subj={{if @actionProps.secondary.data-test-subj @actionProps.secondary.data-test-subj \"euiBanner-secondaryAction\"}} {{on \"click\" this.onSecondary}}>{{@actionProps.secondary.children}}</EuiButtonEmpty>\n          {{/if}}\n        </div>\n      {{/if}}\n    </div>\n  </div>\n  {{#if @announceOnMount}}\n    {{!-- One line: the separators follow the words directly, as upstream. --}}\n    <EuiLiveAnnouncer>{{@title}}{{#if (and @title @text)}},&nbsp;{{/if}}{{@text}}{{#if (and (or @title @text) (has-block))}},&nbsp;{{/if}}{{yield}}</EuiLiveAnnouncer>\n  {{/if}}\n</div>", {
+      strictMode: true,
+      scope: () => ({
+        EuiTitle,
+        EuiButtonIcon,
+        on,
+        EuiText,
+        or,
+        EuiButton,
+        EuiButtonEmpty,
+        EuiLiveAnnouncer,
+        and
+      })
+    }), this);
+  }
+}
+export { EuiBanner as default };
+//# sourceMappingURL=eui-banner.js.map