@limetech/lime-elements 37.1.0-next.38 → 37.1.0-next.39

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 (11) hide show
  1. package/dist/cjs/limel-list_2.cjs.entry.js +19 -12
  2. package/dist/cjs/limel-list_2.cjs.entry.js.map +1 -1
  3. package/dist/collection/components/list/list.js +19 -12
  4. package/dist/collection/components/list/list.js.map +1 -1
  5. package/dist/esm/limel-list_2.entry.js +19 -12
  6. package/dist/esm/limel-list_2.entry.js.map +1 -1
  7. package/dist/lime-elements/lime-elements.esm.js +1 -1
  8. package/dist/lime-elements/{p-251955cf.entry.js → p-172385f4.entry.js} +2 -2
  9. package/dist/lime-elements/p-172385f4.entry.js.map +1 -0
  10. package/package.json +3 -3
  11. package/dist/lime-elements/p-251955cf.entry.js.map +0 -1
package/dist/cjs/limel-list_2.cjs.entry.js CHANGED
@@ -246,6 +246,10 @@ const List = class {
246
246
  this.setupListeners();
247
247
  };
248
248
  this.setupList = () => {
249
+ if (this.mdcList) {
250
+ this.teardown();
251
+ this.mdcList = null;
252
+ }
249
253
  const element = this.element.shadowRoot.querySelector('.mdc-deprecated-list');
250
254
  if (!element) {
251
255
  return;
@@ -354,21 +358,24 @@ const List = class {
354
358
  if (!this.mdcList) {
355
359
  return;
356
360
  }
357
- const listItems = this.items.filter(this.isListItem);
358
- if (this.multiple) {
359
- this.mdcList.selectedIndex = listItems
360
- .filter((item) => item.selected)
361
- .map((item) => listItems.indexOf(item));
362
- }
363
- else {
364
- const selectedIndex = listItems.findIndex((item) => item.selected);
365
- if (selectedIndex === -1) {
366
- this.mdcList.initializeListType();
361
+ setTimeout(() => {
362
+ this.setup();
363
+ const listItems = this.items.filter(this.isListItem);
364
+ if (this.multiple) {
365
+ this.mdcList.selectedIndex = listItems
366
+ .filter((item) => item.selected)
367
+ .map((item) => listItems.indexOf(item));
367
368
  }
368
369
  else {
369
- this.mdcList.selectedIndex = selectedIndex;
370
+ const selectedIndex = listItems.findIndex((item) => item.selected);
371
+ if (selectedIndex === -1) {
372
+ this.mdcList.initializeListType();
373
+ }
374
+ else {
375
+ this.mdcList.selectedIndex = selectedIndex;
376
+ }
370
377
  }
371
- }
378
+ }, 0);
372
379
  }
373
380
  get element() { return index.getElement(this); }
374
381
  static get watchers() { return {
package/dist/cjs/limel-list_2.cjs.entry.js.map CHANGED
@@ -1 +1 @@
1
- {"file":"limel-list.limel-menu-surface.entry.cjs.js","mappings":"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","names":["h","index","CheckboxTemplate","listStrings","MDCList","Host","MDCMenuSurface","Corner","isDescendant","ESCAPE","ESCAPE_KEY_CODE","TAB","TAB_KEY_CODE"],"sources":["./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":["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, ListSeparator, MenuItem } from '../../interface';\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';\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 * @param {Array<ListItem | ListSeparator>} items the items of the list, including any `ListSeparator`:s\n * @returns {number} 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 * @param {ListItem | ListSeparator} item the item to render\n * @param {number} index the index the item had in the `items` array\n * @returns {HTMLElement} 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 {item.icon ? this.renderIcon(this.config, item) : null}\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 * @param {ListItem} item the list item\n * @returns {HTMLElement | string} 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 * @param {ListRendererConfig} config the config object, passed on from the `renderListItem` function\n * @param {ListItem} item the list item\n * @returns {HTMLElement} the icon element\n */\n private renderIcon = (config: ListRendererConfig, item: ListItem) => {\n const style: any = {};\n if (item.iconColor) {\n if (config.badgeIcons) {\n style['--icon-background-color'] = item.iconColor;\n } else {\n style.color = item.iconColor;\n }\n }\n\n return (\n <limel-icon\n badge={config.badgeIcons}\n class=\"mdc-deprecated-list-item__graphic\"\n name={item.icon}\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-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\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) -\n var(--list-right-padding)\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 .mdc-deprecated-list-item__primary-text {\n margin-bottom: functions.pxToRem(4);\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, ListItem, ListSeparator, ListType } from '../../interface';\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 }\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 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 }\n\n private setup = () => {\n this.setupList();\n\n this.setupListeners();\n };\n\n private setupList = () => {\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.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","@use '@material/menu-surface';\n@use '@material/elevation';\n@use '@material/menu';\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 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.path || [];\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}
1
+ {"file":"limel-list.limel-menu-surface.entry.cjs.js","mappings":"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","names":["h","index","CheckboxTemplate","listStrings","MDCList","Host","MDCMenuSurface","Corner","isDescendant","ESCAPE","ESCAPE_KEY_CODE","TAB","TAB_KEY_CODE"],"sources":["./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":["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, ListSeparator, MenuItem } from '../../interface';\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';\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 * @param {Array<ListItem | ListSeparator>} items the items of the list, including any `ListSeparator`:s\n * @returns {number} 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 * @param {ListItem | ListSeparator} item the item to render\n * @param {number} index the index the item had in the `items` array\n * @returns {HTMLElement} 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 {item.icon ? this.renderIcon(this.config, item) : null}\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 * @param {ListItem} item the list item\n * @returns {HTMLElement | string} 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 * @param {ListRendererConfig} config the config object, passed on from the `renderListItem` function\n * @param {ListItem} item the list item\n * @returns {HTMLElement} the icon element\n */\n private renderIcon = (config: ListRendererConfig, item: ListItem) => {\n const style: any = {};\n if (item.iconColor) {\n if (config.badgeIcons) {\n style['--icon-background-color'] = item.iconColor;\n } else {\n style.color = item.iconColor;\n }\n }\n\n return (\n <limel-icon\n badge={config.badgeIcons}\n class=\"mdc-deprecated-list-item__graphic\"\n name={item.icon}\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-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\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) -\n var(--list-right-padding)\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 .mdc-deprecated-list-item__primary-text {\n margin-bottom: functions.pxToRem(4);\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, ListItem, ListSeparator, ListType } from '../../interface';\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 }\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.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","@use '@material/menu-surface';\n@use '@material/elevation';\n@use '@material/menu';\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 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.path || [];\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}
package/dist/collection/components/list/list.js CHANGED
@@ -28,6 +28,10 @@ export class List {
28
28
  this.setupListeners();
29
29
  };
30
30
  this.setupList = () => {
31
+ if (this.mdcList) {
32
+ this.teardown();
33
+ this.mdcList = null;
34
+ }
31
35
  const element = this.element.shadowRoot.querySelector('.mdc-deprecated-list');
32
36
  if (!element) {
33
37
  return;
@@ -136,21 +140,24 @@ export class List {
136
140
  if (!this.mdcList) {
137
141
  return;
138
142
  }
139
- const listItems = this.items.filter(this.isListItem);
140
- if (this.multiple) {
141
- this.mdcList.selectedIndex = listItems
142
- .filter((item) => item.selected)
143
- .map((item) => listItems.indexOf(item));
144
- }
145
- else {
146
- const selectedIndex = listItems.findIndex((item) => item.selected);
147
- if (selectedIndex === -1) {
148
- this.mdcList.initializeListType();
143
+ setTimeout(() => {
144
+ this.setup();
145
+ const listItems = this.items.filter(this.isListItem);
146
+ if (this.multiple) {
147
+ this.mdcList.selectedIndex = listItems
148
+ .filter((item) => item.selected)
149
+ .map((item) => listItems.indexOf(item));
149
150
  }
150
151
  else {
151
- this.mdcList.selectedIndex = selectedIndex;
152
+ const selectedIndex = listItems.findIndex((item) => item.selected);
153
+ if (selectedIndex === -1) {
154
+ this.mdcList.initializeListType();
155
+ }
156
+ else {
157
+ this.mdcList.selectedIndex = selectedIndex;
158
+ }
152
159
  }
153
- }
160
+ }, 0);
154
161
  }
155
162
  static get is() { return "limel-list"; }
156
163
  static get encapsulation() { return "shadow"; }
package/dist/collection/components/list/list.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"list.js","sourceRoot":"","sources":["../../../src/components/list/list.tsx"],"names":[],"mappings":"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","sourcesContent":["import { IconSize, ListItem, ListSeparator, ListType } from '../../interface';\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 }\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 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 }\n\n private setup = () => {\n this.setupList();\n\n this.setupListeners();\n };\n\n private setupList = () => {\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.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"]}
1
+ {"version":3,"file":"list.js","sourceRoot":"","sources":["../../../src/components/list/list.tsx"],"names":[],"mappings":"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","sourcesContent":["import { IconSize, ListItem, ListSeparator, ListType } from '../../interface';\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 }\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.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"]}
package/dist/esm/limel-list_2.entry.js CHANGED
@@ -242,6 +242,10 @@ const List = class {
242
242
  this.setupListeners();
243
243
  };
244
244
  this.setupList = () => {
245
+ if (this.mdcList) {
246
+ this.teardown();
247
+ this.mdcList = null;
248
+ }
245
249
  const element = this.element.shadowRoot.querySelector('.mdc-deprecated-list');
246
250
  if (!element) {
247
251
  return;
@@ -350,21 +354,24 @@ const List = class {
350
354
  if (!this.mdcList) {
351
355
  return;
352
356
  }
353
- const listItems = this.items.filter(this.isListItem);
354
- if (this.multiple) {
355
- this.mdcList.selectedIndex = listItems
356
- .filter((item) => item.selected)
357
- .map((item) => listItems.indexOf(item));
358
- }
359
- else {
360
- const selectedIndex = listItems.findIndex((item) => item.selected);
361
- if (selectedIndex === -1) {
362
- this.mdcList.initializeListType();
357
+ setTimeout(() => {
358
+ this.setup();
359
+ const listItems = this.items.filter(this.isListItem);
360
+ if (this.multiple) {
361
+ this.mdcList.selectedIndex = listItems
362
+ .filter((item) => item.selected)
363
+ .map((item) => listItems.indexOf(item));
363
364
  }
364
365
  else {
365
- this.mdcList.selectedIndex = selectedIndex;
366
+ const selectedIndex = listItems.findIndex((item) => item.selected);
367
+ if (selectedIndex === -1) {
368
+ this.mdcList.initializeListType();
369
+ }
370
+ else {
371
+ this.mdcList.selectedIndex = selectedIndex;
372
+ }
366
373
  }
367
- }
374
+ }, 0);
368
375
  }
369
376
  get element() { return getElement(this); }
370
377
  static get watchers() { return {