npm - @limetech/lime-elements - Versions diffs - 37.72.3 → 37.74.0 - Mend

@limetech/lime-elements 37.72.3 → 37.74.0

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

Files changed (45) hide show

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

	@@ -1 +1 @@
1	- {"file":"limel-shortcut.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,WAAW,GAAG,+rEAA+rE;;MCuBtsE,QAAQ;;;IAiDT,gBAAW,GAAG;MAClB,IAAI,IAAI,CAAC,KAAK,EAAE;QACZ,OAAOA,iCAAkB,MAAM,IAAE,IAAI,CAAC,KAAK,CAAQ,CAAC;OACvD;KACJ,CAAC;IAEM,iBAAY,GAAG;;MACnB,IAAI,IAAI,CAAC,KAAK,KAAI,MAAA,IAAI,CAAC,IAAI,0CAAE,KAAK,CAAA,EAAE;QAChC,OAAO,IAAI,CAAC,KAAK,GAAG,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC;OAC9C;MAED,IAAI,IAAI,CAAC,KAAK,EAAE;QACZ,OAAO,IAAI,CAAC,KAAK,CAAC;OACrB;MAED,IAAI,MAAA,IAAI,CAAC,IAAI,0CAAE,KAAK,EAAE;QAClB,OAAO,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC;OAC1B;MAED,OAAO,SAAS,CAAC;KACpB,CAAC;IAEM,uBAAkB,GAAG;MACzB,IAAI,IAAI,CAAC,KAAK,EAAE;QACZ,OAAOA,yBAAa,KAAK,EAAE,IAAI,CAAC,KAAK,GAAI,CAAC;OAC7C;KACJ,CAAC;;iBAhEsB,IAAI;oBAMA,KAAK;;;;EAe1B,MAAM;;IACT,OAAO;MACHA,gCACmB,IAAI,CAAC,QAAQ,EAC5B,IAAI,EAAE,MAAA,IAAI,CAAC,IAAI,0CAAE,IAAI,EACrB,MAAM,EAAE,MAAA,IAAI,CAAC,IAAI,0CAAE,MAAM,EACzB,QAAQ,EAAC,GAAG,gBACA,IAAI,CAAC,YAAY,EAAE,EAC/B,KAAK,EAAE,MAAA,IAAI,CAAC,IAAI,0CAAE,KAAK,IAEvBA,wBAAY,IAAI,EAAE,IAAI,CAAC,IAAI,GAAI,CAC/B;MACJ,IAAI,CAAC,WAAW,EAAE;MAClB,IAAI,CAAC,kBAAkB,EAAE;KAC5B,CAAC;GACL;;;;;;","names":["h"],"sources":["./src/components/shortcut/shortcut.scss?tag=limel-shortcut&encapsulation=shadow","./src/components/shortcut/shortcut.tsx"],"sourcesContent":["/*\n @prop --shortcut-border-radius: defines the radius of corners of the shortcut. Defaults to `1rem`\n* @prop --shortcut-icon-color: defines the fill color of the shortcut icon. Defaults to `--contrast-1000`\n* @prop --shortcut-label-color: defines the color of the shortcut label. Defaults to `--contrast-1100`\n* @prop --shortcut-background-color: defines the backgrounds color of the shortcut icon. Defaults to `--lime-elevated-surface-background-color`\n* @prop --shortcut-badge-text-color: Text color of the notification badge. Defaults to `--color-white`\n* @prop --shortcut-badge-background-color: Background color of the notification badge. Defaults to `--color-red-default`\n/\n\n@use '../../style/mixins';\n\n:host(limel-shortcut) {\n --badge-text-color: var(\n --shortcut-badge-text-color,\n rgb(var(--color-white))\n );\n --badge-background-color: var(\n --shortcut-badge-background-color,\n rgb(var(--color-red-default))\n );\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n row-gap: 0.0625rem; //1px\n\n {\n box-sizing: border-box;\n }\n}\n\n:host(limel-shortcut[disabled]) {\n a {\n opacity: 0.5;\n box-shadow: unset;\n cursor: not-allowed;\n }\n}\n\na {\n all: unset;\n @include mixins.is-elevated-clickable(\n $background-color~~:\n~~ var(\n --shortcut-background-color,\n var(--lime-elevated-surface-background-color)\n ),\n $background-color--hovered~~:\n~~ var(\n --shortcut-background-color,\n var(--lime-elevated-surface-background-color)\n )\n );\n @include mixins.visualize-keyboard-focus;\n text-align: center;\n\n height: calc(100% - 1rem);\n width: calc(100% - 1rem);\n padding: 0.5rem;\n\n border-radius: var(--shortcut-border-radius, 1rem);\n}\n\nlimel-icon {\n display: flex;\n height: 100%;\n width: 100%;\n justify-content: center;\n color: var(--shortcut-icon-color, rgb(var(--contrast-1000)));\n border-radius: var(--shortcut-border-radius, 1rem);\n}\n\nspan {\n @include mixins.truncate-text;\n width: 100%;\n color: var(--shortcut-label-color, rgb(var(--contrast-1100)));\n font-size: 0.75rem;\n text-align: center;\n}\n\nlimel-badge {\n position: absolute;\n top: -0.25rem;\n right: 0.125rem;\n}\n","import { Component, Prop, h } from '@stencil/core';\nimport { Link } from '../../global/shared-types/link.types';\n\n/*\n This component can be used on places such as a start page or a dashboard.\n * Clicking on the component should navigate the user to a new screen,\n * to which you need to provide a URL, by specifying an `href` for the `link` property.\n \n By default, this navigation will happen within the same browser tab.\n * However, it is possible to override that behavior, by specifying a `target`\n * for the `link` property\n \n @exampleComponent limel-example-shortcut\n * @exampleComponent limel-example-shortcut-notification\n * @exampleComponent limel-example-shortcut-styling\n * @exampleComponent limel-example-shortcut-with-click-handler\n /\n\n@Component({\n tag: 'limel-shortcut',\n shadow: true,\n styleUrl: 'shortcut.scss',\n})\nexport class Shortcut {\n /\n Name of icon for the shortcut.\n /\n @Prop({ reflect: true })\n public icon: string;\n\n /\n The text to show below the shortcut. Long label will be truncated.\n /\n @Prop({ reflect: true })\n public label?: string = null;\n\n /\n Set to `true` if shortcut is disabled.\n /\n @Prop({ reflect: true })\n public disabled?: boolean = false;\n\n /\n If specified, will display a notification badge\n * on the shortcut.\n /\n @Prop({ reflect: true })\n public badge?: number \| string;\n\n /\n If supplied, the shortcut will be a clickable link.\n */\n @Prop()\n public link?: Link;\n\n public render() {\n return [\n <a\n aria-disabled={this.disabled}\n href={this.link?.href}\n target={this.link?.target}\n tabindex=\"0\"\n aria-label={this.getAriaLabel()}\n title={this.link?.title}\n >\n <limel-icon name={this.icon} />\n </a>,\n this.renderLabel(),\n this.renderNotification(),\n ];\n }\n\n private renderLabel = () => {\n if (this.label) {\n return <span aria-hidden=\"true\">{this.label}</span>;\n }\n };\n\n private getAriaLabel = () => {\n if (this.label && this.link?.title) {\n return this.label + '. ' + this.link.title;\n }\n\n if (this.label) {\n return this.label;\n }\n\n if (this.link?.title) {\n return this.link.title;\n }\n\n return undefined;\n };\n\n private renderNotification = () => {\n if (this.badge) {\n return <limel-badge label={this.badge} />;\n }\n };\n}\n"],"version":3}
1	+ {"file":"limel-shortcut.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,WAAW,GAAG,+rEAA+rE;;MCuBtsE,QAAQ;;;IAiDT,gBAAW,GAAG;MAClB,IAAI,IAAI,CAAC,KAAK,EAAE;QACZ,OAAOA,iCAAkB,MAAM,IAAE,IAAI,CAAC,KAAK,CAAQ,CAAC;OACvD;KACJ,CAAC;IAEM,iBAAY,GAAG;;MACnB,IAAI,IAAI,CAAC,KAAK,KAAI,MAAA,IAAI,CAAC,IAAI,0CAAE,KAAK,CAAA,EAAE;QAChC,OAAO,IAAI,CAAC,KAAK,GAAG,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC;OAC9C;MAED,IAAI,IAAI,CAAC,KAAK,EAAE;QACZ,OAAO,IAAI,CAAC,KAAK,CAAC;OACrB;MAED,IAAI,MAAA,IAAI,CAAC,IAAI,0CAAE,KAAK,EAAE;QAClB,OAAO,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC;OAC1B;MAED,OAAO,SAAS,CAAC;KACpB,CAAC;IAEM,uBAAkB,GAAG;MACzB,IAAI,IAAI,CAAC,KAAK,EAAE;QACZ,OAAOA,yBAAa,KAAK,EAAE,IAAI,CAAC,KAAK,GAAI,CAAC;OAC7C;KACJ,CAAC;;iBAhEsB,IAAI;oBAMA,KAAK;;;;EAe1B,MAAM;;IACT,OAAO;MACHA,gCACmB,IAAI,CAAC,QAAQ,EAC5B,IAAI,EAAE,MAAA,IAAI,CAAC,IAAI,0CAAE,IAAI,EACrB,MAAM,EAAE,MAAA,IAAI,CAAC,IAAI,0CAAE,MAAM,EACzB,QAAQ,EAAC,GAAG,gBACA,IAAI,CAAC,YAAY,EAAE,EAC/B,KAAK,EAAE,MAAA,IAAI,CAAC,IAAI,0CAAE,KAAK,IAEvBA,wBAAY,IAAI,EAAE,IAAI,CAAC,IAAI,GAAI,CAC/B;MACJ,IAAI,CAAC,WAAW,EAAE;MAClB,IAAI,CAAC,kBAAkB,EAAE;KAC5B,CAAC;GACL;;;;;;","names":["h"],"sources":["./src/components/shortcut/shortcut.scss?tag=limel-shortcut&encapsulation=shadow","./src/components/shortcut/shortcut.tsx"],"sourcesContent":["/*\n @prop --shortcut-border-radius: defines the radius of corners of the shortcut. Defaults to `1rem`\n* @prop --shortcut-icon-color: defines the fill color of the shortcut icon. Defaults to `--contrast-1000`\n* @prop --shortcut-label-color: defines the color of the shortcut label. Defaults to `--contrast-1100`\n* @prop --shortcut-background-color: defines the backgrounds color of the shortcut icon. Defaults to `--lime-elevated-surface-background-color`\n* @prop --shortcut-badge-text-color: Text color of the notification badge. Defaults to `--color-white`\n* @prop --shortcut-badge-background-color: Background color of the notification badge. Defaults to `--color-red-default`\n/\n\n@use '../../style/mixins';\n\n:host(limel-shortcut) {\n --badge-text-color: var(\n --shortcut-badge-text-color,\n rgb(var(--color-white))\n );\n --badge-background-color: var(\n --shortcut-badge-background-color,\n rgb(var(--color-red-default))\n );\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n row-gap: 0.0625rem; //1px\n\n {\n box-sizing: border-box;\n }\n}\n\n:host(limel-shortcut[disabled]) {\n a {\n opacity: 0.5;\n box-shadow: unset;\n cursor: not-allowed;\n }\n}\n\na {\n all: unset;\n @include mixins.is-elevated-clickable(\n $background-color: var(\n --shortcut-background-color,\n var(--lime-elevated-surface-background-color)\n ),\n $background-color--hovered: var(\n --shortcut-background-color,\n var(--lime-elevated-surface-background-color)\n )\n );\n @include mixins.visualize-keyboard-focus;\n text-align: center;\n\n height: calc(100% - 1rem);\n width: calc(100% - 1rem);\n padding: 0.5rem;\n\n border-radius: var(--shortcut-border-radius, 1rem);\n}\n\nlimel-icon {\n display: flex;\n height: 100%;\n width: 100%;\n justify-content: center;\n color: var(--shortcut-icon-color, rgb(var(--contrast-1000)));\n border-radius: var(--shortcut-border-radius, 1rem);\n}\n\nspan {\n @include mixins.truncate-text;\n width: 100%;\n color: var(--shortcut-label-color, rgb(var(--contrast-1100)));\n font-size: 0.75rem;\n text-align: center;\n}\n\nlimel-badge {\n position: absolute;\n top: -0.25rem;\n right: 0.125rem;\n}\n","import { Component, Prop, h } from '@stencil/core';\nimport { Link } from '../../global/shared-types/link.types';\n\n/*\n This component can be used on places such as a start page or a dashboard.\n * Clicking on the component should navigate the user to a new screen,\n * to which you need to provide a URL, by specifying an `href` for the `link` property.\n \n By default, this navigation will happen within the same browser tab.\n * However, it is possible to override that behavior, by specifying a `target`\n * for the `link` property\n \n @exampleComponent limel-example-shortcut\n * @exampleComponent limel-example-shortcut-notification\n * @exampleComponent limel-example-shortcut-styling\n * @exampleComponent limel-example-shortcut-with-click-handler\n /\n\n@Component({\n tag: 'limel-shortcut',\n shadow: true,\n styleUrl: 'shortcut.scss',\n})\nexport class Shortcut {\n /\n Name of icon for the shortcut.\n /\n @Prop({ reflect: true })\n public icon: string;\n\n /\n The text to show below the shortcut. Long label will be truncated.\n /\n @Prop({ reflect: true })\n public label?: string = null;\n\n /\n Set to `true` if shortcut is disabled.\n /\n @Prop({ reflect: true })\n public disabled?: boolean = false;\n\n /\n If specified, will display a notification badge\n * on the shortcut.\n /\n @Prop({ reflect: true })\n public badge?: number \| string;\n\n /\n If supplied, the shortcut will be a clickable link.\n */\n @Prop()\n public link?: Link;\n\n public render() {\n return [\n <a\n aria-disabled={this.disabled}\n href={this.link?.href}\n target={this.link?.target}\n tabindex=\"0\"\n aria-label={this.getAriaLabel()}\n title={this.link?.title}\n >\n <limel-icon name={this.icon} />\n </a>,\n this.renderLabel(),\n this.renderNotification(),\n ];\n }\n\n private renderLabel = () => {\n if (this.label) {\n return <span aria-hidden=\"true\">{this.label}</span>;\n }\n };\n\n private getAriaLabel = () => {\n if (this.label && this.link?.title) {\n return this.label + '. ' + this.link.title;\n }\n\n if (this.label) {\n return this.label;\n }\n\n if (this.link?.title) {\n return this.link.title;\n }\n\n return undefined;\n };\n\n private renderNotification = () => {\n if (this.badge) {\n return <limel-badge label={this.badge} />;\n }\n };\n}\n"],"version":3}

package/dist/collection/components/list/list.js CHANGED Viewed

@@ -72,15 +72,19 @@ export class List {
       const selectedItem = listItems.find((item) => {
         return !!item.selected;
       });
+      let interactedItem;
       if (selectedItem) {
         if (this.type !== 'radio') {
           this.mdcList.selectedIndex = -1;
         }
-        this.change.emit(Object.assign(Object.assign({}, selectedItem), { selected: false }));
+        interactedItem = Object.assign(Object.assign({}, selectedItem), { selected: false });
+        this.change.emit(interactedItem);
       }
       if (listItems[index] !== selectedItem) {
-        this.change.emit(Object.assign(Object.assign({}, listItems[index]), { selected: true }));
+        interactedItem = Object.assign(Object.assign({}, listItems[index]), { selected: true });
+        this.change.emit(interactedItem);
       }
+      this.interact.emit(interactedItem);
     };
     this.handleMultiSelect = (index) => {
       const listItems = this.items.filter(this.isListItem);
@@ -101,6 +105,7 @@ export class List {
         return Object.assign(Object.assign({}, item), { selected: true });
       });
       this.change.emit(selectedItems);
+      this.interact.emit(Object.assign({}, selectedItems[index]));
     };
     this.isListItem = (item) => {
       return !('separator' in item);
@@ -335,6 +340,26 @@ export class List {
             }
           }
         }
+      }, {
+        "method": "interact",
+        "name": "interact",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Fires when a user interacts with an item in the list (e.g., click,\nkeyboard select)."
+        },
+        "complexType": {
+          "original": "ListItem",
+          "resolved": "ListItem<any>",
+          "references": {
+            "ListItem": {
+              "location": "import",
+              "path": "./list-item.types"
+            }
+          }
+        }
       }];
   }
   static get elementRef() { return "element"; }

package/dist/collection/components/list/list.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"list.js","sourceRoot":"","sources":["../../../src/components/list/list.tsx"],"names":[],"mappings":"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","sourcesContent":["import { IconSize } from '../icon/icon.types';\nimport { ListItem, ListSeparator } from './list-item.types';\nimport { ListType } from './list.types';\nimport { MDCList, MDCListActionEvent } from '@material/list';\nimport { strings as listStrings } from '@material/list/constants';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { ListRenderer } from './list-renderer';\nimport { ListRendererConfig } from './list-renderer-config';\n\nconst { ACTION_EVENT } = listStrings;\n\n/*\n @exampleComponent limel-example-list\n * @exampleComponent limel-example-list-secondary\n * @exampleComponent limel-example-list-separator\n * @exampleComponent limel-example-list-selectable\n * @exampleComponent limel-example-list-icons\n * @exampleComponent limel-example-list-badge-icons\n * @exampleComponent limel-example-list-checkbox\n * @exampleComponent limel-example-list-checkbox-icons\n * @exampleComponent limel-example-list-radio-button\n * @exampleComponent limel-example-list-radio-button-icons\n * @exampleComponent limel-example-list-action\n * @exampleComponent limel-example-list-striped\n * @exampleComponent limel-example-list-badge-icons-with-multiple-lines\n * @exampleComponent limel-example-list-grid\n * @exampleComponent limel-example-list-primary-component\n /\n@Component({\n tag: 'limel-list',\n shadow: { delegatesFocus: true },\n styleUrl: 'list.scss',\n})\nexport class List {\n /\n List of items to display\n /\n @Prop()\n public items: Array<ListItem \| ListSeparator>;\n\n /\n Set to `true` if the list should display larger icons with a background\n /\n @Prop()\n public badgeIcons: boolean;\n\n /\n Size of the icons in the list\n /\n @Prop()\n public iconSize: IconSize = 'small';\n\n /\n The type of the list, omit to get a regular list. Available types are:\n * `selectable`: regular list with single selection.\n * `radio`: radio button list with single selection.\n * `checkbox`: checkbox list with multiple selection.\n /\n @Prop()\n public type: ListType;\n\n /\n By default, lists will display 3 lines of text, and then truncate the rest.\n * Consumers can increase or decrease this number by specifying\n * `maxLinesSecondaryText`. If consumer enters zero or negative\n * numbers we default to 1; and if they type decimals we round up.\n /\n // eslint-disable-next-line no-magic-numbers\n @Prop() maxLinesSecondaryText: number = 3;\n\n @Element()\n private element: HTMLLimelListElement;\n\n private config: ListRendererConfig;\n private listRenderer = new ListRenderer();\n private mdcList: MDCList;\n private multiple: boolean;\n private selectable: boolean;\n\n /\n Fired when a new value has been selected from the list.\n * Only fired if `type` is set to `selectable`, `radio` or `checkbox`.\n /\n @Event()\n private change: EventEmitter<ListItem \| ListItem[]>;\n\n /\n Fired when an action has been selected from the action menu of a list item\n /\n @Event()\n protected select: EventEmitter<ListItem \| ListItem[]>;\n\n public connectedCallback() {\n this.setup();\n }\n\n public disconnectedCallback() {\n this.teardown();\n }\n\n public componentDidLoad() {\n this.setup();\n this.triggerIconColorWarning();\n }\n\n public render() {\n this.config = {\n badgeIcons: this.badgeIcons,\n type: this.type,\n iconSize: this.iconSize,\n };\n let maxLinesSecondaryText = +this.maxLinesSecondaryText?.toFixed();\n if (this.maxLinesSecondaryText < 1) {\n maxLinesSecondaryText = 1;\n }\n\n const html = this.listRenderer.render(this.items, this.config);\n\n return (\n <Host\n style={{\n '--maxLinesSecondaryText': `${maxLinesSecondaryText}`,\n }}\n >\n {html}\n </Host>\n );\n }\n\n @Watch('type')\n protected handleType() {\n this.setupListeners();\n }\n\n @Watch('items')\n protected itemsChanged() {\n if (!this.mdcList) {\n return;\n }\n\n setTimeout(() => {\n this.setup();\n\n const listItems = this.items.filter(this.isListItem);\n\n if (this.multiple) {\n this.mdcList.selectedIndex = listItems\n .filter((item: ListItem) => item.selected)\n .map((item: ListItem) => listItems.indexOf(item));\n } else {\n const selectedIndex = listItems.findIndex(\n (item: ListItem) => item.selected,\n );\n\n if (selectedIndex === -1) {\n this.mdcList.initializeListType();\n } else {\n this.mdcList.selectedIndex = selectedIndex;\n }\n }\n }, 0);\n }\n\n private setup = () => {\n this.setupList();\n\n this.setupListeners();\n };\n\n private setupList = () => {\n if (this.mdcList) {\n this.teardown();\n this.mdcList = null;\n }\n\n const element = this.element.shadowRoot.querySelector(\n '.mdc-deprecated-list',\n );\n if (!element) {\n return;\n }\n\n this.mdcList = new MDCList(element);\n this.mdcList.hasTypeahead = true;\n };\n\n private setupListeners = () => {\n if (!this.mdcList) {\n return;\n }\n\n this.mdcList.unlisten(ACTION_EVENT, this.handleAction);\n\n this.selectable = ['selectable', 'radio', 'checkbox'].includes(\n this.type,\n );\n this.multiple = this.type === 'checkbox';\n\n if (!this.selectable) {\n return;\n }\n\n this.mdcList.listen(ACTION_EVENT, this.handleAction);\n this.mdcList.singleSelection = !this.multiple;\n };\n\n private teardown = () => {\n this.mdcList?.unlisten(ACTION_EVENT, this.handleAction);\n this.mdcList?.destroy();\n };\n\n private handleAction = (event: MDCListActionEvent) => {\n if (!this.multiple) {\n this.handleSingleSelect(event.detail.index);\n\n return;\n }\n\n this.handleMultiSelect(event.detail.index);\n };\n\n private handleSingleSelect = (index: number) => {\n const listItems = this.items.filter(this.isListItem) as ListItem[];\n if (listItems[index].disabled) {\n return;\n }\n\n const selectedItem: ListItem = listItems.find((item: ListItem) => {\n return !!item.selected;\n });\n\n if (selectedItem) {\n if (this.type !== 'radio') {\n this.mdcList.selectedIndex = -1;\n }\n\n this.change.emit({ ...selectedItem, selected: false });\n }\n\n if (listItems[index] !== selectedItem) {\n this.change.emit({ ...listItems[index], selected: true });\n }\n };\n\n private handleMultiSelect = (index: number) => {\n const listItems = this.items.filter(this.isListItem) as ListItem[];\n if (listItems[index].disabled) {\n return;\n }\n\n const selectedItems: ListItem[] = listItems\n .filter((item: ListItem, listIndex: number) => {\n if (listIndex === index) {\n // This is the item that was selected or deselected,\n // so we negate its previous selection status.\n return !item.selected;\n }\n\n // This is an item that didn't change, so we keep its selection status.\n return item.selected;\n })\n .map((item: ListItem) => {\n return { ...item, selected: true };\n });\n\n this.change.emit(selectedItems);\n };\n\n private isListItem = (item: ListItem): boolean => {\n return !('separator' in item);\n };\n\n private triggerIconColorWarning() {\n if (this.items?.some((item) => 'iconColor' in item)) {\n / eslint-disable-next-line no-console */\n console.warn(\n \"The `iconColor` prop is deprecated now! Use the new `Icon` interface and instead of `iconColor: 'color-name'` write `icon {name: 'icon-name', color: 'color-name'}`.\",\n );\n }\n }\n}\n"]}
1	+ {"version":3,"file":"list.js","sourceRoot":"","sources":["../../../src/components/list/list.tsx"],"names":[],"mappings":"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","sourcesContent":["import { IconSize } from '../icon/icon.types';\nimport { ListItem, ListSeparator } from './list-item.types';\nimport { ListType } from './list.types';\nimport { MDCList, MDCListActionEvent } from '@material/list';\nimport { strings as listStrings } from '@material/list/constants';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { ListRenderer } from './list-renderer';\nimport { ListRendererConfig } from './list-renderer-config';\n\nconst { ACTION_EVENT } = listStrings;\n\n/*\n @exampleComponent limel-example-list\n * @exampleComponent limel-example-list-secondary\n * @exampleComponent limel-example-list-separator\n * @exampleComponent limel-example-list-selectable\n * @exampleComponent limel-example-list-icons\n * @exampleComponent limel-example-list-badge-icons\n * @exampleComponent limel-example-list-checkbox\n * @exampleComponent limel-example-list-checkbox-icons\n * @exampleComponent limel-example-list-radio-button\n * @exampleComponent limel-example-list-radio-button-icons\n * @exampleComponent limel-example-list-action\n * @exampleComponent limel-example-list-striped\n * @exampleComponent limel-example-list-badge-icons-with-multiple-lines\n * @exampleComponent limel-example-list-grid\n * @exampleComponent limel-example-list-primary-component\n /\n@Component({\n tag: 'limel-list',\n shadow: { delegatesFocus: 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 /\n Fires when a user interacts with an item in the list (e.g., click,\n * keyboard select).\n /\n @Event()\n interact: EventEmitter<ListItem>;\n\n public connectedCallback() {\n this.setup();\n }\n\n public disconnectedCallback() {\n this.teardown();\n }\n\n public componentDidLoad() {\n this.setup();\n this.triggerIconColorWarning();\n }\n\n public render() {\n this.config = {\n badgeIcons: this.badgeIcons,\n type: this.type,\n iconSize: this.iconSize,\n };\n let maxLinesSecondaryText = +this.maxLinesSecondaryText?.toFixed();\n if (this.maxLinesSecondaryText < 1) {\n maxLinesSecondaryText = 1;\n }\n\n const html = this.listRenderer.render(this.items, this.config);\n\n return (\n <Host\n style={{\n '--maxLinesSecondaryText': `${maxLinesSecondaryText}`,\n }}\n >\n {html}\n </Host>\n );\n }\n\n @Watch('type')\n protected handleType() {\n this.setupListeners();\n }\n\n @Watch('items')\n protected itemsChanged() {\n if (!this.mdcList) {\n return;\n }\n\n setTimeout(() => {\n this.setup();\n\n const listItems = this.items.filter(this.isListItem);\n\n if (this.multiple) {\n this.mdcList.selectedIndex = listItems\n .filter((item: ListItem) => item.selected)\n .map((item: ListItem) => listItems.indexOf(item));\n } else {\n const selectedIndex = listItems.findIndex(\n (item: ListItem) => item.selected,\n );\n\n if (selectedIndex === -1) {\n this.mdcList.initializeListType();\n } else {\n this.mdcList.selectedIndex = selectedIndex;\n }\n }\n }, 0);\n }\n\n private setup = () => {\n this.setupList();\n\n this.setupListeners();\n };\n\n private setupList = () => {\n if (this.mdcList) {\n this.teardown();\n this.mdcList = null;\n }\n\n const element = this.element.shadowRoot.querySelector(\n '.mdc-deprecated-list',\n );\n if (!element) {\n return;\n }\n\n this.mdcList = new MDCList(element);\n this.mdcList.hasTypeahead = true;\n };\n\n private setupListeners = () => {\n if (!this.mdcList) {\n return;\n }\n\n this.mdcList.unlisten(ACTION_EVENT, this.handleAction);\n\n this.selectable = ['selectable', 'radio', 'checkbox'].includes(\n this.type,\n );\n this.multiple = this.type === 'checkbox';\n\n if (!this.selectable) {\n return;\n }\n\n this.mdcList.listen(ACTION_EVENT, this.handleAction);\n this.mdcList.singleSelection = !this.multiple;\n };\n\n private teardown = () => {\n this.mdcList?.unlisten(ACTION_EVENT, this.handleAction);\n this.mdcList?.destroy();\n };\n\n private handleAction = (event: MDCListActionEvent) => {\n if (!this.multiple) {\n this.handleSingleSelect(event.detail.index);\n\n return;\n }\n\n this.handleMultiSelect(event.detail.index);\n };\n\n private handleSingleSelect = (index: number) => {\n const listItems = this.items.filter(this.isListItem) as ListItem[];\n if (listItems[index].disabled) {\n return;\n }\n\n const selectedItem: ListItem = listItems.find((item: ListItem) => {\n return !!item.selected;\n });\n\n let interactedItem: ListItem;\n\n if (selectedItem) {\n if (this.type !== 'radio') {\n this.mdcList.selectedIndex = -1;\n }\n\n interactedItem = { ...selectedItem, selected: false };\n this.change.emit(interactedItem);\n }\n\n if (listItems[index] !== selectedItem) {\n interactedItem = { ...listItems[index], selected: true };\n this.change.emit(interactedItem);\n }\n\n this.interact.emit(interactedItem);\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 this.interact.emit({ ...selectedItems[index] });\n };\n\n private isListItem = (item: ListItem): boolean => {\n return !('separator' in item);\n };\n\n private triggerIconColorWarning() {\n if (this.items?.some((item) => 'iconColor' in item)) {\n / eslint-disable-next-line no-console */\n console.warn(\n \"The `iconColor` prop is deprecated now! Use the new `Icon` interface and instead of `iconColor: 'color-name'` write `icon {name: 'icon-name', color: 'color-name'}`.\",\n );\n }\n }\n}\n"]}

package/dist/collection/components/menu-list/menu-list.js CHANGED Viewed

@@ -51,12 +51,16 @@ export class MenuList {
       const selectedItem = MenuItems.find((item) => {
         return !!item.selected;
       });
+      let interactedItem;
       if (selectedItem) {
-        this.select.emit(Object.assign(Object.assign({}, selectedItem), { selected: false }));
+        interactedItem = Object.assign(Object.assign({}, selectedItem), { selected: false });
+        this.select.emit(interactedItem);
       }
       if (MenuItems[index] !== selectedItem) {
-        this.select.emit(Object.assign(Object.assign({}, MenuItems[index]), { selected: false }));
+        interactedItem = Object.assign(Object.assign({}, MenuItems[index]), { selected: false });
+        this.select.emit(interactedItem);
       }
+      this.interact.emit(interactedItem);
     };
     this.isMenuItem = (item) => {
       return !('separator' in item);
@@ -246,6 +250,26 @@ export class MenuList {
             }
           }
         }
+      }, {
+        "method": "interact",
+        "name": "interact",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Fires when a user interacts with an item in the list (e.g., click,\nkeyboard select)."
+        },
+        "complexType": {
+          "original": "MenuItem",
+          "resolved": "MenuItem<any>",
+          "references": {
+            "MenuItem": {
+              "location": "import",
+              "path": "../menu/menu.types"
+            }
+          }
+        }
       }];
   }
   static get elementRef() { return "element"; }

package/dist/collection/components/menu-list/menu-list.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"menu-list.js","sourceRoot":"","sources":["../../../src/components/menu-list/menu-list.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,OAAO,EAAoB,MAAM,gBAAgB,CAAC;AAC3D,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAC7C,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EACH,SAAS,EACT,OAAO,EACP,KAAK,EAEL,CAAC,EACD,IAAI,EACJ,KAAK,GACR,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAGxD,MAAM,EAAE,cAAc,EAAE,GAAG,WAAW,CAAC;AAEvC;;GAEG;AAMH,MAAM,OAAO,QAAQ;;IAwCT,qBAAgB,GAAG,IAAI,gBAAgB,EAAE,CAAC;~~IA8C1C~~,UAAK,GAAG,GAAG,EAAE;MACjB,IAAI,CAAC,SAAS,EAAE,CAAC;MACjB,IAAI,CAAC,cAAc,EAAE,CAAC;IAC1B,CAAC,CAAC;IAEM,cAAS,GAAG,GAAG,EAAE;MACrB,IAAI,IAAI,CAAC,OAAO,EAAE;QACd,IAAI,CAAC,QAAQ,EAAE,CAAC;QAChB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;OACvB;MAED,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;MACnE,IAAI,CAAC,OAAO,EAAE;QACV,OAAO;OACV;MAED,IAAI,CAAC,OAAO,GAAG,IAAI,OAAO,CAAC,OAAO,CAAC,CAAC;MACpC,IAAI,CAAC,OAAO,CAAC,YAAY,GAAG,IAAI,CAAC;MACjC,IAAI,CAAC,OAAO,CAAC,SAAS,GAAG,IAAI,CAAC;MAC9B,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC;IAC9D,CAAC,CAAC;IAEM,mBAAc,GAAG,GAAG,EAAE;MAC1B,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE;QACf,OAAO;OACV;MAED,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,cAAc,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;MAC7D,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,cAAc,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;IAC/D,CAAC,CAAC;IAEM,aAAQ,GAAG,GAAG,EAAE;;MACpB,MAAA,IAAI,CAAC,OAAO,0CAAE,QAAQ,CAAC,cAAc,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;MAC9D,MAAA,IAAI,CAAC,OAAO,0CAAE,OAAO,EAAE,CAAC;IAC5B,CAAC,CAAC;IAEM,qBAAgB,GAAG,CAAC,KAAuB,EAAE,EAAE;MACnD,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IAChD,CAAC,CAAC;IAEM,uBAAkB,GAAG,CAAC,KAAa,EAAE,EAAE;MAC3C,MAAM,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,UAAU,CAAe,CAAC;MACnE,IAAI,SAAS,CAAC,KAAK,CAAC,CAAC,QAAQ,EAAE;QAC3B,OAAO;OACV;MAED,MAAM,YAAY,GAAa,SAAS,CAAC,IAAI,CAAC,CAAC,IAAc,EAAE,EAAE;QAC7D,OAAO,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC;MAC3B,CAAC,CAAC,CAAC;MAEH,IAAI,~~YAAY~~,~~EAAE~~;~~QACd~~,IAAI,~~CAAC~~,~~MAAM~~,~~CAAC~~,~~IAAI~~,~~iCAAM,~~YAAY,KAAE,QAAQ,EAAE,KAAK,~~IAAG~~,CAAC;~~OAC1D~~;MAED,IAAI,SAAS,CAAC,KAAK,CAAC,KAAK,YAAY,EAAE;QACnC,IAAI,CAAC,MAAM,CAAC,IAAI,~~iCAAM~~,~~SAAS~~,CAAC,~~KAAK~~,CAAC,~~KAAE,~~QAAQ,~~EAAE~~,~~KAAK~~,~~IAAG~~,CAAC;~~OAC9D;IACL~~,CAAC,CAAC;IAEM,eAAU,GAAG,CAAC,IAAc,EAAW,EAAE;MAC7C,OAAO,CAAC,CAAC,WAAW,IAAI,IAAI,CAAC,CAAC;IAClC,CAAC,CAAC;;;~~oBAlI0B~~,OAAO;;iCAiBK,CAAC;;~~EAelC~~,iBAAiB;IACpB,IAAI,CAAC,KAAK,EAAE,CAAC;EACjB,CAAC;EAEM,oBAAoB;IACvB,IAAI,CAAC,QAAQ,EAAE,CAAC;EACpB,CAAC;EAEM,gBAAgB;IACnB,IAAI,CAAC,KAAK,EAAE,CAAC;IACb,IAAI,CAAC,uBAAuB,EAAE,CAAC;EACnC,CAAC;EAEM,MAAM;IACT,IAAI,CAAC,MAAM,GAAG;MACV,UAAU,EAAE,IAAI,CAAC,UAAU;MAC3B,IAAI,EAAE,IAAI,CAAC,IAAI;MACf,QAAQ,EAAE,IAAI,CAAC,QAAQ;KAC1B,CAAC;IAEF,MAAM,IAAI,GAAG,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;IAEnE,OAAO,WAAK,KAAK,EAAC,2BAA2B,IAAE,IAAI,CAAO,CAAC;EAC/D,CAAC;EAGS,UAAU;IAChB,IAAI,CAAC,cAAc,EAAE,CAAC;EAC1B,CAAC;EAGS,YAAY;IAClB,UAAU,CAAC,GAAG,EAAE;MACZ,IAAI,CAAC,KAAK,EAAE,CAAC;IACjB,CAAC,EAAE,CAAC,CAAC,CAAC;EACV,CAAC;~~EAiEO~~,uBAAuB;;IAC3B,IAAI,MAAA,IAAI,CAAC,KAAK,0CAAE,IAAI,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,WAAW,IAAI,IAAI,CAAC,EAAE;MACjD,yCAAyC;MACzC,OAAO,CAAC,IAAI,CACR,sKAAsK,CACzK,CAAC;KACL;EACL,CAAC~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~CACJ","sourcesContent":["import { IconSize } from '../icon/icon.types';\nimport { ListSeparator } from '../list/list-item.types';\nimport { MenuItem } from '../menu/menu.types';\nimport { MenuListType } from '../menu-list/menu-list.types';\nimport { MDCMenu, MDCMenuItemEvent } from '@material/menu';\nimport { MDCRipple } from '@material/ripple';\nimport { strings as menuStrings } from '@material/menu/constants';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { MenuListRenderer } from './menu-list-renderer';\nimport { MenuListRendererConfig } from './menu-list-renderer-config';\n\nconst { SELECTED_EVENT } = menuStrings;\n\n/*\n @private\n /\n@Component({\n tag: 'limel-menu-list',\n shadow: { delegatesFocus: true },\n styleUrl: 'menu-list.scss',\n})\nexport class MenuList {\n /\n List of items to display\n /\n @Prop()\n public items: Array<MenuItem \| 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 menu, omit to get a regular vertical menu.\n * Available types are:\n * `menu`: regular vertical menu.\n /\n @Prop()\n public type: MenuListType;\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: HTMLLimelMenuListElement;\n\n private config: MenuListRendererConfig;\n private MenuListRenderer = new MenuListRenderer();\n private mdcMenu: MDCMenu;\n\n /\n Fired when a new value has been selected from the list.\n /\n @Event()\n private select: EventEmitter<MenuItem>;\n\n public connectedCallback() {\n this.setup();\n }\n\n public disconnectedCallback() {\n this.teardown();\n }\n\n public componentDidLoad() {\n this.setup();\n this.triggerIconColorWarning();\n }\n\n public render() {\n this.config = {\n badgeIcons: this.badgeIcons,\n type: this.type,\n iconSize: this.iconSize,\n };\n\n const html = this.MenuListRenderer.render(this.items, this.config);\n\n return <div class=\"mdc-menu mdc-menu-surface\">{html}</div>;\n }\n\n @Watch('type')\n protected handleType() {\n this.setupListeners();\n }\n\n @Watch('items')\n protected itemsChanged() {\n setTimeout(() => {\n this.setup();\n }, 0);\n }\n\n private setup = () => {\n this.setupMenu();\n this.setupListeners();\n };\n\n private setupMenu = () => {\n if (this.mdcMenu) {\n this.teardown();\n this.mdcMenu = null;\n }\n\n const element = this.element.shadowRoot.querySelector('.mdc-menu');\n if (!element) {\n return;\n }\n\n this.mdcMenu = new MDCMenu(element);\n this.mdcMenu.hasTypeahead = true;\n this.mdcMenu.wrapFocus = true;\n this.mdcMenu.items.forEach((item) => new MDCRipple(item));\n };\n\n private setupListeners = () => {\n if (!this.mdcMenu) {\n return;\n }\n\n this.mdcMenu.unlisten(SELECTED_EVENT, this.handleMenuSelect);\n this.mdcMenu.listen(SELECTED_EVENT, this.handleMenuSelect);\n };\n\n private teardown = () => {\n this.mdcMenu?.unlisten(SELECTED_EVENT, this.handleMenuSelect);\n this.mdcMenu?.destroy();\n };\n\n private handleMenuSelect = (event: MDCMenuItemEvent) => {\n this.handleSingleSelect(event.detail.index);\n };\n\n private handleSingleSelect = (index: number) => {\n const MenuItems = this.items.filter(this.isMenuItem) as MenuItem[];\n if (MenuItems[index].disabled) {\n return;\n }\n\n const selectedItem: MenuItem = MenuItems.find((item: MenuItem) => {\n return !!item.selected;\n });\n\n if (selectedItem) {\n ~~this.select.emit(~~{ ...selectedItem, selected: false });\n }\n\n if (MenuItems[index] !== selectedItem) {\n ~~this.select.emit(~~{ ...MenuItems[index], selected: false });\n }\n };\n\n private isMenuItem = (item: MenuItem): boolean => {\n return !('separator' in item);\n };\n\n private triggerIconColorWarning() {\n if (this.items?.some((item) => 'iconColor' in item)) {\n / eslint-disable-next-line no-console */\n console.warn(\n \"The `iconColor` prop is deprecated now! Use the new `Icon` interface and instead of `iconColor: 'color-name'` write `icon {name: 'icon-name', color: 'color-name'}`.\",\n );\n }\n }\n}\n"]}
1	+ {"version":3,"file":"menu-list.js","sourceRoot":"","sources":["../../../src/components/menu-list/menu-list.tsx"],"names":[],"mappings":"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","sourcesContent":["import { IconSize } from '../icon/icon.types';\nimport { ListSeparator } from '../list/list-item.types';\nimport { MenuItem } from '../menu/menu.types';\nimport { MenuListType } from '../menu-list/menu-list.types';\nimport { MDCMenu, MDCMenuItemEvent } from '@material/menu';\nimport { MDCRipple } from '@material/ripple';\nimport { strings as menuStrings } from '@material/menu/constants';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { MenuListRenderer } from './menu-list-renderer';\nimport { MenuListRendererConfig } from './menu-list-renderer-config';\n\nconst { SELECTED_EVENT } = menuStrings;\n\n/*\n @private\n /\n@Component({\n tag: 'limel-menu-list',\n shadow: { delegatesFocus: true },\n styleUrl: 'menu-list.scss',\n})\nexport class MenuList {\n /\n List of items to display\n /\n @Prop()\n public items: Array<MenuItem \| 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 menu, omit to get a regular vertical menu.\n * Available types are:\n * `menu`: regular vertical menu.\n /\n @Prop()\n public type: MenuListType;\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: HTMLLimelMenuListElement;\n\n private config: MenuListRendererConfig;\n private MenuListRenderer = new MenuListRenderer();\n private mdcMenu: MDCMenu;\n\n /\n Fired when a new value has been selected from the list.\n /\n @Event()\n private select: EventEmitter<MenuItem>;\n\n /\n Fires when a user interacts with an item in the list (e.g., click,\n * keyboard select).\n /\n @Event()\n interact: EventEmitter<MenuItem>;\n\n public connectedCallback() {\n this.setup();\n }\n\n public disconnectedCallback() {\n this.teardown();\n }\n\n public componentDidLoad() {\n this.setup();\n this.triggerIconColorWarning();\n }\n\n public render() {\n this.config = {\n badgeIcons: this.badgeIcons,\n type: this.type,\n iconSize: this.iconSize,\n };\n\n const html = this.MenuListRenderer.render(this.items, this.config);\n\n return <div class=\"mdc-menu mdc-menu-surface\">{html}</div>;\n }\n\n @Watch('type')\n protected handleType() {\n this.setupListeners();\n }\n\n @Watch('items')\n protected itemsChanged() {\n setTimeout(() => {\n this.setup();\n }, 0);\n }\n\n private setup = () => {\n this.setupMenu();\n this.setupListeners();\n };\n\n private setupMenu = () => {\n if (this.mdcMenu) {\n this.teardown();\n this.mdcMenu = null;\n }\n\n const element = this.element.shadowRoot.querySelector('.mdc-menu');\n if (!element) {\n return;\n }\n\n this.mdcMenu = new MDCMenu(element);\n this.mdcMenu.hasTypeahead = true;\n this.mdcMenu.wrapFocus = true;\n this.mdcMenu.items.forEach((item) => new MDCRipple(item));\n };\n\n private setupListeners = () => {\n if (!this.mdcMenu) {\n return;\n }\n\n this.mdcMenu.unlisten(SELECTED_EVENT, this.handleMenuSelect);\n this.mdcMenu.listen(SELECTED_EVENT, this.handleMenuSelect);\n };\n\n private teardown = () => {\n this.mdcMenu?.unlisten(SELECTED_EVENT, this.handleMenuSelect);\n this.mdcMenu?.destroy();\n };\n\n private handleMenuSelect = (event: MDCMenuItemEvent) => {\n this.handleSingleSelect(event.detail.index);\n };\n\n private handleSingleSelect = (index: number) => {\n const MenuItems = this.items.filter(this.isMenuItem) as MenuItem[];\n if (MenuItems[index].disabled) {\n return;\n }\n\n const selectedItem: MenuItem = MenuItems.find((item: MenuItem) => {\n return !!item.selected;\n });\n\n let interactedItem: MenuItem;\n if (selectedItem) {\n interactedItem = { ...selectedItem, selected: false };\n this.select.emit(interactedItem);\n }\n\n if (MenuItems[index] !== selectedItem) {\n interactedItem = { ...MenuItems[index], selected: false };\n this.select.emit(interactedItem);\n }\n\n this.interact.emit(interactedItem);\n };\n\n private isMenuItem = (item: MenuItem): boolean => {\n return !('separator' in item);\n };\n\n private triggerIconColorWarning() {\n if (this.items?.some((item) => 'iconColor' in item)) {\n / eslint-disable-next-line no-console */\n console.warn(\n \"The `iconColor` prop is deprecated now! Use the new `Icon` interface and instead of `iconColor: 'color-name'` write `icon {name: 'icon-name', color: 'color-name'}`.\",\n );\n }\n }\n}\n"]}

package/dist/collection/components/text-editor/prosemirror-adapter/plugins/trigger/create-html-inserter.js ADDED Viewed

@@ -0,0 +1,11 @@
+import { DOMParser } from 'prosemirror-model';
+export const createHtmlInserter = (view, contentConverter, startPos, dispatchTransaction) => {
+  const schema = view.state.schema;
+  return async (input) => {
+    const container = document.createElement('span');
+    container.innerHTML = await contentConverter.parseAsHTML(input, schema);
+    const fragment = DOMParser.fromSchema(schema).parse(container).content;
+    dispatchTransaction(view, startPos, fragment);
+  };
+};
+//# sourceMappingURL=create-html-inserter.js.map

package/dist/collection/components/text-editor/prosemirror-adapter/plugins/trigger/create-html-inserter.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"create-html-inserter.js","sourceRoot":"","sources":["../../../../../../src/components/text-editor/prosemirror-adapter/plugins/trigger/create-html-inserter.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,SAAS,EAAY,MAAM,mBAAmB,CAAC;AAI9D,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAC9B,IAAgB,EAChB,gBAAsC,EACtC,QAAgB,EAChB,mBAIS,EACyB,EAAE;EACpC,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;EAEjC,OAAO,KAAK,EAAE,KAAa,EAAiB,EAAE;IAC1C,MAAM,SAAS,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;IACjD,SAAS,CAAC,SAAS,GAAG,MAAM,gBAAgB,CAAC,WAAW,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;IAExE,MAAM,QAAQ,GAAG,SAAS,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,OAAO,CAAC;IAEvE,mBAAmB,CAAC,IAAI,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC;EAClD,CAAC,CAAC;AACN,CAAC,CAAC","sourcesContent":["import { Node, DOMParser, Fragment } from 'prosemirror-model';\nimport { EditorView } from 'prosemirror-view';\nimport { ContentTypeConverter } from '../../../utils/content-type-converter';\n\nexport const createHtmlInserter = (\n view: EditorView,\n contentConverter: ContentTypeConverter,\n startPos: number,\n dispatchTransaction: (\n view: EditorView,\n startPos: number,\n fragment: Fragment | Node,\n ) => void,\n): ((input: string) => Promise<void>) => {\n const schema = view.state.schema;\n\n return async (input: string): Promise<void> => {\n const container = document.createElement('span');\n container.innerHTML = await contentConverter.parseAsHTML(input, schema);\n\n const fragment = DOMParser.fromSchema(schema).parse(container).content;\n\n dispatchTransaction(view, startPos, fragment);\n };\n};\n"]}

package/dist/collection/components/text-editor/prosemirror-adapter/plugins/trigger/factory.js CHANGED Viewed

@@ -30,16 +30,16 @@ const stillHasTrigger = (state, activeTrigger, triggerPosition, triggerLength) =
   return (state.doc.textBetween(triggerPosition, triggerPosition + 1) ===
     activeTrigger);
 };
-const getTriggerEventDetail = (view, trigger, value) => {
+const getTriggerEventDetail = (view, contentConverter, trigger, value) => {
   return {
     trigger: trigger,
-    textEditor: inserterFactory(view),
+    textEditor: inserterFactory(view, contentConverter),
     value: value,
   };
 };
-const sendTriggerEvent = (type, view, trigger, value) => {
+const sendTriggerEvent = (type, view, contentConverter, trigger, value) => {
   const event = new CustomEvent(type, {
-    detail: getTriggerEventDetail(view, trigger, value),
+    detail: getTriggerEventDetail(view, contentConverter, trigger, value),
     bubbles: true,
     composed: true,
   });
@@ -77,14 +77,14 @@ const processTransactions = (text, transactions, oldState) => {
   }
   return text;
 };
-export const createTriggerPlugin = (triggerCharacters) => {
+export const createTriggerPlugin = (triggerCharacters, contentConverter) => {
   let activeTrigger = null;
   let triggerText = '';
   let pluginView = null;
   let triggerPosition = null;
   const stopTrigger = () => {
     triggerText = '';
-    sendTriggerEvent('triggerStop', pluginView, activeTrigger, triggerText);
+    sendTriggerEvent('triggerStop', pluginView, contentConverter, activeTrigger, triggerText);
     triggerPosition = null;
     activeTrigger = null;
   };
@@ -103,7 +103,7 @@ export const createTriggerPlugin = (triggerCharacters) => {
       activeTrigger = event.data;
       triggerText = '';
       triggerPosition = state.selection.$from.pos - triggerText.length;
-      sendTriggerEvent('triggerStart', view, activeTrigger, triggerText);
+      sendTriggerEvent('triggerStart', view, contentConverter, activeTrigger, triggerText);
       return false;
     }
     return false;
@@ -118,7 +118,7 @@ export const createTriggerPlugin = (triggerCharacters) => {
     const updatedText = processTransactions(triggerText, transactions, oldState);
     if (updatedText !== triggerText) {
       triggerText = updatedText;
-      sendTriggerEvent('triggerChange', pluginView, activeTrigger, triggerText.slice(1));
+      sendTriggerEvent('triggerChange', pluginView, contentConverter, activeTrigger, triggerText.slice(1));
     }
   };
   return new Plugin({

package/dist/collection/components/text-editor/prosemirror-adapter/plugins/trigger/factory.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"factory.js","sourceRoot":"","sources":["../../../../../../src/components/text-editor/prosemirror-adapter/plugins/trigger/factory.ts"],"names":[],"mappings":"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","sourcesContent":["import { Plugin, PluginKey, EditorState, Transaction } from 'prosemirror-state';\nimport { ReplaceStep, ReplaceAroundStep } from 'prosemirror-transform';\nimport { EditorView } from 'prosemirror-view';\nimport { inserterFactory } from './inserter';\nimport {\n TriggerCharacter,\n TriggerEventDetail,\n} from 'src/components/text-editor/text-editor.types';\n\nconst isTrigger = (\n key: string,\n validTriggers: TriggerCharacter[],\n): key is TriggerCharacter => {\n return key.length === 1 && validTriggers.includes(key as TriggerCharacter);\n};\n\nconst shouldTrigger = (state: EditorState): boolean => {\n const { $from } = state.selection;\n\n if ($from.pos === 1) {\n return true;\n }\n\n // Getting the position immediately before the current selection\n const prevPos = $from.pos - 1;\n\n if (prevPos > 0) {\n // allow trigger if the cursor is at the start of a new paragraph\n if ($from.parentOffset === 0) {\n return true;\n }\n\n const prevChar = state.doc.textBetween(prevPos, $from.pos);\n\n return prevChar === ' ' \|\| prevChar === '\\n';\n }\n\n return false;\n};\n\nconst stillHasTrigger = (\n state: EditorState,\n activeTrigger: string,\n triggerPosition: number,\n triggerLength: number,\n): boolean => {\n const cursorPosition = state.selection.$from.pos;\n\n if (\n cursorPosition < triggerPosition \|\|\n cursorPosition > triggerPosition + triggerLength + 1\n ) {\n return false;\n }\n\n return (\n state.doc.textBetween(triggerPosition, triggerPosition + 1) ===\n activeTrigger\n );\n};\n\nconst getTriggerEventDetail = (\n view: EditorView,\n trigger: TriggerCharacter,\n value: string,\n): TriggerEventDetail => {\n return {\n trigger: trigger,\n textEditor: inserterFactory(view),\n value: value,\n };\n};\n\nconst sendTriggerEvent = (\n type: 'triggerStart' \| 'triggerStop' \| 'triggerChange',\n view: EditorView,\n trigger: TriggerCharacter,\n value: string,\n) => {\n const event = new CustomEvent<TriggerEventDetail>(type, {\n detail: getTriggerEventDetail(view, trigger, value),\n bubbles: true,\n composed: true,\n });\n view.dom.dispatchEvent(event);\n};\n\nconst processTransactions = (\n text: string,\n transactions: Transaction[],\n oldState: EditorState,\n): string => {\n let textAdded = '';\n let textRemoved = '';\n\n transactions.forEach((transaction) => {\n if (transaction.docChanged) {\n transaction.steps.forEach((step) => {\n if (\n step instanceof ReplaceStep \|\|\n step instanceof ReplaceAroundStep\n ) {\n const slice = step.slice;\n const fromPos = step.from;\n const toPos = step.to;\n\n if (slice?.size) {\n // Text added\n textAdded += slice.content.textBetween(0, slice.size);\n } else if (fromPos !== toPos) {\n // Text removed\n const removedText = oldState.doc.textBetween(\n fromPos,\n toPos,\n );\n textRemoved += removedText;\n }\n }\n });\n }\n });\n\n if (textAdded) {\n text += textAdded;\n } else if (textRemoved) {\n text = text.slice(0, -textRemoved.length);\n }\n\n return text;\n};\n\nexport const createTriggerPlugin = (triggerCharacters: TriggerCharacter[]) => {\n let activeTrigger: TriggerCharacter \| null = null;\n let triggerText = '';\n let pluginView: EditorView \| null = null;\n let triggerPosition: number \| null = null;\n\n const stopTrigger = () => {\n triggerText = '';\n sendTriggerEvent('triggerStop', pluginView, activeTrigger, triggerText);\n triggerPosition = null;\n activeTrigger = null;\n };\n\n const handleKeyDown = (_: EditorView, event: any) => {\n if (event.key === 'Escape') {\n stopTrigger();\n\n return true;\n }\n\n return false;\n };\n\n const handleInput = (view: EditorView, event: any) => {\n const { state } = view;\n\n if (\n event.inputType === 'insertText' &&\n isTrigger(event.data, triggerCharacters) &&\n shouldTrigger(state)\n ) {\n activeTrigger = event.data;\n triggerText = '';\n triggerPosition = state.selection.$from.pos - triggerText.length;\n sendTriggerEvent('triggerStart', view, activeTrigger, triggerText);\n\n return false;\n }\n\n return false;\n };\n\n const appendTransactions = (\n transactions: Transaction[],\n oldState: EditorState,\n newState: EditorState,\n ): Transaction => {\n if (!activeTrigger \|\| !triggerPosition \|\| !pluginView) {\n return;\n }\n\n if (\n !stillHasTrigger(\n newState,\n activeTrigger,\n triggerPosition,\n triggerText.length,\n )\n ) {\n return;\n }\n\n const updatedText = processTransactions(\n triggerText,\n transactions,\n oldState,\n );\n\n if (updatedText !== triggerText) {\n triggerText = updatedText;\n sendTriggerEvent(\n 'triggerChange',\n pluginView,\n activeTrigger,\n triggerText.slice(1),\n );\n }\n };\n\n return new Plugin({\n key: new PluginKey('triggerPlugin'),\n view: (view: EditorView) => {\n pluginView = view;\n\n return {};\n },\n state: {\n init: () => {\n return {};\n },\n apply: (transaction: Transaction) => {\n if (transaction.getMeta('stopTrigger')) {\n stopTrigger();\n }\n\n return {};\n },\n },\n props: {\n handleKeyDown: handleKeyDown,\n handleDOMEvents: {\n input: handleInput,\n },\n },\n appendTransaction: appendTransactions,\n });\n};\n"]}
1	+ {"version":3,"file":"factory.js","sourceRoot":"","sources":["../../../../../../src/components/text-editor/prosemirror-adapter/plugins/trigger/factory.ts"],"names":[],"mappings":"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","sourcesContent":["import { Plugin, PluginKey, EditorState, Transaction } from 'prosemirror-state';\nimport { ReplaceStep, ReplaceAroundStep } from 'prosemirror-transform';\nimport { EditorView } from 'prosemirror-view';\nimport { inserterFactory } from './inserter';\nimport {\n TriggerCharacter,\n TriggerEventDetail,\n} from 'src/components/text-editor/text-editor.types';\nimport { ContentTypeConverter } from '../../../utils/content-type-converter';\n\nconst isTrigger = (\n key: string,\n validTriggers: TriggerCharacter[],\n): key is TriggerCharacter => {\n return key.length === 1 && validTriggers.includes(key as TriggerCharacter);\n};\n\nconst shouldTrigger = (state: EditorState): boolean => {\n const { $from } = state.selection;\n\n if ($from.pos === 1) {\n return true;\n }\n\n // Getting the position immediately before the current selection\n const prevPos = $from.pos - 1;\n\n if (prevPos > 0) {\n // allow trigger if the cursor is at the start of a new paragraph\n if ($from.parentOffset === 0) {\n return true;\n }\n\n const prevChar = state.doc.textBetween(prevPos, $from.pos);\n\n return prevChar === ' ' \|\| prevChar === '\\n';\n }\n\n return false;\n};\n\nconst stillHasTrigger = (\n state: EditorState,\n activeTrigger: string,\n triggerPosition: number,\n triggerLength: number,\n): boolean => {\n const cursorPosition = state.selection.$from.pos;\n\n if (\n cursorPosition < triggerPosition \|\|\n cursorPosition > triggerPosition + triggerLength + 1\n ) {\n return false;\n }\n\n return (\n state.doc.textBetween(triggerPosition, triggerPosition + 1) ===\n activeTrigger\n );\n};\n\nconst getTriggerEventDetail = (\n view: EditorView,\n contentConverter: ContentTypeConverter,\n trigger: TriggerCharacter,\n value: string,\n): TriggerEventDetail => {\n return {\n trigger: trigger,\n textEditor: inserterFactory(view, contentConverter),\n value: value,\n };\n};\n\nconst sendTriggerEvent = (\n type: 'triggerStart' \| 'triggerStop' \| 'triggerChange',\n view: EditorView,\n contentConverter: ContentTypeConverter,\n trigger: TriggerCharacter,\n value: string,\n) => {\n const event = new CustomEvent<TriggerEventDetail>(type, {\n detail: getTriggerEventDetail(view, contentConverter, trigger, value),\n bubbles: true,\n composed: true,\n });\n view.dom.dispatchEvent(event);\n};\n\nconst processTransactions = (\n text: string,\n transactions: Transaction[],\n oldState: EditorState,\n): string => {\n let textAdded = '';\n let textRemoved = '';\n\n transactions.forEach((transaction) => {\n if (transaction.docChanged) {\n transaction.steps.forEach((step) => {\n if (\n step instanceof ReplaceStep \|\|\n step instanceof ReplaceAroundStep\n ) {\n const slice = step.slice;\n const fromPos = step.from;\n const toPos = step.to;\n\n if (slice?.size) {\n // Text added\n textAdded += slice.content.textBetween(0, slice.size);\n } else if (fromPos !== toPos) {\n // Text removed\n const removedText = oldState.doc.textBetween(\n fromPos,\n toPos,\n );\n textRemoved += removedText;\n }\n }\n });\n }\n });\n\n if (textAdded) {\n text += textAdded;\n } else if (textRemoved) {\n text = text.slice(0, -textRemoved.length);\n }\n\n return text;\n};\n\nexport const createTriggerPlugin = (\n triggerCharacters: TriggerCharacter[],\n contentConverter: ContentTypeConverter,\n) => {\n let activeTrigger: TriggerCharacter \| null = null;\n let triggerText = '';\n let pluginView: EditorView \| null = null;\n let triggerPosition: number \| null = null;\n\n const stopTrigger = () => {\n triggerText = '';\n sendTriggerEvent(\n 'triggerStop',\n pluginView,\n contentConverter,\n activeTrigger,\n triggerText,\n );\n triggerPosition = null;\n activeTrigger = null;\n };\n\n const handleKeyDown = (_: EditorView, event: any) => {\n if (event.key === 'Escape') {\n stopTrigger();\n\n return true;\n }\n\n return false;\n };\n\n const handleInput = (view: EditorView, event: any) => {\n const { state } = view;\n\n if (\n event.inputType === 'insertText' &&\n isTrigger(event.data, triggerCharacters) &&\n shouldTrigger(state)\n ) {\n activeTrigger = event.data;\n triggerText = '';\n triggerPosition = state.selection.$from.pos - triggerText.length;\n sendTriggerEvent(\n 'triggerStart',\n view,\n contentConverter,\n activeTrigger,\n triggerText,\n );\n\n return false;\n }\n\n return false;\n };\n\n const appendTransactions = (\n transactions: Transaction[],\n oldState: EditorState,\n newState: EditorState,\n ): Transaction => {\n if (!activeTrigger \|\| !triggerPosition \|\| !pluginView) {\n return;\n }\n\n if (\n !stillHasTrigger(\n newState,\n activeTrigger,\n triggerPosition,\n triggerText.length,\n )\n ) {\n return;\n }\n\n const updatedText = processTransactions(\n triggerText,\n transactions,\n oldState,\n );\n\n if (updatedText !== triggerText) {\n triggerText = updatedText;\n sendTriggerEvent(\n 'triggerChange',\n pluginView,\n contentConverter,\n activeTrigger,\n triggerText.slice(1),\n );\n }\n };\n\n return new Plugin({\n key: new PluginKey('triggerPlugin'),\n view: (view: EditorView) => {\n pluginView = view;\n\n return {};\n },\n state: {\n init: () => {\n return {};\n },\n apply: (transaction: Transaction) => {\n if (transaction.getMeta('stopTrigger')) {\n stopTrigger();\n }\n\n return {};\n },\n },\n props: {\n handleKeyDown: handleKeyDown,\n handleDOMEvents: {\n input: handleInput,\n },\n },\n appendTransaction: appendTransactions,\n });\n};\n"]}

package/dist/collection/components/text-editor/prosemirror-adapter/plugins/trigger/inserter.js CHANGED Viewed

@@ -1,33 +1,41 @@
-export const inserterFactory = (view) => {
+import { createHtmlInserter } from './create-html-inserter';
+export const inserterFactory = (view, contentConverter) => {
   const startPos = getTriggerStartPosition(view);
   return {
-    insert: (input) => {
-      const { state, dispatch } = view;
-      const { schema, selection } = state;
-      const { $from } = selection;
-      let node;
-      try {
-        node = createNode(input, schema);
-      }
-      catch (error) {
-        // eslint-disable-next-line no-console
-        console.error(error.message);
-        return;
-      }
-      const spaceNode = schema.text(' ');
-      const fragment = schema.nodes.doc.create(null, [node, spaceNode]);
-      const transaction = state.tr.replaceWith(startPos, $from.pos, fragment);
-      transaction.setMeta('stopTrigger', true);
-      dispatch(transaction);
-    },
-    stopTrigger: () => {
-      const { state, dispatch } = view;
-      const transaction = state.tr;
-      transaction.setMeta('stopTrigger', true);
-      dispatch(transaction);
-    },
+    insert: createNodeAndTextInserter(view, startPos),
+    insertHtml: createHtmlInserter(view, contentConverter, startPos, dispatchTransaction),
+    stopTrigger: () => stopTriggerTransaction(view),
   };
 };
+const createNodeAndTextInserter = (view, startPos) => (input) => {
+  const schema = view.state.schema;
+  let node;
+  try {
+    node = createNode(input, schema);
+  }
+  catch (error) {
+    // eslint-disable-next-line no-console
+    console.error(error.message);
+    return;
+  }
+  const spaceNode = schema.text(' ');
+  const fragment = schema.nodes.doc.create(null, [node, spaceNode]);
+  dispatchTransaction(view, startPos, fragment);
+};
+const stopTriggerTransaction = (view) => {
+  const { state, dispatch } = view;
+  const transaction = state.tr;
+  transaction.setMeta('stopTrigger', true);
+  dispatch(transaction);
+};
+const dispatchTransaction = (view, startPos, fragment) => {
+  const state = view.state;
+  const dispatch = view.dispatch;
+  const fromPos = state.selection.$from.pos;
+  const transaction = state.tr.replaceWith(startPos, fromPos, fragment);
+  transaction.setMeta('stopTrigger', true);
+  dispatch(transaction);
+};
 const createNode = (input, schema) => {
   var _a;
   if (typeof input === 'string') {
@@ -46,7 +54,7 @@ const createNode = (input, schema) => {
 const getCustomNode = (name, schema) => {
   const customNode = Object.values(schema.nodes).find((prosemirrorNode) => prosemirrorNode.name === name);
   if (!customNode) {
-    throw new Error(`A custom element hasn't been registered for node ${name}`);
+    throw new Error(`No custom element has been registered for node ${name}`);
   }
   return customNode;
 };

package/dist/collection/components/text-editor/prosemirror-adapter/plugins/trigger/inserter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"inserter.js","sourceRoot":"","sources":["../../../../../../src/components/text-editor/prosemirror-adapter/plugins/trigger/inserter.ts"],"names":[],"mappings":"AAOA,MAAM,CAAC,MAAM,eAAe,GAAG,~~CAAC~~,IAAgB,~~EAAc~~,EAAE;~~EAC5D~~,MAAM,QAAQ,GAAG,uBAAuB,CAAC,IAAI,CAAC,CAAC;EAE/C,OAAO;IACH,MAAM,EAAE,CAAC,~~KAA8B~~,EAAE,~~EAAE~~;~~MACvC~~,~~MAAM~~,EAAE,~~KAAK~~,~~EAAE~~,QAAQ,EAAE,GAAG,IAAI,CAAC;~~MACjC~~,~~MAAM~~,~~EAAE~~,MAAM,EAAE,~~SAAS~~,EAAE,~~GAAG~~,~~KAAK~~,CAAC~~;MACpC~~,~~MAAM~~,EAAE,~~KAAK~~,~~EAAE~~,GAAG,~~SAAS~~,CAAC;~~MAE5B~~,IAAI,IAAU,CAAC;~~MAEf~~,IAAI;~~QACA~~,IAAI,GAAG,UAAU,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;~~OACpC~~;~~MAAC~~,OAAO,KAAK,EAAE;~~QACZ~~,sCAAsC;~~QACtC~~,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;~~QAE7B~~,OAAO;~~OACV~~;~~MAED~~,MAAM,SAAS,GAAG,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;~~MAEnC~~,MAAM,QAAQ,GAAG,MAAM,CAAC,KAAK,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC;~~MAElE~~,MAAM,~~WAAW~~,GAAG,~~KAAK,~~CAAC,EAAE,~~CAAC~~,~~WAAW~~,~~CACpC~~,QAAQ,~~EACR~~,~~KAAK~~,CAAC,GAAG,~~EACT~~,~~QAAQ~~,~~CACX~~,CAAC;~~MAEF~~,WAAW,CAAC,OAAO,CAAC,aAAa,EAAE,IAAI,CAAC,CAAC;~~MACzC~~,QAAQ,CAAC,WAAW,CAAC,CAAC;~~IAC1B~~,CAAC;~~IACD~~,~~WAAW~~,~~EAAE~~,GAAG,EAAE;~~MACd~~,MAAM,~~EAAE~~,KAAK,~~EAAE~~,QAAQ,~~EAAE,~~GAAG,IAAI,CAAC;~~MAEjC~~,MAAM,WAAW,GAAG,KAAK,CAAC,EAAE,CAAC;~~MAC7B~~,WAAW,CAAC,OAAO,CAAC,aAAa,EAAE,IAAI,CAAC,CAAC;~~MAEzC~~,QAAQ,CAAC,WAAW,CAAC,CAAC;~~IAC1B~~,CAAC~~;GACJ~~,CAAC;~~AACN,CAAC,CAAC;~~AAEF,MAAM,UAAU,GAAG,CAAC,KAA8B,EAAE,MAAc,EAAQ,EAAE;;EACxE,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;IAC3B,OAAO,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;GAC7B;EAED,MAAM,IAAI,GAAG,KAAK,CAAC,IAAI,CAAC;EAExB,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE;IAC1B,OAAO,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;GAC5B;EAED,MAAM,UAAU,GAAG,aAAa,CAAC,IAAI,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;EAEvD,MAAM,UAAU,GAAW,CAAC,MAAA,KAAK,CAAC,QAAQ,mCAAI,EAAE,CAAC;KAC5C,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,UAAU,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;KACzC,MAAM,CAAC,OAAO,CAAC,CAAC;EAErB,OAAO,UAAU,CAAC,MAAM,CAAC,IAAI,CAAC,UAAU,EAAE,UAAU,CAAC,CAAC;AAC1D,CAAC,CAAC;AAEF,MAAM,aAAa,GAAG,CAAC,IAAY,EAAE,MAAc,EAAY,EAAE;EAC7D,MAAM,UAAU,GAAG,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,IAAI,CAC/C,CAAC,eAAe,EAAE,EAAE,CAAC,eAAe,CAAC,IAAI,KAAK,IAAI,CACrD,CAAC;EAEF,IAAI,CAAC,UAAU,EAAE;IACb,MAAM,IAAI,KAAK,CACX,~~oDAAoD~~,IAAI,EAAE,~~CAC7D~~,CAAC;GACL;EAED,OAAO,UAAU,CAAC;AACtB,CAAC,CAAC;AAEF,MAAM,uBAAuB,GAAG,CAAC,IAAgB,EAAU,EAAE;;EACzD,OAAO,MAAA,MAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,SAAS,0CAAE,KAAK,0CAAE,GAAG,CAAC;AAC7C,CAAC,CAAC","sourcesContent":["import { Node, NodeType, Schema } from 'prosemirror-model';\nimport { EditorView } from 'prosemirror-view';\nimport {\n TextEditor,\n TextEditorNode,\n} from 'src/components/text-editor/text-editor.types';\n\nexport const inserterFactory = (view: EditorView): TextEditor => {\n const startPos = getTriggerStartPosition(view);\n\n return {\n insert: (~~input~~: ~~TextEditorNode~~ ~~\| string~~) => {\n ~~const~~ ~~{ state~~, ~~dispatch~~ } ~~= view;\~~n ~~const~~ { ~~schema,~~ ~~selection~~ } = ~~state;\~~n const { ~~$from }~~ = ~~selection~~;\n\n let node: Node;\n\n try {\n node = createNode(input, schema);\n } catch (error) {\n // eslint-disable-next-line no-console\n console.error(error.message);\n\n return;\n }\n\n const spaceNode = schema.text(' ');\n\n const fragment = schema.nodes.doc.create(null, [node, spaceNode]);\n\n ~~const~~ ~~transaction~~ = ~~state.tr.replaceWith~~(\n ~~startPos,\n $from.pos,\n fragment,\n )~~;\n\n transaction.setMeta('stopTrigger', true);\n dispatch(transaction);\n },\n ~~stopTrigger~~: () => {\n const { state, dispatch } = view;\n\n const transaction = state.tr;\n transaction.setMeta('stopTrigger', true);\n\n dispatch(transaction);\n }~~,\n }~~;\n~~};\n~~\nconst createNode = (input: TextEditorNode \| string, schema: Schema): Node => {\n if (typeof input === 'string') {\n return schema.text(input);\n }\n\n const node = input.node;\n\n if (typeof node === 'string') {\n return schema.text(node);\n }\n\n const customNode = getCustomNode(node.tagName, schema);\n\n const childNodes: Node[] = (input.children ?? [])\n .map((child) => createNode(child, schema))\n .filter(Boolean);\n\n return customNode.create(node.attributes, childNodes);\n};\n\nconst getCustomNode = (name: string, schema: Schema): NodeType => {\n const customNode = Object.values(schema.nodes).find(\n (prosemirrorNode) => prosemirrorNode.name === name,\n );\n\n if (!customNode) {\n throw new Error(\n `A custom element ~~hasn't~~ been registered for node ${name}`,\n );\n }\n\n return customNode;\n};\n\nconst getTriggerStartPosition = (view: EditorView): number => {\n return view.state?.selection?.$from?.pos;\n};\n"]}
1	+ {"version":3,"file":"inserter.js","sourceRoot":"","sources":["../../../../../../src/components/text-editor/prosemirror-adapter/plugins/trigger/inserter.ts"],"names":[],"mappings":"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","sourcesContent":["import { Node, NodeType, Schema, Fragment } from 'prosemirror-model';\nimport { EditorView } from 'prosemirror-view';\nimport {\n TextEditor,\n TextEditorNode,\n} from 'src/components/text-editor/text-editor.types';\nimport { ContentTypeConverter } from '../../../utils/content-type-converter';\nimport { createHtmlInserter } from './create-html-inserter';\n\nexport const inserterFactory = (\n view: EditorView,\n contentConverter: ContentTypeConverter,\n): TextEditor => {\n const startPos = getTriggerStartPosition(view);\n\n return {\n insert: createNodeAndTextInserter(view, startPos),\n insertHtml: createHtmlInserter(\n view,\n contentConverter,\n startPos,\n dispatchTransaction,\n ),\n stopTrigger: () => stopTriggerTransaction(view),\n };\n};\n\nconst createNodeAndTextInserter =\n (view: EditorView, startPos: number) =>\n (input: TextEditorNode \| string): void => {\n const schema = view.state.schema;\n let node: Node;\n\n try {\n node = createNode(input, schema);\n } catch (error) {\n // eslint-disable-next-line no-console\n console.error(error.message);\n\n return;\n }\n\n const spaceNode = schema.text(' ');\n\n const fragment = schema.nodes.doc.create(null, [node, spaceNode]);\n\n dispatchTransaction(view, startPos, fragment);\n };\n\nconst stopTriggerTransaction = (view: EditorView): void => {\n const { state, dispatch } = view;\n\n const transaction = state.tr;\n transaction.setMeta('stopTrigger', true);\n\n dispatch(transaction);\n};\n\nconst dispatchTransaction = (\n view: EditorView,\n startPos: number,\n fragment: Fragment \| Node,\n): void => {\n const state = view.state;\n const dispatch = view.dispatch;\n const fromPos = state.selection.$from.pos;\n\n const transaction = state.tr.replaceWith(startPos, fromPos, fragment);\n transaction.setMeta('stopTrigger', true);\n dispatch(transaction);\n};\n\nconst createNode = (input: TextEditorNode \| string, schema: Schema): Node => {\n if (typeof input === 'string') {\n return schema.text(input);\n }\n\n const node = input.node;\n\n if (typeof node === 'string') {\n return schema.text(node);\n }\n\n const customNode = getCustomNode(node.tagName, schema);\n\n const childNodes: Node[] = (input.children ?? [])\n .map((child) => createNode(child, schema))\n .filter(Boolean);\n\n return customNode.create(node.attributes, childNodes);\n};\n\nconst getCustomNode = (name: string, schema: Schema): NodeType => {\n const customNode = Object.values(schema.nodes).find(\n (prosemirrorNode) => prosemirrorNode.name === name,\n );\n\n if (!customNode) {\n throw new Error(\n `No custom element has been registered for node ${name}`,\n );\n }\n\n return customNode;\n};\n\nconst getTriggerStartPosition = (view: EditorView): number => {\n return view.state?.selection?.$from?.pos;\n};\n"]}

package/dist/collection/components/text-editor/prosemirror-adapter/prosemirror-adapter.js CHANGED Viewed

@@ -253,7 +253,7 @@ export class ProsemirrorAdapter {
         ...exampleSetup({ schema: this.schema, menuBar: false }),
         keymap(this.menuCommandFactory.buildKeymap()),
         createLinkPlugin(this.handleNewLinkSelection),
-        createTriggerPlugin(this.triggerCharacters),
+        createTriggerPlugin(this.triggerCharacters, this.contentConverter),
         createImageRemoverPlugin(),
         createMenuStateTrackingPlugin(editorMenuTypesArray, this.menuCommandFactory, this.updateActiveActionBarItems),
         createActionBarInteractionPlugin(this.menuCommandFactory),