@ember-eui/core 16.0.1 → 16.0.2

package/dist/components/eui-range.js

@@ -4,7 +4,7 @@ import { fn } from '@ember/helper';
 import { on } from '@ember/modifier';
 import { action } from '@ember/object';
 import { guidFor } from '@ember/object/internals';
-import { later } from '@ember/runloop';
+import { cancel, later } from '@ember/runloop';
 import { service } from '@ember/service';
 import optional from '@nullvoxpopuli/ember-composable-helpers/helpers/optional';
 import { eq, not, and } from 'ember-truth-helpers';
@@ -27,10 +27,16 @@ import { setComponentTemplate } from '@ember/component';
 import { g, i, n } from 'decorator-transforms/runtime-esm';
 
 class EuiRangeComponent extends Component {
+  blurTimer;
+  willDestroy() {
+    super.willDestroy();
+    cancel(this.blurTimer);
+  }
+  // Defaults
   static {
     g(this.prototype, "min", [argOrDefaultDecorator(0)]);
   }
-  #min = (i(this, "min"), void 0); // Defaults
+  #min = (i(this, "min"), void 0);
   static {
     g(this.prototype, "max", [argOrDefaultDecorator(100)]);
   }
@@ -161,7 +167,8 @@ class EuiRangeComponent extends Component {
     n(this.prototype, "onInputFocus", [action]);
   }
   onInputBlur(e) {
-    later(this, () => {
+    cancel(this.blurTimer);
+    this.blurTimer = later(this, () => {
       // Safari does not recognize any focus-related eventing for input[type=range]
       // making it impossible to capture its state using active/focus/relatedTarget
       // Instead, a prevention flag is set on mousedown, with a waiting period here.

package/dist/components/eui-range.js.map

@@ -1 +1 @@
-{"version":3,"file":"eui-range.js","sources":["../../src/components/eui-range.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { cached, tracked } from '@glimmer/tracking';\nimport { fn } from '@ember/helper';\nimport { on } from '@ember/modifier';\nimport { action } from '@ember/object';\nimport { guidFor } from '@ember/object/internals';\nimport { later } from '@ember/runloop';\nimport { service } from '@ember/service';\n\nimport optional from '@nullvoxpopuli/ember-composable-helpers/helpers/optional';\nimport { and, eq, not } from 'ember-truth-helpers';\n\nimport argOrDefault, {\n  argOrDefaultDecorator\n} from '../helpers/arg-or-default.ts';\nimport { getEuiThemeContext } from '../utils/emotion/consume.ts';\nimport { rangeAriaValueText } from '../utils/eui/range.ts';\nimport {\n  euiRangeStyles,\n  getLevelColor\n} from '../utils/eui/styles.generated.ts';\nimport { euiClass, useEuiBorealisStyles } from '../utils/eui/styles.ts';\nimport { isWithinRange } from '../utils/number/index.ts';\nimport EuiInputPopover from './eui-input-popover.gts';\nimport EuiRangeHighlight from './eui-range-highlight.gts';\nimport EuiRangeInput from './eui-range-input.gts';\nimport EuiRangeLabel from './eui-range-label.gts';\nimport EuiRangeSlider from './eui-range-slider.gts';\nimport EuiRangeTooltip from './eui-range-tooltip.gts';\nimport EuiRangeTrack from './eui-range-track.gts';\nimport EuiRangeWrapper from './eui-range-wrapper.gts';\n\nimport type EuiI18n from '../services/eui-i18n';\nimport type { EuiInputPopoverArgs } from './eui-input-popover';\nimport type { EuiRangeLevel } from './eui-range-levels';\nimport type { EuiRangeTick } from './eui-range-ticks';\n\n/** Upstream `inputPopoverProps` of EuiRange and EuiDualRange. */\nexport type EuiRangeInputPopoverProps = Partial<\n  Omit<\n    EuiInputPopoverArgs,\n    | 'input'\n    | 'isOpen'\n    | 'closePopover'\n    | 'disableFocusTrap'\n    | 'ownFocus'\n    | 'popoverScreenReaderText'\n    | 'fullWidth'\n  >\n> & { className?: string };\n\nexport interface EuiRangeArgs {\n  /**\n   * Props of the EuiInputPopover used with `@showInput=\"inputWithPopover\"`\n   * (upstream `inputPopoverProps`): EuiInputPopover args except `isOpen`,\n   * `closePopover`, `disableFocusTrap`, `ownFocus`,\n   * `popoverScreenReaderText` and `fullWidth`, which the range controls.\n   * Its `className` is added to the popover root.\n   */\n  inputPopoverProps?: EuiRangeInputPopoverProps;\n  /** Smaller slider, for dense forms. Defaults to `false`. */\n  compressed?: boolean;\n  /** Makes the number input read-only. */\n  readOnly?: boolean;\n  /** Stretches the slider to its container's width. Defaults to `false`. */\n  fullWidth?: boolean;\n  /** Id of the slider. Defaults to a generated id. */\n  id?: string;\n  /**\n   * Create colored indicators for certain intervals\n   */\n  levels?: EuiRangeLevel[];\n  /** Increment between values. Defaults to `1`. */\n  step?: number;\n  /**\n   * Pass `true` to displays an extra input control for direct manipulation.\n   * Pass `'inputWithPopover'` to only show the input but show the range in a dropdown.\n   */\n  showInput?: boolean | 'inputWithPopover';\n  /**\n   * Shows static min/max labels on the sides of the range slider.\n   * Defaults to `false`.\n   */\n  showLabels?: boolean;\n  /**\n   * Shows a thick line from min to value. Defaults to `false`.\n   */\n  showRange?: boolean;\n  /**\n   * Shows clickable tick marks and labels at the given interval\n   * (`step`/`tickInterval`). Defaults to `false`.\n   */\n  showTicks?: boolean;\n\n  /** Lowest selectable value. Defaults to `0`. */\n  min?: number;\n  /** Highest selectable value. Defaults to `100`. */\n  max?: number;\n  /**\n   * Shows the value in a tooltip above the thumb. Defaults to `false`.\n   */\n  showValue?: boolean;\n  /**\n   * Specified ticks at specified values\n   */\n  ticks?: EuiRangeTick[];\n  /**\n   * Modifies the number of tick marks and at what interval\n   */\n  tickInterval?: number;\n  /**\n   * Appends to the tooltip\n   */\n  valueAppend?: any;\n  /**\n   * Prepends to the tooltip\n   */\n  valuePrepend?: any;\n\n  /**\n   * Called with the event (read `event.target.value`, a string) and whether\n   * the value is within `@min`/`@max`. Update `@value` here.\n   */\n  onChange?: (event: Event, isValid: boolean) => void;\n  /** Called when the slider or input loses focus. */\n  onBlur?: (event: Event) => void;\n  /** Called when the slider or input gets focus. */\n  onFocus?: (event: Event) => void;\n\n  /** The value. */\n  value?: number;\n\n  /** Disables the slider and input. */\n  disabled?: boolean;\n\n  /** @private Show the `<:prepend>` block. Defaults to `true`. */\n  isPrependProvided?: boolean;\n  /** @private Show the `<:append>` block. Defaults to `true`. */\n  isAppendProvided?: boolean;\n  /** @private Ignore the `<:max>` block. */\n  isFakeMaxBlock?: boolean;\n  /** @private Ignore the `<:min>` block. */\n  isFakeMinBlock?: boolean;\n  /** @private Ignore the `<:value>` block. */\n  isFakeValueBlock?: boolean;\n  /** @private Ignore the `<:valueAppend>` block. */\n  isFakeValueAppendBlock?: boolean;\n  /** @private Ignore the `<:valuePrepend>` block. */\n  isFakeValuePrependBlock?: boolean;\n  /** Shows the invalid state. */\n  isInvalid?: boolean;\n  /** `name` of the inputs, for forms. */\n  name?: string;\n  /**\n   * Shows a spinner in the number input (`@showInput=\"inputWithPopover\"`).\n   * Defaults to `false`.\n   */\n  isLoading?: boolean;\n}\n\n/**\n * A slider to pick a number, optionally with a number input, ticks,\n * levels and a value tooltip. For a range of two values use EuiDualRange.\n */\nexport interface EuiRangeSignature {\n  Element: HTMLInputElement;\n  Args: EuiRangeArgs;\n  Blocks: {\n    /** Custom min label (`@showLabels`); yields `@min`. */\n    min: [min: number];\n    /** Custom max label (`@showLabels`); yields `@max`. */\n    max: [max: number];\n    /** Custom value tooltip content (`@showValue`). */\n    value: [];\n    /** Content after the value in the tooltip, e.g. a unit. */\n    valueAppend: [];\n    /** Content before the value in the tooltip, e.g. a currency sign. */\n    valuePrepend: [];\n    /** Content before the number input (`@showInput`); yields its class. */\n    prepend: [classes: string];\n    /** Content after the number input (`@showInput`); yields its class. */\n    append: [classes: string];\n    /** Unused. */\n    input: [];\n    /** Unused. */\n    content: [];\n  };\n}\n\nexport default class EuiRangeComponent extends Component<EuiRangeSignature> {\n  // Defaults\n  @argOrDefaultDecorator(0) min!: number;\n  @argOrDefaultDecorator(100) max!: number;\n  @argOrDefaultDecorator(1) step!: number;\n  @argOrDefaultDecorator(false) fullWidth!: boolean;\n  @argOrDefaultDecorator(false) compressed!: boolean;\n  @argOrDefaultDecorator(false) isLoading!: boolean;\n  @argOrDefaultDecorator(false) showLabels!: boolean;\n  @argOrDefaultDecorator(false) showInput!: boolean | string;\n  @argOrDefaultDecorator(false) showRange!: boolean;\n  @argOrDefaultDecorator(false) showTicks!: boolean;\n  @argOrDefaultDecorator(false) showValue!: boolean;\n  @argOrDefaultDecorator([]) levels!: EuiRangeLevel[];\n\n  @service declare euiI18n: EuiI18n;\n\n  preventPopoverClose = false;\n\n  //State\n  @tracked id: string = this.args.id || guidFor({});\n  @tracked isPopoverOpen = false;\n  ///\n\n  @action\n  handleOnChange(e: Event): void {\n    const isValid = isWithinRange(\n      this.min,\n      this.max,\n      (e.currentTarget as HTMLInputElement).value\n    );\n\n    if (this.args.onChange) {\n      this.args.onChange(e, isValid);\n    }\n  }\n\n  get isValid(): boolean {\n    return isWithinRange(this.min, this.max, this.args.value ?? '');\n  }\n\n  get digitTolerance(): number {\n    return Math.max(String(this.min).length, String(this.max).length);\n  }\n\n  get showInputOnly(): boolean {\n    return this.showInput === 'inputWithPopover';\n  }\n\n  get canShowDropdown(): boolean {\n    return this.showInputOnly && !this.args.readOnly && !this.args.disabled;\n  }\n\n  get numberValue(): number {\n    return Number(this.args.value);\n  }\n\n  get showRangeTooltip(): boolean {\n    return (\n      this.showValue &&\n      !!String(this.args.value).length &&\n      this.args.value !== undefined\n    );\n  }\n\n  get context() {\n    return getEuiThemeContext(this);\n  }\n\n  /** Upstream root styles (`euiRange` + `hasInput`) composed into the wrapper. */\n  @cached\n  get rootCss() {\n    const styles = useEuiBorealisStyles(this.context, euiRangeStyles);\n    return [styles.euiRange, this.showInput && styles.hasInput];\n  }\n\n  /** `euiRange__slimHorizontalSpacer` with ticks, else `euiRange__horizontalSpacer`. */\n  @cached\n  get spacerClass(): string {\n    const styles = useEuiBorealisStyles(this.context, euiRangeStyles);\n    const slim = this.showTicks || !!this.args.ticks;\n    return slim\n      ? `euiRange__slimHorizontalSpacer ${euiClass(this.context, styles.euiRange__slimHorizontalSpacer)}`\n      : `euiRange__horizontalSpacer ${euiClass(this.context, styles.euiRange__horizontalSpacer)}`;\n  }\n\n  /** The level color the value falls into, for the thumb. */\n  get thumbColor(): string | undefined {\n    return getLevelColor(this.levels ?? [], Number(this.args.value));\n  }\n\n  get ariaValueText(): string | undefined {\n    return this.args.ticks\n      ? rangeAriaValueText(this.args.ticks, this.args.value)\n      : undefined;\n  }\n\n  get screenReaderInstructions(): string {\n    return this.euiI18n.lookupToken(\n      'euiRange.sliderScreenReaderInstructions',\n      'You are in a custom range slider. Use the Up and Down arrow keys to change the value.'\n    );\n  }\n\n  @action\n  onInputFocus(e: Event): void {\n    if (this.args.onFocus) {\n      this.args.onFocus(e);\n    }\n\n    this.isPopoverOpen = true;\n  }\n\n  @action\n  onInputBlur(e: Event): void {\n    later(\n      this,\n      () => {\n        // Safari does not recognize any focus-related eventing for input[type=range]\n        // making it impossible to capture its state using active/focus/relatedTarget\n        // Instead, a prevention flag is set on mousedown, with a waiting period here.\n        // Mousedown is viable because in the popover case, it is inaccessible via keyboard (intentionally)\n        if (this.preventPopoverClose) {\n          this.preventPopoverClose = false;\n\n          return;\n        }\n\n        if (this.args.onBlur) {\n          this.args.onBlur(e);\n        }\n\n        this.closePopover();\n      },\n      200\n    );\n  }\n\n  @action\n  setPreventPopover(val: boolean): void {\n    this.preventPopoverClose = val;\n  }\n\n  @action\n  closePopover(): void {\n    this.preventPopoverClose = false;\n    this.isPopoverOpen = false;\n  }\n\n  @action\n  setPreventPopoverClose(bool: boolean): void {\n    this.preventPopoverClose = bool;\n  }\n\n  <template>\n    {{#let\n      (and (argOrDefault @isPrependProvided true) (has-block \"prepend\"))\n      (and (argOrDefault @isAppendProvided true) (has-block \"append\"))\n      (and (not (argOrDefault @isFakeMaxBlock false)) (has-block \"max\"))\n      (and (not (argOrDefault @isFakeMinBlock false)) (has-block \"min\"))\n      (and (not (argOrDefault @isFakeValueBlock false)) (has-block \"value\"))\n      (and\n        (not (argOrDefault @isFakeValueAppendBlock false))\n        (has-block \"valueAppend\")\n      )\n      (and\n        (not (argOrDefault @isFakeValuePrependBlock false))\n        (has-block \"valuePrepend\")\n      )\n      as |hasPrepend hasAppend hasMaxBlock hasMinBlock hasValueBlock hasValueAppendBlock hasValuePrependBlock|\n    }}\n      {{#if this.showInputOnly}}\n        <EuiInputPopover\n          class=\"euiRange__popover {{@inputPopoverProps.className}}\"\n          @panelPaddingSize={{@inputPopoverProps.panelPaddingSize}}\n          @anchorPosition={{@inputPopoverProps.anchorPosition}}\n          @attachToAnchor={{@inputPopoverProps.attachToAnchor}}\n          @display={{@inputPopoverProps.display}}\n          @offset={{@inputPopoverProps.offset}}\n          @repositionToCrossAxis={{@inputPopoverProps.repositionToCrossAxis}}\n          @closeOnScroll={{@inputPopoverProps.closeOnScroll}}\n          @panelMinWidth={{@inputPopoverProps.panelMinWidth}}\n          @onPanelResize={{@inputPopoverProps.onPanelResize}}\n          @css={{@inputPopoverProps.css}}\n          @panelCss={{@inputPopoverProps.panelCss}}\n          @repositionOnScroll={{@inputPopoverProps.repositionOnScroll}}\n          @panelClassName={{@inputPopoverProps.panelClassName}}\n          @panelStyle={{@inputPopoverProps.panelStyle}}\n          @anchorClassName={{@inputPopoverProps.anchorClassName}}\n          @zIndex={{@inputPopoverProps.zIndex}}\n          @container={{@inputPopoverProps.container}}\n          @buffer={{@inputPopoverProps.buffer}}\n          @insert={{@inputPopoverProps.insert}}\n          @hasArrow={{@inputPopoverProps.hasArrow}}\n          @initialFocus={{@inputPopoverProps.initialFocus}}\n          @ariaLabel={{@inputPopoverProps.ariaLabel}}\n          @ariaLabelledBy={{@inputPopoverProps.ariaLabelledBy}}\n          @popoverRef={{@inputPopoverProps.popoverRef}}\n          @portalRef={{@inputPopoverProps.portalRef}}\n          @onTrapDeactivation={{@inputPopoverProps.onTrapDeactivation}}\n          @shouldAccountForOtherPopovers={{@inputPopoverProps.shouldAccountForOtherPopovers}}\n          @fullWidth={{@fullWidth}}\n          @isOpen={{this.isPopoverOpen}}\n          @closePopover={{this.closePopover}}\n          @disableFocusTrap={{true}}\n          @popoverScreenReaderText={{this.screenReaderInstructions}}\n        >\n          <:input>\n            <EuiRangeInput\n              id={{this.id}}\n              @min={{this.min}}\n              @max={{this.max}}\n              @readOnly={{@readOnly}}\n              @step={{this.step}}\n              @value={{@value}}\n              @disabled={{@disabled}}\n              @compressed={{@compressed}}\n              @name={{@name}}\n              @fullWidth={{and this.showInputOnly this.fullWidth}}\n              @isLoading={{and this.showInputOnly @isLoading}}\n              @isInvalid={{@isInvalid}}\n              @autoSize={{not this.showInputOnly}}\n              @isPrependProvided={{hasPrepend}}\n              @isAppendProvided={{hasAppend}}\n              ...attributes\n              {{on \"focus\" (if this.canShowDropdown this.onInputFocus (optional @onFocus))}}\n              {{on \"blur\" (if this.canShowDropdown this.onInputBlur (optional @onBlur))}}\n              {{on \"input\" this.handleOnChange}}\n            >\n              <:prepend as |classes|>\n                {{yield classes to=\"prepend\"}}\n              </:prepend>\n              <:append as |classes|>\n                {{yield classes to=\"append\"}}\n              </:append>\n            </EuiRangeInput>\n          </:input>\n          <:content>\n            <EuiRangeWrapper\n              class=\"euiRange\"\n              @css={{this.rootCss}}\n              @fullWidth={{@fullWidth}}\n              @compressed={{@compressed}}\n            >\n              {{#if this.showLabels}}\n                <EuiRangeLabel @side=\"min\" @disabled={{@disabled}}>\n                  {{#if hasMinBlock}}\n                    {{yield this.min to=\"min\"}}\n                  {{else}}\n                    {{this.min}}\n                  {{/if}}\n                </EuiRangeLabel>\n              {{/if}}\n              <EuiRangeTrack\n                aria-hidden={{if this.showInput \"true\"}}\n                @disabled={{@disabled}}\n                @compressed={{@compressed}}\n                @max={{this.max}}\n                @min={{this.min}}\n                @step={{this.step}}\n                @showTicks={{this.showTicks}}\n                @showRange={{this.showRange}}\n                @tickInterval={{@tickInterval}}\n                @ticks={{@ticks}}\n                @levels={{this.levels}}\n                @onChange={{this.handleOnChange}}\n                @value={{@value}}\n                as |trackWidth|\n              >\n                <EuiRangeSlider\n                  aria-hidden={{if this.showInput \"true\"}}\n                  tabindex={{if this.showInput \"-1\"}}\n                  @id={{if this.showInput undefined this.id}}\n                  @name={{@name}}\n                  @min={{this.min}}\n                  @max={{this.max}}\n                  @step={{this.step}}\n                  @value={{@value}}\n                  @disabled={{@disabled}}\n                  @showTicks={{this.showTicks}}\n                  @showRange={{this.showRange}}\n                  @thumbColor={{this.thumbColor}}\n                  @ariaValueText={{this.ariaValueText}}\n                  ...attributes\n                  {{on \"mousedown\" (if this.showInputOnly (fn this.setPreventPopoverClose true) (optional))}}\n                  {{on \"focus\" (if (eq this.showInput true) (optional) (optional @onFocus))}}\n                  {{on \"blur\" (if this.showInputOnly this.onInputBlur (optional @onBlur))}}\n                  {{on \"input\" this.handleOnChange}}\n                />\n                {{#if (and this.showRange this.isValid)}}\n                  <EuiRangeHighlight\n                    @showTicks={{this.showTicks}}\n                    @min={{this.min}}\n                    @max={{this.max}}\n                    @lowerValue={{this.min}}\n                    @upperValue={{this.numberValue}}\n                    @levels={{this.levels}}\n                    @trackWidth={{trackWidth}}\n                  />\n                {{/if}}\n                {{#if this.showRangeTooltip}}\n                  <EuiRangeTooltip\n                    @value={{@value}}\n                    @max={{this.max}}\n                    @min={{this.min}}\n                    @name={{@name}}\n                    @showTicks={{this.showTicks}}\n                  >\n                    <:valuePrepend>{{~#if hasValuePrependBlock~}}{{yield to=\"valuePrepend\"}}{{~else~}}{{@valuePrepend}}{{~/if~}}</:valuePrepend>\n                    <:value>{{~#if hasValueBlock~}}{{yield to=\"value\"}}{{~else~}}{{@value}}{{~/if~}}</:value>\n                    <:valueAppend>{{~#if hasValueAppendBlock~}}{{yield to=\"valueAppend\"}}{{~else~}}{{@valueAppend}}{{~/if~}}</:valueAppend>\n                  </EuiRangeTooltip>\n                {{/if}}\n              </EuiRangeTrack>\n              {{#if this.showLabels}}\n                <EuiRangeLabel @side=\"max\" @disabled={{@disabled}}>\n                  {{#if hasMaxBlock}}\n                    {{yield this.max to=\"max\"}}\n                  {{else}}\n                    {{this.max}}\n                  {{/if}}\n                </EuiRangeLabel>\n              {{/if}}\n              {{#if (and this.showInput (not this.showInputOnly))}}\n                <div class={{this.spacerClass}}></div>\n                <EuiRangeInput\n                  id={{this.id}}\n                  @min={{this.min}}\n                  @max={{this.max}}\n                  @readOnly={{@readOnly}}\n                  @step={{this.step}}\n                  @value={{@value}}\n                  @disabled={{@disabled}}\n                  @compressed={{@compressed}}\n                  @name={{@name}}\n                  @fullWidth={{and this.showInputOnly this.fullWidth}}\n                  @isLoading={{and this.showInputOnly @isLoading}}\n                  @isInvalid={{@isInvalid}}\n                  @autoSize={{not this.showInputOnly}}\n                  @isPrependProvided={{hasPrepend}}\n                  @isAppendProvided={{hasAppend}}\n                  ...attributes\n                  {{on \"focus\" (if this.canShowDropdown this.onInputFocus (optional @onFocus))}}\n                  {{on \"blur\" (if this.canShowDropdown this.onInputBlur (optional @onBlur))}}\n                  {{on \"input\" this.handleOnChange}}\n                >\n                  <:prepend as |classes|>\n                    {{yield classes to=\"prepend\"}}\n                  </:prepend>\n                  <:append as |classes|>\n                    {{yield classes to=\"append\"}}\n                  </:append>\n                </EuiRangeInput>\n              {{/if}}\n            </EuiRangeWrapper>\n          </:content>\n        </EuiInputPopover>\n      {{else}}\n        <EuiRangeWrapper\n          class=\"euiRange\"\n          @css={{this.rootCss}}\n          @fullWidth={{@fullWidth}}\n          @compressed={{@compressed}}\n        >\n          {{#if this.showLabels}}\n            <EuiRangeLabel @side=\"min\" @disabled={{@disabled}}>\n              {{#if hasMinBlock}}\n                {{yield this.min to=\"min\"}}\n              {{else}}\n                {{this.min}}\n              {{/if}}\n            </EuiRangeLabel>\n          {{/if}}\n          <EuiRangeTrack\n            aria-hidden={{if this.showInput \"true\"}}\n            @disabled={{@disabled}}\n            @compressed={{@compressed}}\n            @max={{this.max}}\n            @min={{this.min}}\n            @step={{this.step}}\n            @showTicks={{this.showTicks}}\n            @showRange={{this.showRange}}\n            @tickInterval={{@tickInterval}}\n            @ticks={{@ticks}}\n            @levels={{this.levels}}\n            @onChange={{this.handleOnChange}}\n            @value={{@value}}\n            as |trackWidth|\n          >\n            <EuiRangeSlider\n              aria-hidden={{if this.showInput \"true\"}}\n              tabindex={{if this.showInput \"-1\"}}\n              @id={{if this.showInput undefined this.id}}\n              @name={{@name}}\n              @min={{this.min}}\n              @max={{this.max}}\n              @step={{this.step}}\n              @value={{@value}}\n              @disabled={{@disabled}}\n              @showTicks={{this.showTicks}}\n              @showRange={{this.showRange}}\n              @thumbColor={{this.thumbColor}}\n              @ariaValueText={{this.ariaValueText}}\n              ...attributes\n              {{on \"mousedown\" (if this.showInputOnly (fn this.setPreventPopoverClose true) (optional))}}\n              {{on \"focus\" (if (eq this.showInput true) (optional) (optional @onFocus))}}\n              {{on \"blur\" (if this.showInputOnly this.onInputBlur (optional @onBlur))}}\n              {{on \"input\" this.handleOnChange}}\n            />\n            {{#if (and this.showRange this.isValid)}}\n              <EuiRangeHighlight\n                @showTicks={{this.showTicks}}\n                @min={{this.min}}\n                @max={{this.max}}\n                @lowerValue={{this.min}}\n                @upperValue={{this.numberValue}}\n                @levels={{this.levels}}\n                @trackWidth={{trackWidth}}\n              />\n            {{/if}}\n            {{#if this.showRangeTooltip}}\n              <EuiRangeTooltip\n                @value={{@value}}\n                @max={{this.max}}\n                @min={{this.min}}\n                @name={{@name}}\n                @showTicks={{this.showTicks}}\n              >\n                <:valuePrepend>{{~#if hasValuePrependBlock~}}{{yield to=\"valuePrepend\"}}{{~else~}}{{@valuePrepend}}{{~/if~}}</:valuePrepend>\n                <:value>{{~#if hasValueBlock~}}{{yield to=\"value\"}}{{~else~}}{{@value}}{{~/if~}}</:value>\n                <:valueAppend>{{~#if hasValueAppendBlock~}}{{yield to=\"valueAppend\"}}{{~else~}}{{@valueAppend}}{{~/if~}}</:valueAppend>\n              </EuiRangeTooltip>\n            {{/if}}\n          </EuiRangeTrack>\n          {{#if this.showLabels}}\n            <EuiRangeLabel @side=\"max\" @disabled={{@disabled}}>\n              {{#if hasMaxBlock}}\n                {{yield this.max to=\"max\"}}\n              {{else}}\n                {{this.max}}\n              {{/if}}\n            </EuiRangeLabel>\n          {{/if}}\n          {{#if (and this.showInput (not this.showInputOnly))}}\n            <div class={{this.spacerClass}}></div>\n            <EuiRangeInput\n              id={{this.id}}\n              @min={{this.min}}\n              @max={{this.max}}\n              @readOnly={{@readOnly}}\n              @step={{this.step}}\n              @value={{@value}}\n              @disabled={{@disabled}}\n              @compressed={{@compressed}}\n              @name={{@name}}\n              @fullWidth={{and this.showInputOnly this.fullWidth}}\n              @isLoading={{and this.showInputOnly @isLoading}}\n              @isInvalid={{@isInvalid}}\n              @autoSize={{not this.showInputOnly}}\n              @isPrependProvided={{hasPrepend}}\n              @isAppendProvided={{hasAppend}}\n              ...attributes\n              {{on \"focus\" (if this.canShowDropdown this.onInputFocus (optional @onFocus))}}\n              {{on \"blur\" (if this.canShowDropdown this.onInputBlur (optional @onBlur))}}\n              {{on \"input\" this.handleOnChange}}\n            >\n              <:prepend as |classes|>\n                {{yield classes to=\"prepend\"}}\n              </:prepend>\n              <:append as |classes|>\n                {{yield classes to=\"append\"}}\n              </:append>\n            </EuiRangeInput>\n          {{/if}}\n        </EuiRangeWrapper>\n      {{/if}}\n    {{/let}}\n  </template>\n}\n"],"names":["EuiRangeComponent","Component","g","prototype","argOrDefaultDecorator","i","service","preventPopoverClose","tracked","args","id","guidFor","handleOnChange","e","isValid","isWithinRange","min","max","currentTarget","value","onChange","n","action","digitTolerance","Math","String","length","showInputOnly","showInput","canShowDropdown","readOnly","disabled","numberValue","Number","showRangeTooltip","showValue","undefined","context","getEuiThemeContext","rootCss","styles","useEuiBorealisStyles","euiRangeStyles","euiRange","hasInput","cached","spacerClass","slim","showTicks","ticks","euiClass","euiRange__slimHorizontalSpacer","euiRange__horizontalSpacer","thumbColor","getLevelColor","levels","ariaValueText","rangeAriaValueText","screenReaderInstructions","euiI18n","lookupToken","onInputFocus","onFocus","isPopoverOpen","onInputBlur","later","onBlur","closePopover","setPreventPopover","val","setPreventPopoverClose","bool","setComponentTemplate","precompileTemplate","strictMode","scope","and","argOrDefault","not","EuiInputPopover","EuiRangeInput","on","optional","EuiRangeWrapper","EuiRangeLabel","EuiRangeTrack","EuiRangeSlider","fn","eq","EuiRangeHighlight","EuiRangeTooltip"],"mappings":"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"}
+{"version":3,"file":"eui-range.js","sources":["../../src/components/eui-range.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { cached, tracked } from '@glimmer/tracking';\nimport { fn } from '@ember/helper';\nimport { on } from '@ember/modifier';\nimport { action } from '@ember/object';\nimport { guidFor } from '@ember/object/internals';\nimport { cancel, later } from '@ember/runloop';\nimport { service } from '@ember/service';\n\nimport optional from '@nullvoxpopuli/ember-composable-helpers/helpers/optional';\nimport { and, eq, not } from 'ember-truth-helpers';\n\nimport argOrDefault, {\n  argOrDefaultDecorator\n} from '../helpers/arg-or-default.ts';\nimport { getEuiThemeContext } from '../utils/emotion/consume.ts';\nimport { rangeAriaValueText } from '../utils/eui/range.ts';\nimport {\n  euiRangeStyles,\n  getLevelColor\n} from '../utils/eui/styles.generated.ts';\nimport { euiClass, useEuiBorealisStyles } from '../utils/eui/styles.ts';\nimport { isWithinRange } from '../utils/number/index.ts';\nimport EuiInputPopover from './eui-input-popover.gts';\nimport EuiRangeHighlight from './eui-range-highlight.gts';\nimport EuiRangeInput from './eui-range-input.gts';\nimport EuiRangeLabel from './eui-range-label.gts';\nimport EuiRangeSlider from './eui-range-slider.gts';\nimport EuiRangeTooltip from './eui-range-tooltip.gts';\nimport EuiRangeTrack from './eui-range-track.gts';\nimport EuiRangeWrapper from './eui-range-wrapper.gts';\n\nimport type EuiI18n from '../services/eui-i18n';\nimport type { EuiInputPopoverArgs } from './eui-input-popover';\nimport type { EuiRangeLevel } from './eui-range-levels';\nimport type { EuiRangeTick } from './eui-range-ticks';\n\n/** Upstream `inputPopoverProps` of EuiRange and EuiDualRange. */\nexport type EuiRangeInputPopoverProps = Partial<\n  Omit<\n    EuiInputPopoverArgs,\n    | 'input'\n    | 'isOpen'\n    | 'closePopover'\n    | 'disableFocusTrap'\n    | 'ownFocus'\n    | 'popoverScreenReaderText'\n    | 'fullWidth'\n  >\n> & { className?: string };\n\nexport interface EuiRangeArgs {\n  /**\n   * Props of the EuiInputPopover used with `@showInput=\"inputWithPopover\"`\n   * (upstream `inputPopoverProps`): EuiInputPopover args except `isOpen`,\n   * `closePopover`, `disableFocusTrap`, `ownFocus`,\n   * `popoverScreenReaderText` and `fullWidth`, which the range controls.\n   * Its `className` is added to the popover root.\n   */\n  inputPopoverProps?: EuiRangeInputPopoverProps;\n  /** Smaller slider, for dense forms. Defaults to `false`. */\n  compressed?: boolean;\n  /** Makes the number input read-only. */\n  readOnly?: boolean;\n  /** Stretches the slider to its container's width. Defaults to `false`. */\n  fullWidth?: boolean;\n  /** Id of the slider. Defaults to a generated id. */\n  id?: string;\n  /**\n   * Create colored indicators for certain intervals\n   */\n  levels?: EuiRangeLevel[];\n  /** Increment between values. Defaults to `1`. */\n  step?: number;\n  /**\n   * Pass `true` to displays an extra input control for direct manipulation.\n   * Pass `'inputWithPopover'` to only show the input but show the range in a dropdown.\n   */\n  showInput?: boolean | 'inputWithPopover';\n  /**\n   * Shows static min/max labels on the sides of the range slider.\n   * Defaults to `false`.\n   */\n  showLabels?: boolean;\n  /**\n   * Shows a thick line from min to value. Defaults to `false`.\n   */\n  showRange?: boolean;\n  /**\n   * Shows clickable tick marks and labels at the given interval\n   * (`step`/`tickInterval`). Defaults to `false`.\n   */\n  showTicks?: boolean;\n\n  /** Lowest selectable value. Defaults to `0`. */\n  min?: number;\n  /** Highest selectable value. Defaults to `100`. */\n  max?: number;\n  /**\n   * Shows the value in a tooltip above the thumb. Defaults to `false`.\n   */\n  showValue?: boolean;\n  /**\n   * Specified ticks at specified values\n   */\n  ticks?: EuiRangeTick[];\n  /**\n   * Modifies the number of tick marks and at what interval\n   */\n  tickInterval?: number;\n  /**\n   * Appends to the tooltip\n   */\n  valueAppend?: any;\n  /**\n   * Prepends to the tooltip\n   */\n  valuePrepend?: any;\n\n  /**\n   * Called with the event (read `event.target.value`, a string) and whether\n   * the value is within `@min`/`@max`. Update `@value` here.\n   */\n  onChange?: (event: Event, isValid: boolean) => void;\n  /** Called when the slider or input loses focus. */\n  onBlur?: (event: Event) => void;\n  /** Called when the slider or input gets focus. */\n  onFocus?: (event: Event) => void;\n\n  /** The value. */\n  value?: number;\n\n  /** Disables the slider and input. */\n  disabled?: boolean;\n\n  /** @private Show the `<:prepend>` block. Defaults to `true`. */\n  isPrependProvided?: boolean;\n  /** @private Show the `<:append>` block. Defaults to `true`. */\n  isAppendProvided?: boolean;\n  /** @private Ignore the `<:max>` block. */\n  isFakeMaxBlock?: boolean;\n  /** @private Ignore the `<:min>` block. */\n  isFakeMinBlock?: boolean;\n  /** @private Ignore the `<:value>` block. */\n  isFakeValueBlock?: boolean;\n  /** @private Ignore the `<:valueAppend>` block. */\n  isFakeValueAppendBlock?: boolean;\n  /** @private Ignore the `<:valuePrepend>` block. */\n  isFakeValuePrependBlock?: boolean;\n  /** Shows the invalid state. */\n  isInvalid?: boolean;\n  /** `name` of the inputs, for forms. */\n  name?: string;\n  /**\n   * Shows a spinner in the number input (`@showInput=\"inputWithPopover\"`).\n   * Defaults to `false`.\n   */\n  isLoading?: boolean;\n}\n\n/**\n * A slider to pick a number, optionally with a number input, ticks,\n * levels and a value tooltip. For a range of two values use EuiDualRange.\n */\nexport interface EuiRangeSignature {\n  Element: HTMLInputElement;\n  Args: EuiRangeArgs;\n  Blocks: {\n    /** Custom min label (`@showLabels`); yields `@min`. */\n    min: [min: number];\n    /** Custom max label (`@showLabels`); yields `@max`. */\n    max: [max: number];\n    /** Custom value tooltip content (`@showValue`). */\n    value: [];\n    /** Content after the value in the tooltip, e.g. a unit. */\n    valueAppend: [];\n    /** Content before the value in the tooltip, e.g. a currency sign. */\n    valuePrepend: [];\n    /** Content before the number input (`@showInput`); yields its class. */\n    prepend: [classes: string];\n    /** Content after the number input (`@showInput`); yields its class. */\n    append: [classes: string];\n    /** Unused. */\n    input: [];\n    /** Unused. */\n    content: [];\n  };\n}\n\nexport default class EuiRangeComponent extends Component<EuiRangeSignature> {\n  blurTimer: ReturnType<typeof later> | undefined;\n\n  willDestroy(): void {\n    super.willDestroy();\n    cancel(this.blurTimer);\n  }\n\n  // Defaults\n  @argOrDefaultDecorator(0) min!: number;\n  @argOrDefaultDecorator(100) max!: number;\n  @argOrDefaultDecorator(1) step!: number;\n  @argOrDefaultDecorator(false) fullWidth!: boolean;\n  @argOrDefaultDecorator(false) compressed!: boolean;\n  @argOrDefaultDecorator(false) isLoading!: boolean;\n  @argOrDefaultDecorator(false) showLabels!: boolean;\n  @argOrDefaultDecorator(false) showInput!: boolean | string;\n  @argOrDefaultDecorator(false) showRange!: boolean;\n  @argOrDefaultDecorator(false) showTicks!: boolean;\n  @argOrDefaultDecorator(false) showValue!: boolean;\n  @argOrDefaultDecorator([]) levels!: EuiRangeLevel[];\n\n  @service declare euiI18n: EuiI18n;\n\n  preventPopoverClose = false;\n\n  //State\n  @tracked id: string = this.args.id || guidFor({});\n  @tracked isPopoverOpen = false;\n  ///\n\n  @action\n  handleOnChange(e: Event): void {\n    const isValid = isWithinRange(\n      this.min,\n      this.max,\n      (e.currentTarget as HTMLInputElement).value\n    );\n\n    if (this.args.onChange) {\n      this.args.onChange(e, isValid);\n    }\n  }\n\n  get isValid(): boolean {\n    return isWithinRange(this.min, this.max, this.args.value ?? '');\n  }\n\n  get digitTolerance(): number {\n    return Math.max(String(this.min).length, String(this.max).length);\n  }\n\n  get showInputOnly(): boolean {\n    return this.showInput === 'inputWithPopover';\n  }\n\n  get canShowDropdown(): boolean {\n    return this.showInputOnly && !this.args.readOnly && !this.args.disabled;\n  }\n\n  get numberValue(): number {\n    return Number(this.args.value);\n  }\n\n  get showRangeTooltip(): boolean {\n    return (\n      this.showValue &&\n      !!String(this.args.value).length &&\n      this.args.value !== undefined\n    );\n  }\n\n  get context() {\n    return getEuiThemeContext(this);\n  }\n\n  /** Upstream root styles (`euiRange` + `hasInput`) composed into the wrapper. */\n  @cached\n  get rootCss() {\n    const styles = useEuiBorealisStyles(this.context, euiRangeStyles);\n    return [styles.euiRange, this.showInput && styles.hasInput];\n  }\n\n  /** `euiRange__slimHorizontalSpacer` with ticks, else `euiRange__horizontalSpacer`. */\n  @cached\n  get spacerClass(): string {\n    const styles = useEuiBorealisStyles(this.context, euiRangeStyles);\n    const slim = this.showTicks || !!this.args.ticks;\n    return slim\n      ? `euiRange__slimHorizontalSpacer ${euiClass(this.context, styles.euiRange__slimHorizontalSpacer)}`\n      : `euiRange__horizontalSpacer ${euiClass(this.context, styles.euiRange__horizontalSpacer)}`;\n  }\n\n  /** The level color the value falls into, for the thumb. */\n  get thumbColor(): string | undefined {\n    return getLevelColor(this.levels ?? [], Number(this.args.value));\n  }\n\n  get ariaValueText(): string | undefined {\n    return this.args.ticks\n      ? rangeAriaValueText(this.args.ticks, this.args.value)\n      : undefined;\n  }\n\n  get screenReaderInstructions(): string {\n    return this.euiI18n.lookupToken(\n      'euiRange.sliderScreenReaderInstructions',\n      'You are in a custom range slider. Use the Up and Down arrow keys to change the value.'\n    );\n  }\n\n  @action\n  onInputFocus(e: Event): void {\n    if (this.args.onFocus) {\n      this.args.onFocus(e);\n    }\n\n    this.isPopoverOpen = true;\n  }\n\n  @action\n  onInputBlur(e: Event): void {\n    cancel(this.blurTimer);\n    this.blurTimer = later(\n      this,\n      () => {\n        // Safari does not recognize any focus-related eventing for input[type=range]\n        // making it impossible to capture its state using active/focus/relatedTarget\n        // Instead, a prevention flag is set on mousedown, with a waiting period here.\n        // Mousedown is viable because in the popover case, it is inaccessible via keyboard (intentionally)\n        if (this.preventPopoverClose) {\n          this.preventPopoverClose = false;\n\n          return;\n        }\n\n        if (this.args.onBlur) {\n          this.args.onBlur(e);\n        }\n\n        this.closePopover();\n      },\n      200\n    );\n  }\n\n  @action\n  setPreventPopover(val: boolean): void {\n    this.preventPopoverClose = val;\n  }\n\n  @action\n  closePopover(): void {\n    this.preventPopoverClose = false;\n    this.isPopoverOpen = false;\n  }\n\n  @action\n  setPreventPopoverClose(bool: boolean): void {\n    this.preventPopoverClose = bool;\n  }\n\n  <template>\n    {{#let\n      (and (argOrDefault @isPrependProvided true) (has-block \"prepend\"))\n      (and (argOrDefault @isAppendProvided true) (has-block \"append\"))\n      (and (not (argOrDefault @isFakeMaxBlock false)) (has-block \"max\"))\n      (and (not (argOrDefault @isFakeMinBlock false)) (has-block \"min\"))\n      (and (not (argOrDefault @isFakeValueBlock false)) (has-block \"value\"))\n      (and\n        (not (argOrDefault @isFakeValueAppendBlock false))\n        (has-block \"valueAppend\")\n      )\n      (and\n        (not (argOrDefault @isFakeValuePrependBlock false))\n        (has-block \"valuePrepend\")\n      )\n      as |hasPrepend hasAppend hasMaxBlock hasMinBlock hasValueBlock hasValueAppendBlock hasValuePrependBlock|\n    }}\n      {{#if this.showInputOnly}}\n        <EuiInputPopover\n          class=\"euiRange__popover {{@inputPopoverProps.className}}\"\n          @panelPaddingSize={{@inputPopoverProps.panelPaddingSize}}\n          @anchorPosition={{@inputPopoverProps.anchorPosition}}\n          @attachToAnchor={{@inputPopoverProps.attachToAnchor}}\n          @display={{@inputPopoverProps.display}}\n          @offset={{@inputPopoverProps.offset}}\n          @repositionToCrossAxis={{@inputPopoverProps.repositionToCrossAxis}}\n          @closeOnScroll={{@inputPopoverProps.closeOnScroll}}\n          @panelMinWidth={{@inputPopoverProps.panelMinWidth}}\n          @onPanelResize={{@inputPopoverProps.onPanelResize}}\n          @css={{@inputPopoverProps.css}}\n          @panelCss={{@inputPopoverProps.panelCss}}\n          @repositionOnScroll={{@inputPopoverProps.repositionOnScroll}}\n          @panelClassName={{@inputPopoverProps.panelClassName}}\n          @panelStyle={{@inputPopoverProps.panelStyle}}\n          @anchorClassName={{@inputPopoverProps.anchorClassName}}\n          @zIndex={{@inputPopoverProps.zIndex}}\n          @container={{@inputPopoverProps.container}}\n          @buffer={{@inputPopoverProps.buffer}}\n          @insert={{@inputPopoverProps.insert}}\n          @hasArrow={{@inputPopoverProps.hasArrow}}\n          @initialFocus={{@inputPopoverProps.initialFocus}}\n          @ariaLabel={{@inputPopoverProps.ariaLabel}}\n          @ariaLabelledBy={{@inputPopoverProps.ariaLabelledBy}}\n          @popoverRef={{@inputPopoverProps.popoverRef}}\n          @portalRef={{@inputPopoverProps.portalRef}}\n          @onTrapDeactivation={{@inputPopoverProps.onTrapDeactivation}}\n          @shouldAccountForOtherPopovers={{@inputPopoverProps.shouldAccountForOtherPopovers}}\n          @fullWidth={{@fullWidth}}\n          @isOpen={{this.isPopoverOpen}}\n          @closePopover={{this.closePopover}}\n          @disableFocusTrap={{true}}\n          @popoverScreenReaderText={{this.screenReaderInstructions}}\n        >\n          <:input>\n            <EuiRangeInput\n              id={{this.id}}\n              @min={{this.min}}\n              @max={{this.max}}\n              @readOnly={{@readOnly}}\n              @step={{this.step}}\n              @value={{@value}}\n              @disabled={{@disabled}}\n              @compressed={{@compressed}}\n              @name={{@name}}\n              @fullWidth={{and this.showInputOnly this.fullWidth}}\n              @isLoading={{and this.showInputOnly @isLoading}}\n              @isInvalid={{@isInvalid}}\n              @autoSize={{not this.showInputOnly}}\n              @isPrependProvided={{hasPrepend}}\n              @isAppendProvided={{hasAppend}}\n              ...attributes\n              {{on \"focus\" (if this.canShowDropdown this.onInputFocus (optional @onFocus))}}\n              {{on \"blur\" (if this.canShowDropdown this.onInputBlur (optional @onBlur))}}\n              {{on \"input\" this.handleOnChange}}\n            >\n              <:prepend as |classes|>\n                {{yield classes to=\"prepend\"}}\n              </:prepend>\n              <:append as |classes|>\n                {{yield classes to=\"append\"}}\n              </:append>\n            </EuiRangeInput>\n          </:input>\n          <:content>\n            <EuiRangeWrapper\n              class=\"euiRange\"\n              @css={{this.rootCss}}\n              @fullWidth={{@fullWidth}}\n              @compressed={{@compressed}}\n            >\n              {{#if this.showLabels}}\n                <EuiRangeLabel @side=\"min\" @disabled={{@disabled}}>\n                  {{#if hasMinBlock}}\n                    {{yield this.min to=\"min\"}}\n                  {{else}}\n                    {{this.min}}\n                  {{/if}}\n                </EuiRangeLabel>\n              {{/if}}\n              <EuiRangeTrack\n                aria-hidden={{if this.showInput \"true\"}}\n                @disabled={{@disabled}}\n                @compressed={{@compressed}}\n                @max={{this.max}}\n                @min={{this.min}}\n                @step={{this.step}}\n                @showTicks={{this.showTicks}}\n                @showRange={{this.showRange}}\n                @tickInterval={{@tickInterval}}\n                @ticks={{@ticks}}\n                @levels={{this.levels}}\n                @onChange={{this.handleOnChange}}\n                @value={{@value}}\n                as |trackWidth|\n              >\n                <EuiRangeSlider\n                  aria-hidden={{if this.showInput \"true\"}}\n                  tabindex={{if this.showInput \"-1\"}}\n                  @id={{if this.showInput undefined this.id}}\n                  @name={{@name}}\n                  @min={{this.min}}\n                  @max={{this.max}}\n                  @step={{this.step}}\n                  @value={{@value}}\n                  @disabled={{@disabled}}\n                  @showTicks={{this.showTicks}}\n                  @showRange={{this.showRange}}\n                  @thumbColor={{this.thumbColor}}\n                  @ariaValueText={{this.ariaValueText}}\n                  ...attributes\n                  {{on \"mousedown\" (if this.showInputOnly (fn this.setPreventPopoverClose true) (optional))}}\n                  {{on \"focus\" (if (eq this.showInput true) (optional) (optional @onFocus))}}\n                  {{on \"blur\" (if this.showInputOnly this.onInputBlur (optional @onBlur))}}\n                  {{on \"input\" this.handleOnChange}}\n                />\n                {{#if (and this.showRange this.isValid)}}\n                  <EuiRangeHighlight\n                    @showTicks={{this.showTicks}}\n                    @min={{this.min}}\n                    @max={{this.max}}\n                    @lowerValue={{this.min}}\n                    @upperValue={{this.numberValue}}\n                    @levels={{this.levels}}\n                    @trackWidth={{trackWidth}}\n                  />\n                {{/if}}\n                {{#if this.showRangeTooltip}}\n                  <EuiRangeTooltip\n                    @value={{@value}}\n                    @max={{this.max}}\n                    @min={{this.min}}\n                    @name={{@name}}\n                    @showTicks={{this.showTicks}}\n                  >\n                    <:valuePrepend>{{~#if hasValuePrependBlock~}}{{yield to=\"valuePrepend\"}}{{~else~}}{{@valuePrepend}}{{~/if~}}</:valuePrepend>\n                    <:value>{{~#if hasValueBlock~}}{{yield to=\"value\"}}{{~else~}}{{@value}}{{~/if~}}</:value>\n                    <:valueAppend>{{~#if hasValueAppendBlock~}}{{yield to=\"valueAppend\"}}{{~else~}}{{@valueAppend}}{{~/if~}}</:valueAppend>\n                  </EuiRangeTooltip>\n                {{/if}}\n              </EuiRangeTrack>\n              {{#if this.showLabels}}\n                <EuiRangeLabel @side=\"max\" @disabled={{@disabled}}>\n                  {{#if hasMaxBlock}}\n                    {{yield this.max to=\"max\"}}\n                  {{else}}\n                    {{this.max}}\n                  {{/if}}\n                </EuiRangeLabel>\n              {{/if}}\n              {{#if (and this.showInput (not this.showInputOnly))}}\n                <div class={{this.spacerClass}}></div>\n                <EuiRangeInput\n                  id={{this.id}}\n                  @min={{this.min}}\n                  @max={{this.max}}\n                  @readOnly={{@readOnly}}\n                  @step={{this.step}}\n                  @value={{@value}}\n                  @disabled={{@disabled}}\n                  @compressed={{@compressed}}\n                  @name={{@name}}\n                  @fullWidth={{and this.showInputOnly this.fullWidth}}\n                  @isLoading={{and this.showInputOnly @isLoading}}\n                  @isInvalid={{@isInvalid}}\n                  @autoSize={{not this.showInputOnly}}\n                  @isPrependProvided={{hasPrepend}}\n                  @isAppendProvided={{hasAppend}}\n                  ...attributes\n                  {{on \"focus\" (if this.canShowDropdown this.onInputFocus (optional @onFocus))}}\n                  {{on \"blur\" (if this.canShowDropdown this.onInputBlur (optional @onBlur))}}\n                  {{on \"input\" this.handleOnChange}}\n                >\n                  <:prepend as |classes|>\n                    {{yield classes to=\"prepend\"}}\n                  </:prepend>\n                  <:append as |classes|>\n                    {{yield classes to=\"append\"}}\n                  </:append>\n                </EuiRangeInput>\n              {{/if}}\n            </EuiRangeWrapper>\n          </:content>\n        </EuiInputPopover>\n      {{else}}\n        <EuiRangeWrapper\n          class=\"euiRange\"\n          @css={{this.rootCss}}\n          @fullWidth={{@fullWidth}}\n          @compressed={{@compressed}}\n        >\n          {{#if this.showLabels}}\n            <EuiRangeLabel @side=\"min\" @disabled={{@disabled}}>\n              {{#if hasMinBlock}}\n                {{yield this.min to=\"min\"}}\n              {{else}}\n                {{this.min}}\n              {{/if}}\n            </EuiRangeLabel>\n          {{/if}}\n          <EuiRangeTrack\n            aria-hidden={{if this.showInput \"true\"}}\n            @disabled={{@disabled}}\n            @compressed={{@compressed}}\n            @max={{this.max}}\n            @min={{this.min}}\n            @step={{this.step}}\n            @showTicks={{this.showTicks}}\n            @showRange={{this.showRange}}\n            @tickInterval={{@tickInterval}}\n            @ticks={{@ticks}}\n            @levels={{this.levels}}\n            @onChange={{this.handleOnChange}}\n            @value={{@value}}\n            as |trackWidth|\n          >\n            <EuiRangeSlider\n              aria-hidden={{if this.showInput \"true\"}}\n              tabindex={{if this.showInput \"-1\"}}\n              @id={{if this.showInput undefined this.id}}\n              @name={{@name}}\n              @min={{this.min}}\n              @max={{this.max}}\n              @step={{this.step}}\n              @value={{@value}}\n              @disabled={{@disabled}}\n              @showTicks={{this.showTicks}}\n              @showRange={{this.showRange}}\n              @thumbColor={{this.thumbColor}}\n              @ariaValueText={{this.ariaValueText}}\n              ...attributes\n              {{on \"mousedown\" (if this.showInputOnly (fn this.setPreventPopoverClose true) (optional))}}\n              {{on \"focus\" (if (eq this.showInput true) (optional) (optional @onFocus))}}\n              {{on \"blur\" (if this.showInputOnly this.onInputBlur (optional @onBlur))}}\n              {{on \"input\" this.handleOnChange}}\n            />\n            {{#if (and this.showRange this.isValid)}}\n              <EuiRangeHighlight\n                @showTicks={{this.showTicks}}\n                @min={{this.min}}\n                @max={{this.max}}\n                @lowerValue={{this.min}}\n                @upperValue={{this.numberValue}}\n                @levels={{this.levels}}\n                @trackWidth={{trackWidth}}\n              />\n            {{/if}}\n            {{#if this.showRangeTooltip}}\n              <EuiRangeTooltip\n                @value={{@value}}\n                @max={{this.max}}\n                @min={{this.min}}\n                @name={{@name}}\n                @showTicks={{this.showTicks}}\n              >\n                <:valuePrepend>{{~#if hasValuePrependBlock~}}{{yield to=\"valuePrepend\"}}{{~else~}}{{@valuePrepend}}{{~/if~}}</:valuePrepend>\n                <:value>{{~#if hasValueBlock~}}{{yield to=\"value\"}}{{~else~}}{{@value}}{{~/if~}}</:value>\n                <:valueAppend>{{~#if hasValueAppendBlock~}}{{yield to=\"valueAppend\"}}{{~else~}}{{@valueAppend}}{{~/if~}}</:valueAppend>\n              </EuiRangeTooltip>\n            {{/if}}\n          </EuiRangeTrack>\n          {{#if this.showLabels}}\n            <EuiRangeLabel @side=\"max\" @disabled={{@disabled}}>\n              {{#if hasMaxBlock}}\n                {{yield this.max to=\"max\"}}\n              {{else}}\n                {{this.max}}\n              {{/if}}\n            </EuiRangeLabel>\n          {{/if}}\n          {{#if (and this.showInput (not this.showInputOnly))}}\n            <div class={{this.spacerClass}}></div>\n            <EuiRangeInput\n              id={{this.id}}\n              @min={{this.min}}\n              @max={{this.max}}\n              @readOnly={{@readOnly}}\n              @step={{this.step}}\n              @value={{@value}}\n              @disabled={{@disabled}}\n              @compressed={{@compressed}}\n              @name={{@name}}\n              @fullWidth={{and this.showInputOnly this.fullWidth}}\n              @isLoading={{and this.showInputOnly @isLoading}}\n              @isInvalid={{@isInvalid}}\n              @autoSize={{not this.showInputOnly}}\n              @isPrependProvided={{hasPrepend}}\n              @isAppendProvided={{hasAppend}}\n              ...attributes\n              {{on \"focus\" (if this.canShowDropdown this.onInputFocus (optional @onFocus))}}\n              {{on \"blur\" (if this.canShowDropdown this.onInputBlur (optional @onBlur))}}\n              {{on \"input\" this.handleOnChange}}\n            >\n              <:prepend as |classes|>\n                {{yield classes to=\"prepend\"}}\n              </:prepend>\n              <:append as |classes|>\n                {{yield classes to=\"append\"}}\n              </:append>\n            </EuiRangeInput>\n          {{/if}}\n        </EuiRangeWrapper>\n      {{/if}}\n    {{/let}}\n  </template>\n}\n"],"names":["EuiRangeComponent","Component","blurTimer","willDestroy","cancel","g","prototype","argOrDefaultDecorator","i","service","preventPopoverClose","tracked","args","id","guidFor","handleOnChange","e","isValid","isWithinRange","min","max","currentTarget","value","onChange","n","action","digitTolerance","Math","String","length","showInputOnly","showInput","canShowDropdown","readOnly","disabled","numberValue","Number","showRangeTooltip","showValue","undefined","context","getEuiThemeContext","rootCss","styles","useEuiBorealisStyles","euiRangeStyles","euiRange","hasInput","cached","spacerClass","slim","showTicks","ticks","euiClass","euiRange__slimHorizontalSpacer","euiRange__horizontalSpacer","thumbColor","getLevelColor","levels","ariaValueText","rangeAriaValueText","screenReaderInstructions","euiI18n","lookupToken","onInputFocus","onFocus","isPopoverOpen","onInputBlur","later","onBlur","closePopover","setPreventPopover","val","setPreventPopoverClose","bool","setComponentTemplate","precompileTemplate","strictMode","scope","and","argOrDefault","not","EuiInputPopover","EuiRangeInput","on","optional","EuiRangeWrapper","EuiRangeLabel","EuiRangeTrack","EuiRangeSlider","fn","eq","EuiRangeHighlight","EuiRangeTooltip"],"mappings":"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"}

package/dist/components/eui-saturation.js

@@ -17,7 +17,8 @@ import { precompileTemplate } from '@ember/template-compilation';
 import { setComponentTemplate } from '@ember/component';
 import { g, i, n } from 'decorator-transforms/runtime-esm';
 
-/** The saturation / value square on the upstream EUI 123 / Borealis styles. */class EuiSaturation extends Component {
+/** The saturation / value square on the upstream EUI 123 / Borealis styles. */const noop = () => {};
+class EuiSaturation extends Component {
   static {
     g(this.prototype, "euiI18n", [service]);
   }
@@ -95,17 +96,28 @@ import { g, i, n } from 'decorator-transforms/runtime-esm';
   }
   onMouseDown(event) {
     this.moveTo(event);
+    this.stopDrag();
     const move = e => this.moveTo(e);
-    const up = () => {
+    const up = () => this.stopDrag();
+    document.addEventListener('mousemove', move);
+    document.addEventListener('mouseup', up);
+    window.addEventListener('blur', up);
+    this.stopDrag = () => {
       document.removeEventListener('mousemove', move);
       document.removeEventListener('mouseup', up);
+      window.removeEventListener('blur', up);
+      this.stopDrag = noop;
     };
-    document.addEventListener('mousemove', move);
-    document.addEventListener('mouseup', up);
   }
+  /** Removes the document drag listeners (also on teardown mid-drag). */
   static {
     n(this.prototype, "onMouseDown", [action]);
   }
+  stopDrag = noop;
+  willDestroy() {
+    super.willDestroy();
+    this.stopDrag();
+  }
   onTouch(event) {
     const touch = event.touches[0];
     if (touch) this.moveTo(touch);

package/dist/components/eui-saturation.js.map

@@ -1 +1 @@
-{"version":3,"file":"eui-saturation.js","sources":["../../src/components/eui-saturation.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { cached, tracked } from '@glimmer/tracking';\nimport { hash } from '@ember/helper';\nimport { on } from '@ember/modifier';\nimport { action } from '@ember/object';\nimport { schedule } from '@ember/runloop';\nimport { service } from '@ember/service';\n\nimport { modifier } from 'ember-modifier';\n\nimport { getEventPosition } from '../-private/color.ts';\nimport cssStyle from '../-private/css-style.ts';\nimport { getEuiThemeContext } from '../utils/emotion/consume.ts';\nimport { boxReset, buttonReset } from '../utils/eui/color-picker.ts';\nimport { euiSaturationStyles } from '../utils/eui/styles.generated.ts';\nimport { euiClass, useEuiBorealisStyles } from '../utils/eui/styles.ts';\nimport EuiToolTip from './eui-tool-tip.gts';\n\nimport type EuiI18n from '../services/eui-i18n';\nimport type { HSV } from '../-private/color.ts';\n\n/**\n * The saturation / value square of `EuiColorPicker`: drag (or use the\n * arrow keys) to pick how vivid and how light the color is. Rendered for\n * you by the color picker.\n */\nexport interface EuiSaturationSignature {\n  Element: HTMLDivElement;\n  Args: {\n    /** The color as HSV: `[hue, saturation, value]`. Defaults to `[1, 0, 0]`. */\n    color?: HSV;\n    /** The current color as hex, shown in a tooltip over the indicator. */\n    hex?: string;\n    /** Prefix of the ids inside. */\n    id?: string;\n    /** Called with the new `[hue, saturation, value]`. */\n    onChange: (color: HSV) => void;\n  };\n}\n\n/** The saturation / value square on the upstream EUI 123 / Borealis styles. */\nexport default class EuiSaturation extends Component<EuiSaturationSignature> {\n  @service declare euiI18n: EuiI18n;\n\n  @cached\n  get styles() {\n    const context = getEuiThemeContext(this);\n    const styles = useEuiBorealisStyles(context, euiSaturationStyles);\n\n    return {\n      root: `euiSaturation ${euiClass(context, boxReset, styles.euiSaturation)}`,\n      lightness: `euiSaturation__lightness ${euiClass(context, styles.euiSaturation__lightness)}`,\n      saturation: `euiSaturation__saturation ${euiClass(context, styles.euiSaturation__saturation)}`,\n      // upstream: the EuiToolTip anchor that positions the indicator\n      anchor: styles.euiSaturation__tooltip,\n      indicator: `euiSaturation__indicator ${euiClass(context, buttonReset, styles.euiSaturation__indicator)}`\n    };\n  }\n\n  // the indicator follows the pointer; otherwise it shows @color\n  @tracked dragged?: { left: number; top: number; forColor: string };\n  @tracked boxSize = { width: 0, height: 0 };\n\n  box?: HTMLElement;\n\n  get color(): HSV {\n    return this.args.color ?? [1, 0, 0];\n  }\n\n  get indicator(): { left: number; top: number } {\n    if (this.dragged && this.dragged.forColor === this.color.join()) return this.dragged;\n\n    const [, s, v] = this.color;\n\n    return { left: s * this.boxSize.width, top: (1 - v) * this.boxSize.height };\n  }\n\n  get ariaLabel(): string {\n    return this.euiI18n.lookupToken('euiSaturation.ariaLabel', 'Select a color');\n  }\n\n  get roleDescription(): string {\n    return this.euiI18n.lookupToken(\n      'euiSaturation.roleDescription',\n      'HSV color mode saturation and value 2-axis slider.'\n    );\n  }\n\n  get instructions(): string {\n    return this.euiI18n.lookupToken(\n      'euiSaturation.screenReaderInstructions',\n      \"Arrow keys to navigate the square color gradient. Coordinates will be used to calculate HSV color mode 'saturation' and 'value' numbers, in the range of 0 to 1. Left and right to change the saturation. Up and down change the value.\"\n    );\n  }\n\n  update({ left, top, width, height }: { left: number; top: number; width: number; height: number }): void {\n    const color: HSV = [this.color[0], left / width, 1 - top / height];\n\n    this.dragged = { left, top, forColor: color.join() };\n    this.args.onChange(color);\n  }\n\n  moveTo(event: { clientX: number; clientY: number }): void {\n    if (!this.box) return;\n\n    this.update(getEventPosition({ x: event.clientX, y: event.clientY }, this.box));\n  }\n\n  @action\n  onMouseDown(event: MouseEvent): void {\n    this.moveTo(event);\n\n    const move = (e: MouseEvent) => this.moveTo(e);\n    const up = () => {\n      document.removeEventListener('mousemove', move);\n      document.removeEventListener('mouseup', up);\n    };\n\n    document.addEventListener('mousemove', move);\n    document.addEventListener('mouseup', up);\n  }\n\n  @action\n  onTouch(event: TouchEvent): void {\n    const touch = event.touches[0];\n\n    if (touch) this.moveTo(touch);\n  }\n\n  @action\n  onKeyDown(event: KeyboardEvent): void {\n    if (!this.box) return;\n\n    const { width, height } = this.box.getBoundingClientRect();\n    let { left, top } = this.indicator;\n\n    switch (event.key) {\n      case 'ArrowDown':\n        top = Math.min(top + height / 100, height);\n        break;\n      case 'ArrowUp':\n        top = Math.max(top - height / 100, 0);\n        break;\n      case 'ArrowLeft':\n        left = Math.max(left - width / 100, 0);\n        break;\n      case 'ArrowRight':\n        left = Math.min(left + width / 100, width);\n        break;\n      default:\n        return;\n    }\n\n    event.preventDefault();\n    this.update({ left, top, width, height });\n  }\n\n  registerBox = modifier((element: HTMLElement) => {\n    this.box = element;\n\n    const measure = () => {\n      const { width, height } = element.getBoundingClientRect();\n\n      if (width !== this.boxSize.width || height !== this.boxSize.height) {\n        this.boxSize = { width, height };\n      }\n    };\n\n    // measured after rendering, once laid out\n    schedule('afterRender', measure);\n  });\n\n  <template>\n    {{! template-lint-disable no-invalid-interactive }}\n    <div\n      class={{this.styles.root}}\n      data-test-subj=\"euiSaturation\"\n      tabindex=\"-1\"\n      style={{cssStyle (hash background=(hueBackground this.color))}}\n      {{on \"mousedown\" this.onMouseDown}}\n      {{on \"touchstart\" this.onTouch}}\n      {{on \"touchmove\" this.onTouch}}\n      {{on \"keydown\" this.onKeyDown}}\n      ...attributes\n    >\n      <div class={{this.styles.lightness}} {{this.registerBox}}>\n        <div class={{this.styles.saturation}}></div>\n      </div>\n      {{! the indicator is positioned by its tooltip anchor, as upstream }}\n      <EuiToolTip\n        @content={{@hex}}\n        @anchorCss={{this.styles.anchor}}\n        @anchorStyle={{cssStyle (hash left=this.indicator.left top=this.indicator.top)}}\n        @display=\"block\"\n        @disableScreenReaderOutput={{true}}\n      >\n        <button\n          type=\"button\"\n          id=\"{{@id}}-saturationIndicator\"\n          class={{this.styles.indicator}}\n          aria-roledescription={{this.roleDescription}}\n          aria-label={{this.ariaLabel}}\n          aria-describedby=\"{{@id}}-instructions\"\n        ></button>\n      </EuiToolTip>\n      <span hidden id=\"{{@id}}-instructions\">{{this.instructions}}</span>\n    </div>\n  </template>\n}\n\nfunction hueBackground(color: HSV): string {\n  return `hsl(${color[0]}, 100%, 50%)`;\n}\n"],"names":["EuiSaturation","Component","g","prototype","service","i","styles","context","getEuiThemeContext","useEuiBorealisStyles","euiSaturationStyles","root","euiClass","boxReset","euiSaturation","lightness","euiSaturation__lightness","saturation","euiSaturation__saturation","anchor","euiSaturation__tooltip","indicator","buttonReset","euiSaturation__indicator","n","cached","tracked","width","height","box","color","args","dragged","forColor","join","s","v","left","boxSize","top","ariaLabel","euiI18n","lookupToken","roleDescription","instructions","update","onChange","moveTo","event","getEventPosition","x","clientX","y","clientY","onMouseDown","move","e","up","document","removeEventListener","addEventListener","action","onTouch","touch","touches","onKeyDown","getBoundingClientRect","key","Math","min","max","preventDefault","registerBox","modifier","element","measure","schedule","setComponentTemplate","precompileTemplate","strictMode","scope","cssStyle","hash","hueBackground","on","EuiToolTip"],"mappings":"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"}
+{"version":3,"file":"eui-saturation.js","sources":["../../src/components/eui-saturation.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { cached, tracked } from '@glimmer/tracking';\nimport { hash } from '@ember/helper';\nimport { on } from '@ember/modifier';\nimport { action } from '@ember/object';\nimport { schedule } from '@ember/runloop';\nimport { service } from '@ember/service';\n\nimport { modifier } from 'ember-modifier';\n\nimport { getEventPosition } from '../-private/color.ts';\nimport cssStyle from '../-private/css-style.ts';\nimport { getEuiThemeContext } from '../utils/emotion/consume.ts';\nimport { boxReset, buttonReset } from '../utils/eui/color-picker.ts';\nimport { euiSaturationStyles } from '../utils/eui/styles.generated.ts';\nimport { euiClass, useEuiBorealisStyles } from '../utils/eui/styles.ts';\nimport EuiToolTip from './eui-tool-tip.gts';\n\nimport type EuiI18n from '../services/eui-i18n';\nimport type { HSV } from '../-private/color.ts';\n\n/**\n * The saturation / value square of `EuiColorPicker`: drag (or use the\n * arrow keys) to pick how vivid and how light the color is. Rendered for\n * you by the color picker.\n */\nexport interface EuiSaturationSignature {\n  Element: HTMLDivElement;\n  Args: {\n    /** The color as HSV: `[hue, saturation, value]`. Defaults to `[1, 0, 0]`. */\n    color?: HSV;\n    /** The current color as hex, shown in a tooltip over the indicator. */\n    hex?: string;\n    /** Prefix of the ids inside. */\n    id?: string;\n    /** Called with the new `[hue, saturation, value]`. */\n    onChange: (color: HSV) => void;\n  };\n}\n\n/** The saturation / value square on the upstream EUI 123 / Borealis styles. */\nconst noop = (): void => {};\n\nexport default class EuiSaturation extends Component<EuiSaturationSignature> {\n  @service declare euiI18n: EuiI18n;\n\n  @cached\n  get styles() {\n    const context = getEuiThemeContext(this);\n    const styles = useEuiBorealisStyles(context, euiSaturationStyles);\n\n    return {\n      root: `euiSaturation ${euiClass(context, boxReset, styles.euiSaturation)}`,\n      lightness: `euiSaturation__lightness ${euiClass(context, styles.euiSaturation__lightness)}`,\n      saturation: `euiSaturation__saturation ${euiClass(context, styles.euiSaturation__saturation)}`,\n      // upstream: the EuiToolTip anchor that positions the indicator\n      anchor: styles.euiSaturation__tooltip,\n      indicator: `euiSaturation__indicator ${euiClass(context, buttonReset, styles.euiSaturation__indicator)}`\n    };\n  }\n\n  // the indicator follows the pointer; otherwise it shows @color\n  @tracked dragged?: { left: number; top: number; forColor: string };\n  @tracked boxSize = { width: 0, height: 0 };\n\n  box?: HTMLElement;\n\n  get color(): HSV {\n    return this.args.color ?? [1, 0, 0];\n  }\n\n  get indicator(): { left: number; top: number } {\n    if (this.dragged && this.dragged.forColor === this.color.join()) return this.dragged;\n\n    const [, s, v] = this.color;\n\n    return { left: s * this.boxSize.width, top: (1 - v) * this.boxSize.height };\n  }\n\n  get ariaLabel(): string {\n    return this.euiI18n.lookupToken('euiSaturation.ariaLabel', 'Select a color');\n  }\n\n  get roleDescription(): string {\n    return this.euiI18n.lookupToken(\n      'euiSaturation.roleDescription',\n      'HSV color mode saturation and value 2-axis slider.'\n    );\n  }\n\n  get instructions(): string {\n    return this.euiI18n.lookupToken(\n      'euiSaturation.screenReaderInstructions',\n      \"Arrow keys to navigate the square color gradient. Coordinates will be used to calculate HSV color mode 'saturation' and 'value' numbers, in the range of 0 to 1. Left and right to change the saturation. Up and down change the value.\"\n    );\n  }\n\n  update({ left, top, width, height }: { left: number; top: number; width: number; height: number }): void {\n    const color: HSV = [this.color[0], left / width, 1 - top / height];\n\n    this.dragged = { left, top, forColor: color.join() };\n    this.args.onChange(color);\n  }\n\n  moveTo(event: { clientX: number; clientY: number }): void {\n    if (!this.box) return;\n\n    this.update(getEventPosition({ x: event.clientX, y: event.clientY }, this.box));\n  }\n\n  @action\n  onMouseDown(event: MouseEvent): void {\n    this.moveTo(event);\n\n    this.stopDrag();\n\n    const move = (e: MouseEvent) => this.moveTo(e);\n    const up = () => this.stopDrag();\n\n    document.addEventListener('mousemove', move);\n    document.addEventListener('mouseup', up);\n    window.addEventListener('blur', up);\n    this.stopDrag = () => {\n      document.removeEventListener('mousemove', move);\n      document.removeEventListener('mouseup', up);\n      window.removeEventListener('blur', up);\n      this.stopDrag = noop;\n    };\n  }\n\n  /** Removes the document drag listeners (also on teardown mid-drag). */\n  stopDrag: () => void = noop;\n\n  willDestroy(): void {\n    super.willDestroy();\n    this.stopDrag();\n  }\n\n  @action\n  onTouch(event: TouchEvent): void {\n    const touch = event.touches[0];\n\n    if (touch) this.moveTo(touch);\n  }\n\n  @action\n  onKeyDown(event: KeyboardEvent): void {\n    if (!this.box) return;\n\n    const { width, height } = this.box.getBoundingClientRect();\n    let { left, top } = this.indicator;\n\n    switch (event.key) {\n      case 'ArrowDown':\n        top = Math.min(top + height / 100, height);\n        break;\n      case 'ArrowUp':\n        top = Math.max(top - height / 100, 0);\n        break;\n      case 'ArrowLeft':\n        left = Math.max(left - width / 100, 0);\n        break;\n      case 'ArrowRight':\n        left = Math.min(left + width / 100, width);\n        break;\n      default:\n        return;\n    }\n\n    event.preventDefault();\n    this.update({ left, top, width, height });\n  }\n\n  registerBox = modifier((element: HTMLElement) => {\n    this.box = element;\n\n    const measure = () => {\n      const { width, height } = element.getBoundingClientRect();\n\n      if (width !== this.boxSize.width || height !== this.boxSize.height) {\n        this.boxSize = { width, height };\n      }\n    };\n\n    // measured after rendering, once laid out\n    schedule('afterRender', measure);\n  });\n\n  <template>\n    {{! template-lint-disable no-invalid-interactive }}\n    <div\n      class={{this.styles.root}}\n      data-test-subj=\"euiSaturation\"\n      tabindex=\"-1\"\n      style={{cssStyle (hash background=(hueBackground this.color))}}\n      {{on \"mousedown\" this.onMouseDown}}\n      {{on \"touchstart\" this.onTouch}}\n      {{on \"touchmove\" this.onTouch}}\n      {{on \"keydown\" this.onKeyDown}}\n      ...attributes\n    >\n      <div class={{this.styles.lightness}} {{this.registerBox}}>\n        <div class={{this.styles.saturation}}></div>\n      </div>\n      {{! the indicator is positioned by its tooltip anchor, as upstream }}\n      <EuiToolTip\n        @content={{@hex}}\n        @anchorCss={{this.styles.anchor}}\n        @anchorStyle={{cssStyle (hash left=this.indicator.left top=this.indicator.top)}}\n        @display=\"block\"\n        @disableScreenReaderOutput={{true}}\n      >\n        <button\n          type=\"button\"\n          id=\"{{@id}}-saturationIndicator\"\n          class={{this.styles.indicator}}\n          aria-roledescription={{this.roleDescription}}\n          aria-label={{this.ariaLabel}}\n          aria-describedby=\"{{@id}}-instructions\"\n        ></button>\n      </EuiToolTip>\n      <span hidden id=\"{{@id}}-instructions\">{{this.instructions}}</span>\n    </div>\n  </template>\n}\n\nfunction hueBackground(color: HSV): string {\n  return `hsl(${color[0]}, 100%, 50%)`;\n}\n"],"names":["noop","EuiSaturation","Component","g","prototype","service","i","styles","context","getEuiThemeContext","useEuiBorealisStyles","euiSaturationStyles","root","euiClass","boxReset","euiSaturation","lightness","euiSaturation__lightness","saturation","euiSaturation__saturation","anchor","euiSaturation__tooltip","indicator","buttonReset","euiSaturation__indicator","n","cached","tracked","width","height","box","color","args","dragged","forColor","join","s","v","left","boxSize","top","ariaLabel","euiI18n","lookupToken","roleDescription","instructions","update","onChange","moveTo","event","getEventPosition","x","clientX","y","clientY","onMouseDown","stopDrag","move","e","up","document","addEventListener","window","removeEventListener","action","willDestroy","onTouch","touch","touches","onKeyDown","getBoundingClientRect","key","Math","min","max","preventDefault","registerBox","modifier","element","measure","schedule","setComponentTemplate","precompileTemplate","strictMode","scope","cssStyle","hash","hueBackground","on","EuiToolTip"],"mappings":"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"}

package/dist/components/eui-search-bar/field-value-selection-filter.js

@@ -122,10 +122,15 @@ class FieldValueSelectionFilter extends Component {
         loadedOptions = options;
       } else {
         // Async options loader fn, potentially with a cache
-        loadedOptions = this.cachedOptions ?? (await options());
-        // If a cache time is set, populate the cache and schedule a cache reset
-        if (cache != null && cache > 0) {
+        const fromCache = this.cachedOptions;
+        loadedOptions = fromCache ?? (await options());
+        // If a cache time is set, populate the cache and schedule a cache
+        // reset. Only when the options were just loaded (a cache hit keeps
+        // its running timer), and never leave an earlier timer running.
+        // (Upstream starts a new timer on every load without clearing.)
+        if (!fromCache && cache != null && cache > 0 && !this.isDestroying && !this.isDestroyed) {
           this.cachedOptions = loadedOptions;
+          clearTimeout(this.cacheTimeout);
           this.cacheTimeout = setTimeout(() => {
             this.cachedOptions = null;
           }, cache);

package/dist/components/eui-search-bar/field-value-selection-filter.js.map

@@ -1 +1 @@
-{"version":3,"file":"field-value-selection-filter.js","sources":["../../../src/components/eui-search-bar/field-value-selection-filter.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { cached, tracked } from '@glimmer/tracking';\nimport { registerDestructor } from '@ember/destroyable';\nimport { on } from '@ember/modifier';\nimport { action } from '@ember/object';\nimport { service } from '@ember/service';\nimport { waitForPromise } from '@ember/test-waiters';\n\nimport { modifier } from 'ember-modifier';\n\nimport { getEuiThemeContext } from '../../utils/emotion/consume.ts';\nimport { useEuiBorealisStyles } from '../../utils/eui/styles.ts';\nimport { euiFilterGroupStyles } from '../../utils/eui/styles.generated.ts';\nimport { Operator } from '../../utils/eui/search-bar/ast.ts';\nimport { Query } from '../../utils/eui/search-bar/query.ts';\nimport EuiFilterButton from '../eui-filter-button.gts';\nimport EuiPopover from '../eui-popover.gts';\nimport EuiPopoverTitle from '../eui-popover-title.gts';\nimport EuiSelectable from '../eui-selectable.gts';\nimport EuiRenderNode from '../../-private/eui-render-node.gts';\n\nimport type Owner from '@ember/owner';\nimport type { ComponentLike } from '@glint/template';\nimport type {\n  FieldValueOptionType,\n  FieldValueSelectionFilterConfigType,\n  MultiSelect\n} from '../../-private/search-bar.ts';\nimport type { EuiSelectableOption } from '../../-private/selectable-options.ts';\nimport type EuiI18n from '../../services/eui-i18n';\nimport type { Clause, Value } from '../../utils/eui/search-bar/ast.ts';\n\n/**\n * @private A filter button of `EuiSearchBar` opening a list of field values\n * (upstream `FieldValueSelectionFilter`): single or multi select, `and`\n * clauses or one `or` clause, sync or async (cached) options, a search above\n * `searchThreshold` options and checked options sorted first.\n */\nexport interface FieldValueSelectionFilterSignature {\n  Args: {\n    config: FieldValueSelectionFilterConfigType;\n    query: Query;\n    onChange: (query: Query) => void;\n  };\n}\n\nconst defaults = {\n  config: {\n    multiSelect: true,\n    filterWith: 'prefix',\n    searchThreshold: 10,\n    autoSortOptions: true\n  }\n};\n\ninterface LoadedOptions {\n  unsorted: FieldValueOptionType[];\n  sorted: FieldValueOptionType[];\n}\n\ninterface SelectionOption extends EuiSelectableOption {\n  data: { view: string | ComponentLike; value: Value; optionField: string };\n}\n\nexport default class FieldValueSelectionFilter extends Component<FieldValueSelectionFilterSignature> {\n  @service declare euiI18n: EuiI18n;\n\n  @tracked popoverOpen = false;\n  @tracked error: string | null = null;\n  @tracked options: LoadedOptions | null;\n  @tracked activeItemsCount = 0;\n  cachedOptions: FieldValueOptionType[] | null = null;\n  cacheTimeout: ReturnType<typeof setTimeout> | undefined;\n\n  constructor(owner: Owner, args: FieldValueSelectionFilterSignature['Args']) {\n    super(owner, args);\n    const { options } = args.config;\n    this.options = Array.isArray(options)\n      ? { unsorted: options, sorted: options }\n      : null;\n    registerDestructor(this, () => clearTimeout(this.cacheTimeout));\n  }\n\n  get autoSortOptions(): boolean {\n    return this.args.config.autoSortOptions ?? defaults.config.autoSortOptions;\n  }\n\n  get multiSelect(): MultiSelect {\n    return this.args.config.multiSelect ?? defaults.config.multiSelect;\n  }\n\n  /** Upstream componentDidMount/componentDidUpdate: reload on query change. */\n  watchQuery = modifier(\n    (_element: Element, [query]: [Query]) => {\n      if (query !== this.lastQuery) {\n        const isFirst = this.lastQuery === undefined;\n        this.lastQuery = query;\n        if (!isFirst || query.text.length) void this.scheduleLoad();\n      }\n    }\n  );\n\n  lastQuery: Query | undefined;\n\n  scheduleLoad(): Promise<void> {\n    // after the render that consumed the state\n    return waitForPromise(Promise.resolve().then(() => this.loadOptions()));\n  }\n\n  @action\n  closePopover(): void {\n    this.popoverOpen = false;\n  }\n\n  @action\n  onButtonClick(): void {\n    const wasOpen = this.popoverOpen;\n    this.options = null;\n    this.error = null;\n    this.popoverOpen = !wasOpen;\n    if (!wasOpen) {\n      // loading options updates the state, so it runs in the animation frame\n      void waitForPromise(\n        new Promise<void>((resolve) =>\n          window.requestAnimationFrame(() => {\n            void this.loadOptions().then(resolve);\n          })\n        )\n      );\n    }\n  }\n\n  loadOptions = async (): Promise<void> => {\n    if (this.isDestroying || this.isDestroyed) return;\n    let loadedOptions: FieldValueOptionType[];\n    this.options = null;\n    this.error = null;\n\n    const { options, cache } = this.args.config;\n    try {\n      if (Array.isArray(options)) {\n        // Synchronous options, already loaded\n        loadedOptions = options;\n      } else {\n        // Async options loader fn, potentially with a cache\n        loadedOptions = this.cachedOptions ?? (await options());\n\n        // If a cache time is set, populate the cache and schedule a cache reset\n        if (cache != null && cache > 0) {\n          this.cachedOptions = loadedOptions;\n          this.cacheTimeout = setTimeout(() => {\n            this.cachedOptions = null;\n          }, cache);\n        }\n      }\n    } catch {\n      if (this.isDestroying || this.isDestroyed) return;\n      this.options = null;\n      this.error = 'Could not load options';\n      return;\n    }\n    if (this.isDestroying || this.isDestroyed) return;\n\n    const items: Record<'on' | 'off' | 'rest', FieldValueOptionType[]> = {\n      on: [],\n      off: [],\n      rest: []\n    };\n\n    const { query, config } = this.args;\n\n    if (loadedOptions) {\n      loadedOptions.forEach((op) => {\n        const optionField = op.field || config.field;\n        if (optionField) {\n          const clause =\n            this.multiSelect === 'or'\n              ? query.getOrFieldClause(optionField, op.value)\n              : query.getSimpleFieldClause(optionField, op.value);\n          const checked = this.resolveChecked(clause);\n          if (!checked) {\n            items.rest.push(op);\n          } else if (checked === 'on') {\n            items.on.push(op);\n          } else {\n            items.off.push(op);\n          }\n        }\n      });\n    }\n\n    this.error = null;\n    this.activeItemsCount = items.on.length;\n    this.options = {\n      unsorted: loadedOptions,\n      sorted: [...items.on, ...items.off, ...items.rest]\n    };\n  };\n\n  resolveOptionName(option: FieldValueOptionType): string {\n    return option.name || String(option.value as string);\n  }\n\n  resolveChecked(clause: Clause | undefined): 'on' | 'off' | undefined {\n    if (clause) {\n      return Query.isMust(clause) ? 'on' : 'off';\n    }\n    return undefined;\n  }\n\n  isActiveField(field: string | undefined): boolean {\n    if (typeof field !== 'string') {\n      return false;\n    }\n    const { query } = this.args;\n    if (this.multiSelect === 'or') {\n      return query.hasOrFieldClause(field);\n    }\n    return query.hasSimpleFieldClause(field);\n  }\n\n  onOptionClick(field: string, value: Value, checked?: 'on' | 'off'): void {\n    const { autoClose, operator = Operator.EQ } = this.args.config;\n\n    // If the consumer explicitly sets `autoClose`, always defer to that.\n    // Otherwise, default to auto-closing for single selections and leaving the\n    // popover open for multi-select (so users can continue selecting options)\n    const shouldClosePopover = autoClose ?? !this.multiSelect;\n    if (shouldClosePopover) {\n      this.closePopover();\n    }\n\n    const { query } = this.args;\n    if (!this.multiSelect) {\n      this.args.onChange(\n        checked\n          ? query\n              .removeSimpleFieldClauses(field)\n              .addSimpleFieldValue(field, value, true, operator)\n          : query.removeSimpleFieldClauses(field)\n      );\n    } else if (this.multiSelect === 'or') {\n      this.args.onChange(\n        checked\n          ? query.addOrFieldValue(field, value, true, operator)\n          : query.removeOrFieldValue(field, value)\n      );\n    } else {\n      this.args.onChange(\n        checked\n          ? query.addSimpleFieldValue(field, value, true, operator)\n          : query.removeSimpleFieldValue(field, value)\n      );\n    }\n  }\n\n  get visibleOptions(): FieldValueOptionType[] | undefined {\n    return this.autoSortOptions\n      ? this.options?.sorted\n      : this.options?.unsorted;\n  }\n\n  get active(): boolean {\n    const { config } = this.args;\n    const options = this.visibleOptions;\n    const activeTop = this.isActiveField(config.field);\n    const activeItem = options\n      ? options.some((item) => this.isActiveField(item.field))\n      : false;\n    return (activeTop || activeItem) && this.activeItemsCount > 0;\n  }\n\n  get buttonLabel(): string {\n    const hint = this.euiI18n.lookupToken(\n      'euiFieldValueSelectionFilter.buttonLabelHint',\n      'Selection'\n    );\n    return `${this.args.config.name} ${hint}`;\n  }\n\n  get items(): SelectionOption[] {\n    const { query, config } = this.args;\n    const options = this.visibleOptions;\n    if (!options) return [];\n    return options.map((option) => {\n      const optionField = option.field || config.field;\n      if (optionField == null) {\n        throw new Error(\n          'option.field or field should be provided in <FieldValueSelectionFilter/>'\n        );\n      }\n      const clause =\n        this.multiSelect === 'or'\n          ? query.getOrFieldClause(optionField, option.value)\n          : query.getSimpleFieldClause(optionField, option.value);\n      const label = this.resolveOptionName(option);\n      return {\n        label,\n        checked: this.resolveChecked(clause),\n        data: { view: option.view ?? label, value: option.value, optionField }\n      };\n    });\n  }\n\n  get isOverSearchThreshold(): boolean {\n    const threshold =\n      this.args.config.searchThreshold || defaults.config.searchThreshold;\n    const options = this.visibleOptions;\n    return Boolean(options && options.length >= threshold);\n  }\n\n  @cached\n  get panelCss() {\n    const context = getEuiThemeContext(this);\n    return useEuiBorealisStyles(context, euiFilterGroupStyles)\n      .euiFilterGroup__popoverPanel;\n  }\n\n  @action\n  onSelectableChange(options: EuiSelectableOption[]): void {\n    // EuiSelectable reports every option; the clicked one is the option\n    // that became checked (single selection also unchecks the previous one)\n    const previous = this.items;\n    const changes = options.filter(\n      (option, i) => option.checked !== previous[i]?.checked\n    );\n    const changed = (changes.find((option) => option.checked) ??\n      changes[0]) as SelectionOption | undefined;\n    if (changed?.data) {\n      this.onOptionClick(\n        changed.data.optionField,\n        changed.data.value,\n        changed.checked === 'mixed' ? undefined : changed.checked\n      );\n    }\n  }\n\n  <template>\n    <EuiPopover\n      @isOpen={{this.popoverOpen}}\n      @closePopover={{this.closePopover}}\n      @panelPaddingSize=\"none\"\n      @anchorPosition=\"downCenter\"\n      @panelCss={{this.panelCss}}\n      {{this.watchQuery @query}}\n    >\n      <:button>\n        <EuiFilterButton\n          @iconType=\"chevronSingleDown\"\n          @iconSide=\"right\"\n          @isSelected={{this.active}}\n          @hasActiveFilters={{this.active}}\n          @numActiveFilters={{if this.active this.activeItemsCount}}\n          @grow={{true}}\n          aria-label={{this.buttonLabel}}\n          aria-expanded={{if this.popoverOpen \"true\" \"false\"}}\n          {{on \"click\" this.onButtonClick}}\n        >{{@config.name}}</EuiFilterButton>\n      </:button>\n      <:content>\n        <EuiSelectable\n          @singleSelection={{if this.multiSelect false true}}\n          @options={{this.items}}\n          @onChange={{this.onSelectableChange}}\n          @isLoading={{isLoading this.options this.error}}\n          @loadingMessage={{@config.loadingMessage}}\n          @emptyMessage={{if this.error this.error @config.noOptionsMessage}}\n          @noMatchesMessage={{@config.noOptionsMessage}}\n          @listProps={{LIST_PROPS}}\n          @searchable={{this.isOverSearchThreshold}}\n          @searchProps={{SEARCH_PROPS}}\n        >\n          <:default as |parts|>\n            {{#if parts.search}}\n              <EuiPopoverTitle @paddingSize=\"s\">\n                <parts.search />\n              </EuiPopoverTitle>\n            {{/if}}\n            <parts.list>\n              <:option as |option|><EuiRenderNode @value={{viewOf option}} /></:option>\n            </parts.list>\n          </:default>\n        </EuiSelectable>\n      </:content>\n    </EuiPopover>\n  </template>\n}\n\nconst LIST_PROPS = { paddingSize: 's' as const };\nconst SEARCH_PROPS = { compressed: true };\n\nfunction isLoading(options: LoadedOptions | null, error: string | null): boolean {\n  return options == null && error == null;\n}\n\nfunction viewOf(option: EuiSelectableOption): string | ComponentLike {\n  return (option as SelectionOption).data?.view ?? option.label;\n}\n"],"names":["defaults","config","multiSelect","filterWith","searchThreshold","autoSortOptions","FieldValueSelectionFilter","Component","g","prototype","service","i","tracked","cachedOptions","cacheTimeout","constructor","owner","args","options","Array","isArray","unsorted","sorted","registerDestructor","clearTimeout","watchQuery","modifier","_element","query","lastQuery","isFirst","undefined","text","length","scheduleLoad","waitForPromise","Promise","resolve","then","loadOptions","closePopover","popoverOpen","n","action","onButtonClick","wasOpen","error","window","requestAnimationFrame","isDestroying","isDestroyed","loadedOptions","cache","setTimeout","items","on","off","rest","forEach","op","optionField","field","clause","getOrFieldClause","value","getSimpleFieldClause","checked","resolveChecked","push","activeItemsCount","resolveOptionName","option","name","String","Query","isMust","isActiveField","hasOrFieldClause","hasSimpleFieldClause","onOptionClick","autoClose","operator","Operator","EQ","shouldClosePopover","onChange","removeSimpleFieldClauses","addSimpleFieldValue","addOrFieldValue","removeOrFieldValue","removeSimpleFieldValue","visibleOptions","active","activeTop","activeItem","some","item","buttonLabel","hint","euiI18n","lookupToken","map","Error","label","data","view","isOverSearchThreshold","threshold","Boolean","panelCss","context","getEuiThemeContext","useEuiBorealisStyles","euiFilterGroupStyles","euiFilterGroup__popoverPanel","cached","onSelectableChange","previous","changes","filter","changed","find","setComponentTemplate","precompileTemplate","strictMode","scope","EuiPopover","EuiFilterButton","EuiSelectable","isLoading","LIST_PROPS","SEARCH_PROPS","EuiPopoverTitle","EuiRenderNode","viewOf","paddingSize","compressed"],"mappings":"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"}
+{"version":3,"file":"field-value-selection-filter.js","sources":["../../../src/components/eui-search-bar/field-value-selection-filter.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { cached, tracked } from '@glimmer/tracking';\nimport { registerDestructor } from '@ember/destroyable';\nimport { on } from '@ember/modifier';\nimport { action } from '@ember/object';\nimport { service } from '@ember/service';\nimport { waitForPromise } from '@ember/test-waiters';\n\nimport { modifier } from 'ember-modifier';\n\nimport { getEuiThemeContext } from '../../utils/emotion/consume.ts';\nimport { useEuiBorealisStyles } from '../../utils/eui/styles.ts';\nimport { euiFilterGroupStyles } from '../../utils/eui/styles.generated.ts';\nimport { Operator } from '../../utils/eui/search-bar/ast.ts';\nimport { Query } from '../../utils/eui/search-bar/query.ts';\nimport EuiFilterButton from '../eui-filter-button.gts';\nimport EuiPopover from '../eui-popover.gts';\nimport EuiPopoverTitle from '../eui-popover-title.gts';\nimport EuiSelectable from '../eui-selectable.gts';\nimport EuiRenderNode from '../../-private/eui-render-node.gts';\n\nimport type Owner from '@ember/owner';\nimport type { ComponentLike } from '@glint/template';\nimport type {\n  FieldValueOptionType,\n  FieldValueSelectionFilterConfigType,\n  MultiSelect\n} from '../../-private/search-bar.ts';\nimport type { EuiSelectableOption } from '../../-private/selectable-options.ts';\nimport type EuiI18n from '../../services/eui-i18n';\nimport type { Clause, Value } from '../../utils/eui/search-bar/ast.ts';\n\n/**\n * @private A filter button of `EuiSearchBar` opening a list of field values\n * (upstream `FieldValueSelectionFilter`): single or multi select, `and`\n * clauses or one `or` clause, sync or async (cached) options, a search above\n * `searchThreshold` options and checked options sorted first.\n */\nexport interface FieldValueSelectionFilterSignature {\n  Args: {\n    config: FieldValueSelectionFilterConfigType;\n    query: Query;\n    onChange: (query: Query) => void;\n  };\n}\n\nconst defaults = {\n  config: {\n    multiSelect: true,\n    filterWith: 'prefix',\n    searchThreshold: 10,\n    autoSortOptions: true\n  }\n};\n\ninterface LoadedOptions {\n  unsorted: FieldValueOptionType[];\n  sorted: FieldValueOptionType[];\n}\n\ninterface SelectionOption extends EuiSelectableOption {\n  data: { view: string | ComponentLike; value: Value; optionField: string };\n}\n\nexport default class FieldValueSelectionFilter extends Component<FieldValueSelectionFilterSignature> {\n  @service declare euiI18n: EuiI18n;\n\n  @tracked popoverOpen = false;\n  @tracked error: string | null = null;\n  @tracked options: LoadedOptions | null;\n  @tracked activeItemsCount = 0;\n  cachedOptions: FieldValueOptionType[] | null = null;\n  cacheTimeout: ReturnType<typeof setTimeout> | undefined;\n\n  constructor(owner: Owner, args: FieldValueSelectionFilterSignature['Args']) {\n    super(owner, args);\n    const { options } = args.config;\n    this.options = Array.isArray(options)\n      ? { unsorted: options, sorted: options }\n      : null;\n    registerDestructor(this, () => clearTimeout(this.cacheTimeout));\n  }\n\n  get autoSortOptions(): boolean {\n    return this.args.config.autoSortOptions ?? defaults.config.autoSortOptions;\n  }\n\n  get multiSelect(): MultiSelect {\n    return this.args.config.multiSelect ?? defaults.config.multiSelect;\n  }\n\n  /** Upstream componentDidMount/componentDidUpdate: reload on query change. */\n  watchQuery = modifier(\n    (_element: Element, [query]: [Query]) => {\n      if (query !== this.lastQuery) {\n        const isFirst = this.lastQuery === undefined;\n        this.lastQuery = query;\n        if (!isFirst || query.text.length) void this.scheduleLoad();\n      }\n    }\n  );\n\n  lastQuery: Query | undefined;\n\n  scheduleLoad(): Promise<void> {\n    // after the render that consumed the state\n    return waitForPromise(Promise.resolve().then(() => this.loadOptions()));\n  }\n\n  @action\n  closePopover(): void {\n    this.popoverOpen = false;\n  }\n\n  @action\n  onButtonClick(): void {\n    const wasOpen = this.popoverOpen;\n    this.options = null;\n    this.error = null;\n    this.popoverOpen = !wasOpen;\n    if (!wasOpen) {\n      // loading options updates the state, so it runs in the animation frame\n      void waitForPromise(\n        new Promise<void>((resolve) =>\n          window.requestAnimationFrame(() => {\n            void this.loadOptions().then(resolve);\n          })\n        )\n      );\n    }\n  }\n\n  loadOptions = async (): Promise<void> => {\n    if (this.isDestroying || this.isDestroyed) return;\n    let loadedOptions: FieldValueOptionType[];\n    this.options = null;\n    this.error = null;\n\n    const { options, cache } = this.args.config;\n    try {\n      if (Array.isArray(options)) {\n        // Synchronous options, already loaded\n        loadedOptions = options;\n      } else {\n        // Async options loader fn, potentially with a cache\n        const fromCache = this.cachedOptions;\n        loadedOptions = fromCache ?? (await options());\n\n        // If a cache time is set, populate the cache and schedule a cache\n        // reset. Only when the options were just loaded (a cache hit keeps\n        // its running timer), and never leave an earlier timer running.\n        // (Upstream starts a new timer on every load without clearing.)\n        if (!fromCache && cache != null && cache > 0 && !this.isDestroying && !this.isDestroyed) {\n          this.cachedOptions = loadedOptions;\n          clearTimeout(this.cacheTimeout);\n          this.cacheTimeout = setTimeout(() => {\n            this.cachedOptions = null;\n          }, cache);\n        }\n      }\n    } catch {\n      if (this.isDestroying || this.isDestroyed) return;\n      this.options = null;\n      this.error = 'Could not load options';\n      return;\n    }\n    if (this.isDestroying || this.isDestroyed) return;\n\n    const items: Record<'on' | 'off' | 'rest', FieldValueOptionType[]> = {\n      on: [],\n      off: [],\n      rest: []\n    };\n\n    const { query, config } = this.args;\n\n    if (loadedOptions) {\n      loadedOptions.forEach((op) => {\n        const optionField = op.field || config.field;\n        if (optionField) {\n          const clause =\n            this.multiSelect === 'or'\n              ? query.getOrFieldClause(optionField, op.value)\n              : query.getSimpleFieldClause(optionField, op.value);\n          const checked = this.resolveChecked(clause);\n          if (!checked) {\n            items.rest.push(op);\n          } else if (checked === 'on') {\n            items.on.push(op);\n          } else {\n            items.off.push(op);\n          }\n        }\n      });\n    }\n\n    this.error = null;\n    this.activeItemsCount = items.on.length;\n    this.options = {\n      unsorted: loadedOptions,\n      sorted: [...items.on, ...items.off, ...items.rest]\n    };\n  };\n\n  resolveOptionName(option: FieldValueOptionType): string {\n    return option.name || String(option.value as string);\n  }\n\n  resolveChecked(clause: Clause | undefined): 'on' | 'off' | undefined {\n    if (clause) {\n      return Query.isMust(clause) ? 'on' : 'off';\n    }\n    return undefined;\n  }\n\n  isActiveField(field: string | undefined): boolean {\n    if (typeof field !== 'string') {\n      return false;\n    }\n    const { query } = this.args;\n    if (this.multiSelect === 'or') {\n      return query.hasOrFieldClause(field);\n    }\n    return query.hasSimpleFieldClause(field);\n  }\n\n  onOptionClick(field: string, value: Value, checked?: 'on' | 'off'): void {\n    const { autoClose, operator = Operator.EQ } = this.args.config;\n\n    // If the consumer explicitly sets `autoClose`, always defer to that.\n    // Otherwise, default to auto-closing for single selections and leaving the\n    // popover open for multi-select (so users can continue selecting options)\n    const shouldClosePopover = autoClose ?? !this.multiSelect;\n    if (shouldClosePopover) {\n      this.closePopover();\n    }\n\n    const { query } = this.args;\n    if (!this.multiSelect) {\n      this.args.onChange(\n        checked\n          ? query\n              .removeSimpleFieldClauses(field)\n              .addSimpleFieldValue(field, value, true, operator)\n          : query.removeSimpleFieldClauses(field)\n      );\n    } else if (this.multiSelect === 'or') {\n      this.args.onChange(\n        checked\n          ? query.addOrFieldValue(field, value, true, operator)\n          : query.removeOrFieldValue(field, value)\n      );\n    } else {\n      this.args.onChange(\n        checked\n          ? query.addSimpleFieldValue(field, value, true, operator)\n          : query.removeSimpleFieldValue(field, value)\n      );\n    }\n  }\n\n  get visibleOptions(): FieldValueOptionType[] | undefined {\n    return this.autoSortOptions\n      ? this.options?.sorted\n      : this.options?.unsorted;\n  }\n\n  get active(): boolean {\n    const { config } = this.args;\n    const options = this.visibleOptions;\n    const activeTop = this.isActiveField(config.field);\n    const activeItem = options\n      ? options.some((item) => this.isActiveField(item.field))\n      : false;\n    return (activeTop || activeItem) && this.activeItemsCount > 0;\n  }\n\n  get buttonLabel(): string {\n    const hint = this.euiI18n.lookupToken(\n      'euiFieldValueSelectionFilter.buttonLabelHint',\n      'Selection'\n    );\n    return `${this.args.config.name} ${hint}`;\n  }\n\n  get items(): SelectionOption[] {\n    const { query, config } = this.args;\n    const options = this.visibleOptions;\n    if (!options) return [];\n    return options.map((option) => {\n      const optionField = option.field || config.field;\n      if (optionField == null) {\n        throw new Error(\n          'option.field or field should be provided in <FieldValueSelectionFilter/>'\n        );\n      }\n      const clause =\n        this.multiSelect === 'or'\n          ? query.getOrFieldClause(optionField, option.value)\n          : query.getSimpleFieldClause(optionField, option.value);\n      const label = this.resolveOptionName(option);\n      return {\n        label,\n        checked: this.resolveChecked(clause),\n        data: { view: option.view ?? label, value: option.value, optionField }\n      };\n    });\n  }\n\n  get isOverSearchThreshold(): boolean {\n    const threshold =\n      this.args.config.searchThreshold || defaults.config.searchThreshold;\n    const options = this.visibleOptions;\n    return Boolean(options && options.length >= threshold);\n  }\n\n  @cached\n  get panelCss() {\n    const context = getEuiThemeContext(this);\n    return useEuiBorealisStyles(context, euiFilterGroupStyles)\n      .euiFilterGroup__popoverPanel;\n  }\n\n  @action\n  onSelectableChange(options: EuiSelectableOption[]): void {\n    // EuiSelectable reports every option; the clicked one is the option\n    // that became checked (single selection also unchecks the previous one)\n    const previous = this.items;\n    const changes = options.filter(\n      (option, i) => option.checked !== previous[i]?.checked\n    );\n    const changed = (changes.find((option) => option.checked) ??\n      changes[0]) as SelectionOption | undefined;\n    if (changed?.data) {\n      this.onOptionClick(\n        changed.data.optionField,\n        changed.data.value,\n        changed.checked === 'mixed' ? undefined : changed.checked\n      );\n    }\n  }\n\n  <template>\n    <EuiPopover\n      @isOpen={{this.popoverOpen}}\n      @closePopover={{this.closePopover}}\n      @panelPaddingSize=\"none\"\n      @anchorPosition=\"downCenter\"\n      @panelCss={{this.panelCss}}\n      {{this.watchQuery @query}}\n    >\n      <:button>\n        <EuiFilterButton\n          @iconType=\"chevronSingleDown\"\n          @iconSide=\"right\"\n          @isSelected={{this.active}}\n          @hasActiveFilters={{this.active}}\n          @numActiveFilters={{if this.active this.activeItemsCount}}\n          @grow={{true}}\n          aria-label={{this.buttonLabel}}\n          aria-expanded={{if this.popoverOpen \"true\" \"false\"}}\n          {{on \"click\" this.onButtonClick}}\n        >{{@config.name}}</EuiFilterButton>\n      </:button>\n      <:content>\n        <EuiSelectable\n          @singleSelection={{if this.multiSelect false true}}\n          @options={{this.items}}\n          @onChange={{this.onSelectableChange}}\n          @isLoading={{isLoading this.options this.error}}\n          @loadingMessage={{@config.loadingMessage}}\n          @emptyMessage={{if this.error this.error @config.noOptionsMessage}}\n          @noMatchesMessage={{@config.noOptionsMessage}}\n          @listProps={{LIST_PROPS}}\n          @searchable={{this.isOverSearchThreshold}}\n          @searchProps={{SEARCH_PROPS}}\n        >\n          <:default as |parts|>\n            {{#if parts.search}}\n              <EuiPopoverTitle @paddingSize=\"s\">\n                <parts.search />\n              </EuiPopoverTitle>\n            {{/if}}\n            <parts.list>\n              <:option as |option|><EuiRenderNode @value={{viewOf option}} /></:option>\n            </parts.list>\n          </:default>\n        </EuiSelectable>\n      </:content>\n    </EuiPopover>\n  </template>\n}\n\nconst LIST_PROPS = { paddingSize: 's' as const };\nconst SEARCH_PROPS = { compressed: true };\n\nfunction isLoading(options: LoadedOptions | null, error: string | null): boolean {\n  return options == null && error == null;\n}\n\nfunction viewOf(option: EuiSelectableOption): string | ComponentLike {\n  return (option as SelectionOption).data?.view ?? option.label;\n}\n"],"names":["defaults","config","multiSelect","filterWith","searchThreshold","autoSortOptions","FieldValueSelectionFilter","Component","g","prototype","service","i","tracked","cachedOptions","cacheTimeout","constructor","owner","args","options","Array","isArray","unsorted","sorted","registerDestructor","clearTimeout","watchQuery","modifier","_element","query","lastQuery","isFirst","undefined","text","length","scheduleLoad","waitForPromise","Promise","resolve","then","loadOptions","closePopover","popoverOpen","n","action","onButtonClick","wasOpen","error","window","requestAnimationFrame","isDestroying","isDestroyed","loadedOptions","cache","fromCache","setTimeout","items","on","off","rest","forEach","op","optionField","field","clause","getOrFieldClause","value","getSimpleFieldClause","checked","resolveChecked","push","activeItemsCount","resolveOptionName","option","name","String","Query","isMust","isActiveField","hasOrFieldClause","hasSimpleFieldClause","onOptionClick","autoClose","operator","Operator","EQ","shouldClosePopover","onChange","removeSimpleFieldClauses","addSimpleFieldValue","addOrFieldValue","removeOrFieldValue","removeSimpleFieldValue","visibleOptions","active","activeTop","activeItem","some","item","buttonLabel","hint","euiI18n","lookupToken","map","Error","label","data","view","isOverSearchThreshold","threshold","Boolean","panelCss","context","getEuiThemeContext","useEuiBorealisStyles","euiFilterGroupStyles","euiFilterGroup__popoverPanel","cached","onSelectableChange","previous","changes","filter","changed","find","setComponentTemplate","precompileTemplate","strictMode","scope","EuiPopover","EuiFilterButton","EuiSelectable","isLoading","LIST_PROPS","SEARCH_PROPS","EuiPopoverTitle","EuiRenderNode","viewOf","paddingSize","compressed"],"mappings":"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"}

package/dist/components/eui-text-color.js

@@ -1,6 +1,7 @@
 import Component from '@glimmer/component';
 import { cached } from '@glimmer/tracking';
 import { eq } from 'ember-truth-helpers';
+import style from 'ember-style-modifier/modifiers/style';
 import { getEuiThemeContext } from '../utils/emotion/consume.js';
 import { euiClass, useEuiBorealisStyles } from '../utils/eui/styles.js';
 import { dB as euiTextColorStyles } from '../styles.generated-SYAxYhey.js';
@@ -25,14 +26,26 @@ function euiTextColorCss(context, color = 'default') {
   if (color === 'primary') return [styles.euiTextColor, {
     color: context.upstream.euiTheme.colors.textPrimary
   }];
-  // Upstream sets custom colors inline; a class keeps `style` free for callers.
-  return [styles.euiTextColor, styles.customColor, {
+  // The custom value itself goes inline (`euiTextColorInlineStyle`), as
+  // upstream does: a class per color would stay in the style cache for good.
+  return [styles.euiTextColor, styles.customColor];
+}
+/**
+ * @private Upstream's inline `style` for a custom (non-named) color, for the
+ * `{{style}}` modifier. Empty for named colors.
+ */
+function euiTextColorInlineStyle(color) {
+  if (!color || isNamedColor(color) || color === 'primary') return {};
+  return {
     color
-  }];
+  };
 }
 /** Colors its text content. */
 
 class EuiTextColor extends Component {
+  get inlineStyle() {
+    return euiTextColorInlineStyle(this.args.color);
+  }
   get classes() {
     const context = getEuiThemeContext(this);
     return euiClass(context,
@@ -45,14 +58,15 @@ class EuiTextColor extends Component {
     n(this.prototype, "classes", [cached]);
   }
   static {
-    setComponentTemplate(precompileTemplate("{{#if (eq @tagName \"div\")}}\n  <div class=\"euiTextColor {{this.classes}}\" ...attributes>\n    {{yield}}\n  </div>\n{{else if (eq @tagName \"p\")}}\n  <p class=\"euiTextColor {{this.classes}}\" ...attributes>\n    {{yield}}\n  </p>\n{{else}}\n  <span class=\"euiTextColor {{this.classes}}\" ...attributes>\n    {{yield}}\n  </span>\n{{/if}}", {
+    setComponentTemplate(precompileTemplate("{{#if (eq @tagName \"div\")}}\n  <div class=\"euiTextColor {{this.classes}}\" ...attributes {{style this.inlineStyle}}>\n    {{yield}}\n  </div>\n{{else if (eq @tagName \"p\")}}\n  <p class=\"euiTextColor {{this.classes}}\" ...attributes {{style this.inlineStyle}}>\n    {{yield}}\n  </p>\n{{else}}\n  <span class=\"euiTextColor {{this.classes}}\" ...attributes {{style this.inlineStyle}}>\n    {{yield}}\n  </span>\n{{/if}}", {
       strictMode: true,
       scope: () => ({
-        eq
+        eq,
+        style
       })
     }), this);
   }
 }
 
-export { TEXT_COLORS, EuiTextColor as default, euiTextColorCss };
+export { TEXT_COLORS, EuiTextColor as default, euiTextColorCss, euiTextColorInlineStyle };
 //# sourceMappingURL=eui-text-color.js.map

package/dist/components/eui-text-color.js.map

@@ -1 +1 @@
-{"version":3,"file":"eui-text-color.js","sources":["../../src/components/eui-text-color.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { cached } from '@glimmer/tracking';\nimport { eq } from 'ember-truth-helpers';\nimport { getEuiThemeContext } from '../utils/emotion/consume.ts';\nimport { euiClass, useEuiBorealisStyles } from '../utils/eui/styles.ts';\nimport { euiTextColorStyles } from '../utils/eui/styles.generated.ts';\n\nimport type { CSSInterpolation } from '@emotion/css/create-instance';\nimport type { EuiThemeContext } from '../utils/emotion/context.ts';\n\n/** Latest upstream named colors. */\nexport const TEXT_COLORS = [\n  'default',\n  'subdued',\n  'success',\n  'accent',\n  'accentSecondary',\n  'danger',\n  'warning',\n  'ghost',\n  'inherit'\n] as const;\n\n/**\n * A named color, the Ember-only `'primary'`, or any CSS color value\n * (`'#c0ffee'`, `'rgb(…)'`, `'currentColor'`…).\n */\nexport type EuiTextColorValue =\n  | (typeof TEXT_COLORS)[number]\n  | 'primary'\n  | (string & {});\n\nfunction isNamedColor(color: string): color is (typeof TEXT_COLORS)[number] {\n  return (TEXT_COLORS as readonly string[]).includes(color);\n}\n\n/** @private Shared with EuiText, which composes color on its own element. */\nexport function euiTextColorCss(\n  context: EuiThemeContext,\n  color: EuiTextColorValue = 'default'\n): CSSInterpolation[] {\n  const styles = useEuiBorealisStyles(context, euiTextColorStyles);\n  if (isNamedColor(color)) return [styles.euiTextColor, styles[color]];\n  // Upstream dropped `primary`; keep it working with the native text token.\n  if (color === 'primary')\n    return [\n      styles.euiTextColor,\n      { color: context.upstream.euiTheme.colors.textPrimary }\n    ];\n  // Upstream sets custom colors inline; a class keeps `style` free for callers.\n  return [styles.euiTextColor, styles.customColor, { color }];\n}\n\n/** Colors its text content. */\nexport interface EuiTextColorSignature {\n  Element: HTMLSpanElement | HTMLDivElement | HTMLParagraphElement;\n  Args: {\n    /**\n     * `'default'`, `'subdued'`, `'success'`, `'accent'`, `'accentSecondary'`,\n     * `'danger'`, `'warning'`, `'ghost'`, `'inherit'`, `'primary'`, or any\n     * CSS color value. Defaults to `'default'`.\n     */\n    color?: EuiTextColorValue;\n    /** `'span'` (inline), `'div'` or `'p'`. Defaults to `'span'`. */\n    tagName?: 'span' | 'div' | 'p';\n  };\n  Blocks: {\n    /** The content. */\n    default: [];\n  };\n}\n\nexport default class EuiTextColor extends Component<EuiTextColorSignature> {\n  @cached\n  get classes() {\n    const context = getEuiThemeContext(this);\n    return euiClass(\n      context,\n      // React's global reset removes paragraph margins; Ember has no reset.\n      this.args.tagName === 'p' ? { margin: 0 } : undefined,\n      ...euiTextColorCss(context, this.args.color)\n    );\n  }\n\n  <template>\n    {{#if (eq @tagName \"div\")}}\n      <div class=\"euiTextColor {{this.classes}}\" ...attributes>\n        {{yield}}\n      </div>\n    {{else if (eq @tagName \"p\")}}\n      <p class=\"euiTextColor {{this.classes}}\" ...attributes>\n        {{yield}}\n      </p>\n    {{else}}\n      <span class=\"euiTextColor {{this.classes}}\" ...attributes>\n        {{yield}}\n      </span>\n    {{/if}}\n  </template>\n}\n"],"names":["TEXT_COLORS","isNamedColor","color","includes","euiTextColorCss","context","styles","useEuiBorealisStyles","euiTextColorStyles","euiTextColor","upstream","euiTheme","colors","textPrimary","customColor","EuiTextColor","Component","classes","getEuiThemeContext","euiClass","args","tagName","margin","undefined","n","prototype","cached","setComponentTemplate","precompileTemplate","strictMode","scope","eq"],"mappings":";;;;;;;;;;AAWO,MAAMA,WAAA,GAAc,CACzB,SAAA,EACA,SAAA,EACA,SAAA,EACA,QAAA,EACA,iBAAA,EACA,QAAA,EACA,SAAA,EACA,OAAA,EACA,SAAA;AAGF;;;AAGC;;AAMD,SAASC,aAAaC,KAAa,EAAuC;AACxE,EAAA,OAAQF,WAAA,CAAkCG,QAAQ,CAACD,KAAA,CAAA;AACrD;AAEA;AACO,SAASE,eAAAA,CACdC,OAAwB,EACxBH,KAAO,GAAoB,SAAS,EACnC;AACD,EAAA,MAAMI,MAAA,GAASC,qBAAqBF,OAAA,EAASG,kBAAA,CAAA;AAC7C,EAAA,IAAIP,YAAA,CAAaC,QAAQ,OAAO,CAACI,MAAA,CAAOG,YAAY,EAAEH,MAAM,CAACJ,KAAA,CAAM,CAAC;AACpE;EACA,IAAIA,KAAA,KAAU,WACZ,OAAO,CACLI,MAAA,CAAOG,YAAY,EACnB;IAAEP,KAAA,EAAOG,QAAQK,QAAQ,CAACC,QAAQ,CAACC,MAAM,CAACC;AAAY,GAAA,CACvD;AACH;EACA,OAAO,CAACP,MAAA,CAAOG,YAAY,EAAEH,MAAA,CAAOQ,WAAW,EAAE;AAAEZ,IAAAA;AAAM,GAAA,CAAE;AAC7D;AAEA;;AAmBe,MAAMa,qBAAqBC,SAAA,CAAU;EAClD,IACIC,OAAAA,GAAU;AACZ,IAAA,MAAMZ,OAAA,GAAUa,mBAAmB,IAAI,CAAA;IACvC,OAAOC,QAAA,CACLd;AACA;AACA,IAAA,IAAI,CAACe,IAAI,CAACC,OAAO,KAAK,GAAA,GAAM;AAAEC,MAAAA,MAAA,EAAQ;AAAE,KAAA,GAAIC,cACzCnB,eAAA,CAAgBC,OAAA,EAAS,IAAI,CAACe,IAAI,CAAClB,KAAK,CAAA,CAAA;AAE/C,EAAA;AAAA,EAAA;IAAAsB,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,SAAA,EAAA,CATCC,MAAA,CAAA,CAAA;AAAA;AAWD,EAAA;IAAAC,oBAAA,CAAAC,kBAAA,CAAA,yVAAA,EAcA;MAAAC,UAAA,EAAA,IAAA;AAAAC,MAAAA,KAAA,EAAAA,OAAA;AAAAC,QAAAA;AAAA,OAAA;KAAU,CAAA,EAAV,IAAW,CAAA;AAAD;AACZ;;"}
+{"version":3,"file":"eui-text-color.js","sources":["../../src/components/eui-text-color.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { cached } from '@glimmer/tracking';\nimport { eq } from 'ember-truth-helpers';\nimport style from 'ember-style-modifier/modifiers/style';\nimport { getEuiThemeContext } from '../utils/emotion/consume.ts';\nimport { euiClass, useEuiBorealisStyles } from '../utils/eui/styles.ts';\nimport { euiTextColorStyles } from '../utils/eui/styles.generated.ts';\n\nimport type { CSSInterpolation } from '@emotion/css/create-instance';\nimport type { EuiThemeContext } from '../utils/emotion/context.ts';\n\n/** Latest upstream named colors. */\nexport const TEXT_COLORS = [\n  'default',\n  'subdued',\n  'success',\n  'accent',\n  'accentSecondary',\n  'danger',\n  'warning',\n  'ghost',\n  'inherit'\n] as const;\n\n/**\n * A named color, the Ember-only `'primary'`, or any CSS color value\n * (`'#c0ffee'`, `'rgb(…)'`, `'currentColor'`…).\n */\nexport type EuiTextColorValue =\n  | (typeof TEXT_COLORS)[number]\n  | 'primary'\n  | (string & {});\n\nfunction isNamedColor(color: string): color is (typeof TEXT_COLORS)[number] {\n  return (TEXT_COLORS as readonly string[]).includes(color);\n}\n\n/** @private Shared with EuiText, which composes color on its own element. */\nexport function euiTextColorCss(\n  context: EuiThemeContext,\n  color: EuiTextColorValue = 'default'\n): CSSInterpolation[] {\n  const styles = useEuiBorealisStyles(context, euiTextColorStyles);\n  if (isNamedColor(color)) return [styles.euiTextColor, styles[color]];\n  // Upstream dropped `primary`; keep it working with the native text token.\n  if (color === 'primary')\n    return [\n      styles.euiTextColor,\n      { color: context.upstream.euiTheme.colors.textPrimary }\n    ];\n  // The custom value itself goes inline (`euiTextColorInlineStyle`), as\n  // upstream does: a class per color would stay in the style cache for good.\n  return [styles.euiTextColor, styles.customColor];\n}\n\n/**\n * @private Upstream's inline `style` for a custom (non-named) color, for the\n * `{{style}}` modifier. Empty for named colors.\n */\nexport function euiTextColorInlineStyle(\n  color: EuiTextColorValue | undefined\n): Record<string, string> {\n  if (!color || isNamedColor(color) || color === 'primary') return {};\n  return { color };\n}\n\n/** Colors its text content. */\nexport interface EuiTextColorSignature {\n  Element: HTMLSpanElement | HTMLDivElement | HTMLParagraphElement;\n  Args: {\n    /**\n     * `'default'`, `'subdued'`, `'success'`, `'accent'`, `'accentSecondary'`,\n     * `'danger'`, `'warning'`, `'ghost'`, `'inherit'`, `'primary'`, or any\n     * CSS color value. Defaults to `'default'`.\n     */\n    color?: EuiTextColorValue;\n    /** `'span'` (inline), `'div'` or `'p'`. Defaults to `'span'`. */\n    tagName?: 'span' | 'div' | 'p';\n  };\n  Blocks: {\n    /** The content. */\n    default: [];\n  };\n}\n\nexport default class EuiTextColor extends Component<EuiTextColorSignature> {\n  get inlineStyle(): Record<string, string> {\n    return euiTextColorInlineStyle(this.args.color);\n  }\n\n  @cached\n  get classes() {\n    const context = getEuiThemeContext(this);\n    return euiClass(\n      context,\n      // React's global reset removes paragraph margins; Ember has no reset.\n      this.args.tagName === 'p' ? { margin: 0 } : undefined,\n      ...euiTextColorCss(context, this.args.color)\n    );\n  }\n\n  <template>\n    {{#if (eq @tagName \"div\")}}\n      <div class=\"euiTextColor {{this.classes}}\" ...attributes {{style this.inlineStyle}}>\n        {{yield}}\n      </div>\n    {{else if (eq @tagName \"p\")}}\n      <p class=\"euiTextColor {{this.classes}}\" ...attributes {{style this.inlineStyle}}>\n        {{yield}}\n      </p>\n    {{else}}\n      <span class=\"euiTextColor {{this.classes}}\" ...attributes {{style this.inlineStyle}}>\n        {{yield}}\n      </span>\n    {{/if}}\n  </template>\n}\n"],"names":["TEXT_COLORS","isNamedColor","color","includes","euiTextColorCss","context","styles","useEuiBorealisStyles","euiTextColorStyles","euiTextColor","upstream","euiTheme","colors","textPrimary","customColor","euiTextColorInlineStyle","EuiTextColor","Component","inlineStyle","args","classes","getEuiThemeContext","euiClass","tagName","margin","undefined","n","prototype","cached","setComponentTemplate","precompileTemplate","strictMode","scope","eq","style"],"mappings":";;;;;;;;;;;AAYO,MAAMA,WAAA,GAAc,CACzB,SAAA,EACA,SAAA,EACA,SAAA,EACA,QAAA,EACA,iBAAA,EACA,QAAA,EACA,SAAA,EACA,OAAA,EACA,SAAA;AAGF;;;AAGC;;AAMD,SAASC,aAAaC,KAAa,EAAuC;AACxE,EAAA,OAAQF,WAAA,CAAkCG,QAAQ,CAACD,KAAA,CAAA;AACrD;AAEA;AACO,SAASE,eAAAA,CACdC,OAAwB,EACxBH,KAAO,GAAoB,SAAS,EACnC;AACD,EAAA,MAAMI,MAAA,GAASC,qBAAqBF,OAAA,EAASG,kBAAA,CAAA;AAC7C,EAAA,IAAIP,YAAA,CAAaC,QAAQ,OAAO,CAACI,MAAA,CAAOG,YAAY,EAAEH,MAAM,CAACJ,KAAA,CAAM,CAAC;AACpE;EACA,IAAIA,KAAA,KAAU,WACZ,OAAO,CACLI,MAAA,CAAOG,YAAY,EACnB;IAAEP,KAAA,EAAOG,QAAQK,QAAQ,CAACC,QAAQ,CAACC,MAAM,CAACC;AAAY,GAAA,CACvD;AACH;AACA;EACA,OAAO,CAACP,MAAA,CAAOG,YAAY,EAAEH,MAAA,CAAOQ,WAAW,CAAC;AAClD;AAEA;;;;AAIO,SAASC,uBAAAA,CACdb,KAAoC,EACd;AACtB,EAAA,IAAI,CAACA,KAAA,IAASD,YAAA,CAAaC,UAAUA,KAAA,KAAU,SAAA,EAAW,OAAO,EAAC;EAClE,OAAO;AAAEA,IAAAA;GAAM;AACjB;AAEA;;AAmBe,MAAMc,qBAAqBC,SAAA,CAAU;EAClD,IAAIC,WAAAA,GAAsC;AACxC,IAAA,OAAOH,uBAAA,CAAwB,IAAI,CAACI,IAAI,CAACjB,KAAK,CAAA;AAChD,EAAA;EAEA,IACIkB,OAAAA,GAAU;AACZ,IAAA,MAAMf,OAAA,GAAUgB,mBAAmB,IAAI,CAAA;IACvC,OAAOC,QAAA,CACLjB;AACA;AACA,IAAA,IAAI,CAACc,IAAI,CAACI,OAAO,KAAK,GAAA,GAAM;AAAEC,MAAAA,MAAA,EAAQ;AAAE,KAAA,GAAIC,cACzCrB,eAAA,CAAgBC,OAAA,EAAS,IAAI,CAACc,IAAI,CAACjB,KAAK,CAAA,CAAA;AAE/C,EAAA;AAAA,EAAA;IAAAwB,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,SAAA,EAAA,CATCC,MAAA,CAAA,CAAA;AAAA;AAWD,EAAA;IAAAC,oBAAA,CAAAC,kBAAA,CAAA,0aAAA,EAcA;MAAAC,UAAA,EAAA,IAAA;AAAAC,MAAAA,KAAA,EAAAA,OAAA;QAAAC,EAAA;AAAAC,QAAAA;AAAA,OAAA;KAAU,CAAA,EAAV,IAAW,CAAA;AAAD;AACZ;;"}

package/dist/components/eui-text.js

@@ -1,10 +1,11 @@
 import Component from '@glimmer/component';
 import { cached } from '@glimmer/tracking';
+import style from 'ember-style-modifier/modifiers/style';
 import { getEuiThemeContext } from '../utils/emotion/consume.js';
 import { useEuiBorealisStyles, euiClass } from '../utils/eui/styles.js';
 import { by as euiTextStyles } from '../styles.generated-SYAxYhey.js';
 import { euiTextAlignCss } from './eui-text-align.js';
-import { euiTextColorCss } from './eui-text-color.js';
+import { euiTextColorCss, euiTextColorInlineStyle } from './eui-text-color.js';
 import { precompileTemplate } from '@ember/template-compilation';
 import { setComponentTemplate } from '@ember/component';
 import { n } from 'decorator-transforms/runtime-esm';
@@ -66,10 +67,12 @@ class EuiText extends Component {
     n(this.prototype, "classes", [cached]);
   }
   static {
-    setComponentTemplate(precompileTemplate("{{#let (element (tagName @component)) as |Tag|}}\n  <Tag class=\"euiText {{this.classes}}\" ...attributes>{{yield}}</Tag>\n{{/let}}", {
+    setComponentTemplate(precompileTemplate("{{#let (element (tagName @component)) as |Tag|}}\n  <Tag class=\"euiText {{this.classes}}\" ...attributes {{style (euiTextColorInlineStyle @color)}}>{{yield}}</Tag>\n{{/let}}", {
       strictMode: true,
       scope: () => ({
-        tagName
+        tagName,
+        style,
+        euiTextColorInlineStyle
       })
     }), this);
   }