npm - @ukic/canary-web-components - Versions diffs - 3.0.0-canary.13 → 3.0.0-canary.15 - Mend

@ukic/canary-web-components 3.0.0-canary.13 → 3.0.0-canary.15

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 (602) hide show

package/dist/cjs/ic-tree-item.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ic-tree-item.entry.cjs.js","mappings":"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","names":["removeDisabledFalse","isSlotUsed","onComponentRequiredPropUndefined","renderDynamicChildSlots","h","Host"],"sources":["src/components/ic-tree-item/ic-tree-item.css?tag=ic-tree-item&encapsulation=shadow","src/components/ic-tree-item/ic-tree-item.tsx"],"sourcesContent":[":host {\n display: block;\n border: none;\n position: relative;\n}\n\n:host .tree-item-content {\n display: flex;\n align-items: center;\n min-height: calc(var(--ic-space-xl) + var(--ic-space-xs));\n padding: 0 var(--ic-space-xs);\n text-decoration: none;\n color: var(--ic-tree-view-text);\n\n --ic-typography-color: var(--ic-tree-view-text);\n}\n\n::slotted([slot=\"router-item\"]) {\n display: flex;\n align-items: center;\n min-height: calc(var(--ic-space-xl) + var(--ic-space-xs));\n text-decoration: none;\n font-family: var(--ic-font-body-family);\n color: var(--ic-tree-view-text);\n padding: 0 var(--ic-space-xs) !important;\n}\n\n:host(.ic-tree-item-truncate) .tree-item-content,\n:host(.ic-tree-item-truncate) ::slotted([slot=\"router-item\"]) {\n height: calc(var(--ic-space-xl) + var(--ic-space-xs));\n}\n\n::slotted([slot=\"router-item\"].ic-tree-item-single) {\n padding-left: calc(var(--ic-space-xl) + var(--ic-space-xs)) !important;\n}\n\n:host .tree-item-content:focus,\n::slotted([slot=\"router-item\"]:focus) {\n box-shadow: var(--ic-border-focus);\n border-radius: var(--ic-border-radius);\n transition: var(--ic-transition-duration-fast);\n outline: none;\n}\n\n:host(.ic-tree-item-focus-inset) .tree-item-content:focus,\n:host(.ic-tree-item-focus-inset) ::slotted([slot=\"router-item\"]:focus) {\n box-shadow: var(--ic-border-focus-inset);\n border-radius: var(--ic-border-radius-inset);\n}\n\n:host(.ic-tree-item-focus-inset) .tree-item-content,\n:host(.ic-tree-item-focus-inset) ::slotted([slot=\"router-item\"]) {\n padding: 0 var(--ic-space-sm);\n}\n\n:host .tree-item-content:hover,\n::slotted([slot=\"router-item\"]:hover) {\n background-color: var(--ic-tree-view-hover) !important;\n cursor: pointer;\n}\n\n:host .tree-item-content:active,\n::slotted([slot=\"router-item\"]:active) {\n background-color: var(--ic-tree-view-pressed) !important;\n}\n\n:host(.ic-tree-item-selected) .tree-item-content,\n:host(.ic-tree-item-selected) ::slotted([slot=\"router-item\"]) {\n background-color: var(--ic-tree-view-selected) !important;\n}\n\n:host(.ic-tree-item-small) .tree-item-content,\n:host(.ic-tree-item-small) ::slotted([slot=\"router-item\"]) {\n min-height: var(--ic-space-xl);\n}\n\n:host(.ic-tree-item-large) .tree-item-content,\n:host(.ic-tree-item-large) ::slotted([slot=\"router-item\"]) {\n min-height: var(--ic-space-xxl);\n}\n\n:host(.ic-tree-item-truncate.ic-tree-item-small) .tree-item-content,\n:host(.ic-tree-item-truncate.ic-tree-item-small)\n ::slotted([slot=\"router-item\"]) {\n height: var(--ic-space-xl);\n}\n\n:host(.ic-tree-item-truncate.ic-tree-item-large) .tree-item-content,\n:host(.ic-tree-item-truncate.ic-tree-item-large)\n ::slotted([slot=\"router-item\"]) {\n height: var(--ic-space-xxl);\n}\n\n:host(.ic-tree-item-disabled) {\n pointer-events: none;\n}\n\n:host(.ic-tree-item-disabled) .tree-item-content,\n:host(.ic-tree-item-disabled) ::slotted([slot=\"icon\"]),\n:host(.ic-tree-item-disabled) ::slotted([slot=\"router-item\"]) {\n color: var(--ic-tree-view-text-disabled) !important;\n\n --ic-typography-color: var(--ic-tree-view-text-disabled) !important;\n\n fill: var(--ic-tree-view-icon-disabled);\n pointer-events: none;\n}\n\n:host .arrow-dropdown {\n color: var(--ic-tree-view-dropdown-arrow);\n margin-right: var(--ic-space-xs);\n}\n\n:host(.ic-tree-item-disabled) .arrow-dropdown {\n color: var(--ic-tree-view-dropdown-arrow-disabled);\n}\n\n:host(.ic-tree-item-small) .arrow-dropdown {\n margin-right: var(--ic-space-xxs);\n}\n\n:host .tree-item-expanded {\n transform: rotate(180deg);\n margin-top: calc(-1 * var(--ic-space-xxs));\n}\n\n:host .ic-tree-item-single {\n padding-left: calc(var(--ic-space-xl) + var(--ic-space-xs));\n}\n\n:host(.ic-tree-item-small) .ic-tree-item-single {\n padding-left: calc(var(--ic-space-xl) + var(--ic-space-xxs));\n}\n\n.icon-container {\n min-width: var(--ic-space-lg);\n width: var(--ic-space-lg);\n height: var(--ic-space-lg);\n margin: 0 var(--ic-space-xs) 0 0;\n}\n\n:host(.ic-tree-item-small) .icon-container {\n margin: 0 var(--ic-space-xxs) 0 0;\n}\n\n.ic-text-overflow {\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n\n.ic-tooltip-overflow {\n overflow: hidden;\n}\n\n::slotted([slot=\"icon\"]) {\n fill: var(--ic-tree-view-icon);\n}\n\n/ High Contrast /\n@media (forced-colors: active) {\n ::slotted([slot=\"icon\"]) {\n fill: currentcolor;\n }\n\n :host .tree-item-content:hover,\n ::slotted([slot=\"router-item\"]:hover),\n :host .tree-item-content:active,\n ::slotted([slot=\"router-item\"]:active),\n :host(.ic-tree-item-selected) .tree-item-content,\n :host(.ic-tree-item-selected) ::slotted([slot=\"router-item\"]) {\n background-color: none !important;\n }\n\n :host(.ic-tree-item-disabled) .tree-item-content,\n :host(.ic-tree-item-disabled) .arrow-dropdown,\n :host(.ic-tree-item-disabled) ::slotted([slot=\"icon\"]),\n :host(.ic-tree-item-disabled) ::slotted([slot=\"router-item\"]) {\n color: GrayText !important;\n\n --ic-typography-color: GrayText !important;\n\n fill: GrayText !important;\n }\n\n :host .tree-item-content:focus,\n ::slotted([slot=\"router-item\"]:focus) {\n border: var(--ic-border-hc) !important;\n }\n\n :host(.ic-tree-item-selected) .tree-item-content,\n :host(.ic-tree-item-selected) ::slotted([slot=\"router-item\"]) {\n color: Highlight !important;\n\n --ic-typography-color: Highlight !important;\n }\n}\n","import {\n Component,\n h,\n Prop,\n Element,\n Event,\n EventEmitter,\n Host,\n Watch,\n State,\n Listen,\n Method,\n} from \"@stencil/core\";\nimport { IcSizes, IcThemeMode } from \"../../utils/types\";\nimport {\n isSlotUsed,\n onComponentRequiredPropUndefined,\n removeDisabledFalse,\n renderDynamicChildSlots,\n} from \"../../utils/helpers\";\nimport arrowDropdown from \"../../assets/arrow-dropdown.svg\";\n\nlet treeItemIds = 0;\n\n/*\n @slot label - Content is set as the tree item label.\n * @slot icon - Content is placed to the left of the label.\n * @slot router-item - Handle routing by nesting your routes in this slot.\n /\n@Component({\n tag: \"ic-tree-item\",\n styleUrl: \"ic-tree-item.css\",\n shadow: true,\n})\nexport class TreeItem {\n private treeItemId = `ic-tree-item-${treeItemIds++}`;\n private treeItemElement: HTMLElement;\n private treeItemTag = \"IC-TREE-ITEM\";\n private routerSlot: HTMLElement;\n private hostMutationObserver: MutationObserver = null;\n private TOOLTIP = \"ic-tooltip\";\n private TREE_ITEM_LABEL_CLASS_SELECTOR = \".tree-item-label\";\n\n @Element() el: HTMLIcTreeItemElement;\n\n @State() childTreeItems: HTMLIcTreeItemElement[];\n\n /\n If `true`, the tree item appears in the disabled state.\n /\n @Prop() disabled?: boolean = false;\n @Watch(\"disabled\")\n watchDisabledHandler(): void {\n removeDisabledFalse(this.disabled, this.el);\n }\n\n /\n If `true`, the tree item appears in the expanded state.\n /\n @Prop({ mutable: true }) expanded: boolean = false;\n\n /\n @internal If `true`, the tree item will have an inset focus border.\n /\n @Prop() focusInset?: boolean = false;\n\n /\n @internal Determines if the parent tree item has been expanded.\n /\n @Prop({ mutable: true }) hasParentExpanded: boolean = false;\n\n /\n The URL that the tree item link points to. If set, the tree item will render as an \"a\" tag, otherwise it will render as a div.\n /\n @Prop() href?: string \| undefined;\n\n /\n The human language of the linked URL.\n /\n @Prop() hreflang?: string = \"\";\n\n /\n @internal If `true`, the tree item is a parent of other tree items.\n /\n @Prop({ mutable: true }) isParent: boolean = false;\n\n /\n The label of the tree item.\n /\n @Prop() label: string = \"\";\n\n /\n How much of the referrer to send when following the link.\n /\n @Prop() referrerpolicy?: ReferrerPolicy;\n\n /\n The relationship of the linked URL as space-separated link types.\n /\n @Prop() rel?: string;\n\n /\n If `true`, the tree item appears in the selected state.\n /\n @Prop({ mutable: true }) selected: boolean = false;\n @Watch(\"selected\")\n watchSelectedHandler(): void {\n if (this.selected) {\n this.icTreeItemSelected.emit({ id: this.el.id });\n }\n this.updateAriaLabel();\n }\n\n /\n @internal Determines the size of the tree item.\n /\n @Prop() size?: IcSizes = \"medium\";\n\n /\n The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n /\n @Prop() target?: string;\n\n /\n Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n /\n @Prop() theme?: IcThemeMode = \"inherit\";\n\n /\n If `true`, the tree item label will be truncated instead of text wrapping.\n /\n @Prop() truncateTreeItem?: boolean;\n\n /\n Emitted when tree item is selected.\n /\n @Event() icTreeItemSelected: EventEmitter<{ id: string }>;\n\n disconnectedCallback(): void {\n this.hostMutationObserver?.disconnect();\n }\n\n componentWillLoad(): void {\n removeDisabledFalse(this.disabled, this.el);\n\n this.childTreeItems = Array.from((this.el as HTMLElement).children).filter(\n (child) => child.tagName === this.treeItemTag\n ) as HTMLIcTreeItemElement[];\n\n if (this.childTreeItems.length > 0) {\n this.isParent = true;\n }\n }\n\n componentDidLoad(): void {\n this.setTreeItemPadding();\n\n this.updateAriaLabel();\n\n !isSlotUsed(this.el, \"label\") &&\n onComponentRequiredPropUndefined(\n [{ prop: this.label, propName: \"label\" }],\n \"Tree item\"\n );\n\n this.hostMutationObserver = new MutationObserver((mutationList) =>\n renderDynamicChildSlots(mutationList, \"icon\", this)\n );\n this.hostMutationObserver.observe(this.el, {\n childList: true,\n });\n }\n componentDidRender(): void {\n this.truncateTreeItem && this.truncateTreeItemLabel(this.el);\n if (this.expanded) {\n this.childTreeItems.forEach((child: HTMLIcTreeItemElement) => {\n child.truncateTreeItem && this.truncateTreeItemLabel(child);\n });\n }\n }\n\n componentDidUpdate(): void {\n if (this.hasParentExpanded) {\n this.childTreeItems.forEach((child: HTMLIcTreeItemElement) => {\n child.truncateTreeItem && this.truncateTreeItemLabel(child);\n });\n this.hasParentExpanded = false;\n }\n }\n\n @Listen(\"keydown\", {})\n handleKeyDown(ev: KeyboardEvent): void {\n if (ev.key === \"Enter\" \|\| ev.key === \" \") {\n ev.stopImmediatePropagation();\n this.handleTreeItemClicked();\n }\n }\n\n /\n Sets focus on the native `input`.\n /\n @Method()\n async setFocus(): Promise<void> {\n if (this.hasRouterSlot()) {\n this.routerSlot?.focus();\n } else {\n this.treeItemElement?.focus();\n }\n }\n\n private handleTreeItemClicked = (): void => {\n if (this.isParent) {\n this.expanded = !this.expanded;\n this.hasParentExpanded = true;\n }\n\n this.updateAriaLabel();\n this.selected = true;\n this.watchSelectedHandler();\n };\n\n /\n @internal Updates the aria-label of the tree item.\n /\n @Method()\n async updateAriaLabel(): Promise<void> {\n let ariaLabel;\n\n if (this.hasRouterSlot()) {\n ariaLabel = this.routerSlot.textContent;\n } else if (isSlotUsed(this.el, \"label\")) {\n ariaLabel = this.el.querySelector('[slot=\"label\"]').textContent;\n } else {\n ariaLabel = this.label;\n }\n\n if (this.isParent) {\n ariaLabel = `${ariaLabel}, triggers submenu, ${\n this.expanded ? \"expanded\" : \"collapsed\"\n }`;\n }\n\n if (this.el.parentElement) {\n const treeItems = Array.from(\n (this.el.parentElement as HTMLElement).children\n ).filter(\n (child) => child.tagName === this.treeItemTag\n ) as HTMLIcTreeItemElement[];\n\n const index = treeItems.indexOf(this.el) + 1;\n const parentChildren = treeItems.length;\n\n ariaLabel = `${ariaLabel}, ${index} of ${parentChildren}`;\n }\n\n if (this.selected) {\n ariaLabel = `${ariaLabel}, active`;\n }\n\n if (this.disabled) {\n ariaLabel = `${ariaLabel}, dimmed`;\n }\n\n if (this.hasRouterSlot()) {\n this.routerSlot.ariaLabel = ariaLabel;\n } else {\n this.treeItemElement.ariaLabel = ariaLabel;\n }\n }\n\n private setTreeItemPadding = () => {\n let level = 1;\n let parentElement = this.el.parentElement;\n const treeItemContent = this.el.shadowRoot.querySelector(\n \".tree-item-content\"\n ) as HTMLElement;\n\n const isSiblingOfParent = Array.from(parentElement.children)\n .map((sibling) => {\n if (\n sibling !== this.el &&\n !sibling.querySelector('[slot=\"router-item\"]') &&\n !sibling.querySelector('[slot=\"label\"]')\n ) {\n return sibling.children.length > 0;\n } else {\n return false;\n }\n })\n .includes(true);\n\n const isChild = parentElement.tagName === this.treeItemTag;\n\n const isRouterItem = this.hasRouterSlot();\n\n if (\n (isSiblingOfParent && !this.el.isParent) \|\|\n (isChild && !this.el.isParent)\n ) {\n if (isRouterItem) {\n this.routerSlot.classList.add(\"ic-tree-item-single\");\n } else {\n treeItemContent.classList.add(\"ic-tree-item-single\");\n }\n }\n\n while (parentElement) {\n if (parentElement.tagName === this.treeItemTag) {\n level++;\n if (!this.el.isParent && isSiblingOfParent) {\n treeItemContent.style.paddingLeft = `calc(var(--ic-space-xl) + ${\n level 16\n }px)`;\n } else if (!this.el.isParent) {\n treeItemContent.style.paddingLeft = `calc(var(--ic-space-xs) + ${\n level * 24\n }px`;\n } else {\n treeItemContent.style.paddingLeft = `${level * 16}px`;\n }\n }\n parentElement = parentElement.parentElement;\n }\n };\n\n private truncateTreeItemLabel = (treeItem: HTMLIcTreeItemElement) => {\n let typographyEl: HTMLIcTypographyElement =\n treeItem.shadowRoot.querySelector(this.TREE_ITEM_LABEL_CLASS_SELECTOR);\n const slottedContent = treeItem.querySelector(\"[slot='router-item']\");\n let contentHeight = slottedContent?.scrollHeight;\n\n if (!typographyEl) {\n const newTypographyEl = document.createElement(\"ic-typography\");\n newTypographyEl.innerHTML = slottedContent.textContent;\n newTypographyEl.classList.add(\"tree-item-label\");\n slottedContent.replaceChild(newTypographyEl, slottedContent.firstChild);\n typographyEl = newTypographyEl;\n } else {\n contentHeight = typographyEl.scrollHeight;\n }\n\n const tooltipAlreadyExists = !!typographyEl?.closest(this.TOOLTIP);\n const treeContent =\n treeItem.shadowRoot.querySelector(\".tree-item-content\") \|\| slottedContent;\n\n if (contentHeight > treeContent?.clientHeight && !tooltipAlreadyExists) {\n const tooltipEl = document.createElement(\"ic-tooltip\");\n tooltipEl.setAttribute(\"target\", this.el.id);\n tooltipEl.setAttribute(\"label\", typographyEl.textContent);\n tooltipEl.setAttribute(\"placement\", \"right\");\n\n if (treeContent === slottedContent) {\n treeContent.addEventListener(\"focus\", () =>\n this.handleDisplayTooltip(true)\n );\n treeContent.addEventListener(\"blur\", () =>\n this.handleDisplayTooltip(false)\n );\n tooltipEl.setAttribute(\"style\", \"overflow:hidden;\");\n typographyEl.setAttribute(\n \"style\",\n \"overflow:hidden;text-overflow:ellipsis;white-space:nowrap;\"\n );\n } else {\n tooltipEl.classList.add(\"ic-tooltip-overflow\");\n typographyEl.classList.add(\"ic-text-overflow\");\n }\n\n treeContent.appendChild(tooltipEl);\n tooltipEl.appendChild(typographyEl);\n }\n };\n\n private hasRouterSlot(): boolean {\n this.routerSlot = this.el.querySelector('[slot=\"router-item\"]');\n return !!this.routerSlot;\n }\n\n private handleDisplayTooltip = (display: boolean) => {\n const typographyEl: HTMLIcTypographyElement =\n this.el.shadowRoot.querySelector(this.TREE_ITEM_LABEL_CLASS_SELECTOR) \|\|\n this.el.querySelector(this.TREE_ITEM_LABEL_CLASS_SELECTOR);\n const tooltip: HTMLIcTooltipElement = typographyEl?.closest(this.TOOLTIP);\n\n tooltip?.displayTooltip(display);\n };\n\n render() {\n const { disabled, label, selected, size, expanded, focusInset, theme } =\n this;\n\n const Component = this.href && !this.disabled ? \"a\" : \"div\";\n\n const attrs = Component == \"a\" && {\n href: this.href,\n hrefLang: this.hreflang,\n referrerPolicy: this.referrerpolicy,\n rel: this.rel,\n target: this.target,\n };\n\n return (\n <Host\n class={{\n \"ic-tree-item-disabled\": disabled,\n \"ic-tree-item-selected\": !disabled && selected,\n [`ic-tree-item-${size}`]: size !== \"medium\",\n [`ic-tree-item-focus-inset`]: focusInset,\n [`ic-theme-${theme}`]: theme !== \"inherit\",\n \"ic-tree-item-truncate\": this.truncateTreeItem,\n }}\n id={this.treeItemId}\n >\n {this.hasRouterSlot() ? (\n <slot name=\"router-item\" />\n ) : (\n <Component\n class={{\n \"tree-item-content\": true,\n }}\n tabIndex={disabled ? -1 : 0}\n onClick={this.handleTreeItemClicked}\n ref={(el) => (this.treeItemElement = el)}\n aria-disabled={disabled ? \"true\" : \"false\"}\n aria-live=\"polite\"\n {...attrs}\n onFocus={() => this.handleDisplayTooltip(true)}\n onBlur={() => this.handleDisplayTooltip(false)}\n >\n {this.isParent && (\n <span\n class={{\n [\"arrow-dropdown\"]: true,\n [\"tree-item-expanded\"]: expanded,\n }}\n aria-hidden=\"true\"\n innerHTML={arrowDropdown}\n />\n )}\n {isSlotUsed(this.el, \"icon\") && (\n <div class=\"icon-container\">\n <slot name=\"icon\" />\n </div>\n )}\n <ic-typography class=\"tree-item-label\">\n {isSlotUsed(this.el, \"label\") ? <slot name=\"label\" /> : label}\n </ic-typography>\n </Component>\n )}\n {expanded && (\n <div aria-hidden={`${!expanded}`}>\n <slot />\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ic-tree-item.entry.cjs.js","mappings":"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","names":["removeDisabledFalse","isSlotUsed","onComponentRequiredPropUndefined","renderDynamicChildSlots","h","Host"],"sources":["src/components/ic-tree-item/ic-tree-item.css?tag=ic-tree-item&encapsulation=shadow","src/components/ic-tree-item/ic-tree-item.tsx"],"sourcesContent":[":host {\n display: block;\n border: none;\n position: relative;\n}\n\n:host .tree-item-content {\n display: flex;\n align-items: center;\n min-height: calc(var(--ic-space-xl) + var(--ic-space-xs));\n padding: 0 var(--ic-space-xs);\n text-decoration: none;\n color: var(--ic-tree-view-text);\n\n --ic-typography-color: var(--ic-tree-view-text);\n}\n\n::slotted([slot=\"router-item\"]) {\n display: flex;\n align-items: center;\n min-height: calc(var(--ic-space-xl) + var(--ic-space-xs));\n text-decoration: none;\n font-family: var(--ic-font-body-family);\n color: var(--ic-tree-view-text);\n padding: 0 var(--ic-space-xs) !important;\n}\n\n:host(.ic-tree-item-truncate) .tree-item-content,\n:host(.ic-tree-item-truncate) ::slotted([slot=\"router-item\"]) {\n height: calc(var(--ic-space-xl) + var(--ic-space-xs));\n}\n\n::slotted([slot=\"router-item\"].ic-tree-item-single) {\n padding-left: calc(var(--ic-space-xl) + var(--ic-space-xs)) !important;\n}\n\n:host .tree-item-content:focus,\n::slotted([slot=\"router-item\"]:focus) {\n box-shadow: var(--ic-border-focus);\n border-radius: var(--ic-border-radius);\n transition: var(--ic-transition-duration-fast);\n outline: none;\n}\n\n:host(.ic-tree-item-focus-inset) .tree-item-content:focus,\n:host(.ic-tree-item-focus-inset) ::slotted([slot=\"router-item\"]:focus) {\n box-shadow: var(--ic-border-focus-inset);\n border-radius: var(--ic-border-radius-inset);\n}\n\n:host(.ic-tree-item-focus-inset) .tree-item-content,\n:host(.ic-tree-item-focus-inset) ::slotted([slot=\"router-item\"]) {\n padding: 0 var(--ic-space-sm);\n}\n\n:host .tree-item-content:hover,\n::slotted([slot=\"router-item\"]:hover) {\n background-color: var(--ic-tree-view-hover) !important;\n cursor: pointer;\n}\n\n:host .tree-item-content:active,\n::slotted([slot=\"router-item\"]:active) {\n background-color: var(--ic-tree-view-pressed) !important;\n}\n\n:host(.ic-tree-item-selected) .tree-item-content,\n:host(.ic-tree-item-selected) ::slotted([slot=\"router-item\"]) {\n background-color: var(--ic-tree-view-selected) !important;\n}\n\n:host(.ic-tree-item-small) .tree-item-content,\n:host(.ic-tree-item-small) ::slotted([slot=\"router-item\"]) {\n min-height: var(--ic-space-xl);\n}\n\n:host(.ic-tree-item-large) .tree-item-content,\n:host(.ic-tree-item-large) ::slotted([slot=\"router-item\"]) {\n min-height: var(--ic-space-xxl);\n}\n\n:host(.ic-tree-item-truncate.ic-tree-item-small) .tree-item-content,\n:host(.ic-tree-item-truncate.ic-tree-item-small)\n ::slotted([slot=\"router-item\"]) {\n height: var(--ic-space-xl);\n}\n\n:host(.ic-tree-item-truncate.ic-tree-item-large) .tree-item-content,\n:host(.ic-tree-item-truncate.ic-tree-item-large)\n ::slotted([slot=\"router-item\"]) {\n height: var(--ic-space-xxl);\n}\n\n:host(.ic-tree-item-disabled) {\n pointer-events: none;\n}\n\n:host(.ic-tree-item-disabled) .tree-item-content,\n:host(.ic-tree-item-disabled) ::slotted([slot=\"icon\"]),\n:host(.ic-tree-item-disabled) ::slotted([slot=\"router-item\"]) {\n color: var(--ic-tree-view-text-disabled) !important;\n\n --ic-typography-color: var(--ic-tree-view-text-disabled) !important;\n\n fill: var(--ic-tree-view-icon-disabled);\n pointer-events: none;\n}\n\n:host .arrow-dropdown {\n color: var(--ic-tree-view-dropdown-arrow);\n margin-right: var(--ic-space-xs);\n}\n\n:host(.ic-tree-item-disabled) .arrow-dropdown {\n color: var(--ic-tree-view-dropdown-arrow-disabled);\n}\n\n:host(.ic-tree-item-small) .arrow-dropdown {\n margin-right: var(--ic-space-xxs);\n}\n\n:host .tree-item-expanded {\n transform: rotate(180deg);\n margin-top: calc(-1 * var(--ic-space-xxs));\n}\n\n:host .ic-tree-item-single {\n padding-left: calc(var(--ic-space-xl) + var(--ic-space-xs));\n}\n\n:host(.ic-tree-item-small) .ic-tree-item-single {\n padding-left: calc(var(--ic-space-xl) + var(--ic-space-xxs));\n}\n\n.icon-container {\n min-width: var(--ic-space-lg);\n width: var(--ic-space-lg);\n height: var(--ic-space-lg);\n margin: 0 var(--ic-space-xs) 0 0;\n}\n\n:host(.ic-tree-item-small) .icon-container {\n margin: 0 var(--ic-space-xxs) 0 0;\n}\n\n.ic-text-overflow {\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n\n.ic-tooltip-overflow {\n overflow: hidden;\n}\n\n::slotted([slot=\"icon\"]) {\n fill: var(--ic-tree-view-icon);\n}\n\n/ High Contrast /\n@media (forced-colors: active) {\n ::slotted([slot=\"icon\"]) {\n fill: currentcolor;\n }\n\n :host .tree-item-content:hover,\n ::slotted([slot=\"router-item\"]:hover),\n :host .tree-item-content:active,\n ::slotted([slot=\"router-item\"]:active),\n :host(.ic-tree-item-selected) .tree-item-content,\n :host(.ic-tree-item-selected) ::slotted([slot=\"router-item\"]) {\n background-color: none !important;\n }\n\n :host(.ic-tree-item-disabled) .tree-item-content,\n :host(.ic-tree-item-disabled) .arrow-dropdown,\n :host(.ic-tree-item-disabled) ::slotted([slot=\"icon\"]),\n :host(.ic-tree-item-disabled) ::slotted([slot=\"router-item\"]) {\n color: GrayText !important;\n\n --ic-typography-color: GrayText !important;\n\n fill: GrayText !important;\n }\n\n :host .tree-item-content:focus,\n ::slotted([slot=\"router-item\"]:focus) {\n border: var(--ic-border-hc) !important;\n }\n\n :host(.ic-tree-item-selected) .tree-item-content,\n :host(.ic-tree-item-selected) ::slotted([slot=\"router-item\"]) {\n color: Highlight !important;\n\n --ic-typography-color: Highlight !important;\n }\n}\n","import {\n Component,\n h,\n Prop,\n Element,\n Event,\n EventEmitter,\n Host,\n Watch,\n State,\n Listen,\n Method,\n} from \"@stencil/core\";\nimport { IcSizes, IcThemeMode } from \"../../utils/types\";\nimport {\n isSlotUsed,\n onComponentRequiredPropUndefined,\n removeDisabledFalse,\n renderDynamicChildSlots,\n} from \"../../utils/helpers\";\nimport arrowDropdown from \"../../assets/arrow-dropdown.svg\";\n\nlet treeItemIds = 0;\n\n/*\n @slot label - Content is set as the tree item label.\n * @slot icon - Content is placed to the left of the label.\n * @slot router-item - Handle routing by nesting your routes in this slot.\n /\n@Component({\n tag: \"ic-tree-item\",\n styleUrl: \"ic-tree-item.css\",\n shadow: true,\n})\nexport class TreeItem {\n private treeItemId = `ic-tree-item-${treeItemIds++}`;\n private treeItemElement: HTMLElement \| undefined;\n private treeItemTag = \"IC-TREE-ITEM\";\n private routerSlot: HTMLElement \| null;\n private hostMutationObserver: MutationObserver \| null = null;\n private TOOLTIP = \"ic-tooltip\";\n private TREE_ITEM_LABEL_CLASS_SELECTOR = \".tree-item-label\";\n private TREE_ITEM_CONTENT_CLASS_SELECTOR = \".tree-item-content\";\n\n @Element() el: HTMLIcTreeItemElement;\n\n @State() childTreeItems: HTMLIcTreeItemElement[];\n\n /\n If `true`, the tree item appears in the disabled state.\n /\n @Prop() disabled: boolean = false;\n @Watch(\"disabled\")\n watchDisabledHandler(): void {\n removeDisabledFalse(this.disabled, this.el);\n }\n\n /\n If `true`, the tree item appears in the expanded state.\n /\n @Prop({ mutable: true }) expanded: boolean = false;\n\n /\n @internal If `true`, the tree item will have an inset focus border.\n /\n @Prop() focusInset: boolean = false;\n\n /\n @internal Determines if the parent tree item has been expanded.\n /\n @Prop({ mutable: true }) hasParentExpanded: boolean = false;\n\n /\n The URL that the tree item link points to. If set, the tree item will render as an \"a\" tag, otherwise it will render as a div.\n /\n @Prop() href?: string \| undefined;\n\n /\n The human language of the linked URL.\n /\n @Prop() hreflang?: string = \"\";\n\n /\n @internal If `true`, the tree item is a parent of other tree items.\n /\n @Prop({ mutable: true }) isParent: boolean = false;\n\n /\n The label of the tree item.\n /\n @Prop() label: string = \"\";\n\n /\n @internal Holds the previous truncation state before the screen switches to a small viewport, so it can be reset when screen size changes again.\n /\n @Prop() previousTruncateTreeItem?: boolean;\n\n /\n How much of the referrer to send when following the link.\n /\n @Prop() referrerpolicy?: ReferrerPolicy;\n\n /\n The relationship of the linked URL as space-separated link types.\n /\n @Prop() rel?: string;\n\n /\n If `true`, the tree item appears in the selected state.\n /\n @Prop({ mutable: true }) selected: boolean = false;\n @Watch(\"selected\")\n watchSelectedHandler(): void {\n if (this.selected) {\n this.icTreeItemSelected.emit({ id: this.el.id });\n }\n this.updateAriaLabel();\n }\n\n /\n @internal Determines the size of the tree item.\n /\n @Prop() size?: IcSizes = \"medium\";\n\n /\n The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n /\n @Prop() target?: string;\n\n /\n Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n /\n @Prop() theme?: IcThemeMode = \"inherit\";\n\n /\n If `true`, the tree item label will be truncated instead of text wrapping.\n /\n @Prop() truncateTreeItem?: boolean;\n\n /\n Emitted when tree item is selected.\n /\n @Event() icTreeItemSelected: EventEmitter<{ id: string }>;\n\n disconnectedCallback(): void {\n this.hostMutationObserver?.disconnect();\n }\n\n componentWillLoad(): void {\n removeDisabledFalse(this.disabled, this.el);\n\n this.childTreeItems = Array.from((this.el as HTMLElement).children).filter(\n (child) => child.tagName === this.treeItemTag\n ) as HTMLIcTreeItemElement[];\n\n if (this.childTreeItems.length > 0) {\n this.isParent = true;\n }\n }\n\n componentDidLoad(): void {\n this.setTreeItemPadding();\n\n this.updateAriaLabel();\n\n !isSlotUsed(this.el, \"label\") &&\n onComponentRequiredPropUndefined(\n [{ prop: this.label, propName: \"label\" }],\n \"Tree item\"\n );\n\n this.hostMutationObserver = new MutationObserver((mutationList) =>\n renderDynamicChildSlots(mutationList, \"icon\", this)\n );\n this.hostMutationObserver.observe(this.el, {\n childList: true,\n });\n }\n componentDidRender(): void {\n this.truncateTreeItem\n ? this.truncateTreeItemLabel(this.el)\n : this.removeTreeItemTruncation(this.el);\n if (this.expanded) {\n this.childTreeItems.forEach((child: HTMLIcTreeItemElement) => {\n child.truncateTreeItem\n ? this.truncateTreeItemLabel(child)\n : this.removeTreeItemTruncation(child);\n });\n }\n }\n\n componentDidUpdate(): void {\n if (this.hasParentExpanded) {\n this.childTreeItems.forEach((child: HTMLIcTreeItemElement) => {\n child.truncateTreeItem\n ? this.truncateTreeItemLabel(child)\n : this.removeTreeItemTruncation(child);\n });\n this.hasParentExpanded = false;\n }\n }\n\n @Listen(\"keydown\", {})\n handleKeyDown(ev: KeyboardEvent): void {\n if (ev.key === \"Enter\" \|\| ev.key === \" \") {\n ev.stopImmediatePropagation();\n this.handleTreeItemClicked();\n }\n }\n\n /\n Sets focus on the native `input`.\n /\n @Method()\n async setFocus(): Promise<void> {\n if (this.hasRouterSlot()) {\n this.routerSlot?.focus();\n } else {\n this.treeItemElement?.focus();\n }\n }\n\n private handleTreeItemClicked = (): void => {\n if (this.isParent) {\n this.expanded = !this.expanded;\n this.hasParentExpanded = true;\n }\n\n this.updateAriaLabel();\n this.selected = true;\n this.watchSelectedHandler();\n };\n\n /\n @internal Updates the aria-label of the tree item.\n /\n @Method()\n async updateAriaLabel(): Promise<void> {\n let ariaLabel;\n\n if (this.hasRouterSlot()) {\n ariaLabel = this.routerSlot!.textContent;\n } else if (isSlotUsed(this.el, \"label\")) {\n ariaLabel = this.el.querySelector('[slot=\"label\"]')!.textContent;\n } else {\n ariaLabel = this.label;\n }\n\n if (this.isParent) {\n ariaLabel = `${ariaLabel}, triggers submenu, ${\n this.expanded ? \"expanded\" : \"collapsed\"\n }`;\n }\n\n if (this.el.parentElement) {\n const treeItems = Array.from(\n (this.el.parentElement as HTMLElement).children\n ).filter(\n (child) => child.tagName === this.treeItemTag\n ) as HTMLIcTreeItemElement[];\n\n const index = treeItems.indexOf(this.el) + 1;\n const parentChildren = treeItems.length;\n\n ariaLabel = `${ariaLabel}, ${index} of ${parentChildren}`;\n }\n\n if (this.selected) {\n ariaLabel = `${ariaLabel}, active`;\n }\n\n if (this.disabled) {\n ariaLabel = `${ariaLabel}, dimmed`;\n }\n\n if (this.hasRouterSlot()) {\n this.routerSlot!.ariaLabel = ariaLabel;\n } else {\n this.treeItemElement!.ariaLabel = ariaLabel;\n }\n }\n\n private setTreeItemPadding = () => {\n let level = 1;\n let parentElement = this.el.parentElement;\n const treeItemContent = this.el.shadowRoot?.querySelector(\n this.TREE_ITEM_CONTENT_CLASS_SELECTOR\n ) as HTMLElement;\n\n if (!parentElement) {\n return;\n }\n\n const isSiblingOfParent = Array.from(parentElement.children).some(\n (sibling) =>\n sibling !== this.el &&\n !sibling.querySelector('[slot=\"router-item\"]') &&\n !sibling.querySelector('[slot=\"label\"]') &&\n sibling.children.length > 0\n );\n\n if (\n (isSiblingOfParent && !this.el.isParent) \|\|\n (parentElement.tagName === this.treeItemTag && !this.el.isParent)\n ) {\n if (this.hasRouterSlot()) {\n this.routerSlot!.classList.add(\"ic-tree-item-single\");\n } else {\n treeItemContent.classList.add(\"ic-tree-item-single\");\n }\n }\n\n while (parentElement) {\n if (parentElement.tagName === this.treeItemTag) {\n level++;\n treeItemContent.style.paddingLeft = !this.el.isParent\n ? `calc(var(--ic-space-${isSiblingOfParent ? \"xl\" : \"xs\"}) + ${\n level (isSiblingOfParent ? 16 : 24)\n }px)`\n : `${level * 16}px`;\n }\n parentElement = parentElement.parentElement;\n }\n };\n\n private truncateTreeItemLabel = (treeItem: HTMLIcTreeItemElement) => {\n let typographyEl =\n treeItem.shadowRoot?.querySelector<HTMLIcTypographyElement>(\n this.TREE_ITEM_LABEL_CLASS_SELECTOR\n );\n const slottedContent = treeItem.querySelector(\"[slot='router-item']\");\n let contentHeight = slottedContent?.scrollHeight;\n\n if (!typographyEl && slottedContent) {\n const newTypographyEl = document.createElement(\"ic-typography\");\n newTypographyEl.innerHTML = slottedContent.textContent!;\n newTypographyEl.classList.add(\"tree-item-label\");\n slottedContent.replaceChild(newTypographyEl, slottedContent.firstChild!);\n typographyEl = newTypographyEl;\n } else if (typographyEl) {\n contentHeight = typographyEl.scrollHeight;\n }\n\n const tooltipAlreadyExists = !!typographyEl?.closest(this.TOOLTIP);\n const treeContent =\n treeItem.shadowRoot?.querySelector(\n this.TREE_ITEM_CONTENT_CLASS_SELECTOR\n ) \|\| slottedContent;\n\n if (\n contentHeight &&\n treeContent?.clientHeight &&\n contentHeight > treeContent.clientHeight &&\n !tooltipAlreadyExists &&\n typographyEl\n ) {\n const tooltipEl = document.createElement(\"ic-tooltip\");\n tooltipEl.setAttribute(\"target\", this.el.id);\n tooltipEl.setAttribute(\"label\", typographyEl.textContent!);\n tooltipEl.setAttribute(\"placement\", \"right\");\n\n if (treeContent === slottedContent) {\n treeContent.addEventListener(\"focus\", () =>\n this.handleDisplayTooltip(true)\n );\n treeContent.addEventListener(\"blur\", () =>\n this.handleDisplayTooltip(false)\n );\n tooltipEl.setAttribute(\"style\", \"overflow:hidden;\");\n typographyEl.setAttribute(\n \"style\",\n \"overflow:hidden;text-overflow:ellipsis;white-space:nowrap;\"\n );\n } else {\n tooltipEl.classList.add(\"ic-tooltip-overflow\");\n typographyEl.classList.add(\"ic-text-overflow\");\n }\n\n treeContent.appendChild(tooltipEl);\n tooltipEl.appendChild(typographyEl);\n }\n };\n\n private removeTreeItemTruncation = (treeItem: HTMLIcTreeItemElement) => {\n const slottedContent = treeItem.querySelector(\"[slot='router-item']\");\n const typographyEl: HTMLIcTypographyElement =\n treeItem.shadowRoot?.querySelector(this.TREE_ITEM_LABEL_CLASS_SELECTOR) \|\|\n slottedContent!.querySelector(this.TREE_ITEM_LABEL_CLASS_SELECTOR)!;\n const tooltipEl = typographyEl?.closest<HTMLIcTooltipElement>(this.TOOLTIP);\n const treeContent =\n treeItem.shadowRoot?.querySelector(\n this.TREE_ITEM_CONTENT_CLASS_SELECTOR\n ) \|\| slottedContent!;\n\n if (tooltipEl) {\n typographyEl.classList.remove(\"ic-text-overflow\");\n treeContent.replaceChild(\n treeContent === slottedContent\n ? typographyEl.firstChild!\n : typographyEl,\n tooltipEl\n );\n }\n };\n\n private hasRouterSlot(): boolean {\n this.routerSlot = this.el.querySelector('[slot=\"router-item\"]');\n return !!this.routerSlot;\n }\n\n private handleDisplayTooltip = (display: boolean) => {\n const typographyEl =\n this.el.shadowRoot?.querySelector<HTMLIcTypographyElement>(\n this.TREE_ITEM_LABEL_CLASS_SELECTOR\n ) \|\| this.el.querySelector(this.TREE_ITEM_LABEL_CLASS_SELECTOR);\n const tooltip = typographyEl?.closest<HTMLIcTooltipElement>(this.TOOLTIP);\n\n tooltip?.displayTooltip(display);\n };\n\n render() {\n const { disabled, label, selected, size, expanded, focusInset, theme } =\n this;\n\n const Component = this.href && !this.disabled ? \"a\" : \"div\";\n\n const attrs = Component == \"a\" && {\n href: this.href,\n hrefLang: this.hreflang,\n referrerPolicy: this.referrerpolicy,\n rel: this.rel,\n target: this.target,\n };\n\n return (\n <Host\n class={{\n \"ic-tree-item-disabled\": disabled,\n \"ic-tree-item-selected\": !disabled && selected,\n [`ic-tree-item-${size}`]: size !== \"medium\",\n \"ic-tree-item-focus-inset\": focusInset,\n [`ic-theme-${theme}`]: theme !== \"inherit\",\n \"ic-tree-item-truncate\": !!this.truncateTreeItem,\n }}\n id={this.treeItemId}\n >\n {this.hasRouterSlot() ? (\n <slot name=\"router-item\" />\n ) : (\n <Component\n class={{\n \"tree-item-content\": true,\n }}\n tabIndex={disabled ? -1 : 0}\n onClick={this.handleTreeItemClicked}\n ref={(el) => (this.treeItemElement = el)}\n aria-disabled={disabled ? \"true\" : \"false\"}\n aria-live=\"polite\"\n {...attrs}\n onFocus={() => this.handleDisplayTooltip(true)}\n onBlur={() => this.handleDisplayTooltip(false)}\n >\n {this.isParent && (\n <span\n class={{\n [\"arrow-dropdown\"]: true,\n [\"tree-item-expanded\"]: expanded,\n }}\n aria-hidden=\"true\"\n innerHTML={arrowDropdown}\n />\n )}\n {isSlotUsed(this.el, \"icon\") && (\n <div class=\"icon-container\">\n <slot name=\"icon\" />\n </div>\n )}\n <ic-typography class=\"tree-item-label\">\n {isSlotUsed(this.el, \"label\") ? <slot name=\"label\" /> : label}\n </ic-typography>\n </Component>\n )}\n {expanded && (\n <div aria-hidden={`${!expanded}`}>\n <slot />\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/ic-tree-view.cjs.entry.js CHANGED Viewed

@@ -2,12 +2,24 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-8a24b20c.js');
-const helpers = require('./helpers-0e4c4fdd.js');
+const index = require('./index-d337cd8a.js');
+const helpers = require('./helpers-d01564f7.js');
 const icTreeViewCss = ":host{display:block;width:var(--tree-view-width, 100%);background-color:var(--ic-tree-view-background)}:host .heading-area-container{border-bottom:var(--ic-space-1px) solid var(--ic-tree-view-divider);display:flex;align-items:center;min-height:calc(\n    var(--ic-space-xl) + var(--ic-space-xs) - var(--ic-space-1px)\n  );padding:0 var(--ic-space-xs);--ic-typography-color:var(--ic-tree-view-text)}:host(.ic-tree-view-small) .heading-area-container{min-height:calc(var(--ic-space-xl) - var(--ic-space-1px))}:host(.ic-tree-view-large) .heading-area-container{min-height:calc(var(--ic-space-xxl) - var(--ic-space-1px))}:host(.ic-tree-view-truncate) .heading-area-container{height:calc(var(--ic-space-xl) + var(--ic-space-xs) - var(--ic-space-1px))}:host(.ic-tree-view-truncate.ic-tree-view-small) .heading-area-container{height:calc(var(--ic-space-xl) - var(--ic-space-1px))}:host(.ic-tree-view-truncate.ic-tree-view-large) .heading-area-container{height:calc(var(--ic-space-xxl) - var(--ic-space-1px))}.icon-container{width:var(--ic-space-lg);min-width:var(--ic-space-lg);height:var(--ic-space-lg);margin:0 var(--ic-space-xs) 0 0}:host(.ic-tree-view-small) .icon-container{margin:0 var(--ic-space-xxs) 0 0}.ic-text-overflow{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.ic-tooltip-overflow{overflow:hidden}.tree-view-header.with-padding{padding-right:var(--ic-space-xs)}.tree-items-container-hidden{visibility:hidden}::slotted([slot=\"icon\"]){fill:var(--ic-tree-view-icon)}@media (forced-colors: active){::slotted([slot=\"icon\"]){fill:currentcolor}}";
 const IcTreeViewStyle0 = icTreeViewCss;
+var __rest = (undefined && undefined.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s)
+        if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+            t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 let treeViewIds = 0;
 const TreeView = class {
     constructor(hostRef) {
@@ -16,6 +28,11 @@ const TreeView = class {
         this.treeItemTag = "IC-TREE-ITEM";
         this.hostMutationObserver = null;
         this.isLoaded = false;
+        this.resizeObserver = null;
+        this.TOOLTIP = "ic-tooltip";
+        this.previousTruncateHeading = false;
+        this.previousTruncateTreeItems = false;
+        this.smallDevice = false;
         /**
          * If `true`, tree items will have inset focus.
          */
@@ -32,16 +49,34 @@ const TreeView = class {
          * Sets the theme color to the dark or light theme color. "inherit" will set the color based on the system settings or ic-theme component.
          */
         this.theme = "inherit";
+        /**
+         * The content within the tree view tree items. This will take precedence over slotted content.
+         * */
+        this.treeItemData = [];
         /**
          * If `true`, the tree view heading will be truncated instead of text wrapping.
+         * When used on small devices, this prop will be overridden and headings will be set to text-wrap.
          */
         this.truncateHeading = false;
         /**
          * If `true`, tree items will be truncated, unless they are individually overridden.
+         * When used on small devices, this prop will be overridden and tree-items will be set to text-wrap.
          */
         this.truncateTreeItems = false;
+        this.runResizeObserver = () => {
+            this.resizeObserver = new ResizeObserver(() => {
+                const isSmallDevice = helpers.getCurrentDeviceSize() <= helpers.DEVICE_SIZES.S;
+                if (this.smallDevice !== isSmallDevice)
+                    this.smallDevice = isSmallDevice;
+            });
+            this.resizeObserver.observe(document.body);
+        };
+        this.removeTruncation = () => {
+            this.truncateHeading = false;
+            this.truncateTreeItems = false;
+        };
         this.handleKeyDown = (event) => {
-            var _a;
+            var _a, _b;
             const focussedChild = this.treeItems.indexOf(this.treeItems.filter((el) => el === document.activeElement)[0]);
             const expanded = (_a = this.treeItems[focussedChild]) === null || _a === void 0 ? void 0 : _a.expanded;
             switch (event.key) {
@@ -74,7 +109,7 @@ const TreeView = class {
                         this.treeItems[focussedChild].hasParentExpanded = false;
                         this.treeItems[focussedChild].updateAriaLabel();
                     }
-                    else if (this.treeItems[focussedChild].parentElement.tagName ===
+                    else if (((_b = this.treeItems[focussedChild].parentElement) === null || _b === void 0 ? void 0 : _b.tagName) ===
                         this.treeItemTag) {
                         this.treeItems[focussedChild].parentElement.setFocus();
                     }
@@ -83,6 +118,7 @@ const TreeView = class {
             }
         };
         this.getNextItemToSelect = (currentItem, movingDown) => {
+            var _a;
             const numItems = this.treeItems.length - 1;
             if (currentItem < 1) {
                 currentItem = 0;
@@ -100,10 +136,9 @@ const TreeView = class {
                 if (nextItem < 0 || nextItem > numItems) {
                     return currentItem;
                 }
-                if (!this.treeItems[nextItem].disabled &&
-                    (this.treeItems[nextItem].parentElement.tagName !== this.treeItemTag ||
-                        this.treeItems[nextItem].parentElement
-                            .expanded)) {
+                if (((_a = this.treeItems[nextItem].parentElement) === null || _a === void 0 ? void 0 : _a.tagName) !== this.treeItemTag ||
+                    this.treeItems[nextItem].parentElement
+                        .expanded) {
                     return nextItem;
                 }
                 if (nextItem === numItems && this.treeItems[nextItem].disabled) {
@@ -127,10 +162,13 @@ const TreeView = class {
             this.el.addEventListener("slotchange", this.setTreeItems);
         };
         this.truncateTreeViewHeading = () => {
-            const typographyEl = this.el.shadowRoot.querySelector(".tree-view-header");
-            const tooltip = typographyEl === null || typographyEl === void 0 ? void 0 : typographyEl.closest("ic-tooltip");
-            const headingContainer = this.el.shadowRoot.querySelector(".heading-area-container");
-            if ((typographyEl === null || typographyEl === void 0 ? void 0 : typographyEl.scrollHeight) > (headingContainer === null || headingContainer === void 0 ? void 0 : headingContainer.clientHeight)) {
+            var _a, _b;
+            const typographyEl = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(".tree-view-header");
+            const tooltip = typographyEl === null || typographyEl === void 0 ? void 0 : typographyEl.closest(this.TOOLTIP);
+            const headingContainer = (_b = this.el.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector(".heading-area-container");
+            if (typographyEl &&
+                headingContainer &&
+                typographyEl.scrollHeight > headingContainer.clientHeight) {
                 typographyEl.classList.add("ic-text-overflow");
                 if (!tooltip) {
                     const tooltipEl = document.createElement("ic-tooltip");
@@ -143,6 +181,15 @@ const TreeView = class {
                 }
             }
         };
+        this.removeHeadingTruncation = () => {
+            var _a, _b, _c;
+            const typographyEl = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(".tree-view-header");
+            const tooltipEl = typographyEl === null || typographyEl === void 0 ? void 0 : typographyEl.closest(this.TOOLTIP);
+            if (tooltipEl && typographyEl) {
+                typographyEl.classList.remove("ic-text-overflow");
+                (_c = (_b = this.el.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector(".heading-area-container")) === null || _c === void 0 ? void 0 : _c.replaceChild(typographyEl, tooltipEl);
+            }
+        };
         this.isHeadingDefined = () => helpers.isPropDefined(this.heading) && this.heading !== null;
         this.hasHeadingAreaContent = () => {
             return (helpers.isSlotUsed(this.el, "heading") ||
@@ -150,6 +197,17 @@ const TreeView = class {
                 helpers.isSlotUsed(this.el, "icon"));
         };
     }
+    watchSmallDeviceHandler() {
+        if (this.smallDevice) {
+            this.previousTruncateHeading = this.truncateHeading;
+            this.previousTruncateTreeItems = this.truncateTreeItems;
+            this.removeTruncation();
+        }
+        else {
+            this.truncateHeading = this.previousTruncateHeading;
+            this.truncateTreeItems = this.previousTruncateTreeItems;
+        }
+    }
     watchFocusInsetHandler() {
         this.treeItems.forEach((treeItem) => {
             treeItem.focusInset = this.focusInset;
@@ -165,27 +223,44 @@ const TreeView = class {
             treeItem.theme = this.theme;
         });
     }
+    watchTreeItemOptionsHandler() {
+        this.setTreeItems();
+    }
     watchTruncateTreeItemsHandler() {
         this.treeItems.forEach((treeItem) => {
-            if (treeItem.truncateTreeItem === undefined) {
+            if (this.smallDevice) {
+                treeItem.previousTruncateTreeItem = treeItem.truncateTreeItem;
                 treeItem.truncateTreeItem = this.truncateTreeItems;
             }
+            else {
+                treeItem.truncateTreeItem = treeItem.previousTruncateTreeItem;
+            }
         });
     }
     disconnectedCallback() {
-        var _a, _b;
+        var _a, _b, _c;
         (_a = this.el) === null || _a === void 0 ? void 0 : _a.removeEventListener("slotchange", this.setTreeItems);
         (_b = this.hostMutationObserver) === null || _b === void 0 ? void 0 : _b.disconnect();
+        (_c = this.resizeObserver) === null || _c === void 0 ? void 0 : _c.disconnect();
     }
     componentWillLoad() {
         this.setTreeItems();
+        this.previousTruncateHeading = this.truncateHeading;
+        this.previousTruncateTreeItems = this.truncateTreeItems;
+        helpers.checkResizeObserver(this.runResizeObserver);
         this.watchSizeHandler();
         this.watchFocusInsetHandler();
         this.watchThemeHandler();
-        this.watchTruncateTreeItemsHandler();
+        this.treeItems.forEach((treeItem) => {
+            if (treeItem.truncateTreeItem === undefined) {
+                treeItem.truncateTreeItem = this.truncateTreeItems;
+            }
+        });
     }
     componentDidRender() {
-        this.truncateHeading && this.truncateTreeViewHeading();
+        this.truncateHeading
+            ? this.truncateTreeViewHeading()
+            : this.removeHeadingTruncation();
     }
     componentDidLoad() {
         this.addSlotChangeListener();
@@ -204,33 +279,63 @@ const TreeView = class {
     }
     getAllTreeItems(element) {
         const treeItems = [];
-        const collectTreeItems = (el) => {
+        const collectTreeItemsFromSlottedContent = (el) => {
             Array.from(el.children).forEach((child) => {
                 if (child.tagName === this.treeItemTag) {
                     treeItems.push(child);
                 }
-                collectTreeItems(child);
+                collectTreeItemsFromSlottedContent(child);
+            });
+        };
+        const collectTreeItemsFromData = (items, parentElement) => {
+            Array.from(parentElement.children).forEach((child) => {
+                if (child.tagName === this.treeItemTag) {
+                    parentElement.removeChild(child);
+                }
+            });
+            items.forEach((item) => {
+                const treeItem = document.createElement(this.treeItemTag);
+                const { children, icon } = item, props = __rest(item, ["children", "icon"]);
+                Object.assign(treeItem, props);
+                if (icon) {
+                    const iconSlot = document.createElement("div");
+                    iconSlot.setAttribute("slot", "icon");
+                    iconSlot.innerHTML = icon;
+                    treeItem.appendChild(iconSlot);
+                }
+                parentElement.appendChild(treeItem);
+                treeItems.push(treeItem);
+                if (children && children.length > 0) {
+                    collectTreeItemsFromData(children, treeItem);
+                }
             });
         };
-        collectTreeItems(element);
+        if (this.treeItemData.length > 0) {
+            collectTreeItemsFromData(this.treeItemData, element);
+        }
+        else {
+            collectTreeItemsFromSlottedContent(element);
+        }
         return treeItems;
     }
     render() {
         const { heading, isLoaded, size, theme, truncateHeading } = this;
-        return (index.h(index.Host, { key: 'e0979a6b323b02bc65afceea69ee953527d269f1', "context-id": this.treeViewId, class: {
+        return (index.h(index.Host, { key: 'ab251ddb7f516c5e6d6e892e3720033044757a26', "context-id": this.treeViewId, class: {
                 [`ic-tree-view-${size}`]: size !== "medium",
                 [`ic-theme-${theme}`]: theme !== "inherit",
                 "ic-tree-view-truncate": truncateHeading,
-            }, onKeyDown: this.handleKeyDown, "aria-label": this.isHeadingDefined() ? heading : null }, this.hasHeadingAreaContent() && (index.h("div", { key: 'b72efd1f1be26cd539fac41f436deda54eb4b6ed', class: "heading-area-container" }, helpers.isSlotUsed(this.el, "icon") && (index.h("div", { key: 'e3d21bac85aa59bd1adabd18c20a9c7afd20ccb4', class: "icon-container" }, index.h("slot", { key: '972af4222049f8b197832a42f3620f43544215d1', name: "icon" }))), index.h("ic-typography", { key: '905866b6d0606c26b6910c9b725f0ff66948f069', variant: "subtitle-large", class: {
+            }, onKeyDown: this.handleKeyDown, "aria-label": this.isHeadingDefined() ? heading : null }, this.hasHeadingAreaContent() && (index.h("div", { key: 'fe4e16c30af90a4d91b3a2cf6fcce3b0725a8b5b', class: "heading-area-container" }, helpers.isSlotUsed(this.el, "icon") && (index.h("div", { key: '6b086a36544bb52527c2c385d2c9d89d037e5532', class: "icon-container" }, index.h("slot", { key: '8f34f6e54b63e8cd875149e90fc9107059c14975', name: "icon" }))), index.h("ic-typography", { key: '935ef0484d194e43d9b9e85dbd8d97535f82ca7c', variant: "subtitle-large", class: {
                 "tree-view-header": true,
                 "with-padding": this.truncateHeading && !isLoaded,
-            } }, helpers.isSlotUsed(this.el, "heading") ? (index.h("slot", { name: "heading" })) : (heading)))), index.h("slot", { key: '4d4337a008d71ca0be19f05510539480eb7de290' })));
+            } }, helpers.isSlotUsed(this.el, "heading") ? (index.h("slot", { name: "heading" })) : (heading)))), index.h("slot", { key: '48c0ade6f363af74f69c2a61fcd05b1011fb9dae' })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {
+        "smallDevice": ["watchSmallDeviceHandler"],
         "focusInset": ["watchFocusInsetHandler"],
         "size": ["watchSizeHandler"],
         "theme": ["watchThemeHandler"],
+        "treeItemData": ["watchTreeItemOptionsHandler"],
         "truncateTreeItems": ["watchTruncateTreeItemsHandler"]
     }; }
 };

package/dist/cjs/ic-tree-view.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ic-tree-view.entry.cjs.js","mappings":"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","names":["isPropDefined","isSlotUsed","renderDynamicChildSlots","h","Host"],"sources":["src/components/ic-tree-view/ic-tree-view.css?tag=ic-tree-view&encapsulation=shadow","src/components/ic-tree-view/ic-tree-view.tsx"],"sourcesContent":["/*\n @prop --tree-view-width: Width of the tree view\n/\n\n:host {\n display: block;\n width: var(--tree-view-width, 100%);\n background-color: var(--ic-tree-view-background);\n}\n\n:host .heading-area-container {\n border-bottom: var(--ic-space-1px) solid var(--ic-tree-view-divider);\n display: flex;\n align-items: center;\n min-height: calc(\n var(--ic-space-xl) + var(--ic-space-xs) - var(--ic-space-1px)\n );\n padding: 0 var(--ic-space-xs);\n\n --ic-typography-color: var(--ic-tree-view-text);\n}\n\n:host(.ic-tree-view-small) .heading-area-container {\n min-height: calc(var(--ic-space-xl) - var(--ic-space-1px));\n}\n\n:host(.ic-tree-view-large) .heading-area-container {\n min-height: calc(var(--ic-space-xxl) - var(--ic-space-1px));\n}\n\n:host(.ic-tree-view-truncate) .heading-area-container {\n height: calc(var(--ic-space-xl) + var(--ic-space-xs) - var(--ic-space-1px));\n}\n\n:host(.ic-tree-view-truncate.ic-tree-view-small) .heading-area-container {\n height: calc(var(--ic-space-xl) - var(--ic-space-1px));\n}\n\n:host(.ic-tree-view-truncate.ic-tree-view-large) .heading-area-container {\n height: calc(var(--ic-space-xxl) - var(--ic-space-1px));\n}\n\n.icon-container {\n width: var(--ic-space-lg);\n min-width: var(--ic-space-lg);\n height: var(--ic-space-lg);\n margin: 0 var(--ic-space-xs) 0 0;\n}\n\n:host(.ic-tree-view-small) .icon-container {\n margin: 0 var(--ic-space-xxs) 0 0;\n}\n\n.ic-text-overflow {\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n\n.ic-tooltip-overflow {\n overflow: hidden;\n}\n\n/ Ensures truncation works - accounts for text width increase as component hydrates /\n.tree-view-header.with-padding {\n padding-right: var(--ic-space-xs);\n}\n\n.tree-items-container-hidden {\n visibility: hidden;\n}\n\n::slotted([slot=\"icon\"]) {\n fill: var(--ic-tree-view-icon);\n}\n\n/* High Contrast /\n@media (forced-colors: active) {\n ::slotted([slot=\"icon\"]) {\n fill: currentcolor;\n }\n}\n","import {\n Component,\n h,\n Prop,\n Element,\n Host,\n Watch,\n State,\n Listen,\n} from \"@stencil/core\";\nimport { IcSizes, IcThemeMode } from \"../../utils/types\";\nimport {\n isPropDefined,\n isSlotUsed,\n renderDynamicChildSlots,\n} from \"../../utils/helpers\";\n\nlet treeViewIds = 0;\n\n/\n * @slot heading - Content is set as the tree view heading.\n * @slot icon - Content is placed to the left of the heading.\n /\n\n@Component({\n tag: \"ic-tree-view\",\n styleUrl: \"ic-tree-view.css\",\n shadow: true,\n})\nexport class TreeView {\n private treeViewId = `ic-tree-view-${treeViewIds++}`;\n private treeItemTag = \"IC-TREE-ITEM\";\n private hostMutationObserver: MutationObserver = null;\n private isLoaded = false;\n\n @Element() el: HTMLIcTreeViewElement;\n\n @State() treeItems: HTMLIcTreeItemElement[];\n\n /\n If `true`, tree items will have inset focus.\n /\n @Prop() focusInset?: boolean = false;\n @Watch(\"focusInset\")\n watchFocusInsetHandler(): void {\n this.treeItems.forEach((treeItem) => {\n treeItem.focusInset = this.focusInset;\n });\n }\n\n /\n The heading of the tree view.\n /\n @Prop() heading?: string = \"\";\n\n /\n The size of the tree view.\n /\n @Prop() size?: IcSizes = \"medium\";\n @Watch(\"size\")\n watchSizeHandler(): void {\n this.treeItems.forEach((treeItem) => {\n treeItem.size = this.size;\n });\n }\n\n /\n Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n /\n @Prop() theme?: IcThemeMode = \"inherit\";\n @Watch(\"theme\")\n watchThemeHandler(): void {\n this.treeItems.forEach((treeItem) => {\n treeItem.theme = this.theme;\n });\n }\n\n /\n If `true`, the tree view heading will be truncated instead of text wrapping.\n /\n @Prop() truncateHeading?: boolean = false;\n\n /\n If `true`, tree items will be truncated, unless they are individually overridden.\n */\n @Prop() truncateTreeItems?: boolean = false;\n @Watch(\"truncateTreeItems\")\n watchTruncateTreeItemsHandler(): void {\n this.treeItems.forEach((treeItem) => {\n if (treeItem.truncateTreeItem === undefined) {\n treeItem.truncateTreeItem = this.truncateTreeItems;\n }\n });\n }\n\n disconnectedCallback(): void {\n this.el?.removeEventListener(\"slotchange\", this.setTreeItems);\n\n this.hostMutationObserver?.disconnect();\n }\n componentWillLoad(): void {\n this.setTreeItems();\n\n this.watchSizeHandler();\n this.watchFocusInsetHandler();\n this.watchThemeHandler();\n this.watchTruncateTreeItemsHandler();\n }\n\n componentDidRender(): void {\n this.truncateHeading && this.truncateTreeViewHeading();\n }\n\n componentDidLoad(): void {\n this.addSlotChangeListener();\n\n this.hostMutationObserver = new MutationObserver((mutationList) =>\n renderDynamicChildSlots(mutationList, \"icon\", this)\n );\n this.hostMutationObserver.observe(this.el, {\n childList: true,\n });\n\n this.isLoaded = true;\n }\n\n @Listen(\"icTreeItemSelected\")\n handleTreeItemSelected(event: CustomEvent): void {\n this.treeItems.forEach((treeItem) => {\n if (treeItem.selected && treeItem.id !== event.detail.id) {\n treeItem.selected = false;\n }\n });\n }\n\n private handleKeyDown = (event: KeyboardEvent): void => {\n const focussedChild = this.treeItems.indexOf(\n this.treeItems.filter((el) => el === document.activeElement)[0]\n );\n const expanded = this.treeItems[focussedChild]?.expanded;\n switch (event.key) {\n case \"ArrowDown\":\n this.treeItems[\n this.getNextItemToSelect(focussedChild, true)\n ].setFocus();\n if (focussedChild !== this.treeItems.length - 1) {\n event.preventDefault();\n }\n break;\n case \"ArrowUp\":\n this.treeItems[\n this.getNextItemToSelect(focussedChild, false)\n ].setFocus();\n if (focussedChild !== 0) {\n event.preventDefault();\n }\n break;\n case \"ArrowRight\":\n if (this.treeItems[focussedChild].isParent && !expanded) {\n this.treeItems[focussedChild].expanded = true;\n this.treeItems[focussedChild].hasParentExpanded = true;\n this.treeItems[focussedChild].updateAriaLabel();\n } else if (this.treeItems[focussedChild].isParent && expanded) {\n (\n this.treeItems[focussedChild].children[0] as HTMLIcTreeItemElement\n ).setFocus();\n }\n event.preventDefault();\n break;\n case \"ArrowLeft\":\n if (this.treeItems[focussedChild].isParent && expanded) {\n this.treeItems[focussedChild].expanded = false;\n this.treeItems[focussedChild].hasParentExpanded = false;\n this.treeItems[focussedChild].updateAriaLabel();\n } else if (\n this.treeItems[focussedChild].parentElement.tagName ===\n this.treeItemTag\n ) {\n (\n this.treeItems[focussedChild].parentElement as HTMLIcTreeItemElement\n ).setFocus();\n }\n event.preventDefault();\n break;\n }\n };\n\n private getNextItemToSelect = (\n currentItem: number,\n movingDown: boolean\n ): number => {\n const numItems = this.treeItems.length - 1;\n\n if (currentItem < 1) {\n currentItem = 0;\n }\n\n let nextItem = movingDown ? currentItem + 1 : currentItem - 1;\n if (nextItem < 0) {\n nextItem = 0;\n } else if (nextItem > numItems) {\n nextItem = numItems;\n }\n\n const maxAttempts = numItems + 1;\n let attempts = 0;\n\n while (attempts < maxAttempts) {\n if (nextItem < 0 \|\| nextItem > numItems) {\n return currentItem;\n }\n\n if (\n !this.treeItems[nextItem].disabled &&\n (this.treeItems[nextItem].parentElement.tagName !== this.treeItemTag \|\|\n (this.treeItems[nextItem].parentElement as HTMLIcTreeItemElement)\n .expanded)\n ) {\n return nextItem;\n }\n\n if (nextItem === numItems && this.treeItems[nextItem].disabled) {\n return currentItem;\n }\n\n nextItem = movingDown ? nextItem + 1 : nextItem - 1;\n attempts++;\n }\n\n return currentItem;\n };\n\n private linkTreeItems = () => {\n this.treeItems.forEach((treeItem) => {\n treeItem.setAttribute(\"context-id\", this.treeViewId);\n });\n };\n\n private setTreeItems = () => {\n this.treeItems = this.getAllTreeItems(this.el as HTMLElement);\n\n this.linkTreeItems();\n };\n\n private getAllTreeItems(element: HTMLElement): HTMLIcTreeItemElement[] {\n const treeItems: HTMLIcTreeItemElement[] = [];\n\n const collectTreeItems = (el: HTMLElement) => {\n Array.from(el.children).forEach((child) => {\n if (child.tagName === this.treeItemTag) {\n treeItems.push(child as HTMLIcTreeItemElement);\n }\n\n collectTreeItems(child as HTMLElement);\n });\n };\n\n collectTreeItems(element);\n return treeItems;\n }\n\n private addSlotChangeListener = () => {\n this.el.addEventListener(\"slotchange\", this.setTreeItems);\n };\n\n private truncateTreeViewHeading = () => {\n const typographyEl: HTMLIcTypographyElement =\n this.el.shadowRoot.querySelector(\".tree-view-header\");\n const tooltip = typographyEl?.closest(\"ic-tooltip\");\n const headingContainer: HTMLElement = this.el.shadowRoot.querySelector(\n \".heading-area-container\"\n );\n\n if (typographyEl?.scrollHeight > headingContainer?.clientHeight) {\n typographyEl.classList.add(\"ic-text-overflow\");\n\n if (!tooltip) {\n const tooltipEl = document.createElement(\"ic-tooltip\");\n tooltipEl.setAttribute(\"target\", this.el.id);\n tooltipEl.setAttribute(\"label\", typographyEl.textContent);\n tooltipEl.classList.add(\"ic-tooltip-overflow\");\n tooltipEl.setAttribute(\"placement\", \"right\");\n headingContainer.appendChild(tooltipEl);\n tooltipEl.appendChild(typographyEl);\n }\n }\n };\n\n private isHeadingDefined = () =>\n isPropDefined(this.heading) && this.heading !== null;\n\n private hasHeadingAreaContent = (): boolean => {\n return (\n isSlotUsed(this.el, \"heading\") \|\|\n this.isHeadingDefined() \|\|\n isSlotUsed(this.el, \"icon\")\n );\n };\n\n render() {\n const { heading, isLoaded, size, theme, truncateHeading } = this;\n\n return (\n <Host\n context-id={this.treeViewId}\n class={{\n [`ic-tree-view-${size}`]: size !== \"medium\",\n [`ic-theme-${theme}`]: theme !== \"inherit\",\n \"ic-tree-view-truncate\": truncateHeading,\n }}\n onKeyDown={this.handleKeyDown}\n aria-label={this.isHeadingDefined() ? heading : null}\n >\n {this.hasHeadingAreaContent() && (\n <div class=\"heading-area-container\">\n {isSlotUsed(this.el, \"icon\") && (\n <div class=\"icon-container\">\n <slot name=\"icon\" />\n </div>\n )}\n <ic-typography\n variant=\"subtitle-large\"\n class={{\n \"tree-view-header\": true,\n \"with-padding\": this.truncateHeading && !isLoaded,\n }}\n >\n {isSlotUsed(this.el, \"heading\") ? (\n <slot name=\"heading\" />\n ) : (\n heading\n )}\n </ic-typography>\n </div>\n )}\n\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ic-tree-view.entry.cjs.js","mappings":"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","names":["getCurrentDeviceSize","DEVICE_SIZES","isPropDefined","isSlotUsed","checkResizeObserver","renderDynamicChildSlots","h","Host"],"sources":["src/components/ic-tree-view/ic-tree-view.css?tag=ic-tree-view&encapsulation=shadow","src/components/ic-tree-view/ic-tree-view.tsx"],"sourcesContent":["/*\n @prop --tree-view-width: Width of the tree view\n/\n\n:host {\n display: block;\n width: var(--tree-view-width, 100%);\n background-color: var(--ic-tree-view-background);\n}\n\n:host .heading-area-container {\n border-bottom: var(--ic-space-1px) solid var(--ic-tree-view-divider);\n display: flex;\n align-items: center;\n min-height: calc(\n var(--ic-space-xl) + var(--ic-space-xs) - var(--ic-space-1px)\n );\n padding: 0 var(--ic-space-xs);\n\n --ic-typography-color: var(--ic-tree-view-text);\n}\n\n:host(.ic-tree-view-small) .heading-area-container {\n min-height: calc(var(--ic-space-xl) - var(--ic-space-1px));\n}\n\n:host(.ic-tree-view-large) .heading-area-container {\n min-height: calc(var(--ic-space-xxl) - var(--ic-space-1px));\n}\n\n:host(.ic-tree-view-truncate) .heading-area-container {\n height: calc(var(--ic-space-xl) + var(--ic-space-xs) - var(--ic-space-1px));\n}\n\n:host(.ic-tree-view-truncate.ic-tree-view-small) .heading-area-container {\n height: calc(var(--ic-space-xl) - var(--ic-space-1px));\n}\n\n:host(.ic-tree-view-truncate.ic-tree-view-large) .heading-area-container {\n height: calc(var(--ic-space-xxl) - var(--ic-space-1px));\n}\n\n.icon-container {\n width: var(--ic-space-lg);\n min-width: var(--ic-space-lg);\n height: var(--ic-space-lg);\n margin: 0 var(--ic-space-xs) 0 0;\n}\n\n:host(.ic-tree-view-small) .icon-container {\n margin: 0 var(--ic-space-xxs) 0 0;\n}\n\n.ic-text-overflow {\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n\n.ic-tooltip-overflow {\n overflow: hidden;\n}\n\n/ Ensures truncation works - accounts for text width increase as component hydrates /\n.tree-view-header.with-padding {\n padding-right: var(--ic-space-xs);\n}\n\n.tree-items-container-hidden {\n visibility: hidden;\n}\n\n::slotted([slot=\"icon\"]) {\n fill: var(--ic-tree-view-icon);\n}\n\n/* High Contrast /\n@media (forced-colors: active) {\n ::slotted([slot=\"icon\"]) {\n fill: currentcolor;\n }\n}\n","import {\n Component,\n h,\n Prop,\n Element,\n Host,\n Watch,\n State,\n Listen,\n} from \"@stencil/core\";\nimport { IcSizes, IcThemeMode } from \"../../utils/types\";\nimport {\n checkResizeObserver,\n DEVICE_SIZES,\n getCurrentDeviceSize,\n isPropDefined,\n isSlotUsed,\n renderDynamicChildSlots,\n} from \"../../utils/helpers\";\nimport { IcTreeItemOptions } from \"./ic-tree-view.types\";\n\nlet treeViewIds = 0;\n\n/\n * @slot heading - Content is set as the tree view heading.\n * @slot icon - Content is placed to the left of the heading.\n /\n\n@Component({\n tag: \"ic-tree-view\",\n styleUrl: \"ic-tree-view.css\",\n shadow: true,\n})\nexport class TreeView {\n private treeViewId = `ic-tree-view-${treeViewIds++}`;\n private treeItemTag = \"IC-TREE-ITEM\";\n private hostMutationObserver: MutationObserver \| null = null;\n private isLoaded = false;\n private resizeObserver: ResizeObserver \| null = null;\n private TOOLTIP = \"ic-tooltip\";\n\n private previousTruncateHeading: boolean = false;\n private previousTruncateTreeItems: boolean = false;\n\n @Element() el: HTMLIcTreeViewElement;\n\n @State() smallDevice: boolean = false;\n @Watch(\"smallDevice\")\n watchSmallDeviceHandler(): void {\n if (this.smallDevice) {\n this.previousTruncateHeading = this.truncateHeading;\n this.previousTruncateTreeItems = this.truncateTreeItems;\n this.removeTruncation();\n } else {\n this.truncateHeading = this.previousTruncateHeading;\n this.truncateTreeItems = this.previousTruncateTreeItems;\n }\n }\n\n @State() treeItems: HTMLIcTreeItemElement[];\n\n /\n If `true`, tree items will have inset focus.\n /\n @Prop() focusInset: boolean = false;\n @Watch(\"focusInset\")\n watchFocusInsetHandler(): void {\n this.treeItems.forEach((treeItem) => {\n treeItem.focusInset = this.focusInset;\n });\n }\n\n /\n The heading of the tree view.\n /\n @Prop() heading: string = \"\";\n\n /\n The size of the tree view.\n /\n @Prop() size?: IcSizes = \"medium\";\n @Watch(\"size\")\n watchSizeHandler(): void {\n this.treeItems.forEach((treeItem) => {\n treeItem.size = this.size;\n });\n }\n\n /\n Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n /\n @Prop() theme?: IcThemeMode = \"inherit\";\n @Watch(\"theme\")\n watchThemeHandler(): void {\n this.treeItems.forEach((treeItem) => {\n treeItem.theme = this.theme;\n });\n }\n\n /\n The content within the tree view tree items. This will take precedence over slotted content.\n * /\n @Prop() treeItemData: IcTreeItemOptions[] = [];\n @Watch(\"treeItemData\")\n watchTreeItemOptionsHandler(): void {\n this.setTreeItems();\n }\n\n /\n If `true`, the tree view heading will be truncated instead of text wrapping.\n * When used on small devices, this prop will be overridden and headings will be set to text-wrap.\n /\n @Prop({ mutable: true }) truncateHeading: boolean = false;\n\n /\n If `true`, tree items will be truncated, unless they are individually overridden.\n * When used on small devices, this prop will be overridden and tree-items will be set to text-wrap.\n */\n @Prop({ mutable: true }) truncateTreeItems: boolean = false;\n @Watch(\"truncateTreeItems\")\n watchTruncateTreeItemsHandler(): void {\n this.treeItems.forEach((treeItem) => {\n if (this.smallDevice) {\n treeItem.previousTruncateTreeItem = treeItem.truncateTreeItem;\n treeItem.truncateTreeItem = this.truncateTreeItems;\n } else {\n treeItem.truncateTreeItem = treeItem.previousTruncateTreeItem;\n }\n });\n }\n\n disconnectedCallback(): void {\n this.el?.removeEventListener(\"slotchange\", this.setTreeItems);\n\n this.hostMutationObserver?.disconnect();\n this.resizeObserver?.disconnect();\n }\n componentWillLoad(): void {\n this.setTreeItems();\n\n this.previousTruncateHeading = this.truncateHeading;\n this.previousTruncateTreeItems = this.truncateTreeItems;\n\n checkResizeObserver(this.runResizeObserver);\n\n this.watchSizeHandler();\n this.watchFocusInsetHandler();\n this.watchThemeHandler();\n this.treeItems.forEach((treeItem) => {\n if (treeItem.truncateTreeItem === undefined) {\n treeItem.truncateTreeItem = this.truncateTreeItems;\n }\n });\n }\n\n componentDidRender(): void {\n this.truncateHeading\n ? this.truncateTreeViewHeading()\n : this.removeHeadingTruncation();\n }\n\n componentDidLoad(): void {\n this.addSlotChangeListener();\n\n this.hostMutationObserver = new MutationObserver((mutationList) =>\n renderDynamicChildSlots(mutationList, \"icon\", this)\n );\n this.hostMutationObserver.observe(this.el, {\n childList: true,\n });\n\n this.isLoaded = true;\n }\n\n @Listen(\"icTreeItemSelected\")\n handleTreeItemSelected(event: CustomEvent): void {\n this.treeItems.forEach((treeItem) => {\n if (treeItem.selected && treeItem.id !== event.detail.id) {\n treeItem.selected = false;\n }\n });\n }\n\n private runResizeObserver = () => {\n this.resizeObserver = new ResizeObserver(() => {\n const isSmallDevice = getCurrentDeviceSize() <= DEVICE_SIZES.S;\n if (this.smallDevice !== isSmallDevice) this.smallDevice = isSmallDevice;\n });\n\n this.resizeObserver.observe(document.body);\n };\n\n private removeTruncation = (): void => {\n this.truncateHeading = false;\n this.truncateTreeItems = false;\n };\n\n private handleKeyDown = (event: KeyboardEvent): void => {\n const focussedChild = this.treeItems.indexOf(\n this.treeItems.filter((el) => el === document.activeElement)[0]\n );\n const expanded = this.treeItems[focussedChild]?.expanded;\n switch (event.key) {\n case \"ArrowDown\":\n this.treeItems[\n this.getNextItemToSelect(focussedChild, true)\n ].setFocus();\n if (focussedChild !== this.treeItems.length - 1) {\n event.preventDefault();\n }\n break;\n case \"ArrowUp\":\n this.treeItems[\n this.getNextItemToSelect(focussedChild, false)\n ].setFocus();\n if (focussedChild !== 0) {\n event.preventDefault();\n }\n break;\n case \"ArrowRight\":\n if (this.treeItems[focussedChild].isParent && !expanded) {\n this.treeItems[focussedChild].expanded = true;\n this.treeItems[focussedChild].hasParentExpanded = true;\n this.treeItems[focussedChild].updateAriaLabel();\n } else if (this.treeItems[focussedChild].isParent && expanded) {\n (\n this.treeItems[focussedChild].children[0] as HTMLIcTreeItemElement\n ).setFocus();\n }\n event.preventDefault();\n break;\n case \"ArrowLeft\":\n if (this.treeItems[focussedChild].isParent && expanded) {\n this.treeItems[focussedChild].expanded = false;\n this.treeItems[focussedChild].hasParentExpanded = false;\n this.treeItems[focussedChild].updateAriaLabel();\n } else if (\n this.treeItems[focussedChild].parentElement?.tagName ===\n this.treeItemTag\n ) {\n (\n this.treeItems[focussedChild].parentElement as HTMLIcTreeItemElement\n ).setFocus();\n }\n event.preventDefault();\n break;\n }\n };\n\n private getNextItemToSelect = (\n currentItem: number,\n movingDown: boolean\n ): number => {\n const numItems = this.treeItems.length - 1;\n\n if (currentItem < 1) {\n currentItem = 0;\n }\n\n let nextItem = movingDown ? currentItem + 1 : currentItem - 1;\n if (nextItem < 0) {\n nextItem = 0;\n } else if (nextItem > numItems) {\n nextItem = numItems;\n }\n\n const maxAttempts = numItems + 1;\n let attempts = 0;\n\n while (attempts < maxAttempts) {\n if (nextItem < 0 \|\| nextItem > numItems) {\n return currentItem;\n }\n\n if (\n this.treeItems[nextItem].parentElement?.tagName !== this.treeItemTag \|\|\n (this.treeItems[nextItem].parentElement as HTMLIcTreeItemElement)\n .expanded\n ) {\n return nextItem;\n }\n\n if (nextItem === numItems && this.treeItems[nextItem].disabled) {\n return currentItem;\n }\n\n nextItem = movingDown ? nextItem + 1 : nextItem - 1;\n attempts++;\n }\n\n return currentItem;\n };\n\n private linkTreeItems = () => {\n this.treeItems.forEach((treeItem) => {\n treeItem.setAttribute(\"context-id\", this.treeViewId);\n });\n };\n\n private setTreeItems = () => {\n this.treeItems = this.getAllTreeItems(this.el as HTMLElement);\n\n this.linkTreeItems();\n };\n\n private getAllTreeItems(element: HTMLElement): HTMLIcTreeItemElement[] {\n const treeItems: HTMLIcTreeItemElement[] = [];\n\n const collectTreeItemsFromSlottedContent = (el: HTMLElement) => {\n Array.from(el.children).forEach((child) => {\n if (child.tagName === this.treeItemTag) {\n treeItems.push(child as HTMLIcTreeItemElement);\n }\n\n collectTreeItemsFromSlottedContent(child as HTMLElement);\n });\n };\n\n const collectTreeItemsFromData = (\n items: IcTreeItemOptions[],\n parentElement: HTMLElement\n ) => {\n Array.from(parentElement.children).forEach((child) => {\n if (child.tagName === this.treeItemTag) {\n parentElement.removeChild(child);\n }\n });\n\n items.forEach((item) => {\n const treeItem = document.createElement(\n this.treeItemTag\n ) as HTMLIcTreeItemElement;\n const { children, icon, ...props } = item;\n Object.assign(treeItem, props);\n\n if (icon) {\n const iconSlot = document.createElement(\"div\");\n iconSlot.setAttribute(\"slot\", \"icon\");\n iconSlot.innerHTML = icon;\n treeItem.appendChild(iconSlot);\n }\n\n parentElement.appendChild(treeItem);\n treeItems.push(treeItem);\n\n if (children && children.length > 0) {\n collectTreeItemsFromData(children, treeItem);\n }\n });\n };\n\n if (this.treeItemData.length > 0) {\n collectTreeItemsFromData(this.treeItemData, element);\n } else {\n collectTreeItemsFromSlottedContent(element);\n }\n\n return treeItems;\n }\n\n private addSlotChangeListener = () => {\n this.el.addEventListener(\"slotchange\", this.setTreeItems);\n };\n\n private truncateTreeViewHeading = () => {\n const typographyEl =\n this.el.shadowRoot?.querySelector<HTMLIcTypographyElement>(\n \".tree-view-header\"\n );\n const tooltip = typographyEl?.closest(this.TOOLTIP);\n const headingContainer = this.el.shadowRoot?.querySelector<HTMLElement>(\n \".heading-area-container\"\n );\n\n if (\n typographyEl &&\n headingContainer &&\n typographyEl.scrollHeight > headingContainer.clientHeight\n ) {\n typographyEl.classList.add(\"ic-text-overflow\");\n\n if (!tooltip) {\n const tooltipEl = document.createElement(\"ic-tooltip\");\n tooltipEl.setAttribute(\"target\", this.el.id);\n tooltipEl.setAttribute(\"label\", typographyEl.textContent!);\n tooltipEl.classList.add(\"ic-tooltip-overflow\");\n tooltipEl.setAttribute(\"placement\", \"right\");\n headingContainer.appendChild(tooltipEl);\n tooltipEl.appendChild(typographyEl);\n }\n }\n };\n\n private removeHeadingTruncation = () => {\n const typographyEl =\n this.el.shadowRoot?.querySelector<HTMLIcTypographyElement>(\n \".tree-view-header\"\n );\n const tooltipEl = typographyEl?.closest<HTMLIcTooltipElement>(this.TOOLTIP);\n\n if (tooltipEl && typographyEl) {\n typographyEl.classList.remove(\"ic-text-overflow\");\n this.el.shadowRoot\n ?.querySelector(\".heading-area-container\")\n ?.replaceChild(typographyEl, tooltipEl);\n }\n };\n\n private isHeadingDefined = () =>\n isPropDefined(this.heading) && this.heading !== null;\n\n private hasHeadingAreaContent = (): boolean => {\n return (\n isSlotUsed(this.el, \"heading\") \|\|\n this.isHeadingDefined() \|\|\n isSlotUsed(this.el, \"icon\")\n );\n };\n\n render() {\n const { heading, isLoaded, size, theme, truncateHeading } = this;\n\n return (\n <Host\n context-id={this.treeViewId}\n class={{\n [`ic-tree-view-${size}`]: size !== \"medium\",\n [`ic-theme-${theme}`]: theme !== \"inherit\",\n \"ic-tree-view-truncate\": truncateHeading,\n }}\n onKeyDown={this.handleKeyDown}\n aria-label={this.isHeadingDefined() ? heading : null}\n >\n {this.hasHeadingAreaContent() && (\n <div class=\"heading-area-container\">\n {isSlotUsed(this.el, \"icon\") && (\n <div class=\"icon-container\">\n <slot name=\"icon\" />\n </div>\n )}\n <ic-typography\n variant=\"subtitle-large\"\n class={{\n \"tree-view-header\": true,\n \"with-padding\": this.truncateHeading && !isLoaded,\n }}\n >\n {isSlotUsed(this.el, \"heading\") ? (\n <slot name=\"heading\" />\n ) : (\n heading\n )}\n </ic-typography>\n </div>\n )}\n\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/ic-typography.cjs.entry.js CHANGED Viewed

@@ -2,8 +2,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-8a24b20c.js');
-const helpers = require('./helpers-fc51fdcb.js');
+const index = require('./index-d337cd8a.js');
+const helpers = require('./helpers-bec0dbd4.js');
 const icTypographyCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:block;position:relative;color:var(--ic-typography-color, var(--ic-color-text-primary))}:host(.ic-typography-vertical-margins-h1){margin:0 0 var(--ic-space-xl)}:host(.ic-typography-vertical-margins-h2){margin:var(--ic-space-xxl) 0 var(--ic-space-lg)}:host(.ic-typography-vertical-margins-h3){margin:var(--ic-space-xl) 0 var(--ic-space-md)}:host(.ic-typography-vertical-margins-h4){margin:var(--ic-space-lg) 0 var(--ic-space-md)}:host(.ic-typography-vertical-margins-subtitle-large),:host(.ic-typography-vertical-margins-subtitle-small),:host(.ic-typography-vertical-margins-body),:host(.ic-typography-vertical-margins-code-large),:host(.ic-typography-vertical-margins-code-small),:host(.ic-typography-vertical-margins-code-extra-small){margin:0 0 var(--ic-space-md)}:host(.ic-typography-vertical-margins-caption),:host(.ic-typography-vertical-margins-caption-uppercase){margin:0 0 var(--ic-space-xs)}:host(.ic-typography-vertical-margins-h2:first-child),:host(.ic-typography-vertical-margins-h3:first-child),:host(.ic-typography-vertical-margins-h4:first-child){margin-top:0}:host(.ic-typography-h1){font:var(--ic-font-h1) !important}:host(.ic-typography-h2){font:var(--ic-font-h2);letter-spacing:var(--ic-font-letter-spacing-0pt0025)}:host(.ic-typography-h3){font:var(--ic-font-h3)}:host(.ic-typography-h4){font:var(--ic-font-h4);letter-spacing:var(--ic-font-letter-spacing-0pt0015)}:host(.ic-typography-subtitle-large){font:var(--ic-font-subtitle-large);letter-spacing:var(--ic-font-letter-spacing-0pt0015)}:host(.ic-typography-subtitle-small){font:var(--ic-font-subtitle-small);letter-spacing:var(--ic-font-letter-spacing-0pt0015)}:host(.ic-typography-body){font:var(--ic-font-body);letter-spacing:var(--ic-font-letter-spacing-0pt005)}:host(.ic-typography-caption){font:var(--ic-font-caption);letter-spacing:var(--ic-font-letter-spacing-0pt0025)}:host(.ic-typography-caption-uppercase){font:var(--ic-font-caption);letter-spacing:var(--ic-font-letter-spacing-0pt0025);text-transform:uppercase}:host(.ic-typography-label){font:var(--ic-font-label);letter-spacing:var(--ic-font-letter-spacing-0pt025)}:host(.ic-typography-label-uppercase){font:var(--ic-font-label);letter-spacing:var(--ic-font-letter-spacing-0pt025);text-transform:uppercase}:host(.ic-typography-code-large){font:var(--ic-font-code-large);letter-spacing:var(--ic-font-letter-spacing-0pt025)}:host(.ic-typography-code-small){font:var(--ic-font-code-small);letter-spacing:var(--ic-font-letter-spacing-0pt005)}:host(.ic-typography-code-extra-small){font:var(--ic-font-code-extra-small);letter-spacing:var(--ic-font-letter-spacing-0pt025)}:host(.ic-typography-badge){font:var(--ic-font-badge);letter-spacing:var(--ic-font-letter-spacing-0pt0025)}:host(.ic-typography-badge-small){font:var(--ic-font-badge-small);letter-spacing:var(--ic-font-letter-spacing-0pt0025)}:host(.ic-typography-no-wrap){white-space:nowrap}:host ::slotted(h1),:host ::slotted(h2),:host ::slotted(h3),:host ::slotted(h4),:host ::slotted(h5),:host ::slotted(h6),:host ::slotted(p),:host ::slotted(label){font:inherit;letter-spacing:inherit}.trunc-wrapper{display:-webkit-box;-webkit-box-orient:vertical;line-clamp:var(--truncation-max-lines, initial);-webkit-line-clamp:var(--truncation-max-lines, initial);overflow:hidden;padding-right:var(--ellipsis-padding-right, 0)}.trunc-btn{border:none;background:none;padding:0;color:var(--ic-color-text-primary);text-decoration:underline;font-weight:var(--ic-font-weight-bold);transition:var(--ic-easing-transition-fast)}.trunc-btn:hover,.trunc-btn.focus{outline:none;border-bottom:0.25rem solid !important;margin-bottom:-0.25rem !important;text-decoration:none;cursor:pointer}:host(.ic-typography-strikethrough){text-decoration:line-through}:host(.ic-typography-underline){text-decoration:underline}:host(.ic-typography-underline.ic-typography-strikethrough){text-decoration:line-through underline}:host(.ic-typography-italic){font-style:italic !important}:host(.ic-typography-bold){font-weight:var(--ic-font-weight-bold)}:host(.ic-theme-dark),:host(.ic-theme-light){--ic-typography-color:var(--ic-color-text-primary)}:host(.in-ag-grid),:host(.in-ag-grid) ::slotted(*){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@supports (text-underline-offset: 25%){.trunc-btn:hover,.trunc-btn.focus{text-decoration-line:underline;text-decoration-thickness:25%;text-underline-offset:25%;border-bottom:0 !important;margin-bottom:0 !important}}@media (prefers-color-scheme: dark) and (not (forced-colors: active)){:host,.trunc-btn::not(ic-tooltip){color:var(--ic-typography-color)}}";
 const IcTypographyStyle0 = icTypographyCss;

package/dist/cjs/{index-8a24b20c.js → index-d337cd8a.js} RENAMED Viewed

@@ -21,7 +21,7 @@ function _interopNamespace(e) {
 }
 const NAMESPACE = 'core';
-const BUILD = /* core */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: true, cmpDidUnload: false, cmpDidUpdate: true, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: true, cmpWillUpdate: true, connectedCallback: true, constructableCSS: true, cssAnnotations: true, devTools: false, disconnectedCallback: true, element: false, event: true, experimentalScopedSlotChanges: false, experimentalSlotFixes: false, formAssociated: false, hasRenderFn: true, hostListener: true, hostListenerTarget: true, hostListenerTargetBody: false, hostListenerTargetDocument: true, hostListenerTargetParent: false, hostListenerTargetWindow: true, hotModuleReplacement: false, hydrateClientSide: true, hydrateServerSide: false, hydratedAttribute: false, hydratedClass: true, hydratedSelectorName: "hydrated", initializeNextTick: false, invisiblePrehydration: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: true, mode: false, modernPropertyDecls: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: true, propString: true, reflect: true, scoped: true, scopedSlotTextContentFix: false, scriptDataOpts: false, shadowDelegatesFocus: true, shadowDom: true, slot: true, slotChildNodesFix: false, slotRelocation: true, state: true, style: true, svg: true, taskQueue: true, transformTagName: false, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: true, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: true, vdomText: true, vdomXlink: true, watchCallback: true };
+const BUILD = /* core */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: true, cmpDidUnload: false, cmpDidUpdate: true, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: true, cmpWillUpdate: true, connectedCallback: true, constructableCSS: true, cssAnnotations: true, devTools: false, disconnectedCallback: true, element: false, event: true, experimentalScopedSlotChanges: false, experimentalSlotFixes: false, formAssociated: false, hasRenderFn: true, hostListener: true, hostListenerTarget: true, hostListenerTargetBody: false, hostListenerTargetDocument: true, hostListenerTargetParent: false, hostListenerTargetWindow: false, hotModuleReplacement: false, hydrateClientSide: true, hydrateServerSide: false, hydratedAttribute: false, hydratedClass: true, hydratedSelectorName: "hydrated", initializeNextTick: false, invisiblePrehydration: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: true, mode: false, modernPropertyDecls: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: true, propString: true, reflect: true, scoped: true, scopedSlotTextContentFix: false, scriptDataOpts: false, shadowDelegatesFocus: true, shadowDom: true, slot: true, slotChildNodesFix: false, slotRelocation: true, state: true, style: true, svg: true, taskQueue: true, transformTagName: false, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: true, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: true, vdomText: true, vdomXlink: true, watchCallback: true };
 /*
  Stencil Client Platform v4.26.0 | MIT Licensed | https://stenciljs.com
@@ -115,10 +115,6 @@ var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
                     return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
                         /* webpackMode: "lazy" */
                         './ic-card-vertical.cjs.entry.js')); }).then(processMod, consoleError);
-                case 'ic-checkbox.cjs':
-                    return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
-                        /* webpackMode: "lazy" */
-                        './ic-checkbox.cjs.entry.js')); }).then(processMod, consoleError);
                 case 'ic-checkbox-group.cjs':
                     return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
                         /* webpackMode: "lazy" */
@@ -287,6 +283,10 @@ var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
                     return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
                         /* webpackMode: "lazy" */
                         './ic-breadcrumb.cjs.entry.js')); }).then(processMod, consoleError);
+                case 'ic-checkbox_3.cjs':
+                    return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
+                        /* webpackMode: "lazy" */
+                        './ic-checkbox_3.cjs.entry.js')); }).then(processMod, consoleError);
                 case 'ic-date-input.cjs':
                     return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
                         /* webpackMode: "lazy" */
@@ -295,10 +295,6 @@ var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
                     return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
                         /* webpackMode: "lazy" */
                         './ic-divider.cjs.entry.js')); }).then(processMod, consoleError);
-                case 'ic-empty-state_2.cjs':
-                    return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
-                        /* webpackMode: "lazy" */
-                        './ic-empty-state_2.cjs.entry.js')); }).then(processMod, consoleError);
                 case 'ic-menu-item.cjs':
                     return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
                         /* webpackMode: "lazy" */
@@ -2603,7 +2599,6 @@ var hostListenerProxy = (hostRef, methodName) => (ev) => {
 };
 var getHostListenerTarget = (elm, flags) => {
   if (flags & 4 /* TargetDocument */) return doc;
-  if (flags & 8 /* TargetWindow */) return win;
   return elm;
 };
 var hostListenerOpts = (flags) => supportsListenerOptions ? {
@@ -2625,4 +2620,4 @@ exports.promiseResolve = promiseResolve;
 exports.registerInstance = registerInstance;
 exports.setNonce = setNonce;
-//# sourceMappingURL=index-8a24b20c.js.map
+//# sourceMappingURL=index-d337cd8a.js.map