@limetech/lime-elements 37.24.0 → 37.26.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (104) hide show
  1. package/CHANGELOG.md +21 -0
  2. package/dist/cjs/{dom-ee8ee17d.js → debounce-2e5f4b7e.js} +1 -31
  3. package/dist/cjs/debounce-2e5f4b7e.js.map +1 -0
  4. package/dist/cjs/dom-81eaa633.js +34 -0
  5. package/dist/cjs/dom-81eaa633.js.map +1 -0
  6. package/dist/cjs/lime-elements.cjs.js +1 -1
  7. package/dist/cjs/{limel-action-bar-item_2.cjs.entry.js → limel-action-bar_3.cjs.entry.js} +106 -1
  8. package/dist/cjs/limel-action-bar_3.cjs.entry.js.map +1 -0
  9. package/dist/cjs/{limel-breadcrumbs_3.cjs.entry.js → limel-breadcrumbs_4.cjs.entry.js} +519 -20
  10. package/dist/cjs/limel-breadcrumbs_4.cjs.entry.js.map +1 -0
  11. package/dist/cjs/{limel-input-field_3.cjs.entry.js → limel-dynamic-label_4.cjs.entry.js} +75 -494
  12. package/dist/cjs/limel-dynamic-label_4.cjs.entry.js.map +1 -0
  13. package/dist/cjs/limel-picker.cjs.entry.js +3 -2
  14. package/dist/cjs/limel-picker.cjs.entry.js.map +1 -1
  15. package/dist/cjs/limel-prosemirror-adapter.cjs.entry.js +154 -117
  16. package/dist/cjs/limel-prosemirror-adapter.cjs.entry.js.map +1 -1
  17. package/dist/cjs/limel-text-editor.cjs.entry.js +8 -2
  18. package/dist/cjs/limel-text-editor.cjs.entry.js.map +1 -1
  19. package/dist/cjs/loader.cjs.js +1 -1
  20. package/dist/collection/components/text-editor/prosemirror-adapter/menu/menu-commands.js +77 -0
  21. package/dist/collection/components/text-editor/prosemirror-adapter/menu/menu-commands.js.map +1 -0
  22. package/dist/collection/components/text-editor/prosemirror-adapter/menu/menu-items.js +53 -0
  23. package/dist/collection/components/text-editor/prosemirror-adapter/menu/menu-items.js.map +1 -0
  24. package/dist/collection/components/text-editor/prosemirror-adapter/prosemirror-adapter.css +73 -82
  25. package/dist/collection/components/text-editor/prosemirror-adapter/prosemirror-adapter.js +34 -9
  26. package/dist/collection/components/text-editor/prosemirror-adapter/prosemirror-adapter.js.map +1 -1
  27. package/dist/collection/components/text-editor/text-editor.css +172 -4
  28. package/dist/collection/components/text-editor/text-editor.js +7 -1
  29. package/dist/collection/components/text-editor/text-editor.js.map +1 -1
  30. package/dist/collection/style/internal/fieldset.scss +62 -0
  31. package/dist/esm/{dom-ae531ebc.js → debounce-9a05c91c.js} +2 -31
  32. package/dist/esm/debounce-9a05c91c.js.map +1 -0
  33. package/dist/esm/dom-0b0170a0.js +32 -0
  34. package/dist/esm/dom-0b0170a0.js.map +1 -0
  35. package/dist/esm/lime-elements.js +1 -1
  36. package/dist/esm/{limel-action-bar-item_2.entry.js → limel-action-bar_3.entry.js} +107 -3
  37. package/dist/esm/limel-action-bar_3.entry.js.map +1 -0
  38. package/dist/esm/{limel-breadcrumbs_3.entry.js → limel-breadcrumbs_4.entry.js} +501 -3
  39. package/dist/esm/limel-breadcrumbs_4.entry.js.map +1 -0
  40. package/dist/esm/{limel-input-field_3.entry.js → limel-dynamic-label_4.entry.js} +70 -490
  41. package/dist/esm/limel-dynamic-label_4.entry.js.map +1 -0
  42. package/dist/esm/limel-picker.entry.js +2 -1
  43. package/dist/esm/limel-picker.entry.js.map +1 -1
  44. package/dist/esm/limel-prosemirror-adapter.entry.js +154 -117
  45. package/dist/esm/limel-prosemirror-adapter.entry.js.map +1 -1
  46. package/dist/esm/limel-text-editor.entry.js +8 -2
  47. package/dist/esm/limel-text-editor.entry.js.map +1 -1
  48. package/dist/esm/loader.js +1 -1
  49. package/dist/lime-elements/lime-elements.esm.js +1 -1
  50. package/dist/lime-elements/lime-elements.esm.js.map +1 -1
  51. package/dist/lime-elements/p-18c97232.js +2 -0
  52. package/dist/lime-elements/p-18c97232.js.map +1 -0
  53. package/dist/lime-elements/p-2bff59a1.entry.js +2 -0
  54. package/dist/lime-elements/p-2bff59a1.entry.js.map +1 -0
  55. package/dist/lime-elements/p-3ab8d3e9.entry.js +68 -0
  56. package/dist/lime-elements/p-3ab8d3e9.entry.js.map +1 -0
  57. package/dist/lime-elements/p-5e7b7b03.js +2 -0
  58. package/dist/lime-elements/p-5e7b7b03.js.map +1 -0
  59. package/dist/lime-elements/p-5fcdb9d2.entry.js +2 -0
  60. package/dist/lime-elements/{p-3e90be0a.entry.js.map → p-5fcdb9d2.entry.js.map} +1 -1
  61. package/dist/lime-elements/{p-5b2e8739.entry.js → p-db7ce0f8.entry.js} +2 -2
  62. package/dist/lime-elements/p-db7ce0f8.entry.js.map +1 -0
  63. package/dist/lime-elements/p-e4424368.entry.js +2 -0
  64. package/dist/lime-elements/p-e4424368.entry.js.map +1 -0
  65. package/dist/lime-elements/p-f1e1f867.entry.js +2 -0
  66. package/dist/lime-elements/p-f1e1f867.entry.js.map +1 -0
  67. package/dist/lime-elements/style/internal/fieldset.scss +62 -0
  68. package/dist/types/components/text-editor/prosemirror-adapter/menu/menu-commands.d.ts +12 -0
  69. package/dist/types/components/text-editor/prosemirror-adapter/menu/menu-items.d.ts +4 -0
  70. package/dist/types/components/text-editor/prosemirror-adapter/prosemirror-adapter.d.ts +4 -1
  71. package/dist/types/components/text-editor/text-editor.d.ts +1 -0
  72. package/package.json +3 -3
  73. package/dist/cjs/dom-ee8ee17d.js.map +0 -1
  74. package/dist/cjs/limel-action-bar-item_2.cjs.entry.js.map +0 -1
  75. package/dist/cjs/limel-action-bar.cjs.entry.js +0 -113
  76. package/dist/cjs/limel-action-bar.cjs.entry.js.map +0 -1
  77. package/dist/cjs/limel-breadcrumbs_3.cjs.entry.js.map +0 -1
  78. package/dist/cjs/limel-dynamic-label_2.cjs.entry.js +0 -91
  79. package/dist/cjs/limel-dynamic-label_2.cjs.entry.js.map +0 -1
  80. package/dist/cjs/limel-input-field_3.cjs.entry.js.map +0 -1
  81. package/dist/esm/dom-ae531ebc.js.map +0 -1
  82. package/dist/esm/limel-action-bar-item_2.entry.js.map +0 -1
  83. package/dist/esm/limel-action-bar.entry.js +0 -109
  84. package/dist/esm/limel-action-bar.entry.js.map +0 -1
  85. package/dist/esm/limel-breadcrumbs_3.entry.js.map +0 -1
  86. package/dist/esm/limel-dynamic-label_2.entry.js +0 -86
  87. package/dist/esm/limel-dynamic-label_2.entry.js.map +0 -1
  88. package/dist/esm/limel-input-field_3.entry.js.map +0 -1
  89. package/dist/lime-elements/p-3e90be0a.entry.js +0 -2
  90. package/dist/lime-elements/p-497a0b69.entry.js +0 -68
  91. package/dist/lime-elements/p-497a0b69.entry.js.map +0 -1
  92. package/dist/lime-elements/p-5b2e8739.entry.js.map +0 -1
  93. package/dist/lime-elements/p-6eeb61e4.entry.js +0 -2
  94. package/dist/lime-elements/p-6eeb61e4.entry.js.map +0 -1
  95. package/dist/lime-elements/p-714d6937.js +0 -2
  96. package/dist/lime-elements/p-714d6937.js.map +0 -1
  97. package/dist/lime-elements/p-a2d19673.entry.js +0 -2
  98. package/dist/lime-elements/p-a2d19673.entry.js.map +0 -1
  99. package/dist/lime-elements/p-af964180.entry.js +0 -2
  100. package/dist/lime-elements/p-af964180.entry.js.map +0 -1
  101. package/dist/lime-elements/p-caf959fe.entry.js +0 -2
  102. package/dist/lime-elements/p-caf959fe.entry.js.map +0 -1
  103. package/dist/lime-elements/p-da62cd3f.entry.js +0 -2
  104. package/dist/lime-elements/p-da62cd3f.entry.js.map +0 -1
@@ -0,0 +1 @@
1
+ {"file":"limel-dynamic-label.limel-helper-line.limel-list.limel-menu-surface.entry.cjs.js","mappings":"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","names":["getIconName","h","Host","index","getIconColor","CheckboxTemplate","listStrings","MDCList","MDCMenuSurface","Corner","isDescendant","ESCAPE","ESCAPE_KEY_CODE","TAB","TAB_KEY_CODE"],"sources":["./src/components/dynamic-label/dynamic-label.scss?tag=limel-dynamic-label&encapsulation=shadow","./src/components/dynamic-label/dynamic-label.tsx","./src/components/helper-line/helper-line.scss?tag=limel-helper-line&encapsulation=shadow","./src/components/helper-line/helper-line.tsx","./src/components/list/radio-button/radio-button.template.tsx","./src/components/list/list-renderer.tsx","./src/components/list/list.scss?tag=limel-list&encapsulation=shadow","./src/components/list/list.tsx","./src/components/menu-surface/menu-surface.scss?tag=limel-menu-surface&encapsulation=shadow","./src/components/menu-surface/menu-surface.tsx"],"sourcesContent":["@use '../../style/mixins.scss';\n\n* {\n box-sizing: border-box;\n min-width: 0;\n}\n\n:host(limel-dynamic-label) {\n --limel-dynamic-label-min-height: 1.75rem;\n display: flex;\n gap: 0.5rem;\n align-items: center;\n border-radius: 0.5rem;\n min-width: 0;\n}\n\nlimel-icon {\n --limel-icon-svg-margin: 0.125rem;\n border-radius: 0.25rem;\n flex-shrink: 0;\n width: var(--limel-dynamic-label-min-height);\n color: rgb(\n var(--contrast-900)\n ); // The default `false` color. Will be overwritten by `Icon`\n}\n\nspan {\n @include mixins.truncate-text;\n flex-grow: 1;\n font-size: 0.8125rem; // `13px`, Like Checkbox & Switch\n color: var(--mdc-theme-on-surface);\n}\n","import { getIconName } from '../icon/get-icon-props';\nimport { Component, Prop, h } from '@stencil/core';\nimport { Label, LabelValue } from './label.types';\nimport { Icon } from '../../interface';\n\n/**\n * This components displays a different label depending on the current given\n * value. A label can consist of a text and an optional icon. If no matching\n * label is found among the given `labels`, the `defaultLabel` will be displayed.\n *\n * One use case of the component is to enhance the visualization of a `boolean`\n * field like a checkbox or switch in a `readonly` state.\n *\n * The reason we offer this component is that the default styling\n * of the Checkbox or Toggle switch in the `readonly` state may not always\n * provide the best way of _visualizing information_, potentially leading to\n * confusion and negatively affecting the end-users' experience.\n *\n * @exampleComponent limel-example-dynamic-label\n * @exampleComponent limel-example-dynamic-label-readonly-boolean\n * @beta\n */\n@Component({\n tag: 'limel-dynamic-label',\n shadow: true,\n styleUrl: 'dynamic-label.scss',\n})\nexport class DynamicLabel {\n /**\n * The current value of the component which is used to match with the given\n * `labels` to determine what label to display.\n *\n * If not matching label is found, the `defaultLabel` is displayed.\n */\n @Prop()\n public value: LabelValue;\n\n /**\n * The label to display when no matching value is found in the `labels`\n * array. This is a fallback label that ensures there's always a label\n * displayed for the component.\n */\n @Prop({ reflect: true })\n public defaultLabel: Omit<Label, 'value'> = {};\n\n /**\n * A list of available labels. Each label has a corresponding value that\n * will be matched with the current `value` of the component to determine\n * what label to display.\n */\n @Prop()\n public labels: Label[] = [];\n\n public render() {\n const label = this.labels.find((l) => l.value === this.value);\n\n return [\n this.renderIcon(label?.icon ?? this.defaultLabel.icon),\n this.renderLabel(label?.text ?? this.defaultLabel.text),\n ];\n }\n\n private renderIcon(icon?: string | Icon) {\n const iconName = getIconName(icon);\n if (!iconName) {\n return;\n }\n\n let iconColor: string | undefined;\n let iconBackgroundColor: string | undefined;\n\n if (typeof icon === 'object') {\n iconColor = icon.color;\n iconBackgroundColor = icon.backgroundColor;\n }\n\n const iconProps = {\n role: 'presentation',\n name: iconName,\n style: {\n color: iconColor,\n 'background-color': iconBackgroundColor,\n },\n };\n\n return <limel-icon {...iconProps} />;\n }\n\n private renderLabel(label: string = '') {\n return <span>{label}</span>;\n }\n}\n",":host(limel-helper-line) {\n transition: opacity 0.2s ease;\n\n box-sizing: border-box;\n display: grid;\n\n min-width: 0; // prevents overflowing, if component is placed in flex containers\n\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n font-size: 0.6875rem;\n line-height: normal;\n\n color: rgb(var(--contrast-1200));\n}\n\ndiv {\n display: flex;\n justify-content: space-between;\n gap: 0.75rem;\n overflow: hidden;\n padding: 0 1rem;\n}\n\n:host(limel-helper-line.invalid) {\n .helper-text {\n color: var(--mdc-theme-error);\n }\n}\n\n.counter {\n flex-shrink: 0;\n margin-left: auto;\n}\n\n.helper-text,\n.counter {\n padding-top: 0.125rem;\n}\n\n// This animates height of the helper line, from `0` to `auto`.\n// To get this animation effect, the consumer component should\n// add `hide` classed accordingly.\n:host(limel-helper-line) {\n transition: grid-template-rows\n var(--limel-h-l-grid-template-rows-transition-speed, 0.46s)\n cubic-bezier(1, 0.09, 0, 0.89);\n grid-template-rows: var(--limel-h-l-grid-template-rows, 1fr);\n}\n\n:host(limel-helper-line.hide) {\n --limel-h-l-grid-template-rows-transition-speed: 0.3s;\n --limel-h-l-grid-template-rows: 0fr;\n}\n// End: animating height\n","import { Component, Host, Prop, h } from '@stencil/core';\n\n/**\n * This is an internal and private component that many input fields\n * use to display a helper text, along with a character counter below the\n * input field.\n *\n * We created this to keep the visual styles the same everywhere\n * and to avoid importing styles separately.\n *\n * Also this enables us to open the helper line in limel-portal,\n * more easily without having to send the styles to the portal.\n *\n * @exampleComponent limel-example-helper-line\n * @exampleComponent limel-example-helper-line-invalid\n * @exampleComponent limel-example-helper-line-long-text\n * @exampleComponent limel-example-helper-line-long-text-no-counter\n * @exampleComponent limel-example-helper-line-character-counter\n * @exampleComponent limel-example-helper-line-empty\n * @exampleComponent limel-example-helper-line-animation\n * @private\n */\n@Component({\n tag: 'limel-helper-line',\n shadow: true,\n styleUrl: 'helper-line.scss',\n})\nexport class HelperLine {\n /**\n * The helper text that is displayed on the left side.\n */\n @Prop({ reflect: true })\n public helperText?: string;\n\n /**\n * Length of the current input value, coming from the parent component.\n * Used in the character counter section on the right side.\n */\n @Prop({ reflect: true })\n public length?: number;\n\n /**\n * Maximum length of the characters, defined on the parent component.\n * Used in the character counter section on the right side.\n */\n @Prop({ reflect: true })\n public maxLength?: number;\n\n /**\n * Turns `true`, when the parent component is invalid.\n * For example, when the parent component is `required` but is left empty.\n * Or when the input format is invalid.\n */\n @Prop({ reflect: true })\n public invalid?: boolean = false;\n\n /**\n * Used by `aria-controls` and `aria-describedby` in the parent component.\n */\n @Prop({ reflect: true })\n public helperTextId?: string;\n\n public render() {\n return (\n <Host\n tabIndex={-1}\n class={{\n invalid: this.invalid,\n }}\n style={!this.hasContent() ? { display: 'none' } : {}}\n aria-hidden={!this.hasContent()}\n >\n <div>\n {this.renderHelperText()}\n {this.renderCharacterCounter()}\n </div>\n </Host>\n );\n }\n\n private hasContent = () => {\n return !!(\n this.maxLength > 0 ||\n (this.helperText && this.helperText.length > 0)\n );\n };\n\n private renderHelperText = () => {\n if (!this.helperText) {\n return;\n }\n\n return (\n <span class=\"helper-text\" id={this.helperTextId}>\n {this.helperText}\n </span>\n );\n };\n\n private renderCharacterCounter = () => {\n const counter = `${this.length} / ${this.maxLength}`;\n\n if (!this.maxLength) {\n return;\n }\n\n return <span class=\"counter\">{counter}</span>;\n };\n}\n","import { FunctionalComponent, h } from '@stencil/core';\n\ninterface RadioButtonTemplateProps {\n disabled?: boolean;\n id: string;\n checked?: boolean;\n onChange?: (event: Event) => void;\n label?: string;\n}\n\nexport const RadioButtonTemplate: FunctionalComponent<\n RadioButtonTemplateProps\n> = (props) => {\n return (\n <div class=\"mdc-form-field\">\n <div\n class={`\n mdc-radio\n ${props.disabled ? 'mdc-radio--disabled' : ''}\n `}\n >\n <input\n class=\"mdc-radio__native-control\"\n type=\"radio\"\n id={props.id}\n checked={props.checked}\n disabled={props.disabled}\n onChange={props.onChange}\n />\n <div class=\"mdc-radio__background\">\n <div class=\"mdc-radio__outer-circle\" />\n <div class=\"mdc-radio__inner-circle\" />\n </div>\n </div>\n <label\n class={`${props.disabled ? 'disabled' : ''}`}\n htmlFor={props.id}\n >\n {props.label}\n </label>\n </div>\n );\n};\n","import { ListItem } from './list-item.types';\nimport { ListSeparator } from '../../global/shared-types/separator.types';\nimport { MenuItem } from '../menu/menu.types';\nimport { h } from '@stencil/core';\nimport { CheckboxTemplate } from '../checkbox/checkbox.template';\nimport { ListRendererConfig } from './list-renderer-config';\nimport { RadioButtonTemplate } from './radio-button/radio-button.template';\nimport { getIconColor, getIconName } from '../icon/get-icon-props';\n\nexport class ListRenderer {\n private defaultConfig: ListRendererConfig = {\n isOpen: true,\n badgeIcons: false,\n };\n\n private config: ListRendererConfig;\n\n private hasIcons: boolean;\n private twoLines: boolean;\n private avatarList: boolean;\n private commandKey: boolean;\n\n private applyTabIndexToItemAtIndex: number;\n\n public render(\n items: Array<ListItem | ListSeparator>,\n config: ListRendererConfig = {},\n ) {\n items = items || [];\n this.config = { ...this.defaultConfig, ...config };\n\n this.twoLines = items.some((item) => {\n return 'secondaryText' in item && !!item.secondaryText;\n });\n\n this.hasIcons = items.some((item) => {\n return 'icon' in item && !!item.icon;\n });\n\n this.avatarList = this.config.badgeIcons && this.hasIcons;\n const selectableListTypes = ['selectable', 'radio', 'checkbox'];\n\n let role;\n switch (this.config.type) {\n case 'checkbox':\n role = 'group';\n break;\n case 'radio':\n role = 'radiogroup';\n break;\n default:\n role = 'listbox';\n }\n\n this.applyTabIndexToItemAtIndex =\n this.getIndexForWhichToApplyTabIndex(items);\n\n const classNames = {\n 'mdc-deprecated-list': true,\n 'mdc-deprecated-list--two-line': this.twoLines,\n selectable: selectableListTypes.includes(this.config.type),\n 'mdc-deprecated-list--avatar-list': this.avatarList,\n 'list--compact':\n this.twoLines &&\n this.commandKey &&\n ['small', 'x-small'].includes(this.config.iconSize),\n };\n\n return (\n <ul class={classNames} role={role} aria-orientation=\"vertical\">\n {items.map(this.renderListItem)}\n </ul>\n );\n }\n\n /**\n * Determine which ListItem should have the `tab-index` attribute set,\n * and return the index at which that ListItem is located in `items`.\n * Returns `undefined` if no item should have the attribute set.\n * See https://github.com/material-components/material-components-web/tree/e66a43a75fef4f9179e24856649518e15e279a04/packages/mdc-list#accessibility\n *\n * @param items - the items of the list, including any `ListSeparator`:s\n * @returns the index as per the description\n */\n private getIndexForWhichToApplyTabIndex = (\n items: Array<ListItem | ListSeparator>,\n ) => {\n let result;\n for (let i = 0, max = items.length; i < max; i += 1) {\n if ('separator' in items[i]) {\n // Ignore ListSeparator\n } else {\n const item = items[i] as ListItem<any>;\n if (item.selected) {\n result = i;\n break;\n }\n\n if (result === undefined && !item.disabled) {\n result = i;\n // Do NOT break, as any later item with\n // `selected=true` should get the tab-index instead!\n }\n }\n }\n\n return result;\n };\n\n /**\n * Render a single list item\n *\n * @param item - the item to render\n * @param index - the index the item had in the `items` array\n * @returns the list item\n */\n private renderListItem = (\n item: ListItem | ListSeparator,\n index: number,\n ) => {\n if ('separator' in item) {\n return (\n <li class=\"mdc-deprecated-list-divider\" role=\"separator\">\n {this.rendertext(item)}\n <div class=\"limel-list-divider-line\" />\n </li>\n );\n }\n\n if (['radio', 'checkbox'].includes(this.config.type)) {\n return this.renderVariantListItem(this.config, item, index);\n }\n\n const classNames = {\n 'mdc-deprecated-list-item': true,\n 'mdc-deprecated-list-item--disabled': item.disabled,\n 'mdc-deprecated-list-item--selected': item.selected,\n 'has-primary-component': this.hasPrimaryComponent(item),\n };\n\n const attributes: { tabindex?: string } = {};\n if (index === this.applyTabIndexToItemAtIndex) {\n attributes.tabindex = '0';\n }\n\n return (\n <li\n class={classNames}\n aria-disabled={item.disabled ? 'true' : 'false'}\n aria-selected={item.selected ? 'true' : 'false'}\n data-index={index}\n {...attributes}\n >\n {this.renderIcon(this.config, item)}\n {this.getPrimaryComponent(item)}\n {this.renderText(item)}\n {this.twoLines && this.avatarList ? this.renderDivider() : null}\n {this.renderActionMenu(item.actions)}\n </li>\n );\n };\n\n private rendertext = (item: ListSeparator) => {\n if ('text' in item) {\n return <h2 class=\"limel-list-divider-title\">{item.text}</h2>;\n }\n };\n\n private getPrimaryComponent(item: ListItem): Element {\n if (!this.hasPrimaryComponent(item)) {\n return;\n }\n\n const PrimaryComponent = item.primaryComponent.name;\n const props = item.primaryComponent.props;\n\n return <PrimaryComponent {...props} />;\n }\n\n private hasPrimaryComponent = (item: ListItem) => {\n return !!item?.primaryComponent?.name;\n };\n\n /**\n * Render the text of the list item\n *\n * @param item - the list item\n * @returns the text for the list item\n */\n private renderText = (item: ListItem) => {\n if (this.isSimpleItem(item)) {\n return (\n <span class=\"mdc-deprecated-list-item__text\">{item.text}</span>\n );\n }\n\n return (\n <div class=\"mdc-deprecated-list-item__text\">\n <div class=\"mdc-deprecated-list-item__primary-command-text\">\n <div class=\"mdc-deprecated-list-item__primary-text\">\n {item.text}\n </div>\n </div>\n <div class=\"mdc-deprecated-list-item__secondary-text\">\n {item.secondaryText}\n </div>\n </div>\n );\n };\n\n private isSimpleItem = (item: ListItem): boolean => {\n return !('secondaryText' in item);\n };\n\n /**\n * Render an icon for a list item\n *\n * @param config - the config object, passed on from the `renderListItem` function\n * @param item - the list item\n * @returns the icon element\n */\n private renderIcon = (config: ListRendererConfig, item: ListItem) => {\n const style: any = {};\n const name = getIconName(item.icon);\n if (!name) {\n return;\n }\n\n const color = getIconColor(item.icon, item.iconColor);\n\n if (color) {\n if (config.badgeIcons) {\n style['--icon-background-color'] = color;\n } else {\n style.color = color;\n }\n }\n\n return (\n <limel-icon\n badge={config.badgeIcons}\n class=\"mdc-deprecated-list-item__graphic\"\n name={name}\n style={style}\n size={config.iconSize}\n />\n );\n };\n\n private renderDivider = () => {\n const classes = {\n 'mdc-deprecated-list-divider': true,\n 'mdc-deprecated-list-divider--inset': true,\n };\n if (this.config.iconSize) {\n classes[this.config.iconSize] = true;\n }\n\n return <hr class={classes} />;\n };\n\n private renderActionMenu = (actions: Array<MenuItem | ListSeparator>) => {\n if (!actions || actions.length === 0) {\n return;\n }\n\n return (\n <limel-menu\n class=\"mdc-deprecated-list-item__meta\"\n items={actions}\n openDirection=\"left-start\"\n >\n <limel-icon-button\n class=\"action-menu-trigger\"\n slot=\"trigger\"\n icon=\"menu_2\"\n />\n </limel-menu>\n );\n };\n\n private renderVariantListItem = (\n config: ListRendererConfig,\n item: ListItem,\n index: number,\n ) => {\n let itemTemplate;\n if (config.type === 'radio') {\n itemTemplate = (\n <RadioButtonTemplate\n id={`c_${index}`}\n checked={item.selected}\n disabled={item.disabled}\n />\n );\n } else if (config.type === 'checkbox') {\n itemTemplate = (\n <CheckboxTemplate\n id={`c_${index}`}\n checked={item.selected}\n disabled={item.disabled}\n />\n );\n }\n\n const classNames = {\n 'mdc-deprecated-list-item': true,\n 'mdc-deprecated-list-item--disabled': item.disabled,\n 'mdc-deprecated-list-item__text': !item.secondaryText,\n 'has-primary-component': this.hasPrimaryComponent(item),\n };\n\n const attributes: { tabindex?: string } = {};\n if (index === this.applyTabIndexToItemAtIndex) {\n attributes.tabindex = '0';\n }\n\n return (\n <li\n class={classNames}\n role={config.type}\n aria-checked={item.selected ? 'true' : 'false'}\n aria-disabled={item.disabled ? 'true' : 'false'}\n data-index={index}\n {...attributes}\n >\n {this.renderVariantListItemContent(config, item, itemTemplate)}\n </li>\n );\n };\n\n private renderVariantListItemContent = (\n config: ListRendererConfig,\n item: ListItem,\n itemTemplate: any,\n ) => {\n if (this.hasIcons) {\n return [\n item.icon ? this.renderIcon(config, item) : null,\n this.getPrimaryComponent(item),\n this.renderText(item),\n <div class=\"mdc-deprecated-list-item__meta\">\n {itemTemplate}\n </div>,\n ];\n }\n\n return [\n <div class=\"mdc-deprecated-list-item__graphic\">{itemTemplate}</div>,\n this.getPrimaryComponent(item),\n this.renderText(item),\n ];\n };\n}\n","@use '../../style/functions';\n@use '../../style/mixins';\n\n@use '../../style/internal/lime-theme';\n@use '../checkbox/checkbox.scss';\n\n@use '@material/list';\n\n$list-border-radius: 0.375rem; // 6px\n$list--has-interactive-items--mdc-list-item--hover: 1;\n$list-static-actions-list: 1;\n$list-mdc-list-item: 0;\n\n/**\n * @prop --icon-background-color: Color to use for icon background when `badgeIcons=true`.\n * @prop --icon-color: Color to use for icon. Defaults to grey when `badgeIcons=false`. Defaults to white when `badgeIcons=true`.\n * @prop --list-grid-max-width: Maximum width of a list that has `has-grid-layout` class. Defaults to `100%`.\n * @prop --list-grid-item-max-width: Maximum width of items in a list that has `has-grid-layout` class. Defaults to `10rem`.\n * @prop --list-grid-item-min-width: Minimum width of items in a list that has `has-grid-layout` class. Defaults to `7.5rem`.\n * @prop --list-grid-gap: Distance between items in a list that has `has-grid-layout` class. Defaults to `0.75rem`.\n * @prop --list-background-color-of-odd-interactive-items: Background color of odd list items, when `has-striped-rows` class is applied to the component. Defaults to `--contrast-200`.\n * @prop --list-background-color-of-even-interactive-items: Background color of even list items, when `has-striped-rows` class is applied to the component. Defaults to `transparent`.\n * @prop --list-margin: Space around the list. Defaults to `0.25rem`, which visualizes keyboard-focused items in a better way, as it adds some space for the outline effect;\n */\n\n:host(limel-list) {\n display: block;\n isolation: isolate;\n @include checkbox.custom-checkbox-styles;\n}\n\n:host([hidden]) {\n display: none;\n}\n\n@include list.deprecated-core-styles;\n\n.mdc-deprecated-list,\n.mdc-deprecated-list-item__secondary-text {\n // As long as this component is depended on MDC,\n // we need to force it to be font-agnostic.\n // When MDC-dependency is removed, this block can also be removed.\n // However, on removal of MDC-dependency, we should also make sure to check\n // other font-related styles that might be set by MDC,\n // such as `letter-spacing` or `font-size`.\n font-family: inherit;\n}\n\n.mdc-deprecated-list {\n --mdc-theme-text-icon-on-background: var(\n --icon-color,\n rgb(var(--contrast-900))\n );\n margin: var(\n --list-margin,\n 0.25rem\n ); // added space to visualize keyboard-focused items\n padding: 0;\n border-radius: $list-border-radius;\n\n .mdc-deprecated-list-divider {\n border-bottom-color: transparent;\n display: flex;\n align-items: center;\n gap: 0.75rem;\n height: auto;\n padding: 0 0.5rem;\n }\n\n .limel-list-divider-line {\n background-color: rgb(var(--contrast-400));\n height: 0.125rem;\n border-radius: 1rem;\n min-width: 1rem;\n flex-grow: 1;\n }\n\n .limel-list-divider-title {\n all: unset;\n @include mixins.truncate-text;\n color: rgb(var(--contrast-900));\n font-size: 0.8125rem; // 13px\n }\n\n .mdc-deprecated-list-item {\n transition: background-color 0.2s ease;\n box-sizing: border-box;\n z-index: $list-mdc-list-item; // in Chrome on Windows, menus flicker when they have a scroll bar and user hovers on them. We may be able to remove this in future versions of Chrome. Kia 2021-May-12\n min-height: 2.5rem;\n\n &:not(.mdc-deprecated-list-item--disabled) {\n &:hover {\n background-color: rgb(var(--contrast-300));\n z-index: 1;\n }\n }\n\n &.mdc-deprecated-list-item--disabled {\n cursor: not-allowed;\n\n limel-icon {\n opacity: 0.38; // similar to `mdc-deprecated-list-item__text` when disabled\n }\n }\n\n &:first-child {\n border-top-left-radius: $list-border-radius;\n border-top-right-radius: $list-border-radius;\n }\n &:last-child {\n border-bottom-right-radius: $list-border-radius;\n border-bottom-left-radius: $list-border-radius;\n }\n }\n\n &.selectable\n .mdc-deprecated-list-item:not(.mdc-deprecated-list-item--disabled) {\n cursor: pointer;\n }\n\n .mdc-deprecated-list-item__meta {\n // the action menu on the right side a list item\n line-height: 100%;\n margin-right: -0.5rem;\n }\n\n .mdc-deprecated-list-item__graphic {\n margin-right: functions.pxToRem(8);\n }\n\n &.mdc-deprecated-list--avatar-list {\n position: relative;\n\n limel-icon.mdc-deprecated-list-item__graphic {\n background-color: var(\n --icon-background-color,\n rgb(var(--contrast-900))\n );\n color: var(--icon-color, rgba(var(--color-white), 0.88));\n margin-right: functions.pxToRem(12);\n margin-left: functions.pxToRem(-4);\n }\n\n hr.mdc-deprecated-list-divider {\n position: absolute;\n bottom: 0;\n\n &.mdc-deprecated-list-divider--inset {\n --icon-width: #{functions.pxToRem(40)};\n --icon-right-padding: #{functions.pxToRem(12)};\n --list-right-padding: #{functions.pxToRem(12)};\n right: 0;\n width: calc(\n 100% - var(--icon-width) - var(--icon-right-padding) - var(\n --list-right-padding\n )\n );\n\n &.x-small {\n --icon-width: #{functions.pxToRem(24)};\n }\n\n &.small {\n --icon-width: #{functions.pxToRem(32)};\n }\n\n &.medium {\n --icon-width: #{functions.pxToRem(40)};\n }\n\n &.large {\n --icon-width: #{functions.pxToRem(48)};\n }\n }\n }\n\n .mdc-deprecated-list-item:last-child hr.mdc-deprecated-list-divider {\n display: none;\n }\n }\n\n &.mdc-deprecated-list--two-line {\n .mdc-deprecated-list-item__text {\n padding-top: functions.pxToRem(8);\n padding-bottom: functions.pxToRem(8);\n }\n }\n\n .mdc-deprecated-list-item__secondary-text,\n .mdc-deprecated-list-item__primary-text,\n .mdc-deprecated-list-item__command-text {\n margin: 0;\n &:before,\n &:after {\n display: none;\n }\n }\n\n .mdc-deprecated-list-item__command-text {\n color: rgb(var(--contrast-800));\n margin-left: 0.7rem;\n }\n\n .mdc-deprecated-list-item__text {\n align-self: center;\n width: 100%;\n }\n\n .has-primary-component {\n .mdc-deprecated-list-item__text {\n margin-left: 0.5rem;\n }\n }\n .mdc-deprecated-list-item__primary-command-text {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: baseline;\n }\n\n // Tweaks to display the icon correctly in Edge\n limel-icon.mdc-deprecated-list-item__graphic {\n display: block;\n }\n}\n\n.mdc-deprecated-list:not(.mdc-deprecated-list--avatar-list) {\n limel-icon.mdc-deprecated-list-item__graphic {\n // Tweaks to make icon lists align nicely with badge-icon lists.\n &[size='x-small'] {\n margin-right: functions.pxToRem(4);\n }\n &[size='small'] {\n margin-right: functions.pxToRem(8);\n }\n &[size='medium'] {\n margin-right: functions.pxToRem(8);\n }\n &[size='large'] {\n margin-right: functions.pxToRem(12);\n }\n }\n}\n\n.mdc-deprecated-list-item.mdc-deprecated-list-item--selected {\n &:before {\n background-color: var(--mdc-theme-primary);\n opacity: 0.15;\n }\n}\n\n:not(.mdc-deprecated-list--non-interactive) {\n > {\n :not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item {\n @include mixins.visualize-keyboard-focus;\n\n &:focus-visible {\n border-radius: $list-border-radius;\n z-index: $list--has-interactive-items--mdc-list-item--hover;\n }\n }\n }\n}\n\n@import '../checkbox/checkbox.scss';\n\n@import './radio-button/radio-button.scss';\n\n@import './partial-styles/custom-styles.scss';\n@import './partial-styles/enable-multiline-text.scss';\n@import './partial-styles/_has-grid-layout.scss';\n@import './partial-styles/_static-actions.scss';\n","import { IconSize } from '../icon/icon.types';\nimport { ListItem, ListSeparator } from './list-item.types';\nimport { ListType } from './list.types';\nimport { MDCList, MDCListActionEvent } from '@material/list';\nimport { strings as listStrings } from '@material/list/constants';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { ListRenderer } from './list-renderer';\nimport { ListRendererConfig } from './list-renderer-config';\n\nconst { ACTION_EVENT } = listStrings;\n\n/**\n * @exampleComponent limel-example-list\n * @exampleComponent limel-example-list-secondary\n * @exampleComponent limel-example-list-separator\n * @exampleComponent limel-example-list-selectable\n * @exampleComponent limel-example-list-icons\n * @exampleComponent limel-example-list-badge-icons\n * @exampleComponent limel-example-list-checkbox\n * @exampleComponent limel-example-list-checkbox-icons\n * @exampleComponent limel-example-list-radio-button\n * @exampleComponent limel-example-list-radio-button-icons\n * @exampleComponent limel-example-list-action\n * @exampleComponent limel-example-list-striped\n * @exampleComponent limel-example-list-badge-icons-with-multiple-lines\n * @exampleComponent limel-example-list-grid\n * @exampleComponent limel-example-list-primary-component\n */\n@Component({\n tag: 'limel-list',\n shadow: true,\n styleUrl: 'list.scss',\n})\nexport class List {\n /**\n * List of items to display\n */\n @Prop()\n public items: Array<ListItem | ListSeparator>;\n\n /**\n * Set to `true` if the list should display larger icons with a background\n */\n @Prop()\n public badgeIcons: boolean;\n\n /**\n * Size of the icons in the list\n */\n @Prop()\n public iconSize: IconSize = 'small';\n\n /**\n * The type of the list, omit to get a regular list. Available types are:\n * `selectable`: regular list with single selection.\n * `radio`: radio button list with single selection.\n * `checkbox`: checkbox list with multiple selection.\n */\n @Prop()\n public type: ListType;\n\n /**\n * By default, lists will display 3 lines of text, and then truncate the rest.\n * Consumers can increase or decrease this number by specifying\n * `maxLinesSecondaryText`. If consumer enters zero or negative\n * numbers we default to 1; and if they type decimals we round up.\n */\n // eslint-disable-next-line no-magic-numbers\n @Prop() maxLinesSecondaryText: number = 3;\n\n @Element()\n private element: HTMLLimelListElement;\n\n private config: ListRendererConfig;\n private listRenderer = new ListRenderer();\n private mdcList: MDCList;\n private multiple: boolean;\n private selectable: boolean;\n\n /**\n * Fired when a new value has been selected from the list.\n * Only fired if `type` is set to `selectable`, `radio` or `checkbox`.\n */\n @Event()\n private change: EventEmitter<ListItem | ListItem[]>;\n\n /**\n * Fired when an action has been selected from the action menu of a list item\n */\n @Event()\n protected select: EventEmitter<ListItem | ListItem[]>;\n\n public connectedCallback() {\n this.setup();\n }\n\n public disconnectedCallback() {\n this.teardown();\n }\n\n public componentDidLoad() {\n this.setup();\n this.triggerIconColorWarning();\n }\n\n public render() {\n this.config = {\n badgeIcons: this.badgeIcons,\n type: this.type,\n iconSize: this.iconSize,\n };\n let maxLinesSecondaryText = +this.maxLinesSecondaryText?.toFixed();\n if (this.maxLinesSecondaryText < 1) {\n maxLinesSecondaryText = 1;\n }\n\n const html = this.listRenderer.render(this.items, this.config);\n\n return (\n <Host\n style={{\n '--maxLinesSecondaryText': `${maxLinesSecondaryText}`,\n }}\n >\n {html}\n </Host>\n );\n }\n\n @Watch('type')\n protected handleType() {\n this.setupListeners();\n }\n\n @Watch('items')\n protected itemsChanged() {\n if (!this.mdcList) {\n return;\n }\n\n setTimeout(() => {\n this.setup();\n\n const listItems = this.items.filter(this.isListItem);\n\n if (this.multiple) {\n this.mdcList.selectedIndex = listItems\n .filter((item: ListItem) => item.selected)\n .map((item: ListItem) => listItems.indexOf(item));\n } else {\n const selectedIndex = listItems.findIndex(\n (item: ListItem) => item.selected,\n );\n\n if (selectedIndex === -1) {\n this.mdcList.initializeListType();\n } else {\n this.mdcList.selectedIndex = selectedIndex;\n }\n }\n }, 0);\n }\n\n private setup = () => {\n this.setupList();\n\n this.setupListeners();\n };\n\n private setupList = () => {\n if (this.mdcList) {\n this.teardown();\n this.mdcList = null;\n }\n\n const element = this.element.shadowRoot.querySelector(\n '.mdc-deprecated-list',\n );\n if (!element) {\n return;\n }\n\n this.mdcList = new MDCList(element);\n this.mdcList.hasTypeahead = true;\n };\n\n private setupListeners = () => {\n if (!this.mdcList) {\n return;\n }\n\n this.mdcList.unlisten(ACTION_EVENT, this.handleAction);\n\n this.selectable = ['selectable', 'radio', 'checkbox'].includes(\n this.type,\n );\n this.multiple = this.type === 'checkbox';\n\n if (!this.selectable) {\n return;\n }\n\n this.mdcList.listen(ACTION_EVENT, this.handleAction);\n this.mdcList.singleSelection = !this.multiple;\n };\n\n private teardown = () => {\n this.mdcList?.unlisten(ACTION_EVENT, this.handleAction);\n this.mdcList?.destroy();\n };\n\n private handleAction = (event: MDCListActionEvent) => {\n if (!this.multiple) {\n this.handleSingleSelect(event.detail.index);\n\n return;\n }\n\n this.handleMultiSelect(event.detail.index);\n };\n\n private handleSingleSelect = (index: number) => {\n const listItems = this.items.filter(this.isListItem) as ListItem[];\n if (listItems[index].disabled) {\n return;\n }\n\n const selectedItem: ListItem = listItems.find((item: ListItem) => {\n return !!item.selected;\n });\n\n if (selectedItem) {\n this.mdcList.selectedIndex = -1;\n this.change.emit({ ...selectedItem, selected: false });\n }\n\n if (listItems[index] !== selectedItem) {\n this.change.emit({ ...listItems[index], selected: true });\n }\n };\n\n private handleMultiSelect = (index: number) => {\n const listItems = this.items.filter(this.isListItem) as ListItem[];\n if (listItems[index].disabled) {\n return;\n }\n\n const selectedItems: ListItem[] = listItems\n .filter((item: ListItem, listIndex: number) => {\n if (listIndex === index) {\n // This is the item that was selected or deselected,\n // so we negate its previous selection status.\n return !item.selected;\n }\n\n // This is an item that didn't change, so we keep its selection status.\n return item.selected;\n })\n .map((item: ListItem) => {\n return { ...item, selected: true };\n });\n\n this.change.emit(selectedItems);\n };\n\n private isListItem = (item: ListItem): boolean => {\n return !('separator' in item);\n };\n\n private triggerIconColorWarning() {\n if (this.items.some((item) => 'iconColor' in item)) {\n /* eslint-disable-next-line no-console */\n console.warn(\n \"The `iconColor` prop is deprecated now! Use the new `Icon` interface and instead of `iconColor: 'color-name'` write `icon {name: 'icon-name', color: 'color-name'}`.\",\n );\n }\n }\n}\n","@use '@material/menu-surface';\n@use '@material/elevation';\n@use '@material/menu';\n\n/**\n* @prop --limel-menu-surface-display: defines whether the surface is treated as a block, flex or grid. It affects layout used to display its children. Defaults to `block`.\n* @prop --limel-menu-surface-flex-direction: defines the direction of menu-surface layout.\n*/\n\n:host(limel-menu-surface) {\n display: block;\n max-height: inherit;\n}\n\n@include menu-surface.core-styles;\n@include menu.core-styles;\n\n.mdc-menu-surface {\n display: var(--limel-menu-surface-display, block);\n flex-direction: var(--limel-menu-surface-flex-direction, row);\n max-height: inherit;\n position: relative;\n --mdc-menu-max-width: var(\n --menu-surface-width,\n min(calc(100vw - 2rem), 20rem)\n );\n background-color: var(--lime-elevated-surface-background-color);\n}\n\n:host(limel-menu-surface.has-grid-layout) {\n .mdc-menu-surface {\n width: var(--menu-surface-width, min(calc(100vw - 2rem), 40rem));\n max-width: unset;\n }\n}\n","import { Corner, MDCMenuSurface } from '@material/menu-surface';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Prop,\n} from '@stencil/core';\nimport { isDescendant } from '../../util/dom';\nimport {\n ESCAPE,\n ESCAPE_KEY_CODE,\n TAB,\n TAB_KEY_CODE,\n} from '../../util/keycodes';\n\n/**\n * @slot - Content to put inside the surface\n * @private\n */\n@Component({\n tag: 'limel-menu-surface',\n shadow: true,\n styleUrl: 'menu-surface.scss',\n})\nexport class MenuSurface {\n /**\n * True if the menu surface is open, false otherwise\n */\n @Prop()\n public open = false;\n\n /**\n * Clicks in this element should not be prevented when the menu surface is open\n */\n @Prop()\n public allowClicksElement: HTMLElement;\n\n /**\n * Emitted when the menu surface is dismissed and should be closed\n */\n @Event()\n public dismiss: EventEmitter<void>;\n\n @Element()\n private host: HTMLLimelMenuSurfaceElement;\n\n private menuSurface: MDCMenuSurface;\n\n public connectedCallback() {\n this.setup();\n }\n\n public disconnectedCallback() {\n this.teardown();\n }\n\n public componentDidLoad() {\n this.setup();\n }\n\n public render() {\n const classList = {\n 'mdc-menu': true,\n 'mdc-menu-surface': true,\n 'mdc-menu-surface--open': this.open,\n 'mdc-elevation-transition': true,\n 'mdc-elevation--z4': true,\n };\n\n return (\n <div class={classList} tabindex=\"-1\">\n <slot />\n </div>\n );\n }\n\n private setup = () => {\n const menuElement: HTMLElement =\n this.host.shadowRoot.querySelector('.mdc-menu-surface');\n if (!menuElement) {\n return;\n }\n\n this.menuSurface = new MDCMenuSurface(menuElement);\n this.menuSurface.setAnchorCorner(Corner.TOP_START);\n\n document.addEventListener('mousedown', this.handleDocumentClick, {\n capture: true,\n });\n this.host.addEventListener('keydown', this.handleKeyDown);\n window.addEventListener('resize', this.handleResize, {\n passive: true,\n });\n };\n\n private teardown = () => {\n this.menuSurface?.destroy();\n document.removeEventListener('mousedown', this.handleDocumentClick, {\n capture: true,\n });\n this.host.removeEventListener('keydown', this.handleKeyDown);\n window.removeEventListener('resize', this.handleResize);\n };\n\n private handleDocumentClick = (event) => {\n const elementPath = event.composedPath ? event.composedPath() : [];\n\n if (!this.open) {\n return;\n }\n\n if (isDescendant(event.target, this.host)) {\n return;\n }\n\n if (this.allowClicksElement) {\n const clickedInAllowedElement = elementPath.includes(\n this.allowClicksElement,\n );\n\n if (clickedInAllowedElement) {\n return;\n }\n }\n\n this.dismiss.emit();\n this.preventClickEventPropagation();\n };\n\n private handleResize = () => {\n if (this.open) {\n this.dismiss.emit();\n }\n };\n\n private preventClickEventPropagation = () => {\n // When the menu surface is open, we want to stop the `click` event from propagating\n // when clicking outside the surface itself. This is to prevent any dialog that might\n // be open from closing, etc. However, when dragging a scrollbar no `click` event is emitted,\n // only mousedown and mouseup. So we listen for `mousedown` and attach a one-time listener\n // for `click`, so we can capture and \"kill\" it.\n document.addEventListener('click', this.stopEvent, {\n capture: true,\n once: true,\n });\n // We also capture and \"kill\" the next `mouseup` event.\n document.addEventListener('mouseup', this.stopEvent, {\n capture: true,\n once: true,\n });\n // If the user dragged the scrollbar, no `click` event happens. So when we get the\n // `mouseup` event, remove the handler for `click` if it's still there.\n // Otherwise, we would catch the next click even though the menu is no longer open.\n document.addEventListener(\n 'mouseup',\n () => {\n document.removeEventListener('click', this.stopEvent, {\n capture: true,\n });\n },\n {\n once: true,\n },\n );\n };\n\n private stopEvent = (event) => {\n event.stopPropagation();\n event.preventDefault();\n };\n\n private handleKeyDown = (event: KeyboardEvent) => {\n const isEscape =\n event.key === ESCAPE || event.keyCode === ESCAPE_KEY_CODE;\n const isTab = event.key === TAB || event.keyCode === TAB_KEY_CODE;\n\n if (this.open && (isEscape || isTab)) {\n event.stopPropagation();\n this.dismiss.emit();\n }\n };\n}\n"],"version":3}
@@ -3,10 +3,11 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-d1052409.js');
6
- const dom = require('./dom-ee8ee17d.js');
6
+ const dom = require('./dom-81eaa633.js');
7
7
  const keycodes = require('./keycodes-3949f425.js');
8
8
  const randomString = require('./random-string-c8445652.js');
9
9
  const getIconProps = require('./get-icon-props-50be7440.js');
10
+ const debounce = require('./debounce-2e5f4b7e.js');
10
11
  require('./isObject-e28b7997.js');
11
12
  require('./toNumber-062ea29c.js');
12
13
  require('./isSymbol-d22b2798.js');
@@ -96,7 +97,7 @@ const Picker = class {
96
97
  this.handleCloseMenu = this.handleCloseMenu.bind(this);
97
98
  this.onListKeyDown = this.onListKeyDown.bind(this);
98
99
  this.portalId = randomString.createRandomString();
99
- this.debouncedSearch = dom.debounce(this.search, SEARCH_DEBOUNCE);
100
+ this.debouncedSearch = debounce.debounce(this.search, SEARCH_DEBOUNCE);
100
101
  }
101
102
  componentWillLoad() {
102
103
  this.chips = this.createChips(this.value);
@@ -1 +1 @@
1
- {"file":"limel-picker.entry.cjs.js","mappings":";;;;;;;;;;;;;;AAAA,MAAM,SAAS,GAAG,qEAAqE;;ACqCvF,MAAM,eAAe,GAAG,GAAG,CAAC;AAC5B,MAAM,iBAAiB,GAAG,gBAAgB,CAAC;MAiB9B,MAAM;EA8Jf;;;;;;;IANQ,oBAAe,GAAG,KAAK,CAAC;IAwFxB,eAAU,GAAG,CAAC,IAAc;MAChC,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;MACzB,IAAI,CAAC,CAAC,KAAK,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;QACtC,OAAO,KAAK,CAAC,EAAE,CAAC;OACnB;MAED,OAAO,KAAK,CAAC;KAChB,CAAC;IAEM,gBAAW,GAAG,CAAC,KAA4B;MAC/C,IAAI,CAAC,KAAK,EAAE;QACR,OAAO,EAAE,CAAC;OACb;MAED,IAAI,IAAI,CAAC,QAAQ,EAAE;QACf,MAAM,SAAS,GAAe,KAAmB,CAAC;QAElD,OAAO,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;OACzC;MAED,MAAM,QAAQ,GAAa,KAAiB,CAAC;MAE7C,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,CAAC;KACtC,CAAC;IAEM,eAAU,GAAG,CAAC,QAAkB;MACpC,MAAM,IAAI,GAAGA,wBAAW,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;MACxC,MAAM,KAAK,GAAGC,6BAAgB,CAAC,QAAQ,CAAC,IAAI,EAAE,QAAQ,CAAC,SAAS,CAAC,CAAC;MAClE,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC;MAE1C,OAAO;QACH,EAAE,EAAE,GAAG,OAAO,EAAE;QAChB,IAAI,EAAE,QAAQ,CAAC,IAAI;QACnB,SAAS,EAAE,IAAI;QACf,IAAI,EAAE,IAAI,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,SAAS;QACrD,KAAK,EAAE,QAAQ;OAClB,CAAC;KACL,CAAC;IAwNM,WAAM,GAAG,OAAO,KAAa;MACjC,MAAM,SAAS,GAAG,UAAU,CAAC;QACzB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;OACvB,CAAC,CAAC;MACH,MAAM,MAAM,IAAI,MAAM,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,CAElD,CAAC;MACF,YAAY,CAAC,SAAS,CAAC,CAAC;MACxB,IAAI,CAAC,kBAAkB,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;KAC1C,CAAC;oBAjfyB,KAAK;oBAOL,KAAK;;;;;;oBAoCL,KAAK;mBAOf,KAAK;;;oBAuBK,KAAK;qBAML,IAAI;mBAMW,EAAE;0BAOJ,QAAQ;gCAUI,QAAQ;sBAM/B,KAAK;;qBA0BN,EAAE;mBAGH,KAAK;iBAGR,EAAE;IActB,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACvD,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC7D,IAAI,CAAC,qBAAqB,GAAG,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACnE,IAAI,CAAC,qBAAqB,GAAG,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACnE,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACjD,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACrD,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACzD,IAAI,CAAC,sBAAsB,GAAG,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACrE,IAAI,CAAC,qBAAqB,GAAG,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACnE,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACvD,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAEnD,IAAI,CAAC,QAAQ,GAAGC,+BAAkB,EAAE,CAAC;IACrC,IAAI,CAAC,eAAe,GAAGC,YAAQ,CAAC,IAAI,CAAC,MAAM,EAAE,eAAe,CAAC,CAAC;GACjE;EAEM,iBAAiB;IACpB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;GAC7C;EAEM,gBAAgB;IACnB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC;GACxE;EAEM,MAAM,mBAAmB;IAC5B,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;IAC7B,IAAI,IAAI,CAAC,OAAO,EAAE;MACd,IAAI,CAAC,eAAe,GAAG,MAAM,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC;KAC3D;GACJ;EAEM,MAAM;IACT,MAAM,KAAK,GAEP,EAAE,CAAC;IAEP,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;MAChB,KAAK,CAAC,QAAQ,GAAG,CAAC,CAAC;KACtB;IAED,OAAO;MACHC,0CACI,IAAI,EAAC,OAAO,EACZ,SAAS,EAAC,QAAQ,EAClB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,SAAS,EAAE,IAAI,CAAC,eAAe,EAAE,EACjC,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,OAAO,EAAE,IAAI,CAAC,eAAe,EAC7B,SAAS,EAAE,IAAI,CAAC,kBAAkB,EAClC,QAAQ,EAAE,IAAI,CAAC,YAAY,EAC3B,UAAU,EAAE,IAAI,CAAC,cAAc,EAC/B,WAAW,EAAE,IAAI,CAAC,qBAAqB,EACvC,UAAU,EAAE,IAAI,CAAC,qBAAqB,EACtC,gBAAgB,EAAE,KAAK,EACvB,cAAc,EAAE,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,eAAe,IAClD,KAAK,EACX;MACF,IAAI,CAAC,cAAc,EAAE;KACxB,CAAC;GACL;EAGS,aAAa;IACnB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;GAC7C;EAEO,eAAe;IACnB,IAAI,IAAI,CAAC,QAAQ,EAAE;MACf,OAAO,IAAI,CAAC,SAAS,CAAC;KACzB;IAED,OAAO,IAAI,CAAC;GACf;;;;;;;EA+CO,cAAc;IAClB,MAAM,eAAe,GAAG,IAAI,CAAC,kBAAkB,EAAE,CAAC;IAElD,MAAM,OAAO,GAAG,EAAE,CAAC;IAEnB,IAAI,IAAI,CAAC,yBAAyB,EAAE,EAAE;MAClC,MAAM,aAAa,GAAG,IAAI,CAAC,gBAAgB,EAAE,CAAC;MAC9C,IAAI,IAAI,CAAC,cAAc,KAAK,KAAK,EAAE;QAC/B,OAAO,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;OAC/B;MAED,IAAI,eAAe,EAAE;QACjB,OAAO,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;OACjC;MAED,IAAI,IAAI,CAAC,cAAc,KAAK,QAAQ,EAAE;QAClC,OAAO,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;OAC/B;KACJ;IAED,OAAO,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;GACrC;EAEO,gBAAgB;;IACpB,MAAM,WAAW,GAAG,MAAA,MAAA,IAAI,CAAC,OAAO,0CAAE,MAAM,mCAAI,CAAC,CAAC;IAC9C,IAAI,WAAW,KAAK,CAAC,EAAE;MACnB,OAAO,IAAI,CAAC;KACf;IAED,OAAO;MACHA,wBACI,KAAK,EAAE;UACH,qBAAqB,EAAE,IAAI;UAC3B,WAAW,EAAE,IAAI,CAAC,cAAc,KAAK,KAAK;UAC1C,cAAc,EAAE,IAAI,CAAC,cAAc,KAAK,QAAQ;UAChD,qBAAqB,EACjB,IAAI,CAAC,oBAAoB,KAAK,QAAQ;SAC7C,EACD,UAAU,EAAE,IAAI,EAChB,IAAI,EAAE,YAAY,EAClB,QAAQ,EAAE,IAAI,CAAC,sBAAsB,EACrC,KAAK,EAAE,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,8BAA8B,CAAC,GAC9D;KACL,CAAC;GACL;EAEO,8BAA8B,CAClC,MAAwB;IAExB,uCACO,MAAM,KACT,OAAO,EAAE,EAAE,IACb;GACL;EAEO,yBAAyB;IAC7B,IAAI,IAAI,CAAC,MAAM,EAAE,EAAE;MACf,OAAO,KAAK,CAAC;KAChB;IAED,OAAO,CAAC,CAAC,IAAI,CAAC,eAAe,CAAC;GACjC;EAEO,kBAAkB;IACtB,IAAI,CAAC,IAAI,CAAC,yBAAyB,EAAE,EAAE;MACnC,OAAO;KACV;IAED,IAAI,IAAI,CAAC,OAAO,EAAE;MACd,OAAO,IAAI,CAAC,aAAa,EAAE,CAAC;KAC/B;IAED,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE;MACnC,OAAO,IAAI,CAAC,kBAAkB,EAAE,CAAC;KACpC;IAED,OAAO,IAAI,CAAC,gBAAgB,EAAE,CAAC;GAClC;;;;;;;EAQO,MAAM;IACV,OAAO,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC;GACzC;EAEO,aAAa;IACjB,QACIA,iBACI,KAAK,EAAE;QACH,KAAK,EAAE,MAAM;QACb,OAAO,EAAE,MAAM;QACf,aAAa,EAAE,QAAQ;QACvB,iBAAiB,EAAE,QAAQ;QAC3B,OAAO,EAAE,QAAQ;OACpB,IAEDA,2BAAe,WAAW,EAAE,KAAK,GAAI,CACnC,EACR;GACL;EAEO,kBAAkB;IACtB,IAAI,CAAC,IAAI,CAAC,kBAAkB,EAAE;MAC1B,OAAO;KACV;IAED,MAAM,KAAK,GAAG;MACV,KAAK,EAAE,2BAA2B;MAClC,YAAY,EAAE,QAAQ;MACtB,MAAM,EAAE,aAAa;KACxB,CAAC;IAEF,OAAOA,eAAG,KAAK,EAAE,KAAK,IAAG,IAAI,CAAC,kBAAkB,CAAK,CAAC;GACzD;EAEO,gBAAgB;IACpB,QACIA,wBACI,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,QAAQ,EAAE,IAAI,CAAC,gBAAgB,EAC/B,SAAS,EAAE,IAAI,CAAC,aAAa,EAC7B,IAAI,EAAC,YAAY,EACjB,KAAK,EAAE,IAAI,CAAC,KAAK,GACnB,EACJ;GACL;EAEO,aAAa,CAAC,KAAoB;IACtC,MAAM,QAAQ,GAAG,CAACC,YAAG,EAAEC,eAAM,EAAEC,cAAK,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IAC1D,MAAM,YAAY,GAAG;MACjBC,qBAAY;MACZC,wBAAe;MACfC,uBAAc;KACjB,CAAC,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;IAC1B,IAAI,QAAQ,IAAI,YAAY,EAAE;MAC1B,IAAI,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC;KAC3B;GACJ;EAEO,YAAY,CAAC,UAAiB,EAAE;IACpC,MAAM,cAAc,GAAG,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,gBAAgB,CAC/D,oBAAoB,CACvB,CAAC;IAEF,QACIN,0BACI,OAAO,EAAE,OAAO,CAAC,MAAM,GAAG,CAAC,EAC3B,WAAW,EAAE,IAAI,CAAC,QAAQ,EAC1B,kBAAkB,EAAE,IAAI,EACxB,cAAc,EAAE,EAAE,SAAS,EAAE,cAAc,EAAE,IAE7CA,gCACI,IAAI,EAAE,OAAO,CAAC,MAAM,GAAG,CAAC,EACxB,kBAAkB,EAAE,IAAI,CAAC,IAAI,EAC7B,KAAK,EAAE;QACH,sBAAsB,EAAE,MAAM;QAC9B,YAAY,EAAE,SAAS;QACvB,OAAO,EAAE,MAAM;OAClB,EACD,SAAS,EAAE,IAAI,CAAC,eAAe,IAE9B,OAAO,CACS,CACV,EACjB;GACL;;;;EAKO,qBAAqB;;;IAGzB,MAAM,OAAO,GACT,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,IAAI,QAAQ,CAAC,aAAa,CAAC;IACjE,MAAM,aAAa,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAC;IAClE,IACIO,gBAAY,CAAC,OAAsB,EAAE,IAAI,CAAC,IAAI,CAAC;MAC/CA,gBAAY,CAAC,OAAsB,EAAE,aAA4B,CAAC,EACpE;MACE,OAAO;KACV;IAED,IAAI,CAAC,eAAe,EAAE,CAAC;GAC1B;;;;;;EAOO,MAAM,eAAe,CAAC,KAAK;IAC/B,KAAK,CAAC,eAAe,EAAE,CAAC;IAExB,MAAM,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC;IAC3B,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;IAEvB,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC;;IAE5B,IAAI,KAAK,KAAK,EAAE,EAAE;MACd,IAAI,CAAC,eAAe,CAAC,KAAK,EAAE,CAAC;KAChC;GACJ;;;;;;EAkBO,gBAAgB,CACpB,KAAkD;;IAElD,KAAK,CAAC,eAAe,EAAE,CAAC;IACxB,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,KAAK,KAAK,CAAC,MAAM,EAAE;MAC5C,IAAI,QAAQ,GACR,KAAK,CAAC,MAAM,CAAC;MACjB,IAAI,IAAI,CAAC,QAAQ,EAAE;QACf,QAAQ,GAAG;UACP,GAAI,IAAI,CAAC,KAAsC;UAC/C,KAAK,CAAC,MAAM;SACf,CAAC;OACL;MAED,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;MAC3B,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;KACnB;IAED,IAAI,IAAI,CAAC,QAAQ,EAAE;MACf,MAAA,IAAI,CAAC,OAAO,0CAAE,QAAQ,CAAC,IAAI,CAAC,CAAC;KAChC;GACJ;;;;;;EAOO,sBAAsB,CAC1B,KAA6C;IAE7C,KAAK,CAAC,eAAe,EAAE,CAAC;IACxB,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE;MACf,OAAO;KACV;IAED,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IACrC,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;GACnB;;;;;EAMO,qBAAqB;IACzB,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC;IAC7B,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC;GAC/B;EAEO,YAAY,CAAC,KAA6C;IAC9D,KAAK,CAAC,eAAe,EAAE,CAAC;IAExB,IAAI,QAAQ,GAAG,IAAI,CAAC;IACpB,IAAI,IAAI,CAAC,QAAQ,EAAE;MACf,MAAM,KAAK,GAAG,KAAK,CAAC,MAAgB,CAAC;MACrC,QAAQ,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI;QACtB,OAAQ,IAAI,CAAC,KAAoB,CAAC,IAAI,CAAC,CAAC,IAAI;UACxC,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;UAEtC,OAAO,GAAG,OAAO,EAAE,KAAK,IAAI,CAAC,EAAE,CAAC;SACnC,CAAC,CAAC;OACN,CAAC,CAAC;KACN;IAED,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;GAC9B;EAEO,cAAc,CAAC,KAAoC;IACvD,KAAK,CAAC,eAAe,EAAE,CAAC;IACxB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC;GACxE;;;;;;;EAQO,kBAAkB,CAAC,KAAoB;IAC3C,MAAM,YAAY,GACd,CAAC,KAAK,CAAC,GAAG,KAAKN,YAAG,IAAI,KAAK,CAAC,OAAO,KAAKG,qBAAY;MACpD,CAAC,KAAK,CAAC,MAAM;MACb,CAAC,KAAK,CAAC,OAAO;MACd,CAAC,KAAK,CAAC,QAAQ,CAAC;IACpB,MAAM,IAAI,GACN,KAAK,CAAC,GAAG,KAAKI,iBAAQ,IAAI,KAAK,CAAC,OAAO,KAAKC,0BAAiB,CAAC;IAClE,MAAM,MAAM,GACR,KAAK,CAAC,GAAG,KAAKC,mBAAU,IAAI,KAAK,CAAC,OAAO,KAAKC,4BAAmB,CAAC;IAEtE,IAAI,CAAC,YAAY,IAAI,CAAC,IAAI,IAAI,CAAC,MAAM,EAAE;MACnC,OAAO;KACV;IAED,MAAM,IAAI,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC,QAAQ,aAAa,CAAC,CAAC;IACrE,IAAI,CAAC,IAAI,EAAE;MACP,OAAO;KACV;IAED,KAAK,CAAC,cAAc,EAAE,CAAC;IAEvB,IAAI,YAAY,IAAI,MAAM,EAAE;MACxB,MAAM,WAAW,GAAgB,IAAI,CAAC,UAAU,CAAC,aAAa,CAC1D,uCAAuC,CAC1C,CAAC;MACF,WAAW,CAAC,KAAK,EAAE,CAAC;MAEpB,OAAO;KACV;IAED,IAAI,IAAI,EAAE;MACN,MAAM,WAAW,GAAgB,IAAI,CAAC,UAAU,CAAC,aAAa,CAC1D,sCAAsC,CACzC,CAAC;MACF,WAAW,CAAC,KAAK,EAAE,CAAC;KACvB;GACJ;;;;;;EAOO,qBAAqB,CAAC,KAAoB;IAC9C,MAAM,QAAQ,GACV,KAAK,CAAC,GAAG,KAAKT,eAAM,IAAI,KAAK,CAAC,OAAO,KAAKG,wBAAe,CAAC;IAE9D,IAAI,QAAQ,EAAE;MACV,KAAK,CAAC,cAAc,EAAE,CAAC;MACvB,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;MACpB,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;KAC/B;GACJ;EAEO,kBAAkB,CAAC,KAAa,EAAE,MAAkB;IACxD,IAAI,KAAK,KAAK,IAAI,CAAC,SAAS,EAAE;MAC1B,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC;MACpB,IAAI,IAAI,CAAC,QAAQ,EAAE;QACf,MAAM,MAAM,GAAG,IAAI,CAAC,KAAmB,CAAC;QACxC,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,IAAI;UAC5B,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;SACjC,CAAC,CAAC;OACN;MAED,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;KACxB;GACJ;EAEO,eAAe;IACnB,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;MACvB,OAAO;KACV;IAED,IAAI,CAAC,eAAe,EAAE,CAAC;GAC1B;EAEO,eAAe;IACnB,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;IAC1B,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;IACpB,IAAI,CAAC,kBAAkB,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC;IAChC,IAAI,CAAC,eAAe,CAAC,MAAM,EAAE,CAAC;GACjC;;;;;;;;;;","names":["getIconName","getIconFillColor","createRandomString","debounce","h","TAB","ESCAPE","ENTER","TAB_KEY_CODE","ESCAPE_KEY_CODE","ENTER_KEY_CODE","isDescendant","ARROW_UP","ARROW_UP_KEY_CODE","ARROW_DOWN","ARROW_DOWN_KEY_CODE"],"sources":["./src/components/picker/picker.scss?tag=limel-picker&encapsulation=shadow","./src/components/picker/picker.tsx"],"sourcesContent":["// Note! The `--dropdown-z-index` property is used from `picker.tsx`.\n/**\n * @prop --dropdown-z-index: z-index of the dropdown menu.\n */\n\n:host {\n position: relative;\n display: block;\n}\n\n:host([hidden]) {\n display: none;\n}\n","import { Action } from '../collapsible-section/action';\nimport { ActionPosition, ActionScrollBehavior } from '../picker/actions.types';\nimport { Chip } from '../chip-set/chip.types';\nimport { ListItem } from '../list/list-item.types';\nimport { Searcher } from '../picker/searcher.types';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { isDescendant } from '../../util/dom';\nimport {\n ARROW_DOWN,\n ARROW_DOWN_KEY_CODE,\n ARROW_UP,\n ARROW_UP_KEY_CODE,\n ENTER,\n ENTER_KEY_CODE,\n ESCAPE,\n ESCAPE_KEY_CODE,\n TAB,\n TAB_KEY_CODE,\n} from '../../util/keycodes';\nimport { createRandomString } from '../../util/random-string';\nimport {\n LimelChipSetCustomEvent,\n LimelListCustomEvent,\n} from '../../components';\nimport { getIconFillColor, getIconName } from '../icon/get-icon-props';\nimport { PickerValue } from './value.types';\nimport { DebouncedFunc, debounce } from 'lodash-es';\n\nconst SEARCH_DEBOUNCE = 300;\nconst CHIP_SET_TAG_NAME = 'limel-chip-set';\n\n/**\n * @exampleComponent limel-example-picker-single\n * @exampleComponent limel-example-picker-multiple\n * @exampleComponent limel-example-picker-icons\n * @exampleComponent limel-example-picker-value-as-object\n * @exampleComponent limel-example-picker-empty-suggestions\n * @exampleComponent limel-example-picker-leading-icon\n * @exampleComponent limel-example-picker-static-actions\n * @exampleComponent limel-example-picker-composite\n */\n@Component({\n tag: 'limel-picker',\n shadow: true,\n styleUrl: 'picker.scss',\n})\nexport class Picker {\n /**\n * True if the picker should be disabled\n */\n @Prop()\n public disabled: boolean = false;\n\n /**\n * Set to `true` to disable adding and removing items,\n * but allow interaction with existing items.\n */\n @Prop({ reflect: true })\n public readonly: boolean = false;\n\n /**\n * Text to display for the input field of the picker\n */\n @Prop()\n public label: string;\n\n /**\n * Search label to display in the input field when searching\n */\n @Prop()\n public searchLabel: string;\n\n /**\n * Optional helper text to display below the input field when it has focus\n */\n @Prop({ reflect: true })\n public helperText: string;\n\n /**\n * Leading icon to show to the far left in the text field\n */\n @Prop()\n public leadingIcon: string;\n\n /**\n * A message to display when the search returned an empty result\n */\n @Prop()\n public emptyResultMessage: string;\n\n /**\n * True if the control requires a value\n */\n @Prop()\n public required: boolean = false;\n\n /**\n * Set to `true` to indicate that the current value of the input field is\n * invalid.\n */\n @Prop({ reflect: true })\n public invalid = false;\n\n /**\n * Currently selected value or values. Where the value can be an object.\n */\n @Prop()\n public value: ListItem<PickerValue> | Array<ListItem<PickerValue>>;\n\n /**\n * A search function that takes a search-string as an argument,\n * and returns a promise that will eventually be resolved with\n * an array of `ListItem`:s.\n *\n * See the docs for the type `Searcher` for type information on\n * the searcher function itself.\n */\n @Prop()\n public searcher: Searcher;\n\n /**\n * True if multiple values are allowed\n */\n @Prop()\n public multiple: boolean = false;\n\n /**\n * Sets delimiters between chips. Works only when `multiple` is `true`.\n */\n @Prop({ reflect: true })\n public delimiter: string = null;\n\n /**\n * Static actions that can be clicked by the user.\n */\n @Prop()\n public actions: Array<ListItem<Action>> = [];\n\n /**\n * Position of the custom static actions in the picker's results dropdown.\n * Can be set to `'top'` or `'bottom'`.\n */\n @Prop()\n public actionPosition: ActionPosition = 'bottom';\n\n /**\n * Scroll behavior of the custom static actions, when user scrolls\n * in the picker's results dropdown. Can be set to `'scroll'` which means\n * the action items will scroll together with the list, or `'sticky'` which\n * retains their position at the top or bottom of the drop down while\n * scrolling.\n */\n @Prop()\n public actionScrollBehavior: ActionScrollBehavior = 'sticky';\n\n /**\n * Whether badge icons should be used in the result list or not\n */\n @Prop({ reflect: true })\n public badgeIcons: boolean = false;\n\n /**\n * Fired when a new value has been selected from the picker\n */\n @Event()\n private change: EventEmitter<\n ListItem<PickerValue> | Array<ListItem<PickerValue>>\n >;\n\n /**\n * Fired when clicking on a selected value\n */\n @Event()\n private interact: EventEmitter<ListItem<PickerValue>>;\n\n /**\n * Emitted when the user selects an action.\n */\n @Event()\n private action: EventEmitter<Action>;\n\n @State()\n private items: Array<ListItem<number | string>>;\n\n @State()\n private textValue: string = '';\n\n @State()\n private loading: boolean = false;\n\n @State()\n private chips: Chip[] = [];\n\n @Element()\n private host: HTMLLimelPickerElement;\n\n // Should NOT be decorated with State(), since this\n // should not trigger a re-render by itself.\n private chipSetEditMode = false;\n\n private debouncedSearch: DebouncedFunc<(query: string) => Promise<void>>;\n private chipSet: HTMLLimelChipSetElement;\n private portalId: string;\n\n constructor() {\n this.handleTextInput = this.handleTextInput.bind(this);\n this.handleInputKeyDown = this.handleInputKeyDown.bind(this);\n this.handleDropdownKeyDown = this.handleDropdownKeyDown.bind(this);\n this.handleInputFieldFocus = this.handleInputFieldFocus.bind(this);\n this.handleChange = this.handleChange.bind(this);\n this.handleInteract = this.handleInteract.bind(this);\n this.handleListChange = this.handleListChange.bind(this);\n this.handleActionListChange = this.handleActionListChange.bind(this);\n this.handleStopEditAndBlur = this.handleStopEditAndBlur.bind(this);\n this.handleCloseMenu = this.handleCloseMenu.bind(this);\n this.onListKeyDown = this.onListKeyDown.bind(this);\n\n this.portalId = createRandomString();\n this.debouncedSearch = debounce(this.search, SEARCH_DEBOUNCE);\n }\n\n public componentWillLoad() {\n this.chips = this.createChips(this.value);\n }\n\n public componentDidLoad() {\n this.chipSet = this.host.shadowRoot.querySelector(CHIP_SET_TAG_NAME);\n }\n\n public async componentWillUpdate() {\n this.chipSetEditMode = false;\n if (this.chipSet) {\n this.chipSetEditMode = await this.chipSet.getEditMode();\n }\n }\n\n public render() {\n const props: {\n maxItems?: number;\n } = {};\n\n if (!this.multiple) {\n props.maxItems = 1;\n }\n\n return [\n <limel-chip-set\n type=\"input\"\n inputType=\"search\"\n label={this.label}\n helperText={this.helperText}\n leadingIcon={this.leadingIcon}\n value={this.chips}\n disabled={this.disabled}\n invalid={this.invalid}\n delimiter={this.renderDelimiter()}\n readonly={this.readonly}\n required={this.required}\n searchLabel={this.searchLabel}\n onInput={this.handleTextInput}\n onKeyDown={this.handleInputKeyDown}\n onChange={this.handleChange}\n onInteract={this.handleInteract}\n onStartEdit={this.handleInputFieldFocus}\n onStopEdit={this.handleStopEditAndBlur}\n emptyInputOnBlur={false}\n clearAllButton={this.multiple && !this.chipSetEditMode}\n {...props}\n />,\n this.renderDropdown(),\n ];\n }\n\n @Watch('value')\n protected onChangeValue() {\n this.chips = this.createChips(this.value);\n }\n\n private renderDelimiter() {\n if (this.multiple) {\n return this.delimiter;\n }\n\n return null;\n }\n\n private getValueId = (item: ListItem) => {\n const value = item.value;\n if (!!value && typeof value === 'object') {\n return value.id;\n }\n\n return value;\n };\n\n private createChips = (value: ListItem | ListItem[]): Chip[] => {\n if (!value) {\n return [];\n }\n\n if (this.multiple) {\n const listItems: ListItem[] = value as ListItem[];\n\n return listItems.map(this.createChip);\n }\n\n const listItem: ListItem = value as ListItem;\n\n return [this.createChip(listItem)];\n };\n\n private createChip = (listItem: ListItem): Chip => {\n const name = getIconName(listItem.icon);\n const color = getIconFillColor(listItem.icon, listItem.iconColor);\n const valueId = this.getValueId(listItem);\n\n return {\n id: `${valueId}`,\n text: listItem.text,\n removable: true,\n icon: name ? { name: name, color: color } : undefined,\n value: listItem,\n };\n };\n\n /**\n * Renders the dropdown with the items to pick from, or a spinner if the picker\n * is waiting for items to be received\n *\n * @returns picker dropdown\n */\n private renderDropdown() {\n const dropDownContent = this.getDropdownContent();\n\n const content = [];\n\n if (this.shouldShowDropDownContent()) {\n const actionContent = this.getActionContent();\n if (this.actionPosition === 'top') {\n content.push(actionContent);\n }\n\n if (dropDownContent) {\n content.push(dropDownContent);\n }\n\n if (this.actionPosition === 'bottom') {\n content.push(actionContent);\n }\n }\n\n return this.renderPortal(content);\n }\n\n private getActionContent() {\n const actionCount = this.actions?.length ?? 0;\n if (actionCount === 0) {\n return null;\n }\n\n return [\n <limel-list\n class={{\n 'static-actions-list': true,\n 'is-on-top': this.actionPosition === 'top',\n 'is-at-bottom': this.actionPosition === 'bottom',\n 'has-position-sticky':\n this.actionScrollBehavior === 'sticky',\n }}\n badgeIcons={true}\n type={'selectable'}\n onChange={this.handleActionListChange}\n items={this.actions.map(this.removeUnusedPropertiesOnAction)}\n />,\n ];\n }\n\n private removeUnusedPropertiesOnAction(\n action: ListItem<Action>,\n ): ListItem<Action> {\n return {\n ...action,\n actions: [],\n };\n }\n\n private shouldShowDropDownContent() {\n if (this.isFull()) {\n return false;\n }\n\n return !!this.chipSetEditMode;\n }\n\n private getDropdownContent() {\n if (!this.shouldShowDropDownContent()) {\n return;\n }\n\n if (this.loading) {\n return this.renderSpinner();\n }\n\n if (!this.items || !this.items.length) {\n return this.renderEmptyMessage();\n }\n\n return this.renderListResult();\n }\n\n /**\n * Returns true if the picker is \"full\"\n * The picker is considered to be full if it has a value and only one is allowed\n *\n * @returns true if the picker is full\n */\n private isFull(): boolean {\n return !this.multiple && !!this.value;\n }\n\n private renderSpinner() {\n return (\n <div\n style={{\n width: '100%',\n display: 'flex',\n 'align-items': 'center',\n 'justify-content': 'center',\n padding: '1rem 0',\n }}\n >\n <limel-spinner limeBranded={false} />\n </div>\n );\n }\n\n private renderEmptyMessage() {\n if (!this.emptyResultMessage) {\n return;\n }\n\n const style = {\n color: 'rgb(var(--contrast-1100))',\n 'text-align': 'center',\n margin: '0.5rem 1rem',\n };\n\n return <p style={style}>{this.emptyResultMessage}</p>;\n }\n\n private renderListResult() {\n return (\n <limel-list\n badgeIcons={this.badgeIcons}\n onChange={this.handleListChange}\n onKeyDown={this.onListKeyDown}\n type=\"selectable\"\n items={this.items}\n />\n );\n }\n\n private onListKeyDown(event: KeyboardEvent) {\n const keyFound = [TAB, ESCAPE, ENTER].includes(event.key);\n const keyCodeFound = [\n TAB_KEY_CODE,\n ESCAPE_KEY_CODE,\n ENTER_KEY_CODE,\n ].includes(event.keyCode);\n if (keyFound || keyCodeFound) {\n this.chipSet.setFocus();\n }\n }\n\n private renderPortal(content: any[] = []) {\n const dropdownZIndex = getComputedStyle(this.host).getPropertyValue(\n '--dropdown-z-index',\n );\n\n return (\n <limel-portal\n visible={content.length > 0}\n containerId={this.portalId}\n inheritParentWidth={true}\n containerStyle={{ 'z-index': dropdownZIndex }}\n >\n <limel-menu-surface\n open={content.length > 0}\n allowClicksElement={this.host}\n style={{\n '--mdc-menu-min-width': '100%',\n 'max-height': 'inherit',\n display: 'flex',\n }}\n onDismiss={this.handleCloseMenu}\n >\n {content}\n </limel-menu-surface>\n </limel-portal>\n );\n }\n\n /**\n * Check if a descendant still has focus. If not, reset text value and search result.\n */\n private handleStopEditAndBlur() {\n // In browsers where shadow DOM is not supported activeElement on shadowRoot will return null\n // However, document.activeElement will return the actual focused element instead of the outermost shadow host\n const element =\n this.host.shadowRoot.activeElement || document.activeElement;\n const portalElement = document.querySelector(`#${this.portalId}`);\n if (\n isDescendant(element as HTMLElement, this.host) ||\n isDescendant(element as HTMLElement, portalElement as HTMLElement)\n ) {\n return;\n }\n\n this.clearInputField();\n }\n\n /**\n * Input handler for the input field\n *\n * @param event - event\n */\n private async handleTextInput(event) {\n event.stopPropagation();\n\n const query = event.detail;\n this.textValue = query;\n\n this.debouncedSearch(query);\n // If the search-query is an empty string, bypass debouncing.\n if (query === '') {\n this.debouncedSearch.flush();\n }\n }\n\n private search = async (query: string) => {\n const timeoutId = setTimeout(() => {\n this.loading = true;\n });\n const result = (await this.searcher(this.textValue)) as Array<\n ListItem<PickerValue>\n >;\n clearTimeout(timeoutId);\n this.handleSearchResult(query, result);\n };\n\n /**\n * Change handler for the list\n *\n * @param event - event\n */\n private handleListChange(\n event: LimelListCustomEvent<ListItem<PickerValue>>,\n ) {\n event.stopPropagation();\n if (!this.value || this.value !== event.detail) {\n let newValue: ListItem<PickerValue> | Array<ListItem<PickerValue>> =\n event.detail;\n if (this.multiple) {\n newValue = [\n ...(this.value as Array<ListItem<PickerValue>>),\n event.detail,\n ];\n }\n\n this.change.emit(newValue);\n this.items = [];\n }\n\n if (this.multiple) {\n this.chipSet?.setFocus(true);\n }\n }\n\n /**\n * Change handler for the list\n *\n * @param event - event\n */\n private handleActionListChange(\n event: LimelListCustomEvent<ListItem<Action>>,\n ) {\n event.stopPropagation();\n if (!event.detail) {\n return;\n }\n\n this.action.emit(event.detail.value);\n this.items = [];\n }\n\n /**\n * Focus handler for the chip set\n * Prevent focus if the picker has a value and does not support multiple values\n */\n private handleInputFieldFocus() {\n const query = this.textValue;\n this.debouncedSearch(query);\n }\n\n private handleChange(event: LimelChipSetCustomEvent<Chip | Chip[]>) {\n event.stopPropagation();\n\n let newValue = null;\n if (this.multiple) {\n const chips = event.detail as Chip[];\n newValue = chips.map((chip) => {\n return (this.value as ListItem[]).find((item) => {\n const valueId = this.getValueId(item);\n\n return `${valueId}` === chip.id;\n });\n });\n }\n\n this.change.emit(newValue);\n }\n\n private handleInteract(event: LimelChipSetCustomEvent<Chip>) {\n event.stopPropagation();\n this.interact.emit(event.detail ? event.detail.value : event.detail);\n }\n\n /**\n * Key handler for the input field\n * Will change focus to the first/last item in the dropdown list to enable selection with the keyboard\n *\n * @param event - event\n */\n private handleInputKeyDown(event: KeyboardEvent) {\n const isForwardTab =\n (event.key === TAB || event.keyCode === TAB_KEY_CODE) &&\n !event.altKey &&\n !event.metaKey &&\n !event.shiftKey;\n const isUp =\n event.key === ARROW_UP || event.keyCode === ARROW_UP_KEY_CODE;\n const isDown =\n event.key === ARROW_DOWN || event.keyCode === ARROW_DOWN_KEY_CODE;\n\n if (!isForwardTab && !isUp && !isDown) {\n return;\n }\n\n const list = document.querySelector(` #${this.portalId} limel-list`);\n if (!list) {\n return;\n }\n\n event.preventDefault();\n\n if (isForwardTab || isDown) {\n const listElement: HTMLElement = list.shadowRoot.querySelector(\n '.mdc-deprecated-list-item:first-child',\n );\n listElement.focus();\n\n return;\n }\n\n if (isUp) {\n const listElement: HTMLElement = list.shadowRoot.querySelector(\n '.mdc-deprecated-list-item:last-child',\n );\n listElement.focus();\n }\n }\n\n /**\n * Key handler for the dropdown\n *\n * @param event - event\n */\n private handleDropdownKeyDown(event: KeyboardEvent) {\n const isEscape =\n event.key === ESCAPE || event.keyCode === ESCAPE_KEY_CODE;\n\n if (isEscape) {\n event.preventDefault();\n this.textValue = '';\n this.chipSet.setFocus(true);\n }\n }\n\n private handleSearchResult(query: string, result: ListItem[]) {\n if (query === this.textValue) {\n this.items = result;\n if (this.multiple) {\n const values = this.value as ListItem[];\n this.items = result.filter((item) => {\n return !values.includes(item);\n });\n }\n\n this.loading = false;\n }\n }\n\n private handleCloseMenu() {\n if (this.items.length > 0) {\n return;\n }\n\n this.clearInputField();\n }\n\n private clearInputField() {\n this.chipSet.emptyInput();\n this.textValue = '';\n this.handleSearchResult('', []);\n this.debouncedSearch.cancel();\n }\n}\n"],"version":3}
1
+ {"file":"limel-picker.entry.cjs.js","mappings":";;;;;;;;;;;;;;;AAAA,MAAM,SAAS,GAAG,qEAAqE;;ACqCvF,MAAM,eAAe,GAAG,GAAG,CAAC;AAC5B,MAAM,iBAAiB,GAAG,gBAAgB,CAAC;MAiB9B,MAAM;EA8Jf;;;;;;;IANQ,oBAAe,GAAG,KAAK,CAAC;IAwFxB,eAAU,GAAG,CAAC,IAAc;MAChC,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;MACzB,IAAI,CAAC,CAAC,KAAK,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;QACtC,OAAO,KAAK,CAAC,EAAE,CAAC;OACnB;MAED,OAAO,KAAK,CAAC;KAChB,CAAC;IAEM,gBAAW,GAAG,CAAC,KAA4B;MAC/C,IAAI,CAAC,KAAK,EAAE;QACR,OAAO,EAAE,CAAC;OACb;MAED,IAAI,IAAI,CAAC,QAAQ,EAAE;QACf,MAAM,SAAS,GAAe,KAAmB,CAAC;QAElD,OAAO,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;OACzC;MAED,MAAM,QAAQ,GAAa,KAAiB,CAAC;MAE7C,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,CAAC;KACtC,CAAC;IAEM,eAAU,GAAG,CAAC,QAAkB;MACpC,MAAM,IAAI,GAAGA,wBAAW,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;MACxC,MAAM,KAAK,GAAGC,6BAAgB,CAAC,QAAQ,CAAC,IAAI,EAAE,QAAQ,CAAC,SAAS,CAAC,CAAC;MAClE,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC;MAE1C,OAAO;QACH,EAAE,EAAE,GAAG,OAAO,EAAE;QAChB,IAAI,EAAE,QAAQ,CAAC,IAAI;QACnB,SAAS,EAAE,IAAI;QACf,IAAI,EAAE,IAAI,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,SAAS;QACrD,KAAK,EAAE,QAAQ;OAClB,CAAC;KACL,CAAC;IAwNM,WAAM,GAAG,OAAO,KAAa;MACjC,MAAM,SAAS,GAAG,UAAU,CAAC;QACzB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;OACvB,CAAC,CAAC;MACH,MAAM,MAAM,IAAI,MAAM,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,CAElD,CAAC;MACF,YAAY,CAAC,SAAS,CAAC,CAAC;MACxB,IAAI,CAAC,kBAAkB,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;KAC1C,CAAC;oBAjfyB,KAAK;oBAOL,KAAK;;;;;;oBAoCL,KAAK;mBAOf,KAAK;;;oBAuBK,KAAK;qBAML,IAAI;mBAMW,EAAE;0BAOJ,QAAQ;gCAUI,QAAQ;sBAM/B,KAAK;;qBA0BN,EAAE;mBAGH,KAAK;iBAGR,EAAE;IActB,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACvD,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC7D,IAAI,CAAC,qBAAqB,GAAG,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACnE,IAAI,CAAC,qBAAqB,GAAG,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACnE,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACjD,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACrD,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACzD,IAAI,CAAC,sBAAsB,GAAG,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACrE,IAAI,CAAC,qBAAqB,GAAG,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACnE,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACvD,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAEnD,IAAI,CAAC,QAAQ,GAAGC,+BAAkB,EAAE,CAAC;IACrC,IAAI,CAAC,eAAe,GAAGC,iBAAQ,CAAC,IAAI,CAAC,MAAM,EAAE,eAAe,CAAC,CAAC;GACjE;EAEM,iBAAiB;IACpB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;GAC7C;EAEM,gBAAgB;IACnB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC;GACxE;EAEM,MAAM,mBAAmB;IAC5B,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;IAC7B,IAAI,IAAI,CAAC,OAAO,EAAE;MACd,IAAI,CAAC,eAAe,GAAG,MAAM,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC;KAC3D;GACJ;EAEM,MAAM;IACT,MAAM,KAAK,GAEP,EAAE,CAAC;IAEP,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;MAChB,KAAK,CAAC,QAAQ,GAAG,CAAC,CAAC;KACtB;IAED,OAAO;MACHC,0CACI,IAAI,EAAC,OAAO,EACZ,SAAS,EAAC,QAAQ,EAClB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,SAAS,EAAE,IAAI,CAAC,eAAe,EAAE,EACjC,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,OAAO,EAAE,IAAI,CAAC,eAAe,EAC7B,SAAS,EAAE,IAAI,CAAC,kBAAkB,EAClC,QAAQ,EAAE,IAAI,CAAC,YAAY,EAC3B,UAAU,EAAE,IAAI,CAAC,cAAc,EAC/B,WAAW,EAAE,IAAI,CAAC,qBAAqB,EACvC,UAAU,EAAE,IAAI,CAAC,qBAAqB,EACtC,gBAAgB,EAAE,KAAK,EACvB,cAAc,EAAE,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,eAAe,IAClD,KAAK,EACX;MACF,IAAI,CAAC,cAAc,EAAE;KACxB,CAAC;GACL;EAGS,aAAa;IACnB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;GAC7C;EAEO,eAAe;IACnB,IAAI,IAAI,CAAC,QAAQ,EAAE;MACf,OAAO,IAAI,CAAC,SAAS,CAAC;KACzB;IAED,OAAO,IAAI,CAAC;GACf;;;;;;;EA+CO,cAAc;IAClB,MAAM,eAAe,GAAG,IAAI,CAAC,kBAAkB,EAAE,CAAC;IAElD,MAAM,OAAO,GAAG,EAAE,CAAC;IAEnB,IAAI,IAAI,CAAC,yBAAyB,EAAE,EAAE;MAClC,MAAM,aAAa,GAAG,IAAI,CAAC,gBAAgB,EAAE,CAAC;MAC9C,IAAI,IAAI,CAAC,cAAc,KAAK,KAAK,EAAE;QAC/B,OAAO,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;OAC/B;MAED,IAAI,eAAe,EAAE;QACjB,OAAO,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;OACjC;MAED,IAAI,IAAI,CAAC,cAAc,KAAK,QAAQ,EAAE;QAClC,OAAO,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;OAC/B;KACJ;IAED,OAAO,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;GACrC;EAEO,gBAAgB;;IACpB,MAAM,WAAW,GAAG,MAAA,MAAA,IAAI,CAAC,OAAO,0CAAE,MAAM,mCAAI,CAAC,CAAC;IAC9C,IAAI,WAAW,KAAK,CAAC,EAAE;MACnB,OAAO,IAAI,CAAC;KACf;IAED,OAAO;MACHA,wBACI,KAAK,EAAE;UACH,qBAAqB,EAAE,IAAI;UAC3B,WAAW,EAAE,IAAI,CAAC,cAAc,KAAK,KAAK;UAC1C,cAAc,EAAE,IAAI,CAAC,cAAc,KAAK,QAAQ;UAChD,qBAAqB,EACjB,IAAI,CAAC,oBAAoB,KAAK,QAAQ;SAC7C,EACD,UAAU,EAAE,IAAI,EAChB,IAAI,EAAE,YAAY,EAClB,QAAQ,EAAE,IAAI,CAAC,sBAAsB,EACrC,KAAK,EAAE,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,8BAA8B,CAAC,GAC9D;KACL,CAAC;GACL;EAEO,8BAA8B,CAClC,MAAwB;IAExB,uCACO,MAAM,KACT,OAAO,EAAE,EAAE,IACb;GACL;EAEO,yBAAyB;IAC7B,IAAI,IAAI,CAAC,MAAM,EAAE,EAAE;MACf,OAAO,KAAK,CAAC;KAChB;IAED,OAAO,CAAC,CAAC,IAAI,CAAC,eAAe,CAAC;GACjC;EAEO,kBAAkB;IACtB,IAAI,CAAC,IAAI,CAAC,yBAAyB,EAAE,EAAE;MACnC,OAAO;KACV;IAED,IAAI,IAAI,CAAC,OAAO,EAAE;MACd,OAAO,IAAI,CAAC,aAAa,EAAE,CAAC;KAC/B;IAED,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE;MACnC,OAAO,IAAI,CAAC,kBAAkB,EAAE,CAAC;KACpC;IAED,OAAO,IAAI,CAAC,gBAAgB,EAAE,CAAC;GAClC;;;;;;;EAQO,MAAM;IACV,OAAO,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC;GACzC;EAEO,aAAa;IACjB,QACIA,iBACI,KAAK,EAAE;QACH,KAAK,EAAE,MAAM;QACb,OAAO,EAAE,MAAM;QACf,aAAa,EAAE,QAAQ;QACvB,iBAAiB,EAAE,QAAQ;QAC3B,OAAO,EAAE,QAAQ;OACpB,IAEDA,2BAAe,WAAW,EAAE,KAAK,GAAI,CACnC,EACR;GACL;EAEO,kBAAkB;IACtB,IAAI,CAAC,IAAI,CAAC,kBAAkB,EAAE;MAC1B,OAAO;KACV;IAED,MAAM,KAAK,GAAG;MACV,KAAK,EAAE,2BAA2B;MAClC,YAAY,EAAE,QAAQ;MACtB,MAAM,EAAE,aAAa;KACxB,CAAC;IAEF,OAAOA,eAAG,KAAK,EAAE,KAAK,IAAG,IAAI,CAAC,kBAAkB,CAAK,CAAC;GACzD;EAEO,gBAAgB;IACpB,QACIA,wBACI,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,QAAQ,EAAE,IAAI,CAAC,gBAAgB,EAC/B,SAAS,EAAE,IAAI,CAAC,aAAa,EAC7B,IAAI,EAAC,YAAY,EACjB,KAAK,EAAE,IAAI,CAAC,KAAK,GACnB,EACJ;GACL;EAEO,aAAa,CAAC,KAAoB;IACtC,MAAM,QAAQ,GAAG,CAACC,YAAG,EAAEC,eAAM,EAAEC,cAAK,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IAC1D,MAAM,YAAY,GAAG;MACjBC,qBAAY;MACZC,wBAAe;MACfC,uBAAc;KACjB,CAAC,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;IAC1B,IAAI,QAAQ,IAAI,YAAY,EAAE;MAC1B,IAAI,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC;KAC3B;GACJ;EAEO,YAAY,CAAC,UAAiB,EAAE;IACpC,MAAM,cAAc,GAAG,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,gBAAgB,CAC/D,oBAAoB,CACvB,CAAC;IAEF,QACIN,0BACI,OAAO,EAAE,OAAO,CAAC,MAAM,GAAG,CAAC,EAC3B,WAAW,EAAE,IAAI,CAAC,QAAQ,EAC1B,kBAAkB,EAAE,IAAI,EACxB,cAAc,EAAE,EAAE,SAAS,EAAE,cAAc,EAAE,IAE7CA,gCACI,IAAI,EAAE,OAAO,CAAC,MAAM,GAAG,CAAC,EACxB,kBAAkB,EAAE,IAAI,CAAC,IAAI,EAC7B,KAAK,EAAE;QACH,sBAAsB,EAAE,MAAM;QAC9B,YAAY,EAAE,SAAS;QACvB,OAAO,EAAE,MAAM;OAClB,EACD,SAAS,EAAE,IAAI,CAAC,eAAe,IAE9B,OAAO,CACS,CACV,EACjB;GACL;;;;EAKO,qBAAqB;;;IAGzB,MAAM,OAAO,GACT,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,IAAI,QAAQ,CAAC,aAAa,CAAC;IACjE,MAAM,aAAa,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAC;IAClE,IACIO,gBAAY,CAAC,OAAsB,EAAE,IAAI,CAAC,IAAI,CAAC;MAC/CA,gBAAY,CAAC,OAAsB,EAAE,aAA4B,CAAC,EACpE;MACE,OAAO;KACV;IAED,IAAI,CAAC,eAAe,EAAE,CAAC;GAC1B;;;;;;EAOO,MAAM,eAAe,CAAC,KAAK;IAC/B,KAAK,CAAC,eAAe,EAAE,CAAC;IAExB,MAAM,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC;IAC3B,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;IAEvB,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC;;IAE5B,IAAI,KAAK,KAAK,EAAE,EAAE;MACd,IAAI,CAAC,eAAe,CAAC,KAAK,EAAE,CAAC;KAChC;GACJ;;;;;;EAkBO,gBAAgB,CACpB,KAAkD;;IAElD,KAAK,CAAC,eAAe,EAAE,CAAC;IACxB,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,KAAK,KAAK,CAAC,MAAM,EAAE;MAC5C,IAAI,QAAQ,GACR,KAAK,CAAC,MAAM,CAAC;MACjB,IAAI,IAAI,CAAC,QAAQ,EAAE;QACf,QAAQ,GAAG;UACP,GAAI,IAAI,CAAC,KAAsC;UAC/C,KAAK,CAAC,MAAM;SACf,CAAC;OACL;MAED,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;MAC3B,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;KACnB;IAED,IAAI,IAAI,CAAC,QAAQ,EAAE;MACf,MAAA,IAAI,CAAC,OAAO,0CAAE,QAAQ,CAAC,IAAI,CAAC,CAAC;KAChC;GACJ;;;;;;EAOO,sBAAsB,CAC1B,KAA6C;IAE7C,KAAK,CAAC,eAAe,EAAE,CAAC;IACxB,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE;MACf,OAAO;KACV;IAED,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IACrC,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;GACnB;;;;;EAMO,qBAAqB;IACzB,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC;IAC7B,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC;GAC/B;EAEO,YAAY,CAAC,KAA6C;IAC9D,KAAK,CAAC,eAAe,EAAE,CAAC;IAExB,IAAI,QAAQ,GAAG,IAAI,CAAC;IACpB,IAAI,IAAI,CAAC,QAAQ,EAAE;MACf,MAAM,KAAK,GAAG,KAAK,CAAC,MAAgB,CAAC;MACrC,QAAQ,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI;QACtB,OAAQ,IAAI,CAAC,KAAoB,CAAC,IAAI,CAAC,CAAC,IAAI;UACxC,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;UAEtC,OAAO,GAAG,OAAO,EAAE,KAAK,IAAI,CAAC,EAAE,CAAC;SACnC,CAAC,CAAC;OACN,CAAC,CAAC;KACN;IAED,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;GAC9B;EAEO,cAAc,CAAC,KAAoC;IACvD,KAAK,CAAC,eAAe,EAAE,CAAC;IACxB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC;GACxE;;;;;;;EAQO,kBAAkB,CAAC,KAAoB;IAC3C,MAAM,YAAY,GACd,CAAC,KAAK,CAAC,GAAG,KAAKN,YAAG,IAAI,KAAK,CAAC,OAAO,KAAKG,qBAAY;MACpD,CAAC,KAAK,CAAC,MAAM;MACb,CAAC,KAAK,CAAC,OAAO;MACd,CAAC,KAAK,CAAC,QAAQ,CAAC;IACpB,MAAM,IAAI,GACN,KAAK,CAAC,GAAG,KAAKI,iBAAQ,IAAI,KAAK,CAAC,OAAO,KAAKC,0BAAiB,CAAC;IAClE,MAAM,MAAM,GACR,KAAK,CAAC,GAAG,KAAKC,mBAAU,IAAI,KAAK,CAAC,OAAO,KAAKC,4BAAmB,CAAC;IAEtE,IAAI,CAAC,YAAY,IAAI,CAAC,IAAI,IAAI,CAAC,MAAM,EAAE;MACnC,OAAO;KACV;IAED,MAAM,IAAI,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC,QAAQ,aAAa,CAAC,CAAC;IACrE,IAAI,CAAC,IAAI,EAAE;MACP,OAAO;KACV;IAED,KAAK,CAAC,cAAc,EAAE,CAAC;IAEvB,IAAI,YAAY,IAAI,MAAM,EAAE;MACxB,MAAM,WAAW,GAAgB,IAAI,CAAC,UAAU,CAAC,aAAa,CAC1D,uCAAuC,CAC1C,CAAC;MACF,WAAW,CAAC,KAAK,EAAE,CAAC;MAEpB,OAAO;KACV;IAED,IAAI,IAAI,EAAE;MACN,MAAM,WAAW,GAAgB,IAAI,CAAC,UAAU,CAAC,aAAa,CAC1D,sCAAsC,CACzC,CAAC;MACF,WAAW,CAAC,KAAK,EAAE,CAAC;KACvB;GACJ;;;;;;EAOO,qBAAqB,CAAC,KAAoB;IAC9C,MAAM,QAAQ,GACV,KAAK,CAAC,GAAG,KAAKT,eAAM,IAAI,KAAK,CAAC,OAAO,KAAKG,wBAAe,CAAC;IAE9D,IAAI,QAAQ,EAAE;MACV,KAAK,CAAC,cAAc,EAAE,CAAC;MACvB,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;MACpB,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;KAC/B;GACJ;EAEO,kBAAkB,CAAC,KAAa,EAAE,MAAkB;IACxD,IAAI,KAAK,KAAK,IAAI,CAAC,SAAS,EAAE;MAC1B,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC;MACpB,IAAI,IAAI,CAAC,QAAQ,EAAE;QACf,MAAM,MAAM,GAAG,IAAI,CAAC,KAAmB,CAAC;QACxC,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,IAAI;UAC5B,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;SACjC,CAAC,CAAC;OACN;MAED,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;KACxB;GACJ;EAEO,eAAe;IACnB,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;MACvB,OAAO;KACV;IAED,IAAI,CAAC,eAAe,EAAE,CAAC;GAC1B;EAEO,eAAe;IACnB,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;IAC1B,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;IACpB,IAAI,CAAC,kBAAkB,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC;IAChC,IAAI,CAAC,eAAe,CAAC,MAAM,EAAE,CAAC;GACjC;;;;;;;;;;","names":["getIconName","getIconFillColor","createRandomString","debounce","h","TAB","ESCAPE","ENTER","TAB_KEY_CODE","ESCAPE_KEY_CODE","ENTER_KEY_CODE","isDescendant","ARROW_UP","ARROW_UP_KEY_CODE","ARROW_DOWN","ARROW_DOWN_KEY_CODE"],"sources":["./src/components/picker/picker.scss?tag=limel-picker&encapsulation=shadow","./src/components/picker/picker.tsx"],"sourcesContent":["// Note! The `--dropdown-z-index` property is used from `picker.tsx`.\n/**\n * @prop --dropdown-z-index: z-index of the dropdown menu.\n */\n\n:host {\n position: relative;\n display: block;\n}\n\n:host([hidden]) {\n display: none;\n}\n","import { Action } from '../collapsible-section/action';\nimport { ActionPosition, ActionScrollBehavior } from '../picker/actions.types';\nimport { Chip } from '../chip-set/chip.types';\nimport { ListItem } from '../list/list-item.types';\nimport { Searcher } from '../picker/searcher.types';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { isDescendant } from '../../util/dom';\nimport {\n ARROW_DOWN,\n ARROW_DOWN_KEY_CODE,\n ARROW_UP,\n ARROW_UP_KEY_CODE,\n ENTER,\n ENTER_KEY_CODE,\n ESCAPE,\n ESCAPE_KEY_CODE,\n TAB,\n TAB_KEY_CODE,\n} from '../../util/keycodes';\nimport { createRandomString } from '../../util/random-string';\nimport {\n LimelChipSetCustomEvent,\n LimelListCustomEvent,\n} from '../../components';\nimport { getIconFillColor, getIconName } from '../icon/get-icon-props';\nimport { PickerValue } from './value.types';\nimport { DebouncedFunc, debounce } from 'lodash-es';\n\nconst SEARCH_DEBOUNCE = 300;\nconst CHIP_SET_TAG_NAME = 'limel-chip-set';\n\n/**\n * @exampleComponent limel-example-picker-single\n * @exampleComponent limel-example-picker-multiple\n * @exampleComponent limel-example-picker-icons\n * @exampleComponent limel-example-picker-value-as-object\n * @exampleComponent limel-example-picker-empty-suggestions\n * @exampleComponent limel-example-picker-leading-icon\n * @exampleComponent limel-example-picker-static-actions\n * @exampleComponent limel-example-picker-composite\n */\n@Component({\n tag: 'limel-picker',\n shadow: true,\n styleUrl: 'picker.scss',\n})\nexport class Picker {\n /**\n * True if the picker should be disabled\n */\n @Prop()\n public disabled: boolean = false;\n\n /**\n * Set to `true` to disable adding and removing items,\n * but allow interaction with existing items.\n */\n @Prop({ reflect: true })\n public readonly: boolean = false;\n\n /**\n * Text to display for the input field of the picker\n */\n @Prop()\n public label: string;\n\n /**\n * Search label to display in the input field when searching\n */\n @Prop()\n public searchLabel: string;\n\n /**\n * Optional helper text to display below the input field when it has focus\n */\n @Prop({ reflect: true })\n public helperText: string;\n\n /**\n * Leading icon to show to the far left in the text field\n */\n @Prop()\n public leadingIcon: string;\n\n /**\n * A message to display when the search returned an empty result\n */\n @Prop()\n public emptyResultMessage: string;\n\n /**\n * True if the control requires a value\n */\n @Prop()\n public required: boolean = false;\n\n /**\n * Set to `true` to indicate that the current value of the input field is\n * invalid.\n */\n @Prop({ reflect: true })\n public invalid = false;\n\n /**\n * Currently selected value or values. Where the value can be an object.\n */\n @Prop()\n public value: ListItem<PickerValue> | Array<ListItem<PickerValue>>;\n\n /**\n * A search function that takes a search-string as an argument,\n * and returns a promise that will eventually be resolved with\n * an array of `ListItem`:s.\n *\n * See the docs for the type `Searcher` for type information on\n * the searcher function itself.\n */\n @Prop()\n public searcher: Searcher;\n\n /**\n * True if multiple values are allowed\n */\n @Prop()\n public multiple: boolean = false;\n\n /**\n * Sets delimiters between chips. Works only when `multiple` is `true`.\n */\n @Prop({ reflect: true })\n public delimiter: string = null;\n\n /**\n * Static actions that can be clicked by the user.\n */\n @Prop()\n public actions: Array<ListItem<Action>> = [];\n\n /**\n * Position of the custom static actions in the picker's results dropdown.\n * Can be set to `'top'` or `'bottom'`.\n */\n @Prop()\n public actionPosition: ActionPosition = 'bottom';\n\n /**\n * Scroll behavior of the custom static actions, when user scrolls\n * in the picker's results dropdown. Can be set to `'scroll'` which means\n * the action items will scroll together with the list, or `'sticky'` which\n * retains their position at the top or bottom of the drop down while\n * scrolling.\n */\n @Prop()\n public actionScrollBehavior: ActionScrollBehavior = 'sticky';\n\n /**\n * Whether badge icons should be used in the result list or not\n */\n @Prop({ reflect: true })\n public badgeIcons: boolean = false;\n\n /**\n * Fired when a new value has been selected from the picker\n */\n @Event()\n private change: EventEmitter<\n ListItem<PickerValue> | Array<ListItem<PickerValue>>\n >;\n\n /**\n * Fired when clicking on a selected value\n */\n @Event()\n private interact: EventEmitter<ListItem<PickerValue>>;\n\n /**\n * Emitted when the user selects an action.\n */\n @Event()\n private action: EventEmitter<Action>;\n\n @State()\n private items: Array<ListItem<number | string>>;\n\n @State()\n private textValue: string = '';\n\n @State()\n private loading: boolean = false;\n\n @State()\n private chips: Chip[] = [];\n\n @Element()\n private host: HTMLLimelPickerElement;\n\n // Should NOT be decorated with State(), since this\n // should not trigger a re-render by itself.\n private chipSetEditMode = false;\n\n private debouncedSearch: DebouncedFunc<(query: string) => Promise<void>>;\n private chipSet: HTMLLimelChipSetElement;\n private portalId: string;\n\n constructor() {\n this.handleTextInput = this.handleTextInput.bind(this);\n this.handleInputKeyDown = this.handleInputKeyDown.bind(this);\n this.handleDropdownKeyDown = this.handleDropdownKeyDown.bind(this);\n this.handleInputFieldFocus = this.handleInputFieldFocus.bind(this);\n this.handleChange = this.handleChange.bind(this);\n this.handleInteract = this.handleInteract.bind(this);\n this.handleListChange = this.handleListChange.bind(this);\n this.handleActionListChange = this.handleActionListChange.bind(this);\n this.handleStopEditAndBlur = this.handleStopEditAndBlur.bind(this);\n this.handleCloseMenu = this.handleCloseMenu.bind(this);\n this.onListKeyDown = this.onListKeyDown.bind(this);\n\n this.portalId = createRandomString();\n this.debouncedSearch = debounce(this.search, SEARCH_DEBOUNCE);\n }\n\n public componentWillLoad() {\n this.chips = this.createChips(this.value);\n }\n\n public componentDidLoad() {\n this.chipSet = this.host.shadowRoot.querySelector(CHIP_SET_TAG_NAME);\n }\n\n public async componentWillUpdate() {\n this.chipSetEditMode = false;\n if (this.chipSet) {\n this.chipSetEditMode = await this.chipSet.getEditMode();\n }\n }\n\n public render() {\n const props: {\n maxItems?: number;\n } = {};\n\n if (!this.multiple) {\n props.maxItems = 1;\n }\n\n return [\n <limel-chip-set\n type=\"input\"\n inputType=\"search\"\n label={this.label}\n helperText={this.helperText}\n leadingIcon={this.leadingIcon}\n value={this.chips}\n disabled={this.disabled}\n invalid={this.invalid}\n delimiter={this.renderDelimiter()}\n readonly={this.readonly}\n required={this.required}\n searchLabel={this.searchLabel}\n onInput={this.handleTextInput}\n onKeyDown={this.handleInputKeyDown}\n onChange={this.handleChange}\n onInteract={this.handleInteract}\n onStartEdit={this.handleInputFieldFocus}\n onStopEdit={this.handleStopEditAndBlur}\n emptyInputOnBlur={false}\n clearAllButton={this.multiple && !this.chipSetEditMode}\n {...props}\n />,\n this.renderDropdown(),\n ];\n }\n\n @Watch('value')\n protected onChangeValue() {\n this.chips = this.createChips(this.value);\n }\n\n private renderDelimiter() {\n if (this.multiple) {\n return this.delimiter;\n }\n\n return null;\n }\n\n private getValueId = (item: ListItem) => {\n const value = item.value;\n if (!!value && typeof value === 'object') {\n return value.id;\n }\n\n return value;\n };\n\n private createChips = (value: ListItem | ListItem[]): Chip[] => {\n if (!value) {\n return [];\n }\n\n if (this.multiple) {\n const listItems: ListItem[] = value as ListItem[];\n\n return listItems.map(this.createChip);\n }\n\n const listItem: ListItem = value as ListItem;\n\n return [this.createChip(listItem)];\n };\n\n private createChip = (listItem: ListItem): Chip => {\n const name = getIconName(listItem.icon);\n const color = getIconFillColor(listItem.icon, listItem.iconColor);\n const valueId = this.getValueId(listItem);\n\n return {\n id: `${valueId}`,\n text: listItem.text,\n removable: true,\n icon: name ? { name: name, color: color } : undefined,\n value: listItem,\n };\n };\n\n /**\n * Renders the dropdown with the items to pick from, or a spinner if the picker\n * is waiting for items to be received\n *\n * @returns picker dropdown\n */\n private renderDropdown() {\n const dropDownContent = this.getDropdownContent();\n\n const content = [];\n\n if (this.shouldShowDropDownContent()) {\n const actionContent = this.getActionContent();\n if (this.actionPosition === 'top') {\n content.push(actionContent);\n }\n\n if (dropDownContent) {\n content.push(dropDownContent);\n }\n\n if (this.actionPosition === 'bottom') {\n content.push(actionContent);\n }\n }\n\n return this.renderPortal(content);\n }\n\n private getActionContent() {\n const actionCount = this.actions?.length ?? 0;\n if (actionCount === 0) {\n return null;\n }\n\n return [\n <limel-list\n class={{\n 'static-actions-list': true,\n 'is-on-top': this.actionPosition === 'top',\n 'is-at-bottom': this.actionPosition === 'bottom',\n 'has-position-sticky':\n this.actionScrollBehavior === 'sticky',\n }}\n badgeIcons={true}\n type={'selectable'}\n onChange={this.handleActionListChange}\n items={this.actions.map(this.removeUnusedPropertiesOnAction)}\n />,\n ];\n }\n\n private removeUnusedPropertiesOnAction(\n action: ListItem<Action>,\n ): ListItem<Action> {\n return {\n ...action,\n actions: [],\n };\n }\n\n private shouldShowDropDownContent() {\n if (this.isFull()) {\n return false;\n }\n\n return !!this.chipSetEditMode;\n }\n\n private getDropdownContent() {\n if (!this.shouldShowDropDownContent()) {\n return;\n }\n\n if (this.loading) {\n return this.renderSpinner();\n }\n\n if (!this.items || !this.items.length) {\n return this.renderEmptyMessage();\n }\n\n return this.renderListResult();\n }\n\n /**\n * Returns true if the picker is \"full\"\n * The picker is considered to be full if it has a value and only one is allowed\n *\n * @returns true if the picker is full\n */\n private isFull(): boolean {\n return !this.multiple && !!this.value;\n }\n\n private renderSpinner() {\n return (\n <div\n style={{\n width: '100%',\n display: 'flex',\n 'align-items': 'center',\n 'justify-content': 'center',\n padding: '1rem 0',\n }}\n >\n <limel-spinner limeBranded={false} />\n </div>\n );\n }\n\n private renderEmptyMessage() {\n if (!this.emptyResultMessage) {\n return;\n }\n\n const style = {\n color: 'rgb(var(--contrast-1100))',\n 'text-align': 'center',\n margin: '0.5rem 1rem',\n };\n\n return <p style={style}>{this.emptyResultMessage}</p>;\n }\n\n private renderListResult() {\n return (\n <limel-list\n badgeIcons={this.badgeIcons}\n onChange={this.handleListChange}\n onKeyDown={this.onListKeyDown}\n type=\"selectable\"\n items={this.items}\n />\n );\n }\n\n private onListKeyDown(event: KeyboardEvent) {\n const keyFound = [TAB, ESCAPE, ENTER].includes(event.key);\n const keyCodeFound = [\n TAB_KEY_CODE,\n ESCAPE_KEY_CODE,\n ENTER_KEY_CODE,\n ].includes(event.keyCode);\n if (keyFound || keyCodeFound) {\n this.chipSet.setFocus();\n }\n }\n\n private renderPortal(content: any[] = []) {\n const dropdownZIndex = getComputedStyle(this.host).getPropertyValue(\n '--dropdown-z-index',\n );\n\n return (\n <limel-portal\n visible={content.length > 0}\n containerId={this.portalId}\n inheritParentWidth={true}\n containerStyle={{ 'z-index': dropdownZIndex }}\n >\n <limel-menu-surface\n open={content.length > 0}\n allowClicksElement={this.host}\n style={{\n '--mdc-menu-min-width': '100%',\n 'max-height': 'inherit',\n display: 'flex',\n }}\n onDismiss={this.handleCloseMenu}\n >\n {content}\n </limel-menu-surface>\n </limel-portal>\n );\n }\n\n /**\n * Check if a descendant still has focus. If not, reset text value and search result.\n */\n private handleStopEditAndBlur() {\n // In browsers where shadow DOM is not supported activeElement on shadowRoot will return null\n // However, document.activeElement will return the actual focused element instead of the outermost shadow host\n const element =\n this.host.shadowRoot.activeElement || document.activeElement;\n const portalElement = document.querySelector(`#${this.portalId}`);\n if (\n isDescendant(element as HTMLElement, this.host) ||\n isDescendant(element as HTMLElement, portalElement as HTMLElement)\n ) {\n return;\n }\n\n this.clearInputField();\n }\n\n /**\n * Input handler for the input field\n *\n * @param event - event\n */\n private async handleTextInput(event) {\n event.stopPropagation();\n\n const query = event.detail;\n this.textValue = query;\n\n this.debouncedSearch(query);\n // If the search-query is an empty string, bypass debouncing.\n if (query === '') {\n this.debouncedSearch.flush();\n }\n }\n\n private search = async (query: string) => {\n const timeoutId = setTimeout(() => {\n this.loading = true;\n });\n const result = (await this.searcher(this.textValue)) as Array<\n ListItem<PickerValue>\n >;\n clearTimeout(timeoutId);\n this.handleSearchResult(query, result);\n };\n\n /**\n * Change handler for the list\n *\n * @param event - event\n */\n private handleListChange(\n event: LimelListCustomEvent<ListItem<PickerValue>>,\n ) {\n event.stopPropagation();\n if (!this.value || this.value !== event.detail) {\n let newValue: ListItem<PickerValue> | Array<ListItem<PickerValue>> =\n event.detail;\n if (this.multiple) {\n newValue = [\n ...(this.value as Array<ListItem<PickerValue>>),\n event.detail,\n ];\n }\n\n this.change.emit(newValue);\n this.items = [];\n }\n\n if (this.multiple) {\n this.chipSet?.setFocus(true);\n }\n }\n\n /**\n * Change handler for the list\n *\n * @param event - event\n */\n private handleActionListChange(\n event: LimelListCustomEvent<ListItem<Action>>,\n ) {\n event.stopPropagation();\n if (!event.detail) {\n return;\n }\n\n this.action.emit(event.detail.value);\n this.items = [];\n }\n\n /**\n * Focus handler for the chip set\n * Prevent focus if the picker has a value and does not support multiple values\n */\n private handleInputFieldFocus() {\n const query = this.textValue;\n this.debouncedSearch(query);\n }\n\n private handleChange(event: LimelChipSetCustomEvent<Chip | Chip[]>) {\n event.stopPropagation();\n\n let newValue = null;\n if (this.multiple) {\n const chips = event.detail as Chip[];\n newValue = chips.map((chip) => {\n return (this.value as ListItem[]).find((item) => {\n const valueId = this.getValueId(item);\n\n return `${valueId}` === chip.id;\n });\n });\n }\n\n this.change.emit(newValue);\n }\n\n private handleInteract(event: LimelChipSetCustomEvent<Chip>) {\n event.stopPropagation();\n this.interact.emit(event.detail ? event.detail.value : event.detail);\n }\n\n /**\n * Key handler for the input field\n * Will change focus to the first/last item in the dropdown list to enable selection with the keyboard\n *\n * @param event - event\n */\n private handleInputKeyDown(event: KeyboardEvent) {\n const isForwardTab =\n (event.key === TAB || event.keyCode === TAB_KEY_CODE) &&\n !event.altKey &&\n !event.metaKey &&\n !event.shiftKey;\n const isUp =\n event.key === ARROW_UP || event.keyCode === ARROW_UP_KEY_CODE;\n const isDown =\n event.key === ARROW_DOWN || event.keyCode === ARROW_DOWN_KEY_CODE;\n\n if (!isForwardTab && !isUp && !isDown) {\n return;\n }\n\n const list = document.querySelector(` #${this.portalId} limel-list`);\n if (!list) {\n return;\n }\n\n event.preventDefault();\n\n if (isForwardTab || isDown) {\n const listElement: HTMLElement = list.shadowRoot.querySelector(\n '.mdc-deprecated-list-item:first-child',\n );\n listElement.focus();\n\n return;\n }\n\n if (isUp) {\n const listElement: HTMLElement = list.shadowRoot.querySelector(\n '.mdc-deprecated-list-item:last-child',\n );\n listElement.focus();\n }\n }\n\n /**\n * Key handler for the dropdown\n *\n * @param event - event\n */\n private handleDropdownKeyDown(event: KeyboardEvent) {\n const isEscape =\n event.key === ESCAPE || event.keyCode === ESCAPE_KEY_CODE;\n\n if (isEscape) {\n event.preventDefault();\n this.textValue = '';\n this.chipSet.setFocus(true);\n }\n }\n\n private handleSearchResult(query: string, result: ListItem[]) {\n if (query === this.textValue) {\n this.items = result;\n if (this.multiple) {\n const values = this.value as ListItem[];\n this.items = result.filter((item) => {\n return !values.includes(item);\n });\n }\n\n this.loading = false;\n }\n }\n\n private handleCloseMenu() {\n if (this.items.length > 0) {\n return;\n }\n\n this.clearInputField();\n }\n\n private clearInputField() {\n this.chipSet.emptyInput();\n this.textValue = '';\n this.handleSearchResult('', []);\n this.debouncedSearch.cancel();\n }\n}\n"],"version":3}