@limetech/lime-elements 37.1.0-next.2 → 37.1.0-next.21

package/dist/cjs/limel-dock-button.cjs.entry.js

@@ -40,6 +40,12 @@ const DockButton = class {
         (_c = this.customComponentElement) === null || _c === void 0 ? void 0 : _c.focus();
       }
     };
+    this.getOpenDirection = () => {
+      if (this.useMobileLayout) {
+        return 'top';
+      }
+      return 'right';
+    };
     this.item = undefined;
     this.expanded = false;
     this.useMobileLayout = false;
@@ -85,10 +91,10 @@ const DockButton = class {
   }
   renderTooltip() {
     if (!this.expanded && this.item.label) {
-      return (index.h("limel-tooltip", { elementId: this.tooltipId, label: this.item.label, helperLabel: this.item.helperLabel }));
+      return (index.h("limel-tooltip", { elementId: this.tooltipId, label: this.item.label, helperLabel: this.item.helperLabel, openDirection: this.getOpenDirection() }));
     }
     if (this.expanded && this.item.helperLabel) {
-      return (index.h("limel-tooltip", { elementId: this.tooltipId, label: this.item.helperLabel }));
+      return (index.h("limel-tooltip", { elementId: this.tooltipId, label: this.item.helperLabel, openDirection: this.getOpenDirection() }));
     }
   }
   static get watchers() { return {

package/dist/cjs/limel-dock-button.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"limel-dock-button.entry.cjs.js","mappings":"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","names":["h","createRandomString"],"sources":["./src/components/dock/dock-button/dock-button.scss?tag=limel-dock-button","./src/components/dock/dock-button/dock-button.tsx"],"sourcesContent":["@use '../../../style/mixins';\n@use '../../../style/functions';\n@use '../../../style/internal/variables';\n\n.button {\n    all: unset;\n    isolation: isolate;\n    position: relative;\n\n    @include mixins.is-flat-inset-clickable(\n        $color: var(--limel-dock-item-text-color),\n        $background-color: var(--dock-background-color)\n    );\n    @include mixins.visualize-keyboard-focus;\n\n    box-sizing: border-box;\n    display: flex;\n    align-items: center;\n\n    width: 100%;\n    height: var(--dock-item-height);\n\n    border-radius: functions.pxToRem(6);\n    font-size: functions.pxToRem(14);\n    padding: 0 0.5rem;\n    min-width: var(--dock-item-height);\n\n    &:hover {\n        z-index: 1;\n    }\n\n    &.selected {\n        color: var(--limel-dock-item-text-color--selected);\n        background-color: var(\n            --dock-item-background-color--selected,\n            rgb(var(--contrast-200))\n        );\n\n        box-shadow: var(--button-shadow-inset);\n\n        &:focus-visible {\n            box-shadow: var(--button-shadow-inset),\n                var(--shadow-depth-8-focused);\n        }\n\n        .icon {\n            color: var(--limel-dock-item-text--selected);\n        }\n    }\n}\n\nlimel-popover {\n    // makes buttons that are wrapped in a popover become fullwidth\n    display: grid;\n    grid-template-columns: 100%;\n}\n\n.text {\n    @include mixins.truncate-text();\n    padding-left: 0.5rem;\n    padding-right: 0.75rem;\n}\n\n.icon {\n    flex-shrink: 0;\n    width: calc(var(--dock-item-height) - 1rem);\n    height: calc(var(--dock-item-height) - 1rem);\n    color: var(--dock-item-icon-color, var(--limel-dock-item-text-color));\n}\n\nlimel-badge {\n    position: absolute;\n    top: -0.125rem;\n    right: -0.125rem;\n}\n\n// 👇 Below is a hidden and private hack\n// only for usage in Lime CRM components.\n// It enables our customers to override\n// the default Home icon, using an external URL\n// or an SVG code.\n.icon {\n    position: relative;\n\n    &:before {\n        text-align: center;\n        pointer-events: none;\n        position: absolute;\n        inset: 0;\n        background: {\n            color: var(--dock-background-color, rgb(var(--contrast-100)));\n            position: center;\n            repeat: no-repeat;\n            size: contain;\n            image: var(--limel-custom-home-icon);\n        }\n        // Since `content` defaults to `undefined`\n        // no pseudo element will be rendered, unless\n        // the consumer defines something.\n        content: var(--limel-custom-home-icon-enabler);\n\n        .button.selected & {\n            background-color: var(\n                --dock-item-background-color--selected,\n                rgb(var(--contrast-200))\n            );\n        }\n    }\n}\n","import {\n    Component,\n    Event,\n    EventEmitter,\n    h,\n    Prop,\n    State,\n    Watch,\n} from '@stencil/core';\nimport { DockItem } from '../dock.types';\nimport { createRandomString } from '../../../util/random-string';\n\n/**\n * @private\n */\n@Component({\n    tag: 'limel-dock-button',\n    shadow: false,\n    styleUrl: 'dock-button.scss',\n})\nexport class DockButton {\n    /**\n     * Item that is placed in the dock.\n     */\n    @Prop()\n    public item!: DockItem;\n\n    /**\n     * When the dock is expanded or collapsed, dock items\n     * show labels and tooltips as suitable for the layout.\n     */\n    @Prop({ reflect: true })\n    public expanded? = false;\n\n    /**\n     * When dock is using mobile layout, dock items\n     * show labels and tooltips as suitable for the layout.\n     */\n    @Prop({ reflect: true })\n    public useMobileLayout? = false;\n\n    /**\n     * Fired when a dock item has been selected from the dock.\n     */\n    @Event()\n    public itemSelected: EventEmitter<DockItem>;\n\n    /**\n     * Fired when a dock menu is opened.\n     */\n    @Event()\n    public menuOpen: EventEmitter<DockItem>;\n\n    /**\n     * Indicated whether the popover that renders a component is open.\n     */\n    @State()\n    private isOpen = false;\n\n    /**\n     * Fired when the popover is closed.\n     */\n    @Event()\n    public close: EventEmitter<void>;\n\n    private tooltipId: string;\n    private customComponentElement: HTMLElement;\n\n    constructor() {\n        this.tooltipId = createRandomString();\n    }\n\n    public render() {\n        if (this.item?.dockMenu?.componentName) {\n            return this.renderPopover();\n        }\n\n        return this.renderButton(this.handleClick);\n    }\n\n    @Watch('isOpen')\n    protected openWatcher() {\n        if (!this.isOpen) {\n            return;\n        }\n\n        const observer = new IntersectionObserver(\n            this.focusCustomComponentElement\n        );\n        observer.observe(this.customComponentElement);\n    }\n\n    private renderPopover() {\n        const CustomComponent = this.item?.dockMenu.componentName;\n\n        return (\n            <limel-popover\n                openDirection={this.useMobileLayout ? 'top' : 'right'}\n                open={this.isOpen || this.item.dockMenu.menuOpen}\n                onClose={this.onPopoverClose}\n            >\n                {this.renderButton(this.openPopover, 'trigger')}\n                <CustomComponent\n                    ref={this.setCustomComponentElement}\n                    {...(this.item.dockMenu.props || {})}\n                    onClose={this.onPopoverClose}\n                />\n            </limel-popover>\n        );\n    }\n\n    private renderButton(\n        handleClick: (event: MouseEvent) => void,\n        slot?: string\n    ) {\n        return (\n            <button\n                slot={slot}\n                tabindex=\"0\"\n                id={this.tooltipId}\n                type=\"button\"\n                class={{\n                    button: true,\n                    selected: this.item?.selected,\n                }}\n                onClick={handleClick}\n                aria-live=\"polite\"\n            >\n                {this.renderIcon()}\n                {this.renderLabel()}\n                {this.renderTooltip()}\n                {this.renderNotification()}\n            </button>\n        );\n    }\n\n    private renderNotification = () => {\n        if (this.item.badge !== undefined) {\n            return <limel-badge label={this.item.badge} />;\n        }\n    };\n\n    private openPopover = (event: MouseEvent) => {\n        event.stopPropagation();\n        this.isOpen = true;\n        this.menuOpen.emit(this.item);\n    };\n\n    private setCustomComponentElement = (element: HTMLElement) => {\n        this.customComponentElement = element;\n    };\n\n    private onPopoverClose = () => {\n        this.isOpen = false;\n        this.close.emit();\n    };\n\n    private handleClick = (event: MouseEvent) => {\n        event.stopPropagation();\n        this.itemSelected.emit(this.item);\n    };\n\n    private renderIcon() {\n        if (!this.item.icon) {\n            return;\n        }\n\n        return <limel-icon name={this.item.icon} class=\"icon\" />;\n    }\n\n    private renderLabel() {\n        if (this.expanded) {\n            return <span class=\"text\">{this.item.label}</span>;\n        }\n    }\n\n    private renderTooltip() {\n        if (!this.expanded && this.item.label) {\n            return (\n                <limel-tooltip\n                    elementId={this.tooltipId}\n                    label={this.item.label}\n                    helperLabel={this.item.helperLabel}\n                />\n            );\n        }\n\n        if (this.expanded && this.item.helperLabel) {\n            return (\n                <limel-tooltip\n                    elementId={this.tooltipId}\n                    label={this.item.helperLabel}\n                />\n            );\n        }\n    }\n\n    private focusCustomComponentElement = () => {\n        if (this.customComponentElement?.shadowRoot?.delegatesFocus) {\n            this.customComponentElement?.focus();\n        }\n    };\n}\n"],"version":3}
+{"file":"limel-dock-button.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,aAAa,GAAG,miEAAmiE;;MCoB5iE,UAAU;EAgDnB;;;;;IAoEQ,uBAAkB,GAAG;MACzB,IAAI,IAAI,CAAC,IAAI,CAAC,KAAK,KAAK,SAAS,EAAE;QAC/B,OAAOA,yBAAa,KAAK,EAAE,IAAI,CAAC,IAAI,CAAC,KAAK,GAAI,CAAC;OAClD;KACJ,CAAC;IAEM,gBAAW,GAAG,CAAC,KAAiB;MACpC,KAAK,CAAC,eAAe,EAAE,CAAC;MACxB,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;MACnB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KACjC,CAAC;IAEM,8BAAyB,GAAG,CAAC,OAAoB;MACrD,IAAI,CAAC,sBAAsB,GAAG,OAAO,CAAC;KACzC,CAAC;IAEM,mBAAc,GAAG;MACrB,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;MACpB,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;KACrB,CAAC;IAEM,gBAAW,GAAG,CAAC,KAAiB;MACpC,KAAK,CAAC,eAAe,EAAE,CAAC;MACxB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KACrC,CAAC;IAuCM,gCAA2B,GAAG;;MAClC,IAAI,MAAA,MAAA,IAAI,CAAC,sBAAsB,0CAAE,UAAU,0CAAE,cAAc,EAAE;QACzD,MAAA,IAAI,CAAC,sBAAsB,0CAAE,KAAK,EAAE,CAAC;OACxC;KACJ,CAAC;IAEM,qBAAgB,GAAG;MACvB,IAAI,IAAI,CAAC,eAAe,EAAE;QACtB,OAAO,KAAK,CAAC;OAChB;MAED,OAAO,OAAO,CAAC;KAClB,CAAC;;oBAnLiB,KAAK;2BAOE,KAAK;kBAkBd,KAAK;IAYlB,IAAI,CAAC,SAAS,GAAGC,+BAAkB,EAAE,CAAC;GACzC;EAEM,MAAM;;IACT,IAAI,MAAA,MAAA,IAAI,CAAC,IAAI,0CAAE,QAAQ,0CAAE,aAAa,EAAE;MACpC,OAAO,IAAI,CAAC,aAAa,EAAE,CAAC;KAC/B;IAED,OAAO,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;GAC9C;EAGS,WAAW;IACjB,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE;MACd,OAAO;KACV;IAED,MAAM,QAAQ,GAAG,IAAI,oBAAoB,CACrC,IAAI,CAAC,2BAA2B,CACnC,CAAC;IACF,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,sBAAsB,CAAC,CAAC;GACjD;EAEO,aAAa;;IACjB,MAAM,eAAe,GAAG,MAAA,IAAI,CAAC,IAAI,0CAAE,QAAQ,CAAC,aAAa,CAAC;IAE1D,QACID,2BACI,aAAa,EAAE,IAAI,CAAC,eAAe,GAAG,KAAK,GAAG,OAAO,EACrD,IAAI,EAAE,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,EAChD,OAAO,EAAE,IAAI,CAAC,cAAc,IAE3B,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,WAAW,EAAE,SAAS,CAAC,EAC/CA,QAAC,eAAe,kBACZ,GAAG,EAAE,IAAI,CAAC,yBAAyB,KAC9B,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,IAAI,EAAE,KACnC,OAAO,EAAE,IAAI,CAAC,cAAc,IAC9B,CACU,EAClB;GACL;EAEO,YAAY,CAChB,WAAwC,EACxC,IAAa;;IAEb,QACIA,oBACI,IAAI,EAAE,IAAI,EACV,QAAQ,EAAC,GAAG,EACZ,EAAE,EAAE,IAAI,CAAC,SAAS,EAClB,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE;QACH,MAAM,EAAE,IAAI;QACZ,QAAQ,EAAE,MAAA,IAAI,CAAC,IAAI,0CAAE,QAAQ;OAChC,EACD,OAAO,EAAE,WAAW,eACV,QAAQ,IAEjB,IAAI,CAAC,UAAU,EAAE,EACjB,IAAI,CAAC,WAAW,EAAE,EAClB,IAAI,CAAC,aAAa,EAAE,EACpB,IAAI,CAAC,kBAAkB,EAAE,CACrB,EACX;GACL;EA4BO,UAAU;IACd,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;MACjB,OAAO;KACV;IAED,OAAOA,wBAAY,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,KAAK,EAAC,MAAM,GAAG,CAAC;GAC5D;EAEO,WAAW;IACf,IAAI,IAAI,CAAC,QAAQ,EAAE;MACf,OAAOA,kBAAM,KAAK,EAAC,MAAM,IAAE,IAAI,CAAC,IAAI,CAAC,KAAK,CAAQ,CAAC;KACtD;GACJ;EAEO,aAAa;IACjB,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;MACnC,QACIA,2BACI,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,KAAK,EAAE,IAAI,CAAC,IAAI,CAAC,KAAK,EACtB,WAAW,EAAE,IAAI,CAAC,IAAI,CAAC,WAAW,EAClC,aAAa,EAAE,IAAI,CAAC,gBAAgB,EAAE,GACxC,EACJ;KACL;IAED,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE;MACxC,QACIA,2BACI,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,KAAK,EAAE,IAAI,CAAC,IAAI,CAAC,WAAW,EAC5B,aAAa,EAAE,IAAI,CAAC,gBAAgB,EAAE,GACxC,EACJ;KACL;GACJ;;;;;;;;;","names":["h","createRandomString"],"sources":["./src/components/dock/dock-button/dock-button.scss?tag=limel-dock-button","./src/components/dock/dock-button/dock-button.tsx"],"sourcesContent":["@use '../../../style/mixins';\n@use '../../../style/functions';\n@use '../../../style/internal/variables';\n\n.button {\n    all: unset;\n    isolation: isolate;\n    position: relative;\n\n    @include mixins.is-flat-inset-clickable(\n        $color: var(--limel-dock-item-text-color),\n        $background-color: var(--dock-background-color)\n    );\n    @include mixins.visualize-keyboard-focus;\n\n    box-sizing: border-box;\n    display: flex;\n    align-items: center;\n\n    width: 100%;\n    height: var(--dock-item-height);\n\n    border-radius: functions.pxToRem(6);\n    font-size: functions.pxToRem(14);\n    padding: 0 0.5rem;\n    min-width: var(--dock-item-height);\n\n    &:hover {\n        z-index: 1;\n    }\n\n    &.selected {\n        color: var(--limel-dock-item-text-color--selected);\n        background-color: var(\n            --dock-item-background-color--selected,\n            rgb(var(--contrast-200))\n        );\n\n        box-shadow: var(--button-shadow-inset);\n\n        &:focus-visible {\n            box-shadow: var(--button-shadow-inset),\n                var(--shadow-depth-8-focused);\n        }\n\n        .icon {\n            color: var(--limel-dock-item-text--selected);\n        }\n    }\n}\n\nlimel-popover {\n    // makes buttons that are wrapped in a popover become fullwidth\n    display: grid;\n    grid-template-columns: 100%;\n}\n\n.text {\n    @include mixins.truncate-text();\n    padding-left: 0.5rem;\n    padding-right: 0.75rem;\n}\n\n.icon {\n    flex-shrink: 0;\n    width: calc(var(--dock-item-height) - 1rem);\n    height: calc(var(--dock-item-height) - 1rem);\n    color: var(--dock-item-icon-color, var(--limel-dock-item-text-color));\n}\n\nlimel-badge {\n    position: absolute;\n    top: -0.125rem;\n    right: -0.125rem;\n}\n\n// 👇 Below is a hidden and private hack\n// only for usage in Lime CRM components.\n// It enables our customers to override\n// the default Home icon, using an external URL\n// or an SVG code.\n.icon {\n    position: relative;\n\n    &:before {\n        text-align: center;\n        pointer-events: none;\n        position: absolute;\n        inset: 0;\n        background: {\n            color: var(--dock-background-color, rgb(var(--contrast-100)));\n            position: center;\n            repeat: no-repeat;\n            size: contain;\n            image: var(--limel-custom-home-icon);\n        }\n        // Since `content` defaults to `undefined`\n        // no pseudo element will be rendered, unless\n        // the consumer defines something.\n        content: var(--limel-custom-home-icon-enabler);\n\n        .button.selected & {\n            background-color: var(\n                --dock-item-background-color--selected,\n                rgb(var(--contrast-200))\n            );\n        }\n    }\n}\n","import {\n    Component,\n    Event,\n    EventEmitter,\n    h,\n    Prop,\n    State,\n    Watch,\n} from '@stencil/core';\nimport { DockItem } from '../dock.types';\nimport { createRandomString } from '../../../util/random-string';\n\n/**\n * @private\n */\n@Component({\n    tag: 'limel-dock-button',\n    shadow: false,\n    styleUrl: 'dock-button.scss',\n})\nexport class DockButton {\n    /**\n     * Item that is placed in the dock.\n     */\n    @Prop()\n    public item!: DockItem;\n\n    /**\n     * When the dock is expanded or collapsed, dock items\n     * show labels and tooltips as suitable for the layout.\n     */\n    @Prop({ reflect: true })\n    public expanded? = false;\n\n    /**\n     * When dock is using mobile layout, dock items\n     * show labels and tooltips as suitable for the layout.\n     */\n    @Prop({ reflect: true })\n    public useMobileLayout? = false;\n\n    /**\n     * Fired when a dock item has been selected from the dock.\n     */\n    @Event()\n    public itemSelected: EventEmitter<DockItem>;\n\n    /**\n     * Fired when a dock menu is opened.\n     */\n    @Event()\n    public menuOpen: EventEmitter<DockItem>;\n\n    /**\n     * Indicated whether the popover that renders a component is open.\n     */\n    @State()\n    private isOpen = false;\n\n    /**\n     * Fired when the popover is closed.\n     */\n    @Event()\n    public close: EventEmitter<void>;\n\n    private tooltipId: string;\n    private customComponentElement: HTMLElement;\n\n    constructor() {\n        this.tooltipId = createRandomString();\n    }\n\n    public render() {\n        if (this.item?.dockMenu?.componentName) {\n            return this.renderPopover();\n        }\n\n        return this.renderButton(this.handleClick);\n    }\n\n    @Watch('isOpen')\n    protected openWatcher() {\n        if (!this.isOpen) {\n            return;\n        }\n\n        const observer = new IntersectionObserver(\n            this.focusCustomComponentElement\n        );\n        observer.observe(this.customComponentElement);\n    }\n\n    private renderPopover() {\n        const CustomComponent = this.item?.dockMenu.componentName;\n\n        return (\n            <limel-popover\n                openDirection={this.useMobileLayout ? 'top' : 'right'}\n                open={this.isOpen || this.item.dockMenu.menuOpen}\n                onClose={this.onPopoverClose}\n            >\n                {this.renderButton(this.openPopover, 'trigger')}\n                <CustomComponent\n                    ref={this.setCustomComponentElement}\n                    {...(this.item.dockMenu.props || {})}\n                    onClose={this.onPopoverClose}\n                />\n            </limel-popover>\n        );\n    }\n\n    private renderButton(\n        handleClick: (event: MouseEvent) => void,\n        slot?: string\n    ) {\n        return (\n            <button\n                slot={slot}\n                tabindex=\"0\"\n                id={this.tooltipId}\n                type=\"button\"\n                class={{\n                    button: true,\n                    selected: this.item?.selected,\n                }}\n                onClick={handleClick}\n                aria-live=\"polite\"\n            >\n                {this.renderIcon()}\n                {this.renderLabel()}\n                {this.renderTooltip()}\n                {this.renderNotification()}\n            </button>\n        );\n    }\n\n    private renderNotification = () => {\n        if (this.item.badge !== undefined) {\n            return <limel-badge label={this.item.badge} />;\n        }\n    };\n\n    private openPopover = (event: MouseEvent) => {\n        event.stopPropagation();\n        this.isOpen = true;\n        this.menuOpen.emit(this.item);\n    };\n\n    private setCustomComponentElement = (element: HTMLElement) => {\n        this.customComponentElement = element;\n    };\n\n    private onPopoverClose = () => {\n        this.isOpen = false;\n        this.close.emit();\n    };\n\n    private handleClick = (event: MouseEvent) => {\n        event.stopPropagation();\n        this.itemSelected.emit(this.item);\n    };\n\n    private renderIcon() {\n        if (!this.item.icon) {\n            return;\n        }\n\n        return <limel-icon name={this.item.icon} class=\"icon\" />;\n    }\n\n    private renderLabel() {\n        if (this.expanded) {\n            return <span class=\"text\">{this.item.label}</span>;\n        }\n    }\n\n    private renderTooltip() {\n        if (!this.expanded && this.item.label) {\n            return (\n                <limel-tooltip\n                    elementId={this.tooltipId}\n                    label={this.item.label}\n                    helperLabel={this.item.helperLabel}\n                    openDirection={this.getOpenDirection()}\n                />\n            );\n        }\n\n        if (this.expanded && this.item.helperLabel) {\n            return (\n                <limel-tooltip\n                    elementId={this.tooltipId}\n                    label={this.item.helperLabel}\n                    openDirection={this.getOpenDirection()}\n                />\n            );\n        }\n    }\n\n    private focusCustomComponentElement = () => {\n        if (this.customComponentElement?.shadowRoot?.delegatesFocus) {\n            this.customComponentElement?.focus();\n        }\n    };\n\n    private getOpenDirection = () => {\n        if (this.useMobileLayout) {\n            return 'top';\n        }\n\n        return 'right';\n    };\n}\n"],"version":3}

package/dist/cjs/limel-form.cjs.entry.js

@@ -28989,7 +28989,19 @@ const shouldChangeToUndefined = (value, schema) => {
 };
 const hasCustomComponent = (schema) => {
   var _a, _b;
-  return Boolean((_b = (_a = schema.lime) === null || _a === void 0 ? void 0 : _a.component) === null || _b === void 0 ? void 0 : _b.name);
+  const name = (_b = (_a = schema.lime) === null || _a === void 0 ? void 0 : _a.component) === null || _b === void 0 ? void 0 : _b.name;
+  if (!name) {
+    return false;
+  }
+  try {
+    verifyCustomComponentIsDefined(name);
+  }
+  catch (_c) {
+    // eslint-disable-next-line no-console
+    console.warn(`Custom component ${name} not defined`);
+    return false;
+  }
+  return true;
 };
 const verifyCustomComponentIsDefined = (elementName) => {
   const supportsCustomElements = 'customElements' in window;
@@ -29567,6 +29579,7 @@ function createOption(item) {
   return {
     text: item.label,
     value: item.value,
+    disabled: !!item.schema.readOnly,
   };
 }
 function findValue(value, options) {
@@ -29590,7 +29603,7 @@ function isInteger(data) {
   return Number.isInteger(Number(data));
 }
 
-const formCss = ":host{--mdc-theme-primary:var(\n      --lime-primary-color,\n      rgb(var(--color-teal-default))\n  );--mdc-theme-secondary:var(\n      --lime-secondary-color,\n      rgb(var(--contrast-1100))\n  );--mdc-theme-on-primary:var(\n      --lime-on-primary-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-on-secondary:var(\n      --lime-on-secondary-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-text-disabled-on-background:var(\n      --lime-text-disabled-on-background-color,\n      rgba(var(--contrast-1700), 0.38)\n  );--mdc-theme-text-primary-on-background:var(\n      --lime-text-primary-on-background-color,\n      rgba(var(--contrast-1700), 0.87)\n  );--mdc-theme-text-secondary-on-background:var(\n      --lime-text-secondary-on-background-color,\n      rgba(var(--contrast-1700), 0.54)\n  );--mdc-theme-error:var(\n      --lime-error-background-color,\n      rgb(var(--color-red-dark))\n  );--lime-error-text-color:rgb(var(--color-red-darker));--mdc-theme-surface:var(\n      --lime-surface-background-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-on-surface:var(\n      --lime-on-surface-color,\n      rgb(var(--contrast-1500))\n  )}.mdc-typography{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-font-family, Roboto, sans-serif)}.mdc-typography--headline1{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-headline1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:1.375rem;font-size:var(--mdc-typography-headline1-font-size, 1.375rem);line-height:1.375rem;line-height:var(--mdc-typography-headline1-line-height, 1.375rem);font-weight:300;font-weight:var(--mdc-typography-headline1-font-weight, 300);letter-spacing:-0.015625em;letter-spacing:var(--mdc-typography-headline1-letter-spacing, -0.015625em);text-decoration:inherit;text-decoration:var(--mdc-typography-headline1-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-headline1-text-transform, inherit)}.mdc-typography--headline2{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-headline2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:1rem;font-size:var(--mdc-typography-headline2-font-size, 1rem);line-height:0.875rem;line-height:var(--mdc-typography-headline2-line-height, 0.875rem);font-weight:300;font-weight:var(--mdc-typography-headline2-font-weight, 300);letter-spacing:-0.0083333333em;letter-spacing:var(--mdc-typography-headline2-letter-spacing, -0.0083333333em);text-decoration:inherit;text-decoration:var(--mdc-typography-headline2-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-headline2-text-transform, inherit)}.mdc-typography--headline3{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-headline3-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:1rem;font-size:var(--mdc-typography-headline3-font-size, 1rem);line-height:0.875rem;line-height:var(--mdc-typography-headline3-line-height, 0.875rem);font-weight:400;font-weight:var(--mdc-typography-headline3-font-weight, 400);letter-spacing:normal;letter-spacing:var(--mdc-typography-headline3-letter-spacing, normal);text-decoration:inherit;text-decoration:var(--mdc-typography-headline3-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-headline3-text-transform, inherit)}.mdc-typography--headline4{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-headline4-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:1rem;font-size:var(--mdc-typography-headline4-font-size, 1rem);line-height:0.875rem;line-height:var(--mdc-typography-headline4-line-height, 0.875rem);font-weight:400;font-weight:var(--mdc-typography-headline4-font-weight, 400);letter-spacing:0.0073529412em;letter-spacing:var(--mdc-typography-headline4-letter-spacing, 0.0073529412em);text-decoration:inherit;text-decoration:var(--mdc-typography-headline4-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-headline4-text-transform, inherit)}.mdc-typography--headline5{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-headline5-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:0.875rem;font-size:var(--mdc-typography-headline5-font-size, 0.875rem);line-height:0.875rem;line-height:var(--mdc-typography-headline5-line-height, 0.875rem);font-weight:400;font-weight:var(--mdc-typography-headline5-font-weight, 400);letter-spacing:normal;letter-spacing:var(--mdc-typography-headline5-letter-spacing, normal);text-decoration:inherit;text-decoration:var(--mdc-typography-headline5-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-headline5-text-transform, inherit)}.mdc-typography--headline6{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-headline6-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:0.875rem;font-size:var(--mdc-typography-headline6-font-size, 0.875rem);line-height:0.875rem;line-height:var(--mdc-typography-headline6-line-height, 0.875rem);font-weight:500;font-weight:var(--mdc-typography-headline6-font-weight, 500);letter-spacing:0.0125em;letter-spacing:var(--mdc-typography-headline6-letter-spacing, 0.0125em);text-decoration:inherit;text-decoration:var(--mdc-typography-headline6-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-headline6-text-transform, inherit)}.mdc-typography--subtitle1{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:0.875rem;font-size:var(--mdc-typography-subtitle1-font-size, 0.875rem);line-height:1.125rem;line-height:var(--mdc-typography-subtitle1-line-height, 1.125rem);font-weight:400;font-weight:var(--mdc-typography-subtitle1-font-weight, 400);letter-spacing:0.009375em;letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, 0.009375em);text-decoration:inherit;text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-subtitle1-text-transform, inherit)}.mdc-typography--subtitle2{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-subtitle2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:0.8125rem;font-size:var(--mdc-typography-subtitle2-font-size, 0.8125rem);line-height:1.125rem;line-height:var(--mdc-typography-subtitle2-line-height, 1.125rem);font-weight:500;font-weight:var(--mdc-typography-subtitle2-font-weight, 500);letter-spacing:0.0071428571em;letter-spacing:var(--mdc-typography-subtitle2-letter-spacing, 0.0071428571em);text-decoration:inherit;text-decoration:var(--mdc-typography-subtitle2-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-subtitle2-text-transform, inherit)}.mdc-typography--body1{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-body1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:0.8125rem;font-size:var(--mdc-typography-body1-font-size, 0.8125rem);line-height:1.5rem;line-height:var(--mdc-typography-body1-line-height, 1.5rem);font-weight:400;font-weight:var(--mdc-typography-body1-font-weight, 400);letter-spacing:0.03125em;letter-spacing:var(--mdc-typography-body1-letter-spacing, 0.03125em);text-decoration:inherit;text-decoration:var(--mdc-typography-body1-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-body1-text-transform, inherit)}.mdc-typography--body2{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-body2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:0.8125rem;font-size:var(--mdc-typography-body2-font-size, 0.8125rem);line-height:1.625rem;line-height:var(--mdc-typography-body2-line-height, 1.625rem);font-weight:400;font-weight:var(--mdc-typography-body2-font-weight, 400);letter-spacing:0.0178571429em;letter-spacing:var(--mdc-typography-body2-letter-spacing, 0.0178571429em);text-decoration:inherit;text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-body2-text-transform, inherit)}.mdc-typography--caption{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:0.6875rem;font-size:var(--mdc-typography-caption-font-size, 0.6875rem);line-height:0.875rem;line-height:var(--mdc-typography-caption-line-height, 0.875rem);font-weight:400;font-weight:var(--mdc-typography-caption-font-weight, 400);letter-spacing:0.0333333333em;letter-spacing:var(--mdc-typography-caption-letter-spacing, 0.0333333333em);text-decoration:inherit;text-decoration:var(--mdc-typography-caption-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-caption-text-transform, inherit)}.mdc-typography--button{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-button-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:0.875rem;font-size:var(--mdc-typography-button-font-size, 0.875rem);line-height:2.25rem;line-height:var(--mdc-typography-button-line-height, 2.25rem);font-weight:500;font-weight:var(--mdc-typography-button-font-weight, 500);letter-spacing:0.0892857143em;letter-spacing:var(--mdc-typography-button-letter-spacing, 0.0892857143em);text-decoration:none;text-decoration:var(--mdc-typography-button-text-decoration, none);text-transform:none;text-transform:var(--mdc-typography-button-text-transform, none)}.mdc-typography--overline{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-overline-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:0.6875rem;font-size:var(--mdc-typography-overline-font-size, 0.6875rem);line-height:0.875rem;line-height:var(--mdc-typography-overline-line-height, 0.875rem);font-weight:500;font-weight:var(--mdc-typography-overline-font-weight, 500);letter-spacing:0.1666666667em;letter-spacing:var(--mdc-typography-overline-letter-spacing, 0.1666666667em);text-decoration:none;text-decoration:var(--mdc-typography-overline-text-decoration, none);text-transform:uppercase;text-transform:var(--mdc-typography-overline-text-transform, uppercase)}.form-group{min-width:0}.limel-form-array-item--simple{display:flex;align-items:center}.limel-form-array-item--simple *:first-child{flex-grow:1}.limel-form-array-item--object{margin-bottom:0.25rem}.limel-form-layout--default{display:grid;column-gap:var(--form-column-gap, 1rem);row-gap:var(--form-row-gap, 1rem);padding:var(--form-body-padding, 1rem)}.limel-form-layout--grid{--min-height-of-one-row:3.5rem;display:grid;column-gap:var(--form-column-gap, 1rem);row-gap:var(--form-row-gap, 1rem);padding:var(--form-body-padding, 1rem);grid-template-columns:repeat(var(--number-of-columns), minmax(0, 1fr))}.limel-form-layout--grid.auto-reorder-to-avoid-empty-cells{grid-auto-flow:dense}.limel-form-layout--grid.layout-1-columns .limel-form-layout-colspan--1,.limel-form-layout--grid.layout-1-columns .limel-form-layout-colspan--2,.limel-form-layout--grid.layout-1-columns .limel-form-layout-colspan--3,.limel-form-layout--grid.layout-1-columns .limel-form-layout-colspan--4,.limel-form-layout--grid.layout-1-columns .limel-form-layout-colspan--5{grid-column:span 1}.limel-form-layout--grid.layout-2-columns .limel-form-layout-colspan--1{grid-column:span 1}.limel-form-layout--grid.layout-2-columns .limel-form-layout-colspan--2,.limel-form-layout--grid.layout-2-columns .limel-form-layout-colspan--3,.limel-form-layout--grid.layout-2-columns .limel-form-layout-colspan--4,.limel-form-layout--grid.layout-2-columns .limel-form-layout-colspan--5{grid-column:span 2}.limel-form-layout--grid.layout-3-columns .limel-form-layout-colspan--1{grid-column:span 1}.limel-form-layout--grid.layout-3-columns .limel-form-layout-colspan--2{grid-column:span 2}.limel-form-layout--grid.layout-3-columns .limel-form-layout-colspan--3,.limel-form-layout--grid.layout-3-columns .limel-form-layout-colspan--4,.limel-form-layout--grid.layout-3-columns .limel-form-layout-colspan--5{grid-column:span 3}.limel-form-layout--grid.layout-4-columns .limel-form-layout-colspan--1{grid-column:span 1}.limel-form-layout--grid.layout-4-columns .limel-form-layout-colspan--2{grid-column:span 2}.limel-form-layout--grid.layout-4-columns .limel-form-layout-colspan--3{grid-column:span 3}.limel-form-layout--grid.layout-4-columns .limel-form-layout-colspan--4,.limel-form-layout--grid.layout-4-columns .limel-form-layout-colspan--5{grid-column:span 4}.limel-form-layout--grid.layout-5-columns .limel-form-layout-colspan--1{grid-column:span 1}.limel-form-layout--grid.layout-5-columns .limel-form-layout-colspan--2{grid-column:span 2}.limel-form-layout--grid.layout-5-columns .limel-form-layout-colspan--3{grid-column:span 3}.limel-form-layout--grid.layout-5-columns .limel-form-layout-colspan--4{grid-column:span 4}.limel-form-layout--grid.layout-5-columns .limel-form-layout-colspan--5{grid-column:span 5}.limel-form-layout--grid .limel-form-layout-colspan--all{grid-column:1/-1}.limel-form-layout--grid limel-checkbox,.limel-form-layout--grid limel-switch{min-height:var(--min-height-of-one-row)}.limel-form-layout--grid limel-checkbox{margin-top:0.5rem;display:block}.limel-form-layout--grid limel-switch{margin-left:0.5rem}.form-error{color:var(--mdc-theme-error, #b00020);font-size:0.6875rem;line-height:1.5;visibility:inherit;padding-right:1rem;padding-left:1rem;padding-top:0.25rem}.button-add-new{margin-top:0.5rem;width:100%}.mdc-typography--headline1{position:relative}.form-group .mdc-typography--headline1,.form-group .mdc-typography--body1{color:rgb(var(--contrast-1100))}.form-group .mdc-typography--headline1{--mdc-typography-headline1-font-size:2rem;--mdc-typography-headline1-line-height:2.25rem;--mdc-typography-headline1-letter-spacing:-0.01rem;--mdc-typography-headline1-font-weight:400;margin-top:1.5rem;margin-bottom:0.25rem}.form-group .mdc-typography--body1{margin-top:0;margin-bottom:0.5rem}.form-group .form-group .mdc-typography--headline1,.form-group .form-group .mdc-typography--body1{color:rgb(var(--contrast-1200))}.form-group .form-group .mdc-typography--headline1{--mdc-typography-headline1-font-size:1.625rem;--mdc-typography-headline1-line-height:1.25rem;--mdc-typography-headline1-font-weight:300;margin-top:1rem}.form-group .form-group .mdc-typography--headline1:before{content:\"\";display:block;position:absolute;top:0;bottom:0;margin:auto;left:-0.75rem;background-color:var(--mdc-theme-primary);width:0.125rem;height:var(--mdc-typography-headline1-line-height);border-radius:0.125rem;opacity:0.6}.form-group .form-group .form-group .mdc-typography--headline1,.form-group .form-group .form-group .mdc-typography--body1{color:rgb(var(--contrast-1300))}.form-group .form-group .form-group .mdc-typography--headline1{--mdc-typography-headline1-font-size:1.375rem;--mdc-typography-headline1-line-height:1.5rem;margin-top:0.5rem}.form-group .form-group .form-group .mdc-typography--headline1:before{display:none}.form-group .form-group .form-group .form-group .mdc-typography--headline1,.form-group .form-group .form-group .form-group .mdc-typography--body1{color:rgb(var(--contrast-1400))}.form-group .form-group .form-group .form-group .mdc-typography--headline1{--mdc-typography-headline1-font-size:1.25rem;--mdc-typography-headline1-line-height:1.25rem;margin-top:1rem}.form-group .form-group .form-group .form-group .mdc-typography--headline1:before{display:none}.form-group .form-group .form-group .form-group .mdc-typography--headline1,.form-group .form-group .form-group .form-group .mdc-typography--body1{color:rgb(var(--contrast-1400))}.form-group .form-group .form-group .form-group .mdc-typography--headline1{--mdc-typography-headline1-font-size:1.25rem;--mdc-typography-headline1-line-height:1.25rem;margin-top:0.25rem}.form-group .form-group .form-group .form-group .mdc-typography--headline1:before{display:none}.form-group .form-group .form-group .form-group .form-group .mdc-typography--headline1,.form-group .form-group .form-group .form-group .form-group .mdc-typography--body1{color:rgb(var(--contrast-1400))}.form-group .form-group .form-group .form-group .form-group .mdc-typography--headline1{--mdc-typography-headline1-font-size:1rem;--mdc-typography-headline1-line-height:1rem;margin-top:0.25rem}.form-group .form-group .form-group .form-group .form-group .mdc-typography--headline1:before{display:none}.limel-form-row--layout{--limel-form-row-border-radius:0.375rem;--limel-form-row-icon-size:1.75rem;--limel-form-row-main-information-gap:0.5rem;display:flex;flex-direction:column}.limel-form-row--layout .row{display:flex;gap:0.5rem;flex-direction:column;padding:0.5rem 1rem}.limel-form-row--layout .row:nth-child(odd){background-color:var(--form-background-color-of-odd-rows, rgb(var(--contrast-200)))}.limel-form-row--layout .row:nth-child(even){background-color:var(--form-background-color-of-even-rows, transparent)}.limel-form-row--layout .row:first-child{border-radius:var(--limel-form-row-border-radius) var(--limel-form-row-border-radius) 0 0}.limel-form-row--layout .row:last-child{border-radius:0 0 var(--limel-form-row-border-radius) var(--limel-form-row-border-radius)}.limel-form-row--layout .main-information{display:flex;flex-direction:row;align-items:center;gap:var(--limel-form-row-main-information-gap);min-width:0}.limel-form-row--layout limel-icon{color:rgb(var(--contrast-1200));width:var(--limel-form-row-icon-size);flex-shrink:0;min-width:0}.limel-form-row--layout .title{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin:0;font-weight:normal;flex-grow:1;color:var(--mdc-theme-on-surface);font-size:var(--mdc-typography-subtitle1-font-size, 0.875rem)}.limel-form-row--layout .description{margin:0;color:var(--mdc-theme-text-secondary-on-background);font-size:var(--mdc-typography-body2-font-size, 0.8125rem);line-height:1.5}.limel-form-row--layout .has-icon .description{padding-left:calc(var(--limel-form-row-icon-size) + var(--limel-form-row-main-information-gap))}.limel-form-row--layout .form-group.field{flex-shrink:0;display:flex;align-content:center}.limel-form-row--layout .form-group.field limel-slider{min-width:8rem;display:block}";
+const formCss = ":host{--mdc-theme-primary:var(\n      --lime-primary-color,\n      rgb(var(--color-teal-default))\n  );--mdc-theme-secondary:var(\n      --lime-secondary-color,\n      rgb(var(--contrast-1100))\n  );--mdc-theme-on-primary:var(\n      --lime-on-primary-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-on-secondary:var(\n      --lime-on-secondary-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-text-disabled-on-background:var(\n      --lime-text-disabled-on-background-color,\n      rgba(var(--contrast-1700), 0.38)\n  );--mdc-theme-text-primary-on-background:var(\n      --lime-text-primary-on-background-color,\n      rgba(var(--contrast-1700), 0.87)\n  );--mdc-theme-text-secondary-on-background:var(\n      --lime-text-secondary-on-background-color,\n      rgba(var(--contrast-1700), 0.54)\n  );--mdc-theme-error:var(\n      --lime-error-background-color,\n      rgb(var(--color-red-dark))\n  );--lime-error-text-color:rgb(var(--color-red-darker));--mdc-theme-surface:var(\n      --lime-surface-background-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-on-surface:var(\n      --lime-on-surface-color,\n      rgb(var(--contrast-1500))\n  )}.mdc-typography{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-font-family, Roboto, sans-serif)}.mdc-typography--headline1{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-headline1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:1.375rem;font-size:var(--mdc-typography-headline1-font-size, 1.375rem);line-height:1.375rem;line-height:var(--mdc-typography-headline1-line-height, 1.375rem);font-weight:300;font-weight:var(--mdc-typography-headline1-font-weight, 300);letter-spacing:-0.015625em;letter-spacing:var(--mdc-typography-headline1-letter-spacing, -0.015625em);text-decoration:inherit;text-decoration:var(--mdc-typography-headline1-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-headline1-text-transform, inherit)}.mdc-typography--headline2{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-headline2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:1rem;font-size:var(--mdc-typography-headline2-font-size, 1rem);line-height:0.875rem;line-height:var(--mdc-typography-headline2-line-height, 0.875rem);font-weight:300;font-weight:var(--mdc-typography-headline2-font-weight, 300);letter-spacing:-0.0083333333em;letter-spacing:var(--mdc-typography-headline2-letter-spacing, -0.0083333333em);text-decoration:inherit;text-decoration:var(--mdc-typography-headline2-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-headline2-text-transform, inherit)}.mdc-typography--headline3{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-headline3-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:1rem;font-size:var(--mdc-typography-headline3-font-size, 1rem);line-height:0.875rem;line-height:var(--mdc-typography-headline3-line-height, 0.875rem);font-weight:400;font-weight:var(--mdc-typography-headline3-font-weight, 400);letter-spacing:normal;letter-spacing:var(--mdc-typography-headline3-letter-spacing, normal);text-decoration:inherit;text-decoration:var(--mdc-typography-headline3-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-headline3-text-transform, inherit)}.mdc-typography--headline4{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-headline4-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:1rem;font-size:var(--mdc-typography-headline4-font-size, 1rem);line-height:0.875rem;line-height:var(--mdc-typography-headline4-line-height, 0.875rem);font-weight:400;font-weight:var(--mdc-typography-headline4-font-weight, 400);letter-spacing:0.0073529412em;letter-spacing:var(--mdc-typography-headline4-letter-spacing, 0.0073529412em);text-decoration:inherit;text-decoration:var(--mdc-typography-headline4-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-headline4-text-transform, inherit)}.mdc-typography--headline5{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-headline5-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:0.875rem;font-size:var(--mdc-typography-headline5-font-size, 0.875rem);line-height:0.875rem;line-height:var(--mdc-typography-headline5-line-height, 0.875rem);font-weight:400;font-weight:var(--mdc-typography-headline5-font-weight, 400);letter-spacing:normal;letter-spacing:var(--mdc-typography-headline5-letter-spacing, normal);text-decoration:inherit;text-decoration:var(--mdc-typography-headline5-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-headline5-text-transform, inherit)}.mdc-typography--headline6{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-headline6-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:0.875rem;font-size:var(--mdc-typography-headline6-font-size, 0.875rem);line-height:0.875rem;line-height:var(--mdc-typography-headline6-line-height, 0.875rem);font-weight:500;font-weight:var(--mdc-typography-headline6-font-weight, 500);letter-spacing:0.0125em;letter-spacing:var(--mdc-typography-headline6-letter-spacing, 0.0125em);text-decoration:inherit;text-decoration:var(--mdc-typography-headline6-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-headline6-text-transform, inherit)}.mdc-typography--subtitle1{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:0.875rem;font-size:var(--mdc-typography-subtitle1-font-size, 0.875rem);line-height:1.125rem;line-height:var(--mdc-typography-subtitle1-line-height, 1.125rem);font-weight:400;font-weight:var(--mdc-typography-subtitle1-font-weight, 400);letter-spacing:0.009375em;letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, 0.009375em);text-decoration:inherit;text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-subtitle1-text-transform, inherit)}.mdc-typography--subtitle2{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-subtitle2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:0.8125rem;font-size:var(--mdc-typography-subtitle2-font-size, 0.8125rem);line-height:1.125rem;line-height:var(--mdc-typography-subtitle2-line-height, 1.125rem);font-weight:500;font-weight:var(--mdc-typography-subtitle2-font-weight, 500);letter-spacing:0.0071428571em;letter-spacing:var(--mdc-typography-subtitle2-letter-spacing, 0.0071428571em);text-decoration:inherit;text-decoration:var(--mdc-typography-subtitle2-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-subtitle2-text-transform, inherit)}.mdc-typography--body1{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-body1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:0.8125rem;font-size:var(--mdc-typography-body1-font-size, 0.8125rem);line-height:1.5rem;line-height:var(--mdc-typography-body1-line-height, 1.5rem);font-weight:400;font-weight:var(--mdc-typography-body1-font-weight, 400);letter-spacing:0.03125em;letter-spacing:var(--mdc-typography-body1-letter-spacing, 0.03125em);text-decoration:inherit;text-decoration:var(--mdc-typography-body1-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-body1-text-transform, inherit)}.mdc-typography--body2{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-body2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:0.8125rem;font-size:var(--mdc-typography-body2-font-size, 0.8125rem);line-height:1.625rem;line-height:var(--mdc-typography-body2-line-height, 1.625rem);font-weight:400;font-weight:var(--mdc-typography-body2-font-weight, 400);letter-spacing:0.0178571429em;letter-spacing:var(--mdc-typography-body2-letter-spacing, 0.0178571429em);text-decoration:inherit;text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-body2-text-transform, inherit)}.mdc-typography--caption{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:0.6875rem;font-size:var(--mdc-typography-caption-font-size, 0.6875rem);line-height:0.875rem;line-height:var(--mdc-typography-caption-line-height, 0.875rem);font-weight:400;font-weight:var(--mdc-typography-caption-font-weight, 400);letter-spacing:0.0333333333em;letter-spacing:var(--mdc-typography-caption-letter-spacing, 0.0333333333em);text-decoration:inherit;text-decoration:var(--mdc-typography-caption-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-caption-text-transform, inherit)}.mdc-typography--button{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-button-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:0.875rem;font-size:var(--mdc-typography-button-font-size, 0.875rem);line-height:2.25rem;line-height:var(--mdc-typography-button-line-height, 2.25rem);font-weight:500;font-weight:var(--mdc-typography-button-font-weight, 500);letter-spacing:0.0892857143em;letter-spacing:var(--mdc-typography-button-letter-spacing, 0.0892857143em);text-decoration:none;text-decoration:var(--mdc-typography-button-text-decoration, none);text-transform:none;text-transform:var(--mdc-typography-button-text-transform, none)}.mdc-typography--overline{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-overline-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:0.6875rem;font-size:var(--mdc-typography-overline-font-size, 0.6875rem);line-height:0.875rem;line-height:var(--mdc-typography-overline-line-height, 0.875rem);font-weight:500;font-weight:var(--mdc-typography-overline-font-weight, 500);letter-spacing:0.1666666667em;letter-spacing:var(--mdc-typography-overline-letter-spacing, 0.1666666667em);text-decoration:none;text-decoration:var(--mdc-typography-overline-text-decoration, none);text-transform:uppercase;text-transform:var(--mdc-typography-overline-text-transform, uppercase)}.form-group{min-width:0}.limel-form-array-item--simple{display:flex;align-items:center}.limel-form-array-item--simple *:first-child{flex-grow:1}limel-code-editor{margin-bottom:0.75rem}.limel-form-array-item--object{margin-bottom:0.25rem}.limel-form-layout--default{display:grid;column-gap:var(--form-column-gap, 1rem);row-gap:var(--form-row-gap, 1rem);padding:var(--form-body-padding, 1rem)}.limel-form-layout--grid{--min-height-of-one-row:3.5rem;display:grid;column-gap:var(--form-column-gap, 1rem);row-gap:var(--form-row-gap, 1rem);padding:var(--form-body-padding, 1rem);grid-template-columns:repeat(var(--number-of-columns), minmax(0, 1fr))}.limel-form-layout--grid.auto-reorder-to-avoid-empty-cells{grid-auto-flow:dense}.limel-form-layout--grid.layout-1-columns .limel-form-layout-colspan--1,.limel-form-layout--grid.layout-1-columns .limel-form-layout-colspan--2,.limel-form-layout--grid.layout-1-columns .limel-form-layout-colspan--3,.limel-form-layout--grid.layout-1-columns .limel-form-layout-colspan--4,.limel-form-layout--grid.layout-1-columns .limel-form-layout-colspan--5{grid-column:span 1}.limel-form-layout--grid.layout-2-columns .limel-form-layout-colspan--1{grid-column:span 1}.limel-form-layout--grid.layout-2-columns .limel-form-layout-colspan--2,.limel-form-layout--grid.layout-2-columns .limel-form-layout-colspan--3,.limel-form-layout--grid.layout-2-columns .limel-form-layout-colspan--4,.limel-form-layout--grid.layout-2-columns .limel-form-layout-colspan--5{grid-column:span 2}.limel-form-layout--grid.layout-3-columns .limel-form-layout-colspan--1{grid-column:span 1}.limel-form-layout--grid.layout-3-columns .limel-form-layout-colspan--2{grid-column:span 2}.limel-form-layout--grid.layout-3-columns .limel-form-layout-colspan--3,.limel-form-layout--grid.layout-3-columns .limel-form-layout-colspan--4,.limel-form-layout--grid.layout-3-columns .limel-form-layout-colspan--5{grid-column:span 3}.limel-form-layout--grid.layout-4-columns .limel-form-layout-colspan--1{grid-column:span 1}.limel-form-layout--grid.layout-4-columns .limel-form-layout-colspan--2{grid-column:span 2}.limel-form-layout--grid.layout-4-columns .limel-form-layout-colspan--3{grid-column:span 3}.limel-form-layout--grid.layout-4-columns .limel-form-layout-colspan--4,.limel-form-layout--grid.layout-4-columns .limel-form-layout-colspan--5{grid-column:span 4}.limel-form-layout--grid.layout-5-columns .limel-form-layout-colspan--1{grid-column:span 1}.limel-form-layout--grid.layout-5-columns .limel-form-layout-colspan--2{grid-column:span 2}.limel-form-layout--grid.layout-5-columns .limel-form-layout-colspan--3{grid-column:span 3}.limel-form-layout--grid.layout-5-columns .limel-form-layout-colspan--4{grid-column:span 4}.limel-form-layout--grid.layout-5-columns .limel-form-layout-colspan--5{grid-column:span 5}.limel-form-layout--grid .limel-form-layout-colspan--all{grid-column:1/-1}.limel-form-layout--grid limel-checkbox,.limel-form-layout--grid limel-switch{min-height:var(--min-height-of-one-row)}.limel-form-layout--grid limel-checkbox{margin-top:0.5rem;display:block}.limel-form-layout--grid limel-switch{margin-left:0.5rem}.form-error{color:var(--mdc-theme-error, #b00020);font-size:0.6875rem;line-height:1.5;visibility:inherit;padding-right:1rem;padding-left:1rem;padding-top:0.25rem}.button-add-new{margin-top:0.5rem;width:100%}.mdc-typography--headline1{position:relative}.form-group .mdc-typography--headline1,.form-group .mdc-typography--body1{color:rgb(var(--contrast-1100))}.form-group .mdc-typography--headline1{--mdc-typography-headline1-font-size:2rem;--mdc-typography-headline1-line-height:2.25rem;--mdc-typography-headline1-letter-spacing:-0.01rem;--mdc-typography-headline1-font-weight:400;margin-top:1.5rem;margin-bottom:0.25rem}.form-group .mdc-typography--body1{margin-top:0;margin-bottom:0.5rem}.form-group .form-group .mdc-typography--headline1,.form-group .form-group .mdc-typography--body1{color:rgb(var(--contrast-1200))}.form-group .form-group .mdc-typography--headline1{--mdc-typography-headline1-font-size:1.625rem;--mdc-typography-headline1-line-height:1.25rem;--mdc-typography-headline1-font-weight:300;margin-top:1rem}.form-group .form-group .mdc-typography--headline1:before{content:\"\";display:block;position:absolute;top:0;bottom:0;margin:auto;left:-0.75rem;background-color:var(--mdc-theme-primary);width:0.125rem;height:var(--mdc-typography-headline1-line-height);border-radius:0.125rem;opacity:0.6}.form-group .form-group .form-group .mdc-typography--headline1,.form-group .form-group .form-group .mdc-typography--body1{color:rgb(var(--contrast-1300))}.form-group .form-group .form-group .mdc-typography--headline1{--mdc-typography-headline1-font-size:1.375rem;--mdc-typography-headline1-line-height:1.5rem;margin-top:0.5rem}.form-group .form-group .form-group .mdc-typography--headline1:before{display:none}.form-group .form-group .form-group .form-group .mdc-typography--headline1,.form-group .form-group .form-group .form-group .mdc-typography--body1{color:rgb(var(--contrast-1400))}.form-group .form-group .form-group .form-group .mdc-typography--headline1{--mdc-typography-headline1-font-size:1.25rem;--mdc-typography-headline1-line-height:1.25rem;margin-top:1rem}.form-group .form-group .form-group .form-group .mdc-typography--headline1:before{display:none}.form-group .form-group .form-group .form-group .mdc-typography--headline1,.form-group .form-group .form-group .form-group .mdc-typography--body1{color:rgb(var(--contrast-1400))}.form-group .form-group .form-group .form-group .mdc-typography--headline1{--mdc-typography-headline1-font-size:1.25rem;--mdc-typography-headline1-line-height:1.25rem;margin-top:0.25rem}.form-group .form-group .form-group .form-group .mdc-typography--headline1:before{display:none}.form-group .form-group .form-group .form-group .form-group .mdc-typography--headline1,.form-group .form-group .form-group .form-group .form-group .mdc-typography--body1{color:rgb(var(--contrast-1400))}.form-group .form-group .form-group .form-group .form-group .mdc-typography--headline1{--mdc-typography-headline1-font-size:1rem;--mdc-typography-headline1-line-height:1rem;margin-top:0.25rem}.form-group .form-group .form-group .form-group .form-group .mdc-typography--headline1:before{display:none}.limel-form-row--layout{--limel-form-row-border-radius:0.375rem;--limel-form-row-icon-size:1.75rem;--limel-form-row-main-information-gap:0.5rem;display:flex;flex-direction:column}.limel-form-row--layout .row{display:flex;gap:0.5rem;flex-direction:column;padding:0.5rem 1rem}.limel-form-row--layout .row:nth-child(odd){background-color:var(--form-background-color-of-odd-rows, rgb(var(--contrast-200)))}.limel-form-row--layout .row:nth-child(even){background-color:var(--form-background-color-of-even-rows, transparent)}.limel-form-row--layout .row:first-child{border-radius:var(--limel-form-row-border-radius) var(--limel-form-row-border-radius) 0 0}.limel-form-row--layout .row:last-child{border-radius:0 0 var(--limel-form-row-border-radius) var(--limel-form-row-border-radius)}.limel-form-row--layout .main-information{display:flex;flex-direction:row;align-items:center;gap:var(--limel-form-row-main-information-gap);min-width:0}.limel-form-row--layout limel-icon{color:rgb(var(--contrast-1200));width:var(--limel-form-row-icon-size);flex-shrink:0;min-width:0}.limel-form-row--layout .title{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin:0;font-weight:normal;flex-grow:1;color:var(--mdc-theme-on-surface);font-size:var(--mdc-typography-subtitle1-font-size, 0.875rem)}.limel-form-row--layout .description{margin:0;color:var(--mdc-theme-text-secondary-on-background);font-size:var(--mdc-typography-body2-font-size, 0.8125rem);line-height:1.5}.limel-form-row--layout .has-icon .description{padding-left:calc(var(--limel-form-row-icon-size) + var(--limel-form-row-main-information-gap))}.limel-form-row--layout .form-group.field{flex-shrink:0;display:flex;align-content:center}.limel-form-row--layout .form-group.field limel-slider{min-width:8rem;display:block}";
 
 const Form = class {
   constructor(hostRef) {