@ember-eui/core 13.0.5 → 14.1.0

package/dist/components/eui-selectable-list-item.js

@@ -1,20 +1,86 @@
-import { eq, not, and } from 'ember-truth-helpers';
-import classNames from '../helpers/class-names.js';
-import typeOf from '../helpers/type-of.js';
+import Component from '@glimmer/component';
+import { service } from '@ember/service';
+import EuiBadge from './eui-badge.js';
+import EuiIcon from './eui-icon.js';
+import EuiScreenReaderOnly from './eui-screen-reader-only.js';
 import { precompileTemplate } from '@ember/template-compilation';
 import { setComponentTemplate } from '@ember/component';
-import templateOnly from '@ember/component/template-only';
+import { g, i } from 'decorator-transforms/runtime-esm';
 
-const EuiSelectableListItem = setComponentTemplate(precompileTemplate("\n    {{!-- TODO: not fully implemented --}}\n    <li role=\"option\" aria-selected={{and (not @disabled) (eq (typeOf @checked) \"string\")}} class={{classNames componentName=\"EuiSelectableListItem\" isFocused=@isFocused}} aria-disabled={{@disabled}} ...attributes>\n      <span class=\"euiSelectableListItem__content\">\n        {{!-- {{optionIcon}} --}}\n        {{!-- {{prependNode}} --}}\n        <span class=\"euiSelectableListItem__text\">\n          {{yield}}\n          {{!-- {{state}} --}}\n          {{!-- {{children}} --}}\n          {{!-- {{instruction}} --}}\n        </span>\n        {{!-- {{appendNode}} --}}\n      </span>\n    </li>\n  ", {
-  strictMode: true,
-  scope: () => ({
-    and,
-    not,
-    eq,
-    typeOf,
-    classNames
-  })
-}), templateOnly());
+class EuiSelectableListItem extends Component {
+  static {
+    g(this.prototype, "euiI18n", [service]);
+  }
+  #euiI18n = (i(this, "euiI18n"), void 0);
+  get isChecked() {
+    return typeof this.args.checked === 'string' || this.args.checked === true;
+  }
+  get icon() {
+    const {
+      checked
+    } = this.args;
+    if (checked === 'off') return 'cross';
+    return checked ? 'check' : 'empty';
+  }
+  get showIcons() {
+    return this.args.showIcons !== false;
+  }
+  get focusBadge() {
+    const badge = this.args.onFocusBadge;
+    return typeof badge === 'object' ? badge : {};
+  }
+  get hasPrepend() {
+    return this.args.hasPrepend ?? Boolean(this.args.prepend);
+  }
+  get hasAppend() {
+    return this.args.hasAppend ?? Boolean(this.args.append);
+  }
+  get showFocusBadge() {
+    return this.args.onFocusBadge !== false && Boolean(this.args.isFocused) && !this.args.disabled;
+  }
+  get exclusionState() {
+    if (!this.args.allowExclusions) return undefined;
+    if (this.args.checked === 'on') {
+      return {
+        state: this.euiI18n.lookupToken('euiSelectableListItem.includedOption', 'Included option.'),
+        instruction: this.euiI18n.lookupToken('euiSelectableListItem.includedOptionInstructions', 'To exclude this option, press enter.')
+      };
+    }
+    if (this.args.checked === 'off') {
+      return {
+        state: this.euiI18n.lookupToken('euiSelectableListItem.excludedOption', 'Excluded option.'),
+        instruction: this.euiI18n.lookupToken('euiSelectableListItem.excludedOptionInstructions', 'To deselect this option, press enter.')
+      };
+    }
+    return undefined;
+  }
+  static {
+    setComponentTemplate(precompileTemplate("<li role=\"option\" aria-selected={{if (and2 (not2 @disabled) this.isChecked) \"true\" \"false\"}} class=\"euiSelectableListItem\n    {{if @isFocused \"euiSelectableListItem-isFocused\"}}\" aria-disabled={{if @disabled \"true\"}} ...attributes>\n  <span class=\"euiSelectableListItem__content\">\n    {{#if this.showIcons}}\n      <EuiIcon class=\"euiSelectableListItem__icon\" @type={{this.icon}} @color={{if @checked \"text\"}} />\n    {{/if}}\n    {{#if (or2 this.hasPrepend (and2 (has-block \"prepend\") (isUndefined @hasPrepend)))}}\n      <span class=\"euiSelectableListItem__prepend\">\n        {{~#if (has-block \"prepend\")}}{{yield to=\"prepend\"}}{{else}}{{@prepend}}{{/if~}}\n      </span>\n    {{/if}}\n    <span class=\"euiSelectableListItem__text\">\n      {{#if this.exclusionState}}\n        <EuiScreenReaderOnly>{{this.exclusionState.state}}</EuiScreenReaderOnly>\n      {{/if}}\n      {{yield}}\n      {{#if this.exclusionState}}\n        <EuiScreenReaderOnly>{{this.exclusionState.instruction}}</EuiScreenReaderOnly>\n      {{/if}}\n    </span>\n    {{#if (or2 (or2 this.hasAppend (and2 (has-block \"append\") (isUndefined @hasAppend))) this.showFocusBadge)}}\n      <span class=\"euiSelectableListItem__append\">\n        {{#if (has-block \"append\")}}\n          {{yield to=\"append\"}}\n        {{else}}\n          {{@append}}\n        {{/if}}\n        {{#if this.showFocusBadge}}\n          <EuiBadge class=\"euiSelectableListItem__onFocusBadge\" @iconType=\"returnKey\" @iconSide={{if this.focusBadge.iconSide this.focusBadge.iconSide \"left\"}} @color=\"hollow\" aria-hidden=\"true\">{{this.focusBadge.text}}</EuiBadge>\n        {{/if}}\n      </span>\n    {{/if}}\n  </span>\n</li>", {
+      strictMode: true,
+      scope: () => ({
+        and2,
+        not2,
+        EuiIcon,
+        or2,
+        isUndefined,
+        EuiScreenReaderOnly,
+        EuiBadge
+      })
+    }), this);
+  }
+}
+function and2(a, b) {
+  return Boolean(a && b);
+}
+function or2(a, b) {
+  return Boolean(a || b);
+}
+function isUndefined(a) {
+  return a === undefined;
+}
+function not2(a) {
+  return !a;
+}
 
 export { EuiSelectableListItem as default };
 //# sourceMappingURL=eui-selectable-list-item.js.map

package/dist/components/eui-selectable-list-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"eui-selectable-list-item.js","sources":["../../src/components/eui-selectable-list-item.gts"],"sourcesContent":["import { and,eq, not } from 'ember-truth-helpers';\n\nimport classNames from '../helpers/class-names.ts';\nimport typeOf from '../helpers/type-of.ts';\n\nimport type { TemplateOnlyComponent } from '@ember/component/template-only';\n\nexport interface EuiSelectableListItemSignature {\n  Element: HTMLLIElement;\n  Args: {\n    isFocused?: boolean;\n    disabled?: boolean;\n    checked?: boolean | 'on' | 'off';\n  };\n  Blocks: {\n    default: [];\n  };\n}\n\nconst EuiSelectableListItem: TemplateOnlyComponent<EuiSelectableListItemSignature> =\n  <template>\n    {{! TODO: not fully implemented }}\n    <li\n      role=\"option\"\n      aria-selected={{and (not @disabled) (eq (typeOf @checked) \"string\")}}\n      class={{classNames\n        componentName=\"EuiSelectableListItem\"\n        isFocused=@isFocused\n      }}\n      aria-disabled={{@disabled}}\n      ...attributes\n    >\n      <span class=\"euiSelectableListItem__content\">\n        {{!-- {{optionIcon}} --}}\n        {{!-- {{prependNode}} --}}\n        <span class=\"euiSelectableListItem__text\">\n          {{yield}}\n          {{!-- {{state}} --}}\n          {{!-- {{children}} --}}\n          {{!-- {{instruction}} --}}\n        </span>\n        {{!-- {{appendNode}} --}}\n      </span>\n    </li>\n  </template>;\n\nexport default EuiSelectableListItem;\n"],"names":["EuiSelectableListItem","setComponentTemplate","precompileTemplate","strictMode","scope","and","not","eq","typeOf","classNames","templateOnly"],"mappings":";;;;;;;AAmBA,MAAMA,qBACJ,GAAAC,oBAAA,CAAAC,kBAAA,CAwBA,gpBAAA,EAAA;EAAAC,UAAA,EAAA,IAAA;AAAAC,EAAAA,KAAA,EAAAA,OAAA;IAAAC,GAAA;IAAAC,GAAA;IAAAC,EAAA;IAAAC,MAAA;AAAAC,IAAAA;AAAA,GAAA;AAAU,CAAA,CAAA,EAAAC,YAAA,EAAA;;;;"}
+{"version":3,"file":"eui-selectable-list-item.js","sources":["../../src/components/eui-selectable-list-item.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { service } from '@ember/service';\n\nimport EuiBadge from './eui-badge.gts';\nimport EuiIcon from './eui-icon.gts';\nimport EuiScreenReaderOnly from './eui-screen-reader-only.gts';\n\nimport type EuiI18n from '../services/eui-i18n';\n\n/**\n * One option of an `EuiSelectable` list: a check mark (or a cross when\n * excluded), the label, and optional prepend / append content. Usually\n * rendered for you by `EuiSelectable`.\n */\nexport interface EuiSelectableListItemSignature {\n  Element: HTMLLIElement;\n  Args: {\n    /** Highlights it as the keyboard's current option. */\n    isFocused?: boolean;\n    /** Disables the option. */\n    disabled?: boolean;\n    /** `'on'` (check mark), `'off'` (cross, excluded) or nothing. */\n    checked?: boolean | 'on' | 'off';\n    /** Shows the check mark / cross column. Defaults to `true`. */\n    showIcons?: boolean;\n    /** Text before the label. Use the `<:prepend>` block for markup. */\n    prepend?: string;\n    /** Text after the label. Use the `<:append>` block for markup. */\n    append?: string;\n    /** Tells screen readers that Enter includes / excludes the option. */\n    allowExclusions?: boolean;\n    /**\n     * Shows a \"return key\" badge on the focused option, to hint that\n     * Enter selects it: `true`, `false`, or `{ text, iconSide }` for a\n     * badge with text (e.g. \"Go to\"). Defaults to `true`.\n     */\n    onFocusBadge?: boolean | { text?: string; iconSide?: 'left' | 'right' };\n    /** Renders the prepend wrapper (for blocks that may be empty). */\n    hasPrepend?: boolean;\n    /** Renders the append wrapper (for blocks that may be empty). */\n    hasAppend?: boolean;\n  };\n  Blocks: {\n    /** The label. */\n    default: [];\n    /** Content before the label, e.g. an icon or avatar. */\n    prepend: [];\n    /** Content after the label, e.g. a count badge. */\n    append: [];\n  };\n}\n\nexport default class EuiSelectableListItem extends Component<EuiSelectableListItemSignature> {\n  @service declare euiI18n: EuiI18n;\n\n  get isChecked(): boolean {\n    return typeof this.args.checked === 'string' || this.args.checked === true;\n  }\n\n  get icon(): string {\n    const { checked } = this.args;\n\n    if (checked === 'off') return 'cross';\n\n    return checked ? 'check' : 'empty';\n  }\n\n  get showIcons(): boolean {\n    return this.args.showIcons !== false;\n  }\n\n  get focusBadge(): { text?: string; iconSide?: 'left' | 'right' } {\n    const badge = this.args.onFocusBadge;\n\n    return typeof badge === 'object' ? badge : {};\n  }\n\n  get hasPrepend(): boolean {\n    return this.args.hasPrepend ?? Boolean(this.args.prepend);\n  }\n\n  get hasAppend(): boolean {\n    return this.args.hasAppend ?? Boolean(this.args.append);\n  }\n\n  get showFocusBadge(): boolean {\n    return this.args.onFocusBadge !== false && Boolean(this.args.isFocused) && !this.args.disabled;\n  }\n\n  get exclusionState(): { state: string; instruction: string } | undefined {\n    if (!this.args.allowExclusions) return undefined;\n\n    if (this.args.checked === 'on') {\n      return {\n        state: this.euiI18n.lookupToken('euiSelectableListItem.includedOption', 'Included option.'),\n        instruction: this.euiI18n.lookupToken(\n          'euiSelectableListItem.includedOptionInstructions',\n          'To exclude this option, press enter.'\n        )\n      };\n    }\n\n    if (this.args.checked === 'off') {\n      return {\n        state: this.euiI18n.lookupToken('euiSelectableListItem.excludedOption', 'Excluded option.'),\n        instruction: this.euiI18n.lookupToken(\n          'euiSelectableListItem.excludedOptionInstructions',\n          'To deselect this option, press enter.'\n        )\n      };\n    }\n\n    return undefined;\n  }\n\n  <template>\n    <li\n      role=\"option\"\n      aria-selected={{if (and2 (not2 @disabled) this.isChecked) \"true\" \"false\"}}\n      class=\"euiSelectableListItem\n        {{if @isFocused 'euiSelectableListItem-isFocused'}}\"\n      aria-disabled={{if @disabled \"true\"}}\n      ...attributes\n    >\n      <span class=\"euiSelectableListItem__content\">\n        {{#if this.showIcons}}\n          <EuiIcon\n            class=\"euiSelectableListItem__icon\"\n            @type={{this.icon}}\n            @color={{if @checked \"text\"}}\n          />\n        {{/if}}\n        {{#if (or2 this.hasPrepend (and2 (has-block \"prepend\") (isUndefined @hasPrepend)))}}\n          <span class=\"euiSelectableListItem__prepend\">\n            {{~#if (has-block \"prepend\")}}{{yield to=\"prepend\"}}{{else}}{{@prepend}}{{/if~}}\n          </span>\n        {{/if}}\n        <span class=\"euiSelectableListItem__text\">\n          {{#if this.exclusionState}}\n            <EuiScreenReaderOnly>{{this.exclusionState.state}}</EuiScreenReaderOnly>\n          {{/if}}\n          {{yield}}\n          {{#if this.exclusionState}}\n            <EuiScreenReaderOnly>{{this.exclusionState.instruction}}</EuiScreenReaderOnly>\n          {{/if}}\n        </span>\n        {{#if\n          (or2\n            (or2 this.hasAppend (and2 (has-block \"append\") (isUndefined @hasAppend)))\n            this.showFocusBadge\n          )\n        }}\n          <span class=\"euiSelectableListItem__append\">\n            {{#if (has-block \"append\")}}\n              {{yield to=\"append\"}}\n            {{else}}\n              {{@append}}\n            {{/if}}\n            {{#if this.showFocusBadge}}\n              <EuiBadge\n                class=\"euiSelectableListItem__onFocusBadge\"\n                @iconType=\"returnKey\"\n                @iconSide={{if this.focusBadge.iconSide this.focusBadge.iconSide \"left\"}}\n                @color=\"hollow\"\n                aria-hidden=\"true\"\n              >{{this.focusBadge.text}}</EuiBadge>\n            {{/if}}\n          </span>\n        {{/if}}\n      </span>\n    </li>\n  </template>\n}\n\nfunction and2(a: unknown, b: unknown): boolean {\n  return Boolean(a && b);\n}\n\nfunction or2(a: unknown, b: unknown): boolean {\n  return Boolean(a || b);\n}\n\nfunction isUndefined(a: unknown): boolean {\n  return a === undefined;\n}\n\nfunction not2(a: unknown): boolean {\n  return !a;\n}\n"],"names":["EuiSelectableListItem","Component","g","prototype","service","i","isChecked","args","checked","icon","showIcons","focusBadge","badge","onFocusBadge","hasPrepend","Boolean","prepend","hasAppend","append","showFocusBadge","isFocused","disabled","exclusionState","allowExclusions","undefined","state","euiI18n","lookupToken","instruction","setComponentTemplate","precompileTemplate","strictMode","scope","and2","not2","EuiIcon","or2","isUndefined","EuiScreenReaderOnly","EuiBadge","a","b"],"mappings":"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"}

package/dist/components/eui-selectable-list.js

@@ -0,0 +1,106 @@
+import Component from '@glimmer/component';
+import { fn, hash } from '@ember/helper';
+import { on } from '@ember/modifier';
+import { action } from '@ember/object';
+import { modifier } from 'ember-modifier';
+import cssStyle from '../-private/css-style.js';
+import EuiHighlight from './eui-highlight.js';
+import EuiSelectableListItem from './eui-selectable-list-item.js';
+import { toggleOption } from '../-private/selectable-options.js';
+import { precompileTemplate } from '@ember/template-compilation';
+import { setComponentTemplate } from '@ember/component';
+import { n } from 'decorator-transforms/runtime-esm';
+
+const MAX_VISIBLE_OPTIONS = 7;
+/**
+ * The list of an `EuiSelectable`: renders the options, checks and
+ * unchecks them on click, and scrolls the keyboard's current option into
+ * view. Usually rendered for you by `EuiSelectable`.
+ */
+
+class EuiSelectableList extends Component {
+  get optionArray() {
+    return this.args.visibleOptions ?? this.args.options;
+  }
+  get rowHeight() {
+    return this.args.rowHeight ?? 32;
+  }
+  get isFullHeight() {
+    return this.args.height === 'full';
+  }
+  get listHeight() {
+    if (this.isFullHeight) return undefined;
+    if (typeof this.args.height === 'number') return this.args.height;
+    const count = this.optionArray.length;
+    // show half of the last one to hint there is more to scroll to
+    return count > MAX_VISIBLE_OPTIONS ? (MAX_VISIBLE_OPTIONS - 0.5) * this.rowHeight : count * this.rowHeight;
+  }
+  get classes() {
+    return ['euiSelectableList', this.isFullHeight && 'euiSelectableList-fullHeight', this.args.bordered && 'euiSelectableList-bordered'].filter(Boolean).join(' ');
+  }
+  get isMultiSelectable() {
+    return !this.args.searchable && !this.args.singleSelection;
+  }
+  get groupLabelCount() {
+    return this.optionArray.filter(option => option.isGroupLabel).length;
+  }
+  optionId = index => this.args.makeOptionId?.(index);
+  isFocused = index => this.args.activeOptionIndex === index;
+  posInSet = index => index + 1 - this.groupLabelCount;
+  onOptionMouseDown(index) {
+    this.args.setActiveOptionIndex?.(index);
+  }
+  static {
+    n(this.prototype, "onOptionMouseDown", [action]);
+  }
+  onOptionClick(option) {
+    this.toggleOption(option);
+  }
+  static {
+    n(this.prototype, "onOptionClick", [action]);
+  }
+  toggleOption(option) {
+    const options = toggleOption(this.args.options, option, {
+      allowExclusions: this.args.allowExclusions,
+      singleSelection: this.args.singleSelection
+    });
+    if (options) this.args.onOptionClick(options);
+  }
+  /** Keeps the keyboard's current option in view. */
+  scrollActiveIntoView = modifier((list, [index]) => {
+    if (index === undefined || index < 0) return;
+    const item = list.querySelectorAll(':scope > ul > li')[index];
+    item?.scrollIntoView?.({
+      block: 'nearest'
+    });
+  });
+  static {
+    setComponentTemplate(precompileTemplate("<div class={{this.classes}} ...attributes>\n  <div class=\"euiSelectableList__list\" tabindex=\"-1\" style={{cssStyle (hash height=this.listHeight overflowY=\"auto\" position=\"relative\")}} {{this.scrollActiveIntoView @activeOptionIndex}}>\n    <ul id={{@listId}} role=\"listbox\" tabindex={{unless @searchable \"0\"}} aria-multiselectable={{if this.isMultiSelectable \"true\"}}>\n      {{#let (flag @hasOption (has-block \"option\")) (flag @hasOptionPrepend (has-block \"optionPrepend\")) (flag @hasOptionAppend (has-block \"optionAppend\")) as |customOption customPrepend customAppend|}}\n      {{#each this.optionArray as |option index|}}\n        {{#if option.isGroupLabel}}\n          <li role=\"presentation\" class=\"euiSelectableList__groupLabel\" style={{cssStyle (hash height=this.rowHeight)}}>{{option.prepend}}{{option.label}}{{option.append}}</li>\n        {{else}}\n          <EuiSelectableListItem id={{this.optionId index}} class={{option.className}} style={{cssStyle (hash height=this.rowHeight)}} title={{if option.searchableLabel option.searchableLabel option.label}} aria-posinset={{this.posInSet index}} aria-setsize={{sub this.optionArray.length this.groupLabelCount}} @isFocused={{this.isFocused index}} @checked={{option.checked}} @disabled={{option.disabled}} @hasPrepend={{or2 customPrepend option.prepend}} @hasAppend={{or2 customAppend option.append}} @showIcons={{@showIcons}} @onFocusBadge={{@onFocusBadge}} @allowExclusions={{@allowExclusions}} {{on \"mousedown\" (fn this.onOptionMouseDown index)}} {{on \"click\" (fn this.onOptionClick option)}}>\n            <:default>\n              {{#if customOption}}\n                {{yield option (if @searchValue @searchValue \"\") to=\"option\"}}\n              {{else}}\n                <EuiHighlight @text={{option.label}} @search={{@searchValue}} />\n              {{/if}}\n            </:default>\n            <:prepend>\n              {{~#if customPrepend}}{{yield option to=\"optionPrepend\"}}{{else}}{{option.prepend}}{{/if~}}\n            </:prepend>\n            <:append>\n              {{~#if customAppend}}{{yield option to=\"optionAppend\"}}{{else}}{{option.append}}{{/if~}}\n            </:append>\n          </EuiSelectableListItem>\n        {{/if}}\n      {{/each}}\n      {{/let}}\n    </ul>\n  </div>\n</div>", {
+      strictMode: true,
+      scope: () => ({
+        cssStyle,
+        hash,
+        flag,
+        EuiSelectableListItem,
+        sub,
+        or2,
+        on,
+        fn,
+        EuiHighlight
+      })
+    }), this);
+  }
+}
+// an explicit flag (blocks forwarded by EuiSelectable) or the block itself
+function flag(explicit, hasBlock) {
+  return explicit ?? hasBlock;
+}
+function or2(a, b) {
+  return Boolean(a || b);
+}
+function sub(a, b) {
+  return a - b;
+}
+
+export { EuiSelectableList as default };
+//# sourceMappingURL=eui-selectable-list.js.map

package/dist/components/eui-selectable-list.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"eui-selectable-list.js","sources":["../../src/components/eui-selectable-list.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { fn, hash } from '@ember/helper';\nimport { on } from '@ember/modifier';\nimport { action } from '@ember/object';\n\nimport { modifier } from 'ember-modifier';\n\nimport cssStyle from '../-private/css-style.ts';\nimport EuiHighlight from './eui-highlight.gts';\nimport EuiSelectableListItem from './eui-selectable-list-item.gts';\n\nimport { toggleOption } from '../-private/selectable-options.ts';\n\nimport type { EuiSelectableOption } from '../-private/selectable-options.ts';\n\nexport type { EuiSelectableOption };\n\nconst MAX_VISIBLE_OPTIONS = 7;\n\n/**\n * The list of an `EuiSelectable`: renders the options, checks and\n * unchecks them on click, and scrolls the keyboard's current option into\n * view. Usually rendered for you by `EuiSelectable`.\n */\nexport interface EuiSelectableListSignature {\n  Element: HTMLDivElement;\n  Args: {\n    /** All options; `@onOptionClick` gets them with the change applied. */\n    options: EuiSelectableOption[];\n    /** The options to show (e.g. those matching a search). Defaults to all. */\n    visibleOptions?: EuiSelectableOption[];\n    /** The search, highlighted in the labels. */\n    searchValue?: string;\n    /** Index (in the visible options) of the keyboard's current option. */\n    activeOptionIndex?: number;\n    /** Called when an option is pressed, to make it the current one. */\n    setActiveOptionIndex?: (index: number) => void;\n    /** Called with all options after one is checked or unchecked. */\n    onOptionClick: (options: EuiSelectableOption[]) => void;\n    /**\n     * `true`: one option at most; `'always'`: exactly one (it cannot be\n     * unchecked).\n     */\n    singleSelection?: boolean | 'always';\n    /** Pressing a checked option excludes it (`checked: 'off'`) first. */\n    allowExclusions?: boolean;\n    /** Shows the check mark column. Defaults to `true`. */\n    showIcons?: boolean;\n    /**\n     * Shows the \"return key\" badge on the current option: `true`, `false`\n     * or `{ text, iconSide }`. Defaults to `true`.\n     */\n    onFocusBadge?: boolean | { text?: string; iconSide?: 'left' | 'right' };\n    /** Adds a border around the list. */\n    bordered?: boolean;\n    /** Height of each option in px. Defaults to `32`. */\n    rowHeight?: number;\n    /**\n     * Height of the list in px, or `'full'` to fill its container. By\n     * default it shows up to 7 options (and half of the next one).\n     */\n    height?: number | 'full';\n    /** `id` of the `<ul role=\"listbox\">`. */\n    listId?: string;\n    /** Id of each option's `<li>`, for `aria-activedescendant`. */\n    makeOptionId?: (index: number) => string;\n    /** The list is driven from a search field (which keeps focus). */\n    searchable?: boolean;\n    /** @private Whether `<:option>` is given (when blocks are forwarded). */\n    hasOption?: boolean;\n    /** @private Whether `<:optionPrepend>` is given. */\n    hasOptionPrepend?: boolean;\n    /** @private Whether `<:optionAppend>` is given. */\n    hasOptionAppend?: boolean;\n  };\n  Blocks: {\n    /** Renders an option's label yourself; yields the option and the search. */\n    option: [option: EuiSelectableOption, searchValue: string];\n    /** Content before each label (e.g. an icon); yields the option. */\n    optionPrepend: [option: EuiSelectableOption];\n    /** Content after each label (e.g. a badge); yields the option. */\n    optionAppend: [option: EuiSelectableOption];\n  };\n}\n\nexport default class EuiSelectableList extends Component<EuiSelectableListSignature> {\n  get optionArray(): EuiSelectableOption[] {\n    return this.args.visibleOptions ?? this.args.options;\n  }\n\n  get rowHeight(): number {\n    return this.args.rowHeight ?? 32;\n  }\n\n  get isFullHeight(): boolean {\n    return this.args.height === 'full';\n  }\n\n  get listHeight(): number | undefined {\n    if (this.isFullHeight) return undefined;\n    if (typeof this.args.height === 'number') return this.args.height;\n\n    const count = this.optionArray.length;\n\n    // show half of the last one to hint there is more to scroll to\n    return count > MAX_VISIBLE_OPTIONS\n      ? (MAX_VISIBLE_OPTIONS - 0.5) * this.rowHeight\n      : count * this.rowHeight;\n  }\n\n  get classes(): string {\n    return [\n      'euiSelectableList',\n      this.isFullHeight && 'euiSelectableList-fullHeight',\n      this.args.bordered && 'euiSelectableList-bordered'\n    ]\n      .filter(Boolean)\n      .join(' ');\n  }\n\n  get isMultiSelectable(): boolean {\n    return !this.args.searchable && !this.args.singleSelection;\n  }\n\n  get groupLabelCount(): number {\n    return this.optionArray.filter((option) => option.isGroupLabel).length;\n  }\n\n  optionId = (index: number): string | undefined => this.args.makeOptionId?.(index);\n\n  isFocused = (index: number): boolean => this.args.activeOptionIndex === index;\n\n  posInSet = (index: number): number => index + 1 - this.groupLabelCount;\n\n  @action\n  onOptionMouseDown(index: number): void {\n    this.args.setActiveOptionIndex?.(index);\n  }\n\n  @action\n  onOptionClick(option: EuiSelectableOption): void {\n    this.toggleOption(option);\n  }\n\n  toggleOption(option: EuiSelectableOption): void {\n    const options = toggleOption(this.args.options, option, {\n      allowExclusions: this.args.allowExclusions,\n      singleSelection: this.args.singleSelection\n    });\n\n    if (options) this.args.onOptionClick(options);\n  }\n\n  /** Keeps the keyboard's current option in view. */\n  scrollActiveIntoView = modifier((list: HTMLElement, [index]: [number | undefined]) => {\n    if (index === undefined || index < 0) return;\n\n    const item = list.querySelectorAll<HTMLElement>(':scope > ul > li')[index];\n\n    item?.scrollIntoView?.({ block: 'nearest' });\n  });\n\n  <template>\n    <div class={{this.classes}} ...attributes>\n      <div\n        class=\"euiSelectableList__list\"\n        tabindex=\"-1\"\n        style={{cssStyle\n          (hash height=this.listHeight overflowY=\"auto\" position=\"relative\")\n        }}\n        {{this.scrollActiveIntoView @activeOptionIndex}}\n      >\n        <ul\n          id={{@listId}}\n          role=\"listbox\"\n          tabindex={{unless @searchable \"0\"}}\n          aria-multiselectable={{if this.isMultiSelectable \"true\"}}\n        >\n          {{#let\n            (flag @hasOption (has-block \"option\"))\n            (flag @hasOptionPrepend (has-block \"optionPrepend\"))\n            (flag @hasOptionAppend (has-block \"optionAppend\"))\n            as |customOption customPrepend customAppend|\n          }}\n          {{#each this.optionArray as |option index|}}\n            {{#if option.isGroupLabel}}\n              <li\n                role=\"presentation\"\n                class=\"euiSelectableList__groupLabel\"\n                style={{cssStyle (hash height=this.rowHeight)}}\n              >{{option.prepend}}{{option.label}}{{option.append}}</li>\n            {{else}}\n              <EuiSelectableListItem\n                id={{this.optionId index}}\n                class={{option.className}}\n                style={{cssStyle (hash height=this.rowHeight)}}\n                title={{if option.searchableLabel option.searchableLabel option.label}}\n                aria-posinset={{this.posInSet index}}\n                aria-setsize={{sub this.optionArray.length this.groupLabelCount}}\n                @isFocused={{this.isFocused index}}\n                @checked={{option.checked}}\n                @disabled={{option.disabled}}\n                @hasPrepend={{or2 customPrepend option.prepend}}\n                @hasAppend={{or2 customAppend option.append}}\n                @showIcons={{@showIcons}}\n                @onFocusBadge={{@onFocusBadge}}\n                @allowExclusions={{@allowExclusions}}\n                {{on \"mousedown\" (fn this.onOptionMouseDown index)}}\n                {{on \"click\" (fn this.onOptionClick option)}}\n              >\n                <:default>\n                  {{#if customOption}}\n                    {{yield option (if @searchValue @searchValue \"\") to=\"option\"}}\n                  {{else}}\n                    <EuiHighlight @text={{option.label}} @search={{@searchValue}} />\n                  {{/if}}\n                </:default>\n                <:prepend>\n                  {{~#if customPrepend}}{{yield option to=\"optionPrepend\"}}{{else}}{{option.prepend}}{{/if~}}\n                </:prepend>\n                <:append>\n                  {{~#if customAppend}}{{yield option to=\"optionAppend\"}}{{else}}{{option.append}}{{/if~}}\n                </:append>\n              </EuiSelectableListItem>\n            {{/if}}\n          {{/each}}\n          {{/let}}\n        </ul>\n      </div>\n    </div>\n  </template>\n}\n\n// an explicit flag (blocks forwarded by EuiSelectable) or the block itself\nfunction flag(explicit: boolean | undefined, hasBlock: boolean): boolean {\n  return explicit ?? hasBlock;\n}\n\nfunction or2(a: unknown, b: unknown): boolean {\n  return Boolean(a || b);\n}\n\nfunction sub(a: number, b: number): number {\n  return a - b;\n}\n"],"names":["MAX_VISIBLE_OPTIONS","EuiSelectableList","Component","optionArray","args","visibleOptions","options","rowHeight","isFullHeight","height","listHeight","undefined","count","length","classes","bordered","filter","Boolean","join","isMultiSelectable","searchable","singleSelection","groupLabelCount","option","isGroupLabel","optionId","index","makeOptionId","isFocused","activeOptionIndex","posInSet","onOptionMouseDown","setActiveOptionIndex","n","prototype","action","onOptionClick","toggleOption","allowExclusions","scrollActiveIntoView","modifier","list","item","querySelectorAll","scrollIntoView","block","setComponentTemplate","precompileTemplate","strictMode","scope","cssStyle","hash","flag","EuiSelectableListItem","sub","or2","on","fn","EuiHighlight","explicit","hasBlock","a","b"],"mappings":"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"}

package/dist/components/eui-selectable-message.js

@@ -0,0 +1,14 @@
+import EuiTextComponent from './eui-text.js';
+import { precompileTemplate } from '@ember/template-compilation';
+import { setComponentTemplate } from '@ember/component';
+import templateOnly from '@ember/component/template-only';
+
+const EuiSelectableMessage = setComponentTemplate(precompileTemplate("<EuiText class=\"euiSelectableMessage\n    {{if @bordered \"euiSelectableMessage--bordered\"}}\" @color=\"subdued\" @size=\"xs\" ...attributes>{{yield}}</EuiText>", {
+  strictMode: true,
+  scope: () => ({
+    EuiText: EuiTextComponent
+  })
+}), templateOnly());
+
+export { EuiSelectableMessage as default };
+//# sourceMappingURL=eui-selectable-message.js.map

package/dist/components/eui-selectable-message.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"eui-selectable-message.js","sources":["../../src/components/eui-selectable-message.gts"],"sourcesContent":["import EuiText from './eui-text.gts';\n\nimport type { TemplateOnlyComponent } from '@ember/component/template-only';\n\n/**\n * A message shown by `EuiSelectable` instead of its list: while loading,\n * when nothing matches the search, or when there are no options.\n */\nexport interface EuiSelectableMessageSignature {\n  Element: HTMLDivElement;\n  Args: {\n    /** Adds the list's border, for bordered lists. */\n    bordered?: boolean;\n  };\n  Blocks: {\n    /** The message. */\n    default: [];\n  };\n}\n\nconst EuiSelectableMessage: TemplateOnlyComponent<EuiSelectableMessageSignature> =\n  <template>\n    <EuiText\n      class=\"euiSelectableMessage\n        {{if @bordered 'euiSelectableMessage--bordered'}}\"\n      @color=\"subdued\"\n      @size=\"xs\"\n      ...attributes\n    >{{yield}}</EuiText>\n  </template>;\n\nexport default EuiSelectableMessage;\n"],"names":["EuiSelectableMessage","setComponentTemplate","precompileTemplate","strictMode","scope","EuiText","templateOnly"],"mappings":";;;;;AAoBA,MAAMA,oBAA4C,GAAAC,oBAAA,CAChDC,kBAAA,CAAA,oKAAA,EAQA;EAAAC,UAAA,EAAA,IAAA;AAAAC,EAAAA,KAAA,EAAAA,OAAA;AAAAC,aAAAA;AAAA,GAAA;AAAU,CAAA,CAAA,EAAAC,YAAA,EAAA;;"}

package/dist/components/eui-selectable-search.js

@@ -0,0 +1,33 @@
+import Component from '@glimmer/component';
+import { action } from '@ember/object';
+import { getMatchingOptions } from '../-private/selectable-options.js';
+import EuiFieldSearch from './eui-field-search.js';
+import { precompileTemplate } from '@ember/template-compilation';
+import { setComponentTemplate } from '@ember/component';
+import { n } from 'decorator-transforms/runtime-esm';
+
+class EuiSelectableSearch extends Component {
+  searchValue = this.initialValue;
+  get initialValue() {
+    return this.args.defaultValue ?? '';
+  }
+  onSearch(value) {
+    if (value === this.searchValue) return;
+    this.searchValue = value;
+    this.args.onChange(getMatchingOptions(this.args.options, value, this.args.isPreFiltered), value);
+  }
+  static {
+    n(this.prototype, "onSearch", [action]);
+  }
+  static {
+    setComponentTemplate(precompileTemplate("<EuiFieldSearch class=\"euiSelectableSearch\" @placeholder={{@placeholder}} @value={{this.initialValue}} @incremental={{true}} @fullWidth={{true}} @compressed={{@compressed}} @isLoading={{@isLoading}} @onSearch={{this.onSearch}} autocomplete=\"off\" aria-haspopup=\"listbox\" role={{if @listId \"combobox\"}} aria-autocomplete={{if @listId \"list\"}} aria-expanded={{if @listId \"true\"}} aria-controls={{@listId}} ...attributes />", {
+      strictMode: true,
+      scope: () => ({
+        EuiFieldSearch
+      })
+    }), this);
+  }
+}
+
+export { EuiSelectableSearch as default };
+//# sourceMappingURL=eui-selectable-search.js.map

package/dist/components/eui-selectable-search.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"eui-selectable-search.js","sources":["../../src/components/eui-selectable-search.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { action } from '@ember/object';\n\nimport { getMatchingOptions } from '../-private/selectable-options.ts';\nimport EuiFieldSearch from './eui-field-search.gts';\n\nimport type { EuiSelectableOption } from '../-private/selectable-options.ts';\n\n/**\n * The search field of an `EuiSelectable`: filters the options as you type.\n * Usually rendered for you by `EuiSelectable` with `@searchable={{true}}`.\n */\nexport interface EuiSelectableSearchSignature {\n  Element: HTMLInputElement;\n  Args: {\n    /** The options to filter. */\n    options: EuiSelectableOption[];\n    /** Called with the matching options and the search. */\n    onChange: (matchingOptions: EuiSelectableOption[], searchValue: string) => void;\n    /** Placeholder of the field. */\n    placeholder?: string;\n    /** Initial search. */\n    defaultValue?: string;\n    /** Every option matches (they were already filtered, e.g. by a server). */\n    isPreFiltered?: boolean;\n    /** `id` of the list, to link the field to it for screen readers. */\n    listId?: string;\n    /** Smaller field. */\n    compressed?: boolean;\n    /** Shows a spinner. */\n    isLoading?: boolean;\n  };\n}\n\nexport default class EuiSelectableSearch extends Component<EuiSelectableSearchSignature> {\n  searchValue = this.initialValue;\n\n  get initialValue(): string {\n    return this.args.defaultValue ?? '';\n  }\n\n  @action\n  onSearch(value: string): void {\n    if (value === this.searchValue) return;\n\n    this.searchValue = value;\n    this.args.onChange(getMatchingOptions(this.args.options, value, this.args.isPreFiltered), value);\n  }\n\n  <template>\n    <EuiFieldSearch\n      class=\"euiSelectableSearch\"\n      @placeholder={{@placeholder}}\n      @value={{this.initialValue}}\n      @incremental={{true}}\n      @fullWidth={{true}}\n      @compressed={{@compressed}}\n      @isLoading={{@isLoading}}\n      @onSearch={{this.onSearch}}\n      autocomplete=\"off\"\n      aria-haspopup=\"listbox\"\n      role={{if @listId \"combobox\"}}\n      aria-autocomplete={{if @listId \"list\"}}\n      aria-expanded={{if @listId \"true\"}}\n      aria-controls={{@listId}}\n      ...attributes\n    />\n  </template>\n}\n"],"names":["EuiSelectableSearch","Component","searchValue","initialValue","args","defaultValue","onSearch","value","onChange","getMatchingOptions","options","isPreFiltered","n","prototype","action","setComponentTemplate","precompileTemplate","strictMode","scope","EuiFieldSearch"],"mappings":";;;;;;;;AAkCe,MAAMA,4BAA4BC,SAAA,CAAU;EACzDC,WAAA,GAAc,IAAI,CAACC,YAAY;EAE/B,IAAIA,YAAAA,GAAuB;AACzB,IAAA,OAAO,IAAI,CAACC,IAAI,CAACC,YAAY,IAAI,EAAA;AACnC,EAAA;EAGAC,QAAAA,CAASC,KAAa,EAAQ;AAC5B,IAAA,IAAIA,KAAA,KAAU,IAAI,CAACL,WAAW,EAAE;IAEhC,IAAI,CAACA,WAAW,GAAGK,KAAA;IACnB,IAAI,CAACH,IAAI,CAACI,QAAQ,CAACC,kBAAA,CAAmB,IAAI,CAACL,IAAI,CAACM,OAAO,EAAEH,KAAA,EAAO,IAAI,CAACH,IAAI,CAACO,aAAa,CAAA,EAAGJ,KAAA,CAAA;AAC5F,EAAA;AAAA,EAAA;IAAAK,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,UAAA,EAAA,CANCC,MAAA,CAAA,CAAA;AAAA;AAQD,EAAA;IAAAC,oBAAA,CAAAC,kBAAA,CAAA,ibAAA,EAkBA;MAAAC,UAAA,EAAA,IAAA;AAAAC,MAAAA,KAAA,EAAAA,OAAA;AAAAC,QAAAA;AAAA,OAAA;KAAU,CAAA,EAAV,IAAW,CAAA;AAAD;AACZ;;"}

package/dist/components/eui-selectable-template-sitewide.js

@@ -0,0 +1,129 @@
+import Component from '@glimmer/component';
+import { tracked } from '@glimmer/tracking';
+import { hash } from '@ember/helper';
+import { on } from '@ember/modifier';
+import { action } from '@ember/object';
+import { service } from '@ember/service';
+import cssStyle from '../-private/css-style.js';
+import EuiAvatar from './eui-avatar.js';
+import EuiHighlight from './eui-highlight.js';
+import EuiIcon from './eui-icon.js';
+import EuiLoadingSpinner from './eui-loading-spinner.js';
+import EuiPopoverComponent from './eui-popover.js';
+import EuiPopoverFooter from './eui-popover-footer.js';
+import EuiPopoverTitle from './eui-popover-title.js';
+import EuiSelectable from './eui-selectable.js';
+import EuiSpacer from './eui-spacer.js';
+import { precompileTemplate } from '@ember/template-compilation';
+import { setComponentTemplate } from '@ember/component';
+import { g, i, n } from 'decorator-transforms/runtime-esm';
+
+function metaClass(meta) {
+  return meta.type ? `euiSelectableTemplateSitewide__optionMeta euiSelectableTemplateSitewide__optionMeta--${meta.type}` : 'euiSelectableTemplateSitewide__optionMeta';
+}
+class EuiSelectableTemplateSitewide extends Component {
+  static {
+    g(this.prototype, "euiI18n", [service]);
+  }
+  #euiI18n = (i(this, "euiI18n"), void 0);
+  static {
+    g(this.prototype, "isOpen", [tracked], function () {
+      return false;
+    });
+  }
+  #isOpen = (i(this, "isOpen"), void 0);
+  get formattedOptions() {
+    return this.args.options.map(option => ({
+      key: option.label,
+      ...option,
+      className: ['euiSelectableTemplateSitewide__listItem', option.className].filter(Boolean).join(' ')
+    }));
+  }
+  get placeholder() {
+    return this.args.placeholder ?? this.euiI18n.lookupToken('euiSelectableTemplateSitewide.searchPlaceholder', 'Search for anything...');
+  }
+  get loadingText() {
+    return this.euiI18n.lookupToken('euiSelectableTemplateSitewide.loadingResults', 'Loading results');
+  }
+  get noResultsText() {
+    return this.euiI18n.lookupToken('euiSelectableTemplateSitewide.noResults', 'No results available');
+  }
+  get goTo() {
+    return this.euiI18n.lookupToken('euiSelectableTemplateSitewide.onFocusBadgeGoTo', 'Go to');
+  }
+  open() {
+    this.isOpen = true;
+  }
+  static {
+    n(this.prototype, "open", [action]);
+  }
+  close() {
+    this.isOpen = false;
+  }
+  static {
+    n(this.prototype, "close", [action]);
+  }
+  toggle() {
+    this.isOpen = !this.isOpen;
+  }
+  static {
+    n(this.prototype, "toggle", [action]);
+  }
+  onSearchBlur(event) {
+    const next = event.relatedTarget;
+    const panel = event.currentTarget.closest('.euiSelectableTemplateSitewide')?.querySelector('.euiSelectableTemplateSitewide__popover');
+    // moving into the results keeps the popover open
+    if (next && panel?.contains(next)) return;
+    if (next && document.querySelector('.euiPopover__panel')?.contains(next)) return;
+    this.isOpen = false;
+  }
+  static {
+    n(this.prototype, "onSearchBlur", [action]);
+  }
+  onChange(options) {
+    this.args.onChange?.(options);
+  }
+  static {
+    n(this.prototype, "onChange", [action]);
+  }
+  static {
+    setComponentTemplate(precompileTemplate("<EuiSelectable class=\"euiSelectableTemplateSitewide\" @options={{this.formattedOptions}} @onChange={{this.onChange}} @singleSelection={{true}} @searchable={{true}} @isLoading={{@isLoading}} @isPreFiltered={{@isPreFiltered}} @searchProps={{hash placeholder=this.placeholder onSearch=@onSearch}} @listProps={{hash rowHeight=68 showIcons=false onFocusBadge=(hash text=this.goTo iconSide=\"right\")}} @loadingMessage={{this.loadingText}} @emptyMessage={{this.noResultsText}} @noMatchesMessage={{this.noResultsText}} ...attributes as |parts|>\n  <EuiPopover @isOpen={{this.isOpen}} @closePopover={{this.close}} @panelPaddingSize=\"none\" @ownFocus={{if (has-block \"popoverButton\") true false}} @display={{if (has-block \"popoverButton\") \"inlineBlock\" \"block\"}}>\n    <:button>\n      {{#if (has-block \"popoverButton\")}}\n        {{yield this.toggle to=\"popoverButton\"}}\n      {{else if parts.search}}\n        <parts.search class=\"euiSelectableTemplateSitewide__search\" aria-label={{this.placeholder}} {{on \"focus\" this.open}} {{on \"input\" this.open}} {{on \"blur\" this.onSearchBlur}} />\n      {{/if}}\n    </:button>\n    <:content>\n      <div class=\"euiSelectableTemplateSitewide__popover\" style={{cssStyle (hash width=(if @popoverWidth @popoverWidth 600) maxWidth=\"100%\")}}>\n        {{#if (or2 (has-block \"popoverTitle\") (has-block \"popoverButton\"))}}\n          <EuiPopoverTitle @paddingSize=\"s\">\n            {{yield to=\"popoverTitle\"}}\n            {{#if (has-block \"popoverButton\")}}\n              {{#if (has-block \"popoverTitle\")}}\n                <EuiSpacer />\n              {{/if}}\n              {{#if parts.search}}\n                <parts.search class=\"euiSelectableTemplateSitewide__search\" aria-label={{this.placeholder}} />\n              {{/if}}\n            {{/if}}\n          </EuiPopoverTitle>\n        {{/if}}\n        {{#if @isLoading}}\n          <div class=\"euiText euiText--extraSmall euiSelectableMessage\" style=\"min-height: 300px;\">\n            <EuiLoadingSpinner @size=\"l\" />\n            <br />\n            <p>{{this.loadingText}}</p>\n          </div>\n        {{else}}\n          <parts.list class=\"euiSelectableTemplateSitewide__list\">\n            <:option as |option searchValue|>\n              <EuiHighlight class=\"euiSelectableTemplateSitewide__listItemTitle\" @text={{option.label}} @search={{searchValue}} />\n              {{#if (metaOf option)}}\n                <span class=\"euiSelectableTemplateSitewide__optionMetasList\">\n                  {{#each (metaOf option) as |meta|}}\n                    <EuiHighlight class={{metaClass meta}} @text={{meta.text}} @search={{if meta.highlightSearchString searchValue \"\"}} />\n                  {{/each}}\n                </span>\n              {{/if}}\n            </:option>\n            <:optionPrepend as |option|>\n              {{~#let (iconOf option) as |icon|~}}\n                {{~#if icon~}}\n                  <EuiIcon @type={{icon.type}} @color={{if icon.color icon.color \"subdued\"}} @size=\"l\" />\n                {{~/if~}}\n              {{~/let~}}\n            </:optionPrepend>\n            <:optionAppend as |option|>\n              {{~#let (avatarOf option) as |avatar|~}}\n                {{~#if avatar~}}\n                  <EuiAvatar @name={{avatar.name}} @type={{if avatar.type avatar.type \"space\"}} @color={{avatar.color}} @size=\"s\" />\n                {{~/if~}}\n              {{~/let~}}\n            </:optionAppend>\n          </parts.list>\n        {{/if}}\n        {{#if (has-block \"popoverFooter\")}}\n          <EuiPopoverFooter @paddingSize=\"s\">\n            {{yield to=\"popoverFooter\"}}\n          </EuiPopoverFooter>\n        {{/if}}\n      </div>\n    </:content>\n  </EuiPopover>\n</EuiSelectable>", {
+      strictMode: true,
+      scope: () => ({
+        EuiSelectable,
+        hash,
+        EuiPopover: EuiPopoverComponent,
+        on,
+        cssStyle,
+        or2,
+        EuiPopoverTitle,
+        EuiSpacer,
+        EuiLoadingSpinner,
+        EuiHighlight,
+        metaOf,
+        metaClass,
+        iconOf,
+        EuiIcon,
+        avatarOf,
+        EuiAvatar,
+        EuiPopoverFooter
+      })
+    }), this);
+  }
+}
+function or2(a, b) {
+  return Boolean(a || b);
+}
+function metaOf(option) {
+  const meta = option.meta;
+  return meta?.length ? meta : undefined;
+}
+function iconOf(option) {
+  return option.icon;
+}
+function avatarOf(option) {
+  return option.avatar;
+}
+
+export { EuiSelectableTemplateSitewide as default };
+//# sourceMappingURL=eui-selectable-template-sitewide.js.map

package/dist/components/eui-selectable-template-sitewide.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"eui-selectable-template-sitewide.js","sources":["../../src/components/eui-selectable-template-sitewide.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { tracked } from '@glimmer/tracking';\nimport { hash } from '@ember/helper';\nimport { on } from '@ember/modifier';\nimport { action } from '@ember/object';\nimport { service } from '@ember/service';\n\nimport cssStyle from '../-private/css-style.ts';\nimport EuiAvatar from './eui-avatar.gts';\nimport EuiHighlight from './eui-highlight.gts';\nimport EuiIcon from './eui-icon.gts';\nimport EuiLoadingSpinner from './eui-loading-spinner.gts';\nimport EuiPopover from './eui-popover.gts';\nimport EuiPopoverFooter from './eui-popover-footer.gts';\nimport EuiPopoverTitle from './eui-popover-title.gts';\nimport EuiSelectable from './eui-selectable.gts';\nimport EuiSpacer from './eui-spacer.gts';\n\nimport type EuiI18n from '../services/eui-i18n';\nimport type { EuiSelectableOption } from '../-private/selectable-options.ts';\nimport type { EuiAvatarSignature } from './eui-avatar';\nimport type { EuiIconSignature } from './eui-icon';\n\nexport interface EuiSelectableTemplateSitewideMeta {\n  /** The text. */\n  text: string;\n  /**\n   * `'application'`, `'deployment'`, `'article'`, `'case'` or\n   * `'platform'`, each with its own color; anything else is plain.\n   */\n  type?: string;\n  /** Highlights the search in this text too. */\n  highlightSearchString?: boolean;\n}\n\nexport interface EuiSelectableTemplateSitewideOption extends EuiSelectableOption {\n  /** Icon before the label: `{ type, color }` (subdued by default). */\n  icon?: { type: EuiIconSignature['Args']['type']; color?: EuiIconSignature['Args']['color'] };\n  /** Avatar after the label, e.g. the space it belongs to: `{ name, type, color }`. */\n  avatar?: {\n    name: string;\n    type?: EuiAvatarSignature['Args']['type'];\n    color?: EuiAvatarSignature['Args']['color'];\n  };\n  /** Details under the label, e.g. its type and where it lives. */\n  meta?: EuiSelectableTemplateSitewideMeta[];\n}\n\n/**\n * The search of a whole site or app (\"Search for anything…\"): a search\n * field that opens a popover of results with icons, details and avatars.\n * You provide the results (filtered from the search, e.g. by a server)\n * and navigate when one is chosen (`@onChange` gets the options with the\n * chosen one `checked: 'on'`).\n */\nexport interface EuiSelectableTemplateSitewideSignature {\n  Element: HTMLDivElement;\n  Args: {\n    /** The results. */\n    options: EuiSelectableTemplateSitewideOption[];\n    /** Called with the options, the chosen one `checked: 'on'`. */\n    onChange?: (options: EuiSelectableTemplateSitewideOption[]) => void;\n    /** Called with the search text as you type. */\n    onSearch?: (searchValue: string) => void;\n    /** Shows \"Loading results\" instead of the list. */\n    isLoading?: boolean;\n    /** Placeholder of the search. Defaults to \"Search for anything...\". */\n    placeholder?: string;\n    /** Width of the popover in px. Defaults to `600`. */\n    popoverWidth?: number;\n    /**\n     * The results are already filtered (e.g. by a server), so the search\n     * does not filter them again. Defaults to `false`.\n     */\n    isPreFiltered?: boolean;\n  };\n  Blocks: {\n    /**\n     * A button opening the popover (the search moves into it), e.g. an\n     * icon in a narrow header; yields the function toggling it.\n     */\n    popoverButton: [toggle: () => void];\n    /** Content above the results, e.g. a title. */\n    popoverTitle: [];\n    /** Content below the results, e.g. keyboard shortcuts. */\n    popoverFooter: [];\n  };\n}\n\nfunction metaClass(meta: EuiSelectableTemplateSitewideMeta): string {\n  return meta.type\n    ? `euiSelectableTemplateSitewide__optionMeta euiSelectableTemplateSitewide__optionMeta--${meta.type}`\n    : 'euiSelectableTemplateSitewide__optionMeta';\n}\n\nexport default class EuiSelectableTemplateSitewide extends Component<EuiSelectableTemplateSitewideSignature> {\n  @service declare euiI18n: EuiI18n;\n\n  @tracked isOpen = false;\n\n  get formattedOptions(): EuiSelectableTemplateSitewideOption[] {\n    return this.args.options.map((option) => ({\n      key: option.label,\n      ...option,\n      className: ['euiSelectableTemplateSitewide__listItem', option.className]\n        .filter(Boolean)\n        .join(' ')\n    }));\n  }\n\n  get placeholder(): string {\n    return (\n      this.args.placeholder ??\n      this.euiI18n.lookupToken(\n        'euiSelectableTemplateSitewide.searchPlaceholder',\n        'Search for anything...'\n      )\n    );\n  }\n\n  get loadingText(): string {\n    return this.euiI18n.lookupToken('euiSelectableTemplateSitewide.loadingResults', 'Loading results');\n  }\n\n  get noResultsText(): string {\n    return this.euiI18n.lookupToken('euiSelectableTemplateSitewide.noResults', 'No results available');\n  }\n\n  get goTo(): string {\n    return this.euiI18n.lookupToken('euiSelectableTemplateSitewide.onFocusBadgeGoTo', 'Go to');\n  }\n\n  @action\n  open(): void {\n    this.isOpen = true;\n  }\n\n  @action\n  close(): void {\n    this.isOpen = false;\n  }\n\n  @action\n  toggle(): void {\n    this.isOpen = !this.isOpen;\n  }\n\n  @action\n  onSearchBlur(event: FocusEvent): void {\n    const next = event.relatedTarget as Node | null;\n    const panel = (event.currentTarget as HTMLElement)\n      .closest('.euiSelectableTemplateSitewide')\n      ?.querySelector('.euiSelectableTemplateSitewide__popover');\n\n    // moving into the results keeps the popover open\n    if (next && panel?.contains(next)) return;\n    if (next && document.querySelector('.euiPopover__panel')?.contains(next)) return;\n\n    this.isOpen = false;\n  }\n\n  @action\n  onChange(options: EuiSelectableOption[]): void {\n    this.args.onChange?.(options as EuiSelectableTemplateSitewideOption[]);\n  }\n\n  <template>\n    <EuiSelectable\n      class=\"euiSelectableTemplateSitewide\"\n      @options={{this.formattedOptions}}\n      @onChange={{this.onChange}}\n      @singleSelection={{true}}\n      @searchable={{true}}\n      @isLoading={{@isLoading}}\n      @isPreFiltered={{@isPreFiltered}}\n      @searchProps={{hash placeholder=this.placeholder onSearch=@onSearch}}\n      @listProps={{hash\n        rowHeight=68\n        showIcons=false\n        onFocusBadge=(hash text=this.goTo iconSide=\"right\")\n      }}\n      @loadingMessage={{this.loadingText}}\n      @emptyMessage={{this.noResultsText}}\n      @noMatchesMessage={{this.noResultsText}}\n      ...attributes\n      as |parts|\n    >\n      <EuiPopover\n        @isOpen={{this.isOpen}}\n        @closePopover={{this.close}}\n        @panelPaddingSize=\"none\"\n        @ownFocus={{if (has-block \"popoverButton\") true false}}\n        @display={{if (has-block \"popoverButton\") \"inlineBlock\" \"block\"}}\n      >\n        <:button>\n          {{#if (has-block \"popoverButton\")}}\n            {{yield this.toggle to=\"popoverButton\"}}\n          {{else if parts.search}}\n            <parts.search\n              class=\"euiSelectableTemplateSitewide__search\"\n              aria-label={{this.placeholder}}\n              {{on \"focus\" this.open}}\n              {{on \"input\" this.open}}\n              {{on \"blur\" this.onSearchBlur}}\n            />\n          {{/if}}\n        </:button>\n        <:content>\n          <div\n            class=\"euiSelectableTemplateSitewide__popover\"\n            style={{cssStyle\n              (hash\n                width=(if @popoverWidth @popoverWidth 600) maxWidth=\"100%\"\n              )\n            }}\n          >\n            {{#if (or2 (has-block \"popoverTitle\") (has-block \"popoverButton\"))}}\n              <EuiPopoverTitle @paddingSize=\"s\">\n                {{yield to=\"popoverTitle\"}}\n                {{#if (has-block \"popoverButton\")}}\n                  {{#if (has-block \"popoverTitle\")}}\n                    <EuiSpacer />\n                  {{/if}}\n                  {{#if parts.search}}\n                    <parts.search\n                      class=\"euiSelectableTemplateSitewide__search\"\n                      aria-label={{this.placeholder}}\n                    />\n                  {{/if}}\n                {{/if}}\n              </EuiPopoverTitle>\n            {{/if}}\n            {{#if @isLoading}}\n              <div\n                class=\"euiText euiText--extraSmall euiSelectableMessage\"\n                style=\"min-height: 300px;\"\n              >\n                <EuiLoadingSpinner @size=\"l\" />\n                <br />\n                <p>{{this.loadingText}}</p>\n              </div>\n            {{else}}\n              <parts.list class=\"euiSelectableTemplateSitewide__list\">\n                <:option as |option searchValue|>\n                  <EuiHighlight\n                    class=\"euiSelectableTemplateSitewide__listItemTitle\"\n                    @text={{option.label}}\n                    @search={{searchValue}}\n                  />\n                  {{#if (metaOf option)}}\n                    <span class=\"euiSelectableTemplateSitewide__optionMetasList\">\n                      {{#each (metaOf option) as |meta|}}\n                        <EuiHighlight\n                          class={{metaClass meta}}\n                          @text={{meta.text}}\n                          @search={{if meta.highlightSearchString searchValue \"\"}}\n                        />\n                      {{/each}}\n                    </span>\n                  {{/if}}\n                </:option>\n                <:optionPrepend as |option|>\n                  {{~#let (iconOf option) as |icon|~}}\n                    {{~#if icon~}}\n                      <EuiIcon\n                        @type={{icon.type}}\n                        @color={{if icon.color icon.color \"subdued\"}}\n                        @size=\"l\"\n                      />\n                    {{~/if~}}\n                  {{~/let~}}\n                </:optionPrepend>\n                <:optionAppend as |option|>\n                  {{~#let (avatarOf option) as |avatar|~}}\n                    {{~#if avatar~}}\n                      <EuiAvatar\n                        @name={{avatar.name}}\n                        @type={{if avatar.type avatar.type \"space\"}}\n                        @color={{avatar.color}}\n                        @size=\"s\"\n                      />\n                    {{~/if~}}\n                  {{~/let~}}\n                </:optionAppend>\n              </parts.list>\n            {{/if}}\n            {{#if (has-block \"popoverFooter\")}}\n              <EuiPopoverFooter @paddingSize=\"s\">\n                {{yield to=\"popoverFooter\"}}\n              </EuiPopoverFooter>\n            {{/if}}\n          </div>\n        </:content>\n      </EuiPopover>\n    </EuiSelectable>\n  </template>\n}\n\nfunction or2(a: unknown, b: unknown): boolean {\n  return Boolean(a || b);\n}\n\nfunction metaOf(option: EuiSelectableOption): EuiSelectableTemplateSitewideMeta[] | undefined {\n  const meta = (option as EuiSelectableTemplateSitewideOption).meta;\n\n  return meta?.length ? meta : undefined;\n}\n\nfunction iconOf(option: EuiSelectableOption): EuiSelectableTemplateSitewideOption['icon'] {\n  return (option as EuiSelectableTemplateSitewideOption).icon;\n}\n\nfunction avatarOf(option: EuiSelectableOption): EuiSelectableTemplateSitewideOption['avatar'] {\n  return (option as EuiSelectableTemplateSitewideOption).avatar;\n}\n"],"names":["metaClass","meta","type","EuiSelectableTemplateSitewide","Component","g","prototype","service","i","tracked","formattedOptions","args","options","map","option","key","label","className","filter","Boolean","join","placeholder","euiI18n","lookupToken","loadingText","noResultsText","goTo","open","isOpen","n","action","close","toggle","onSearchBlur","event","next","relatedTarget","panel","currentTarget","closest","querySelector","contains","document","onChange","setComponentTemplate","precompileTemplate","strictMode","scope","EuiSelectable","hash","EuiPopover","on","cssStyle","or2","EuiPopoverTitle","EuiSpacer","EuiLoadingSpinner","EuiHighlight","metaOf","iconOf","EuiIcon","avatarOf","EuiAvatar","EuiPopoverFooter","a","b","length","undefined","icon","avatar"],"mappings":"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"}