npm - @limetech/lime-elements - Versions diffs - 37.40.1 → 37.41.1 - Mend

@limetech/lime-elements 37.40.1 → 37.41.1

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

Files changed (156) hide show

package/dist/cjs/limel-dynamic-label_2.cjs.entry.js ADDED Viewed

@@ -0,0 +1,91 @@
+'use strict';
+Object.defineProperty(exports, '__esModule', { value: true });
+const index = require('./index-d1052409.js');
+const getIconProps = require('./get-icon-props-50be7440.js');
+const dynamicLabelCss = "@charset \"UTF-8\";*{box-sizing:border-box;min-width:0}:host(limel-dynamic-label){--limel-dynamic-label-min-height:1.75rem;display:flex;gap:0.5rem;align-items:center;border-radius:0.5rem;min-width:0}limel-icon{--limel-icon-svg-margin:0.125rem;border-radius:0.25rem;flex-shrink:0;width:var(--limel-dynamic-label-min-height);color:rgb(var(--contrast-900))}span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;flex-grow:1;font-size:0.8125rem;color:var(--mdc-theme-on-surface)}";
+const DynamicLabel = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.value = undefined;
+    this.defaultLabel = {};
+    this.labels = [];
+  }
+  render() {
+    var _a, _b;
+    const label = this.labels.find((l) => l.value === this.value);
+    return [
+      this.renderIcon((_a = label === null || label === void 0 ? void 0 : label.icon) !== null && _a !== void 0 ? _a : this.defaultLabel.icon),
+      this.renderLabel((_b = label === null || label === void 0 ? void 0 : label.text) !== null && _b !== void 0 ? _b : this.defaultLabel.text),
+    ];
+  }
+  renderIcon(icon) {
+    const iconName = getIconProps.getIconName(icon);
+    if (!iconName) {
+      return;
+    }
+    let iconColor;
+    let iconBackgroundColor;
+    if (typeof icon === 'object') {
+      iconColor = icon.color;
+      iconBackgroundColor = icon.backgroundColor;
+    }
+    const iconProps = {
+      role: 'presentation',
+      name: iconName,
+      style: {
+        color: iconColor,
+        'background-color': iconBackgroundColor,
+      },
+    };
+    return index.h("limel-icon", Object.assign({}, iconProps));
+  }
+  renderLabel(label = '') {
+    return index.h("span", null, label);
+  }
+};
+DynamicLabel.style = dynamicLabelCss;
+const helperLineCss = ":host(limel-helper-line){transition:opacity 0.2s ease;box-sizing:border-box;display:grid;min-width:0;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-size:0.6875rem;line-height:normal;color:rgb(var(--contrast-1200))}div{display:flex;justify-content:space-between;gap:0.75rem;overflow:hidden;padding:0 1rem}:host(limel-helper-line.invalid) .helper-text{color:var(--mdc-theme-error)}.counter{flex-shrink:0;margin-left:auto}.helper-text,.counter{padding-top:0.125rem}:host(limel-helper-line){transition:grid-template-rows var(--limel-h-l-grid-template-rows-transition-speed, 0.46s) cubic-bezier(1, 0.09, 0, 0.89);grid-template-rows:var(--limel-h-l-grid-template-rows, 1fr)}:host(limel-helper-line.hide){--limel-h-l-grid-template-rows-transition-speed:0.3s;--limel-h-l-grid-template-rows:0fr}";
+const HelperLine = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.hasContent = () => {
+      return !!(this.maxLength > 0 ||
+        (this.helperText && this.helperText.length > 0));
+    };
+    this.renderHelperText = () => {
+      if (!this.helperText) {
+        return;
+      }
+      return (index.h("span", { class: "helper-text", id: this.helperTextId }, this.helperText));
+    };
+    this.renderCharacterCounter = () => {
+      const counter = `${this.length} / ${this.maxLength}`;
+      if (!this.maxLength) {
+        return;
+      }
+      return index.h("span", { class: "counter" }, counter);
+    };
+    this.helperText = undefined;
+    this.length = undefined;
+    this.maxLength = undefined;
+    this.invalid = false;
+    this.helperTextId = undefined;
+  }
+  render() {
+    return (index.h(index.Host, { tabIndex: -1, class: {
+        invalid: this.invalid,
+      }, style: !this.hasContent() ? { display: 'none' } : {}, "aria-hidden": !this.hasContent() }, index.h("div", null, this.renderHelperText(), this.renderCharacterCounter())));
+  }
+};
+HelperLine.style = helperLineCss;
+exports.limel_dynamic_label = DynamicLabel;
+exports.limel_helper_line = HelperLine;
+//# sourceMappingURL=limel-dynamic-label_2.cjs.entry.js.map

package/dist/cjs/limel-dynamic-label_2.cjs.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"limel-dynamic-label.limel-helper-line.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,eAAe,GAAG,qeAAqe;;MC2Bhf,YAAY;;;;wBAgBuB,EAAE;kBAQrB,EAAE;;EAEpB,MAAM;;IACT,MAAM,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,KAAK,KAAK,IAAI,CAAC,KAAK,CAAC,CAAC;IAE9D,OAAO;MACH,IAAI,CAAC,UAAU,CAAC,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,IAAI,mCAAI,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC;MACtD,IAAI,CAAC,WAAW,CAAC,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,IAAI,mCAAI,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC;KAC1D,CAAC;GACL;EAEO,UAAU,CAAC,IAAoB;IACnC,MAAM,QAAQ,GAAGA,wBAAW,CAAC,IAAI,CAAC,CAAC;IACnC,IAAI,CAAC,QAAQ,EAAE;MACX,OAAO;KACV;IAED,IAAI,SAA6B,CAAC;IAClC,IAAI,mBAAuC,CAAC;IAE5C,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE;MAC1B,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC;MACvB,mBAAmB,GAAG,IAAI,CAAC,eAAe,CAAC;KAC9C;IAED,MAAM,SAAS,GAAG;MACd,IAAI,EAAE,cAAc;MACpB,IAAI,EAAE,QAAQ;MACd,KAAK,EAAE;QACH,KAAK,EAAE,SAAS;QAChB,kBAAkB,EAAE,mBAAmB;OAC1C;KACJ,CAAC;IAEF,OAAOC,wCAAgB,SAAS,EAAI,CAAC;GACxC;EAEO,WAAW,CAAC,QAAgB,EAAE;IAClC,OAAOA,sBAAO,KAAK,CAAQ,CAAC;GAC/B;;;;AC1FL,MAAM,aAAa,GAAG,+yBAA+yB;;MC2BxzB,UAAU;;;IAqDX,eAAU,GAAG;MACjB,OAAO,CAAC,EACJ,IAAI,CAAC,SAAS,GAAG,CAAC;SACjB,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,CAAC,CAClD,CAAC;KACL,CAAC;IAEM,qBAAgB,GAAG;MACvB,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE;QAClB,OAAO;OACV;MAED,QACIA,kBAAM,KAAK,EAAC,aAAa,EAAC,EAAE,EAAE,IAAI,CAAC,YAAY,IAC1C,IAAI,CAAC,UAAU,CACb,EACT;KACL,CAAC;IAEM,2BAAsB,GAAG;MAC7B,MAAM,OAAO,GAAG,GAAG,IAAI,CAAC,MAAM,MAAM,IAAI,CAAC,SAAS,EAAE,CAAC;MAErD,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE;QACjB,OAAO;OACV;MAED,OAAOA,kBAAM,KAAK,EAAC,SAAS,IAAE,OAAO,CAAQ,CAAC;KACjD,CAAC;;;;mBArDyB,KAAK;;;EAQzB,MAAM;IACT,QACIA,QAACC,UAAI,IACD,QAAQ,EAAE,CAAC,CAAC,EACZ,KAAK,EAAE;QACH,OAAO,EAAE,IAAI,CAAC,OAAO;OACxB,EACD,KAAK,EAAE,CAAC,IAAI,CAAC,UAAU,EAAE,GAAG,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,EAAE,iBACvC,CAAC,IAAI,CAAC,UAAU,EAAE,IAE/BD,qBACK,IAAI,CAAC,gBAAgB,EAAE,EACvB,IAAI,CAAC,sBAAsB,EAAE,CAC5B,CACH,EACT;GACL;;;;;;;","names":["getIconName","h","Host"],"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"],"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"],"version":3}

package/dist/cjs/limel-file-viewer.cjs.entry.js CHANGED Viewed

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-d1052409.js');
-const translations = require('./translations-a384b596.js');
+const translations = require('./translations-a67fc927.js');
 function detectExtension(fileName, url) {
   const pathLike = fileName || url;

package/dist/cjs/limel-file.cjs.entry.js CHANGED Viewed

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-d1052409.js');
-const translations = require('./translations-a384b596.js');
+const translations = require('./translations-a67fc927.js');
 const fileMetadata = require('./file-metadata-f259bba5.js');
 require('./get-icon-props-50be7440.js');

package/dist/cjs/limel-flatpickr-adapter.cjs.entry.js CHANGED Viewed

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-d1052409.js');
-const translations = require('./translations-a384b596.js');
+const translations = require('./translations-a67fc927.js');
 const _commonjsHelpers = require('./_commonjsHelpers-0c557e26.js');
 require('./sv-1f9a8edc.js');
 const moment = require('./moment-6b5ef9b3.js');

package/dist/cjs/limel-picker.cjs.entry.js CHANGED Viewed

@@ -3,11 +3,10 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-d1052409.js');
-const dom = require('./dom-81eaa633.js');
+const dom = require('./dom-ee8ee17d.js');
 const keycodes = require('./keycodes-3949f425.js');
 const randomString = require('./random-string-c8445652.js');
 const getIconProps = require('./get-icon-props-50be7440.js');
-const debounce = require('./debounce-2e5f4b7e.js');
 require('./isObject-e28b7997.js');
 require('./toNumber-062ea29c.js');
 require('./isSymbol-d22b2798.js');
@@ -97,7 +96,7 @@ const Picker = class {
     this.handleCloseMenu = this.handleCloseMenu.bind(this);
     this.onListKeyDown = this.onListKeyDown.bind(this);
     this.portalId = randomString.createRandomString();
-    this.debouncedSearch = debounce.debounce(this.search, SEARCH_DEBOUNCE);
+    this.debouncedSearch = dom.debounce(this.search, SEARCH_DEBOUNCE);
   }
   componentWillLoad() {
     this.chips = this.createChips(this.value);

package/dist/cjs/limel-picker.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"limel-picker.entry.cjs.js","mappings":"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","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":"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","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}

package/dist/cjs/{limel-portal_3.cjs.entry.js → limel-portal.cjs.entry.js} RENAMED Viewed

@@ -3,7 +3,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-d1052409.js');
-const randomString = require('./random-string-c8445652.js');
 var top = 'top';
 var bottom = 'bottom';
@@ -267,7 +266,7 @@ function contains(parent, child) {
   return false;
 }
-function getComputedStyle$1(element) {
+function getComputedStyle(element) {
   return getWindow(element).getComputedStyle(element);
 }
@@ -300,7 +299,7 @@ function getParentNode(element) {
 function getTrueOffsetParent(element) {
   if (!isHTMLElement(element) || // https://github.com/popperjs/popper-core/issues/837
-  getComputedStyle$1(element).position === 'fixed') {
+  getComputedStyle(element).position === 'fixed') {
     return null;
   }
@@ -315,7 +314,7 @@ function getContainingBlock(element) {
   if (isIE && isHTMLElement(element)) {
     // In IE 9, 10 and 11 fixed elements containing block is always established by the viewport
-    var elementCss = getComputedStyle$1(element);
+    var elementCss = getComputedStyle(element);
     if (elementCss.position === 'fixed') {
       return null;
@@ -329,7 +328,7 @@ function getContainingBlock(element) {
   }
   while (isHTMLElement(currentNode) && ['html', 'body'].indexOf(getNodeName(currentNode)) < 0) {
-    var css = getComputedStyle$1(currentNode); // This is non-exhaustive but covers the most common CSS properties that
+    var css = getComputedStyle(currentNode); // This is non-exhaustive but covers the most common CSS properties that
     // create a containing block.
     // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
@@ -349,11 +348,11 @@ function getOffsetParent(element) {
   var window = getWindow(element);
   var offsetParent = getTrueOffsetParent(element);
-  while (offsetParent && isTableElement(offsetParent) && getComputedStyle$1(offsetParent).position === 'static') {
+  while (offsetParent && isTableElement(offsetParent) && getComputedStyle(offsetParent).position === 'static') {
     offsetParent = getTrueOffsetParent(offsetParent);
   }
-  if (offsetParent && (getNodeName(offsetParent) === 'html' || getNodeName(offsetParent) === 'body' && getComputedStyle$1(offsetParent).position === 'static')) {
+  if (offsetParent && (getNodeName(offsetParent) === 'html' || getNodeName(offsetParent) === 'body' && getComputedStyle(offsetParent).position === 'static')) {
     return window;
   }
@@ -538,7 +537,7 @@ function mapToStyles(_ref2) {
     if (offsetParent === getWindow(popper)) {
       offsetParent = getDocumentElement(popper);
-      if (getComputedStyle$1(offsetParent).position !== 'static' && position === 'absolute') {
+      if (getComputedStyle(offsetParent).position !== 'static' && position === 'absolute') {
         heightProp = 'scrollHeight';
         widthProp = 'scrollWidth';
       }
@@ -770,7 +769,7 @@ function getDocumentRect(element) {
   var x = -winScroll.scrollLeft + getWindowScrollBarX(element);
   var y = -winScroll.scrollTop;
-  if (getComputedStyle$1(body || html).direction === 'rtl') {
+  if (getComputedStyle(body || html).direction === 'rtl') {
     x += max(html.clientWidth, body ? body.clientWidth : 0) - width;
   }
@@ -784,7 +783,7 @@ function getDocumentRect(element) {
 function isScrollParent(element) {
   // Firefox wants us to check `-x` and `-y` variations as well
-  var _getComputedStyle = getComputedStyle$1(element),
+  var _getComputedStyle = getComputedStyle(element),
       overflow = _getComputedStyle.overflow,
       overflowX = _getComputedStyle.overflowX,
       overflowY = _getComputedStyle.overflowY;
@@ -859,7 +858,7 @@ function getClientRectFromMixedType(element, clippingParent, strategy) {
 function getClippingParents(element) {
   var clippingParents = listScrollParents(getParentNode(element));
-  var canEscapeClipping = ['absolute', 'fixed'].indexOf(getComputedStyle$1(element).position) >= 0;
+  var canEscapeClipping = ['absolute', 'fixed'].indexOf(getComputedStyle(element).position) >= 0;
   var clipperElement = canEscapeClipping && isHTMLElement(element) ? getOffsetParent(element) : element;
   if (!isElement(clipperElement)) {
@@ -2008,125 +2007,6 @@ const Portal = class {
 };
 Portal.style = portalCss;
-function getOwnerElement(id, startingPoint) {
-  let element = startingPoint;
-  do {
-    element = element.parentNode;
-  } while (element &&
-    element.nodeType !== Node.DOCUMENT_FRAGMENT_NODE &&
-    element.nodeType !== Node.DOCUMENT_NODE);
-  return element === null || element === void 0 ? void 0 : element.getElementById(id);
-}
-const DEFAULT_DELAY_FOR_SHOWING = 500;
-class TooltipTimer {
-  constructor(showCallback, hideCallback, delayForShowing = DEFAULT_DELAY_FOR_SHOWING) {
-    this.timerHandle = null;
-    this.showCallback = showCallback;
-    this.hideCallback = hideCallback;
-    this.delayForShowing = delayForShowing;
-  }
-  showAfterDelay() {
-    if (!this.timerHandle) {
-      this.timerHandle = setTimeout(this.showCallback, this.delayForShowing);
-    }
-  }
-  hide() {
-    clearTimeout(this.timerHandle);
-    this.timerHandle = null;
-    this.hideCallback();
-  }
-}
-const tooltipCss = ":host(limel-tooltip){position:absolute;pointer-events:none}";
-const DEFAULT_MAX_LENGTH = 50;
-const Tooltip = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.showTooltip = () => {
-      this.tooltipTimer.showAfterDelay();
-    };
-    this.hideTooltip = () => {
-      this.tooltipTimer.hide();
-    };
-    this.elementId = undefined;
-    this.label = undefined;
-    this.helperLabel = undefined;
-    this.maxlength = DEFAULT_MAX_LENGTH;
-    this.openDirection = 'top';
-    this.open = undefined;
-    this.portalId = randomString.createRandomString();
-    this.tooltipId = randomString.createRandomString();
-    this.tooltipTimer = new TooltipTimer(() => (this.open = true), () => (this.open = false));
-  }
-  connectedCallback() {
-    this.ownerElement = getOwnerElement(this.elementId, this.host);
-    this.setOwnerAriaLabel();
-    this.addListeners();
-  }
-  disconnectedCallback() {
-    this.removeListeners();
-  }
-  render() {
-    const tooltipZIndex = getComputedStyle(this.host).getPropertyValue('--tooltip-z-index');
-    return (index.h("div", { class: "trigger-anchor" }, index.h("limel-portal", { openDirection: this.openDirection, visible: this.open, containerId: this.portalId, containerStyle: {
-        'z-index': tooltipZIndex,
-        'pointer-events': 'none',
-      }, anchor: this.ownerElement }, index.h("limel-tooltip-content", { label: this.label, helperLabel: this.helperLabel, maxlength: this.maxlength, role: "tooltip", "aria-hidden": !this.open, id: this.tooltipId }))));
-  }
-  setOwnerAriaLabel() {
-    var _a;
-    (_a = this.ownerElement) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-describedby', this.tooltipId);
-  }
-  addListeners() {
-    var _a, _b, _c, _d;
-    (_a = this.ownerElement) === null || _a === void 0 ? void 0 : _a.addEventListener('mouseover', this.showTooltip);
-    (_b = this.ownerElement) === null || _b === void 0 ? void 0 : _b.addEventListener('mouseout', this.hideTooltip);
-    (_c = this.ownerElement) === null || _c === void 0 ? void 0 : _c.addEventListener('focus', this.showTooltip);
-    (_d = this.ownerElement) === null || _d === void 0 ? void 0 : _d.addEventListener('blur', this.hideTooltip);
-  }
-  removeListeners() {
-    var _a, _b, _c, _d;
-    (_a = this.ownerElement) === null || _a === void 0 ? void 0 : _a.removeEventListener('mouseover', this.showTooltip);
-    (_b = this.ownerElement) === null || _b === void 0 ? void 0 : _b.removeEventListener('mouseout', this.hideTooltip);
-    (_c = this.ownerElement) === null || _c === void 0 ? void 0 : _c.removeEventListener('focus', this.showTooltip);
-    (_d = this.ownerElement) === null || _d === void 0 ? void 0 : _d.removeEventListener('blur', this.hideTooltip);
-  }
-  get host() { return index.getElement(this); }
-};
-Tooltip.style = tooltipCss;
-const tooltipContentCss = ":host(limel-tooltip-content){animation:display-tooltip 0.2s ease;display:flex;border-radius:0.25rem;padding:0.25rem 0.5rem;background-color:rgb(var(--contrast-1300));box-shadow:var(--shadow-depth-16)}text{font-size:0.875rem;line-height:1.25;display:flex;column-gap:1rem}text.has-column-layout{display:table-cell;width:fit-content;max-width:min(var(--tooltip-max-width-of-text), 80vw)}text.has-column-layout .label{padding-bottom:0.5rem}text.has-column-layout .helper-label{padding-bottom:0.25rem}.label{color:rgb(var(--contrast-200))}.helper-label{color:rgb(var(--contrast-800))}.helper-label:empty{display:none}@keyframes display-tooltip{0%{opacity:0;transform:translate3d(0, 0, 0) scale(0.94)}100%{opacity:1;transform:translate3d(0, 0, 0) scale(1)}}";
-const TooltipContent = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.label = undefined;
-    this.helperLabel = undefined;
-    this.maxlength = undefined;
-  }
-  render() {
-    let isLabelsTextLong = false;
-    if (this.helperLabel && this.maxlength) {
-      isLabelsTextLong =
-        this.label.length + this.helperLabel.length > this.maxlength;
-    }
-    const props = {};
-    if (this.maxlength) {
-      props.style = {
-        '--tooltip-max-width-of-text': `${this.maxlength}` + 'ch',
-      };
-    }
-    return [
-      index.h("text", Object.assign({ class: { 'has-column-layout': isLabelsTextLong } }, props), index.h("div", { class: "label" }, this.label), index.h("div", { class: "helper-label" }, this.helperLabel)),
-    ];
-  }
-};
-TooltipContent.style = tooltipContentCss;
 exports.limel_portal = Portal;
-exports.limel_tooltip = Tooltip;
-exports.limel_tooltip_content = TooltipContent;
-//# sourceMappingURL=limel-portal_3.cjs.entry.js.map
+//# sourceMappingURL=limel-portal.cjs.entry.js.map