npm - @limetech/lime-elements - Versions diffs - 37.65.7 → 37.65.9 - Mend

@limetech/lime-elements 37.65.7 → 37.65.9

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

package/dist/collection/components/form/templates/grid-layout.js CHANGED Viewed

@@ -30,6 +30,9 @@ export class GridLayout extends React.Component {
   handleResize() {
     requestAnimationFrame(() => {
       const element = this.elementRef.current;
+      if (!element) {
+        return;
+      }
       const width = element.getBoundingClientRect().width;
       const maxColumns = Math.min(MAX_COLUMNS, Math.max(1, Math.floor(width / (MAX_COLUMN_WIDTH * PX_PER_REM))));
       const columns = this.getColumnCount(maxColumns);

package/dist/collection/components/form/templates/grid-layout.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"grid-layout.js","sourceRoot":"","sources":["../../../../src/components/form/templates/grid-layout.ts"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { FormLayoutOptions, GridLayoutOptions } from '../form.types';\n\nconst MAX_COLUMNS = 5;\nconst MAX_COLUMN_WIDTH = 15;\nconst PX_PER_REM = 16;\nconst COLUMN_COUNT = '--number-of-columns';\n\nexport class GridLayout extends React.Component<LayoutProps, LayoutState> {\n private elementRef: React.RefObject<HTMLElement>;\n private observer: ResizeObserver;\n\n constructor(public props: LayoutProps) {\n super(props);\n\n this.handleResize = this.handleResize.bind(this);\n\n this.state = {\n maxColumns: MAX_COLUMNS,\n };\n this.elementRef = React.createRef();\n }\n\n public componentDidMount() {\n this.observer = new ResizeObserver(this.handleResize);\n this.observer.observe(this.elementRef.current);\n window.addEventListener('resize', this.handleResize, {\n capture: true,\n passive: true,\n });\n }\n\n public componentWillUnmount() {\n this.observer.unobserve(this.elementRef.current);\n window.removeEventListener('resize', this.handleResize, {\n capture: true,\n });\n }\n\n public handleResize() {\n requestAnimationFrame(() => {\n const element = this.elementRef.current;\n const width = element.getBoundingClientRect().width;\n const maxColumns = Math.min(\n MAX_COLUMNS,\n Math.max(\n 1,\n Math.floor(width / (MAX_COLUMN_WIDTH * PX_PER_REM)),\n ),\n );\n\n const columns = this.getColumnCount(maxColumns);\n if (element.style.getPropertyValue(COLUMN_COUNT) !== `${columns}`) {\n element.style.setProperty(COLUMN_COUNT, `${columns}`);\n }\n\n if (maxColumns !== this.state.maxColumns) {\n this.setState({\n maxColumns: maxColumns,\n });\n }\n });\n }\n\n public render() {\n const classes = ['limel-form-layout--grid'];\n const columns = this.getColumnCount(this.state.maxColumns);\n\n classes.push(`layout-${columns}-columns`);\n if (this.hasAutoFlowDense()) {\n classes.push('auto-reorder-to-avoid-empty-cells');\n }\n\n return React.createElement(\n 'div',\n {\n className: classes.join(' '),\n ref: this.elementRef,\n },\n this.props.children,\n );\n }\n\n private getColumnCount(maxColumns: number) {\n const layout: GridLayoutOptions = this.props.options as any;\n\n return Math.min(layout.columns \|\| MAX_COLUMNS, maxColumns);\n }\n\n private hasAutoFlowDense(): boolean {\n const layout: GridLayoutOptions = this.props.options as any;\n\n return layout.dense !== false;\n }\n}\n\ninterface LayoutProps {\n options: FormLayoutOptions;\n children?: any;\n}\n\ninterface LayoutState {\n maxColumns: number;\n}\n"]}
1	+ {"version":3,"file":"grid-layout.js","sourceRoot":"","sources":["../../../../src/components/form/templates/grid-layout.ts"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { FormLayoutOptions, GridLayoutOptions } from '../form.types';\n\nconst MAX_COLUMNS = 5;\nconst MAX_COLUMN_WIDTH = 15;\nconst PX_PER_REM = 16;\nconst COLUMN_COUNT = '--number-of-columns';\n\nexport class GridLayout extends React.Component<LayoutProps, LayoutState> {\n private elementRef: React.RefObject<HTMLElement>;\n private observer: ResizeObserver;\n\n constructor(public props: LayoutProps) {\n super(props);\n\n this.handleResize = this.handleResize.bind(this);\n\n this.state = {\n maxColumns: MAX_COLUMNS,\n };\n this.elementRef = React.createRef();\n }\n\n public componentDidMount() {\n this.observer = new ResizeObserver(this.handleResize);\n this.observer.observe(this.elementRef.current);\n window.addEventListener('resize', this.handleResize, {\n capture: true,\n passive: true,\n });\n }\n\n public componentWillUnmount() {\n this.observer.unobserve(this.elementRef.current);\n window.removeEventListener('resize', this.handleResize, {\n capture: true,\n });\n }\n\n public handleResize() {\n requestAnimationFrame(() => {\n const element = this.elementRef.current;\n if (!element) {\n return;\n }\n\n const width = element.getBoundingClientRect().width;\n const maxColumns = Math.min(\n MAX_COLUMNS,\n Math.max(\n 1,\n Math.floor(width / (MAX_COLUMN_WIDTH * PX_PER_REM)),\n ),\n );\n\n const columns = this.getColumnCount(maxColumns);\n if (element.style.getPropertyValue(COLUMN_COUNT) !== `${columns}`) {\n element.style.setProperty(COLUMN_COUNT, `${columns}`);\n }\n\n if (maxColumns !== this.state.maxColumns) {\n this.setState({\n maxColumns: maxColumns,\n });\n }\n });\n }\n\n public render() {\n const classes = ['limel-form-layout--grid'];\n const columns = this.getColumnCount(this.state.maxColumns);\n\n classes.push(`layout-${columns}-columns`);\n if (this.hasAutoFlowDense()) {\n classes.push('auto-reorder-to-avoid-empty-cells');\n }\n\n return React.createElement(\n 'div',\n {\n className: classes.join(' '),\n ref: this.elementRef,\n },\n this.props.children,\n );\n }\n\n private getColumnCount(maxColumns: number) {\n const layout: GridLayoutOptions = this.props.options as any;\n\n return Math.min(layout.columns \|\| MAX_COLUMNS, maxColumns);\n }\n\n private hasAutoFlowDense(): boolean {\n const layout: GridLayoutOptions = this.props.options as any;\n\n return layout.dense !== false;\n }\n}\n\ninterface LayoutProps {\n options: FormLayoutOptions;\n children?: any;\n}\n\ninterface LayoutState {\n maxColumns: number;\n}\n"]}

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

@@ -88,13 +88,13 @@ export class Portal {
       this.showContainer();
     }
     if ('ResizeObserver' in window) {
-      const observer = new ResizeObserver(() => {
+      this.observer = new ResizeObserver(() => {
         if (this.popperInstance) {
           this.styleContainer();
           this.popperInstance.update();
         }
       });
-      observer.observe(this.container);
+      this.observer.observe(this.container);
     }
   }
   render() {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"portal.js","sourceRoot":"","sources":["../../../src/components/portal/portal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, h, Prop, Watch } from '@stencil/core';\nimport { OpenDirection } from '../menu/menu.types';\nimport {\n createPopper,\n Instance,\n OptionsGeneric,\n Placement,\n} from '@popperjs/core';\nimport { FlipModifier } from '@popperjs/core/lib/modifiers/flip';\n\nconst IS_VISIBLE_CLASS = 'is-visible';\nconst IS_HIDING_CLASS = 'is-hiding';\nconst hideAnimationDuration = 300;\n\n/*\n The portal component provides a way to render children into a DOM node that\n * exist outside the DOM hierarchy of the parent component.\n \n When the limel-portal component is used, it creates a new DOM node (a div element)\n * and appends it to a parent element (by default, the body of the document).\n * The child elements of the limel-portal are then moved from\n * their original location in the DOM to this new div element.\n \n This technique is often used to overcome CSS stacking context issues,\n * or to render UI elements like modals, dropdowns, tooltips, etc.,\n * that need to visually \"break out\" of their container.\n \n Using this component, we ensure that the content is always rendered in the\n * correct position, and never covers its own trigger, or another component\n * that is opened in the stacking layer. This way, we don't need to worry about\n * z-indexes, or other stacking context issues.\n \n :::important\n * There are some caveats when using this component\n \n 1. Events might not bubble up as expected since the content is moved out to\n * another DOM node.\n * 2. Any styling that is applied to content from the parent will be lost, if the\n * content is just another web-component it will work without any issues.\n * Alternatively, use the `style=\"\"` html attribute.\n * 3. Any component that is placed inside the container must have a style of\n * `max-height: inherit`. This ensures that its placement is calculated\n * correctly in relation to the trigger, and that it never covers its own\n * trigger.\n * 4. When the node is moved in the DOM, `disconnectedCallback` and\n * `connectedCallback` will be invoked, so if `disconnectedCallback` is used\n * to do any tear-down, the appropriate setup will have to be done again on\n * `connectedCallback`.\n * :::\n \n @slot - Content to put inside the portal\n * @private\n * @exampleComponent limel-example-portal-basic\n /\n@Component({\n tag: 'limel-portal',\n shadow: true,\n styleUrl: 'portal.scss',\n})\nexport class Portal {\n /\n Decides which direction the portal content should open.\n /\n @Prop({ reflect: true })\n public openDirection: OpenDirection = 'bottom';\n\n /\n Position of the content.\n /\n @Prop({ reflect: true })\n public position: 'fixed' \| 'absolute' = 'absolute';\n\n /\n A unique ID.\n /\n @Prop({ reflect: true })\n public containerId: string;\n\n /\n Dynamic styling that can be applied to the container holding the content.\n /\n @Prop()\n public containerStyle: object = {};\n\n /\n Used to make a dropdown have the same width as the trigger, for example\n * in `limel-picker`.\n /\n @Prop({ reflect: true })\n public inheritParentWidth = false;\n\n /\n True if the content within the portal should be visible.\n \n If the content is from within a dialog for instance, this can be set to\n * true from false when the dialog opens to position the content properly.\n /\n @Prop({ reflect: true })\n public visible = false;\n\n /\n The element that the content should be positioned relative to.\n * Defaults to the limel-portal element.\n /\n @Prop()\n public anchor?: HTMLElement = null;\n\n @Element()\n private host: HTMLLimelPortalElement;\n\n private parents: WeakMap<HTMLElement, HTMLElement>;\n private container: HTMLElement;\n private popperInstance: Instance;\n private loaded = false;\n private observer: ResizeObserver;\n\n constructor() {\n this.parents = new WeakMap();\n }\n\n public disconnectedCallback() {\n this.removeContainer();\n this.destroyPopper();\n if (this.observer && this.container) {\n this.observer.unobserve(this.container);\n }\n\n this.container = null;\n }\n\n public connectedCallback() {\n if (!this.loaded) {\n return;\n }\n\n if (this.visible) {\n this.init();\n }\n }\n\n public componentDidLoad() {\n this.loaded = true;\n this.connectedCallback();\n }\n\n private init() {\n if (!this.host.isConnected) {\n return;\n }\n\n this.createContainer();\n this.hideContainer();\n this.attachContainer();\n this.styleContainer();\n\n if (this.visible) {\n this.createPopper();\n this.showContainer();\n }\n\n if ('ResizeObserver' in window) {\n const observer = new ResizeObserver(() => {\n if (this.popperInstance) {\n this.styleContainer();\n this.popperInstance.update();\n }\n });\n observer.observe(this.container);\n }\n }\n\n public render() {\n return <slot />;\n }\n\n @Watch('visible')\n protected onVisible() {\n if (!this.container && this.visible) {\n this.init();\n\n return;\n }\n\n if (!this.visible) {\n this.animateHideAndCleanup();\n\n return;\n }\n\n this.styleContainer();\n this.createPopper();\n requestAnimationFrame(() => {\n this.showContainer();\n });\n }\n\n private createContainer() {\n const slot: HTMLSlotElement =\n this.host.shadowRoot.querySelector('slot');\n const content =\n (slot.assignedElements && slot.assignedElements()) \|\| [];\n\n this.container = document.createElement('div');\n this.container.setAttribute('id', this.containerId);\n this.container.setAttribute('class', 'limel-portal--container');\n Object.assign(this.container, {\n portalSource: this.host,\n });\n\n content.forEach((element: HTMLElement) => {\n this.parents.set(element, element.parentElement);\n this.container.appendChild(element);\n });\n }\n\n private attachContainer() {\n this.getParent().appendChild(this.container);\n }\n\n private removeContainer() {\n if (!this.container) {\n return;\n }\n\n Array.from(this.container.children).forEach((element: HTMLElement) => {\n const parent = this.parents.get(element);\n if (!parent) {\n return;\n }\n\n parent.appendChild(element);\n });\n\n this.container.parentElement.removeChild(this.container);\n }\n\n private hideContainer() {\n if (!this.container) {\n return;\n }\n\n this.container.classList.remove(IS_VISIBLE_CLASS);\n }\n\n private showContainer() {\n this.container.classList.add(IS_VISIBLE_CLASS);\n }\n\n private animateHideAndCleanup() {\n if (!this.container) {\n return;\n }\n\n this.container.classList.add(IS_HIDING_CLASS);\n this.styleContainer();\n\n setTimeout(() => {\n this.container.classList.remove(IS_HIDING_CLASS);\n if (!this.visible) {\n this.container.classList.remove(IS_VISIBLE_CLASS);\n this.destroyPopper();\n }\n }, hideAnimationDuration);\n }\n\n private styleContainer() {\n this.setContainerWidth();\n this.setContainerHeight();\n this.setContainerStyles();\n }\n\n private setContainerWidth() {\n const hostWidth = this.host.getBoundingClientRect().width;\n\n if (this.inheritParentWidth) {\n const containerWidth = this.getContentWidth(this.container);\n let width = containerWidth;\n if (hostWidth > 0) {\n width = hostWidth;\n }\n\n this.container.style.width = `${width}px`;\n }\n }\n\n private getContentWidth(element: HTMLElement \| Element) {\n if (!element) {\n return null;\n }\n\n const width = element.getBoundingClientRect().width;\n if (width !== 0) {\n return width;\n }\n\n const elementContent = element.querySelector('');\n\n return this.getContentWidth(elementContent);\n }\n\n private setContainerStyles() {\n Object.keys(this.containerStyle).forEach((property) => {\n this.container.style[property] = this.containerStyle[property];\n });\n }\n\n private createPopper() {\n const config = this.createPopperConfig();\n\n this.popperInstance = createPopper(\n this.anchor \|\| this.host,\n this.container,\n config,\n );\n }\n\n private destroyPopper() {\n this.popperInstance?.destroy();\n this.popperInstance = null;\n }\n\n private createPopperConfig(): Partial<\n OptionsGeneric<Partial<FlipModifier>>\n > {\n const placement = this.getPlacement(this.openDirection);\n const flipPlacement = this.getFlipPlacement(this.openDirection);\n\n return {\n strategy: this.position,\n placement: placement,\n modifiers: [\n {\n name: 'flip',\n options: {\n fallbackPlacements: [flipPlacement],\n },\n },\n ],\n };\n }\n\n private getPlacement(direction: OpenDirection): Placement {\n const placements: Record<OpenDirection, Placement> = {\n 'left-start': 'left-start',\n left: 'left',\n 'left-end': 'left-end',\n 'right-start': 'right-start',\n right: 'right',\n 'right-end': 'right-end',\n 'top-start': 'top-start',\n top: 'top',\n 'top-end': 'top-end',\n 'bottom-start': 'bottom-start',\n bottom: 'bottom',\n 'bottom-end': 'bottom-end',\n };\n\n return placements[direction];\n }\n\n private getFlipPlacement(direction: OpenDirection): Placement {\n const flipPlacements: Record<OpenDirection, Placement> = {\n 'left-start': 'right-start',\n left: 'right',\n 'left-end': 'right-end',\n 'right-start': 'left-start',\n right: 'left',\n 'right-end': 'left-end',\n 'top-start': 'bottom-start',\n top: 'bottom',\n 'top-end': 'bottom-end',\n 'bottom-start': 'top-start',\n bottom: 'top',\n 'bottom-end': 'top-end',\n };\n\n return flipPlacements[direction];\n }\n\n private setContainerHeight() {\n const viewHeight = Math.max(\n document.documentElement.clientHeight \|\| 0,\n window.innerHeight \|\| 0,\n );\n\n const { top, bottom } = this.host.getBoundingClientRect();\n const spaceAboveTopOfSurface = Math.max(top, 0);\n const spaceBelowTopOfSurface = Math.max(viewHeight - bottom, 0);\n const extraCosmeticSpace = 16;\n const maxHeight =\n Math.max(spaceAboveTopOfSurface, spaceBelowTopOfSurface) -\n extraCosmeticSpace;\n\n this.container.style.maxHeight = `${maxHeight}px`;\n }\n\n // Returns the parent element where the content of the portal will be moved to.\n // It needs to have styling of the portal container.\n private getParent() {\n let element: Element \| undefined = this.anchor \|\| this.host;\n\n while (element) {\n const parent = element.closest('.limel-portal--parent');\n if (parent) {\n return parent;\n }\n\n element = (element.getRootNode() as ShadowRoot).host;\n }\n\n return document.body;\n }\n}\n"]}
1	+ {"version":3,"file":"portal.js","sourceRoot":"","sources":["../../../src/components/portal/portal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, h, Prop, Watch } from '@stencil/core';\nimport { OpenDirection } from '../menu/menu.types';\nimport {\n createPopper,\n Instance,\n OptionsGeneric,\n Placement,\n} from '@popperjs/core';\nimport { FlipModifier } from '@popperjs/core/lib/modifiers/flip';\n\nconst IS_VISIBLE_CLASS = 'is-visible';\nconst IS_HIDING_CLASS = 'is-hiding';\nconst hideAnimationDuration = 300;\n\n/*\n The portal component provides a way to render children into a DOM node that\n * exist outside the DOM hierarchy of the parent component.\n \n When the limel-portal component is used, it creates a new DOM node (a div element)\n * and appends it to a parent element (by default, the body of the document).\n * The child elements of the limel-portal are then moved from\n * their original location in the DOM to this new div element.\n \n This technique is often used to overcome CSS stacking context issues,\n * or to render UI elements like modals, dropdowns, tooltips, etc.,\n * that need to visually \"break out\" of their container.\n \n Using this component, we ensure that the content is always rendered in the\n * correct position, and never covers its own trigger, or another component\n * that is opened in the stacking layer. This way, we don't need to worry about\n * z-indexes, or other stacking context issues.\n \n :::important\n * There are some caveats when using this component\n \n 1. Events might not bubble up as expected since the content is moved out to\n * another DOM node.\n * 2. Any styling that is applied to content from the parent will be lost, if the\n * content is just another web-component it will work without any issues.\n * Alternatively, use the `style=\"\"` html attribute.\n * 3. Any component that is placed inside the container must have a style of\n * `max-height: inherit`. This ensures that its placement is calculated\n * correctly in relation to the trigger, and that it never covers its own\n * trigger.\n * 4. When the node is moved in the DOM, `disconnectedCallback` and\n * `connectedCallback` will be invoked, so if `disconnectedCallback` is used\n * to do any tear-down, the appropriate setup will have to be done again on\n * `connectedCallback`.\n * :::\n \n @slot - Content to put inside the portal\n * @private\n * @exampleComponent limel-example-portal-basic\n /\n@Component({\n tag: 'limel-portal',\n shadow: true,\n styleUrl: 'portal.scss',\n})\nexport class Portal {\n /\n Decides which direction the portal content should open.\n /\n @Prop({ reflect: true })\n public openDirection: OpenDirection = 'bottom';\n\n /\n Position of the content.\n /\n @Prop({ reflect: true })\n public position: 'fixed' \| 'absolute' = 'absolute';\n\n /\n A unique ID.\n /\n @Prop({ reflect: true })\n public containerId: string;\n\n /\n Dynamic styling that can be applied to the container holding the content.\n /\n @Prop()\n public containerStyle: object = {};\n\n /\n Used to make a dropdown have the same width as the trigger, for example\n * in `limel-picker`.\n /\n @Prop({ reflect: true })\n public inheritParentWidth = false;\n\n /\n True if the content within the portal should be visible.\n \n If the content is from within a dialog for instance, this can be set to\n * true from false when the dialog opens to position the content properly.\n /\n @Prop({ reflect: true })\n public visible = false;\n\n /\n The element that the content should be positioned relative to.\n * Defaults to the limel-portal element.\n /\n @Prop()\n public anchor?: HTMLElement = null;\n\n @Element()\n private host: HTMLLimelPortalElement;\n\n private parents: WeakMap<HTMLElement, HTMLElement>;\n private container: HTMLElement;\n private popperInstance: Instance;\n private loaded = false;\n private observer: ResizeObserver;\n\n constructor() {\n this.parents = new WeakMap();\n }\n\n public disconnectedCallback() {\n this.removeContainer();\n this.destroyPopper();\n if (this.observer && this.container) {\n this.observer.unobserve(this.container);\n }\n\n this.container = null;\n }\n\n public connectedCallback() {\n if (!this.loaded) {\n return;\n }\n\n if (this.visible) {\n this.init();\n }\n }\n\n public componentDidLoad() {\n this.loaded = true;\n this.connectedCallback();\n }\n\n private init() {\n if (!this.host.isConnected) {\n return;\n }\n\n this.createContainer();\n this.hideContainer();\n this.attachContainer();\n this.styleContainer();\n\n if (this.visible) {\n this.createPopper();\n this.showContainer();\n }\n\n if ('ResizeObserver' in window) {\n this.observer = new ResizeObserver(() => {\n if (this.popperInstance) {\n this.styleContainer();\n this.popperInstance.update();\n }\n });\n this.observer.observe(this.container);\n }\n }\n\n public render() {\n return <slot />;\n }\n\n @Watch('visible')\n protected onVisible() {\n if (!this.container && this.visible) {\n this.init();\n\n return;\n }\n\n if (!this.visible) {\n this.animateHideAndCleanup();\n\n return;\n }\n\n this.styleContainer();\n this.createPopper();\n requestAnimationFrame(() => {\n this.showContainer();\n });\n }\n\n private createContainer() {\n const slot: HTMLSlotElement =\n this.host.shadowRoot.querySelector('slot');\n const content =\n (slot.assignedElements && slot.assignedElements()) \|\| [];\n\n this.container = document.createElement('div');\n this.container.setAttribute('id', this.containerId);\n this.container.setAttribute('class', 'limel-portal--container');\n Object.assign(this.container, {\n portalSource: this.host,\n });\n\n content.forEach((element: HTMLElement) => {\n this.parents.set(element, element.parentElement);\n this.container.appendChild(element);\n });\n }\n\n private attachContainer() {\n this.getParent().appendChild(this.container);\n }\n\n private removeContainer() {\n if (!this.container) {\n return;\n }\n\n Array.from(this.container.children).forEach((element: HTMLElement) => {\n const parent = this.parents.get(element);\n if (!parent) {\n return;\n }\n\n parent.appendChild(element);\n });\n\n this.container.parentElement.removeChild(this.container);\n }\n\n private hideContainer() {\n if (!this.container) {\n return;\n }\n\n this.container.classList.remove(IS_VISIBLE_CLASS);\n }\n\n private showContainer() {\n this.container.classList.add(IS_VISIBLE_CLASS);\n }\n\n private animateHideAndCleanup() {\n if (!this.container) {\n return;\n }\n\n this.container.classList.add(IS_HIDING_CLASS);\n this.styleContainer();\n\n setTimeout(() => {\n this.container.classList.remove(IS_HIDING_CLASS);\n if (!this.visible) {\n this.container.classList.remove(IS_VISIBLE_CLASS);\n this.destroyPopper();\n }\n }, hideAnimationDuration);\n }\n\n private styleContainer() {\n this.setContainerWidth();\n this.setContainerHeight();\n this.setContainerStyles();\n }\n\n private setContainerWidth() {\n const hostWidth = this.host.getBoundingClientRect().width;\n\n if (this.inheritParentWidth) {\n const containerWidth = this.getContentWidth(this.container);\n let width = containerWidth;\n if (hostWidth > 0) {\n width = hostWidth;\n }\n\n this.container.style.width = `${width}px`;\n }\n }\n\n private getContentWidth(element: HTMLElement \| Element) {\n if (!element) {\n return null;\n }\n\n const width = element.getBoundingClientRect().width;\n if (width !== 0) {\n return width;\n }\n\n const elementContent = element.querySelector('');\n\n return this.getContentWidth(elementContent);\n }\n\n private setContainerStyles() {\n Object.keys(this.containerStyle).forEach((property) => {\n this.container.style[property] = this.containerStyle[property];\n });\n }\n\n private createPopper() {\n const config = this.createPopperConfig();\n\n this.popperInstance = createPopper(\n this.anchor \|\| this.host,\n this.container,\n config,\n );\n }\n\n private destroyPopper() {\n this.popperInstance?.destroy();\n this.popperInstance = null;\n }\n\n private createPopperConfig(): Partial<\n OptionsGeneric<Partial<FlipModifier>>\n > {\n const placement = this.getPlacement(this.openDirection);\n const flipPlacement = this.getFlipPlacement(this.openDirection);\n\n return {\n strategy: this.position,\n placement: placement,\n modifiers: [\n {\n name: 'flip',\n options: {\n fallbackPlacements: [flipPlacement],\n },\n },\n ],\n };\n }\n\n private getPlacement(direction: OpenDirection): Placement {\n const placements: Record<OpenDirection, Placement> = {\n 'left-start': 'left-start',\n left: 'left',\n 'left-end': 'left-end',\n 'right-start': 'right-start',\n right: 'right',\n 'right-end': 'right-end',\n 'top-start': 'top-start',\n top: 'top',\n 'top-end': 'top-end',\n 'bottom-start': 'bottom-start',\n bottom: 'bottom',\n 'bottom-end': 'bottom-end',\n };\n\n return placements[direction];\n }\n\n private getFlipPlacement(direction: OpenDirection): Placement {\n const flipPlacements: Record<OpenDirection, Placement> = {\n 'left-start': 'right-start',\n left: 'right',\n 'left-end': 'right-end',\n 'right-start': 'left-start',\n right: 'left',\n 'right-end': 'left-end',\n 'top-start': 'bottom-start',\n top: 'bottom',\n 'top-end': 'bottom-end',\n 'bottom-start': 'top-start',\n bottom: 'top',\n 'bottom-end': 'top-end',\n };\n\n return flipPlacements[direction];\n }\n\n private setContainerHeight() {\n const viewHeight = Math.max(\n document.documentElement.clientHeight \|\| 0,\n window.innerHeight \|\| 0,\n );\n\n const { top, bottom } = this.host.getBoundingClientRect();\n const spaceAboveTopOfSurface = Math.max(top, 0);\n const spaceBelowTopOfSurface = Math.max(viewHeight - bottom, 0);\n const extraCosmeticSpace = 16;\n const maxHeight =\n Math.max(spaceAboveTopOfSurface, spaceBelowTopOfSurface) -\n extraCosmeticSpace;\n\n this.container.style.maxHeight = `${maxHeight}px`;\n }\n\n // Returns the parent element where the content of the portal will be moved to.\n // It needs to have styling of the portal container.\n private getParent() {\n let element: Element \| undefined = this.anchor \|\| this.host;\n\n while (element) {\n const parent = element.closest('.limel-portal--parent');\n if (parent) {\n return parent;\n }\n\n element = (element.getRootNode() as ShadowRoot).host;\n }\n\n return document.body;\n }\n}\n"]}

package/dist/esm/limel-form.entry.js CHANGED Viewed

@@ -23931,6 +23931,9 @@ class GridLayout extends react.Component {
   handleResize() {
     requestAnimationFrame(() => {
       const element = this.elementRef.current;
+      if (!element) {
+        return;
+      }
       const width = element.getBoundingClientRect().width;
       const maxColumns = Math.min(MAX_COLUMNS, Math.max(1, Math.floor(width / (MAX_COLUMN_WIDTH * PX_PER_REM))));
       const columns = this.getColumnCount(maxColumns);