{"version":3,"file":"table.element-vJmPaibM.js","sources":["../../../src/packages/core/components/backoffice-modal-container/backoffice-modal-container.element.ts","../../../src/packages/core/components/backoffice-notification-container/backoffice-notification-container.element.ts","../../../src/packages/core/components/body-layout/body-layout.element.ts","../../../src/packages/core/components/code-block/code-block.element.ts","../../../src/packages/core/components/dropdown/dropdown.element.ts","../../../src/packages/core/components/entity-actions-bundle/entity-actions-bundle.element.ts","../../../src/packages/core/components/footer-layout/footer-layout.element.ts","../../../src/packages/core/components/header-app/header-app-button.element.ts","../../../src/packages/core/components/history/history-item.element.ts","../../../src/packages/core/components/history/history-list.element.ts","../../../src/packages/core/components/icon/icon.element.ts","../../../src/packages/core/components/input-collection-configuration/input-collection-configuration.element.ts","../../../src/packages/core/components/input-color/input-color.element.ts","../../../src/packages/core/components/input-date/input-date.element.ts","../../../src/packages/core/components/input-dropdown/input-dropdown-list.element.ts","../../../src/packages/core/components/input-entity/input-entity.element.ts","../../../src/packages/core/components/input-eye-dropper/input-eye-dropper.element.ts","../../../src/packages/core/components/input-manifest/input-manifest.element.ts","../../../src/packages/core/components/input-number-range/input-number-range.element.ts","../../../src/packages/core/components/input-radio-button-list/input-radio-button-list.element.ts","../../../src/packages/core/components/input-slider/input-slider.element.ts","../../../src/packages/core/components/input-toggle/input-toggle.element.ts","../../../src/packages/core/components/input-with-alias/input-with-alias.element.ts","../../../src/packages/core/components/multiple-color-picker-input/multiple-color-picker-input.element.ts","../../../src/packages/core/components/multiple-color-picker-input/multiple-color-picker-item-input.element.ts","../../../src/packages/core/components/multiple-text-string-input/input-multiple-text-string.element.ts","../../../src/packages/core/components/multiple-text-string-input/input-multiple-text-string-item.element.ts","../../../src/packages/core/components/popover-layout/popover-layout.element.ts","../../../src/packages/core/components/ref-item/ref-item.element.ts","../../../src/packages/core/components/stack/stack.element.ts","../../../src/packages/core/components/split-panel/split-panel.element.ts","../../../src/packages/core/components/table/table.element.ts"],"sourcesContent":["import { UmbTextStyles } from '@umbraco-cms/backoffice/style';\r\nimport type { CSSResultGroup } from '@umbraco-cms/backoffice/external/lit';\r\nimport { css, html, repeat, customElement, state, nothing, property } from '@umbraco-cms/backoffice/external/lit';\r\nimport type { UmbModalManagerContext, UmbModalContext } from '@umbraco-cms/backoffice/modal';\r\nimport { UMB_MODAL_MANAGER_CONTEXT, UmbModalElement } from '@umbraco-cms/backoffice/modal';\r\nimport { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';\r\n\r\n@customElement('umb-backoffice-modal-container')\r\nexport class UmbBackofficeModalContainerElement extends UmbLitElement {\r\n\t@state()\r\n\tprivate _modalElementMap: Map = new Map();\r\n\r\n\t@state()\r\n\t_modals: Array = [];\r\n\r\n\t@property({ type: Boolean, reflect: true, attribute: 'fill-background' })\r\n\tfillBackground = false;\r\n\r\n\tprivate _modalManager?: UmbModalManagerContext;\r\n\r\n\tconstructor() {\r\n\t\tsuper();\r\n\r\n\t\tthis.consumeContext(UMB_MODAL_MANAGER_CONTEXT, (instance) => {\r\n\t\t\t//TODO: This is being called way to many times if first page load includes an open modal.\r\n\t\t\tthis._modalManager = instance;\r\n\t\t\tthis._observeModals();\r\n\t\t});\r\n\t}\r\n\r\n\tprivate _observeModals() {\r\n\t\tif (!this._modalManager) return;\r\n\t\tthis.observe(this._modalManager.modals, (modals) => {\r\n\t\t\tthis.#createModalElements(modals);\r\n\t\t});\r\n\t}\r\n\r\n\t/**\r\n\t * We cannot render the umb-modal element directly in the uui-modal-container because it wont get recognized by UUI.\r\n\t * We therefore have a helper class which creates the uui-modal element and returns it.\r\n\t * @param modals\r\n\t */\r\n\t#createModalElements(modals: Array) {\r\n\t\tthis.fillBackground = false;\r\n\t\tconst oldValue = this._modals;\r\n\t\tthis._modals = modals;\r\n\r\n\t\tconst oldModals = oldValue.filter((oldModal) => !modals.some((modal) => modal.key === oldModal.key));\r\n\r\n\t\toldModals.forEach((modal) => {\r\n\t\t\t// TODO: I would not think this works as expected, the callback method has to be the exact same instance as the one added: [NL]\r\n\t\t\tthis._modalElementMap.get(modal.key)?.removeEventListener('close-end', this.#onCloseEnd.bind(this, modal.key));\r\n\t\t\tthis._modalElementMap.delete(modal.key);\r\n\t\t});\r\n\r\n\t\tif (this._modals.length === 0) {\r\n\t\t\t//this._modalElementMap.clear(); // should not make a difference now that we clean it above. [NL]\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tthis._modals.forEach(async (modalContext) => {\r\n\t\t\tif (this._modalElementMap.has(modalContext.key)) return;\r\n\r\n\t\t\tconst modalElement = new UmbModalElement();\r\n\t\t\tawait modalElement.init(modalContext);\r\n\r\n\t\t\tmodalElement.element?.addEventListener('close-end', this.#onCloseEnd.bind(this, modalContext.key));\r\n\t\t\tmodalContext.addEventListener('umb:destroy', this.#onCloseEnd.bind(this, modalContext.key));\r\n\r\n\t\t\tthis._modalElementMap.set(modalContext.key, modalElement);\r\n\r\n\t\t\t// If any of the modals are fillBackground, set the fillBackground property to true\r\n\t\t\tif (modalContext.backdropBackground) {\r\n\t\t\t\tthis.fillBackground = true;\r\n\t\t\t\tthis.shadowRoot\r\n\t\t\t\t\t?.getElementById('container')\r\n\t\t\t\t\t?.style.setProperty('--backdrop-background', modalContext.backdropBackground);\r\n\t\t\t}\r\n\r\n\t\t\tthis.requestUpdate('_modalElementMap');\r\n\t\t});\r\n\t}\r\n\r\n\t#onCloseEnd(key: string) {\r\n\t\tthis._modalManager?.remove(key);\r\n\t}\r\n\r\n\t#renderModal(key: string) {\r\n\t\tconst modalElement = this._modalElementMap.get(key);\r\n\t\tif (!modalElement) return nothing;\r\n\r\n\t\treturn modalElement.render();\r\n\t}\r\n\r\n\toverride render() {\r\n\t\treturn html`\r\n\t\t\t\r\n\t\t\t\t${this._modals.length > 0\r\n\t\t\t\t\t? repeat(\r\n\t\t\t\t\t\t\tthis._modals,\r\n\t\t\t\t\t\t\t(modal) => modal.key,\r\n\t\t\t\t\t\t\t(modal) => this.#renderModal(modal.key),\r\n\t\t\t\t\t\t)\r\n\t\t\t\t\t: ''}\r\n\t\t\t\r\n\t\t`;\r\n\t}\r\n\r\n\tstatic override styles: CSSResultGroup = [\r\n\t\tUmbTextStyles,\r\n\t\tcss`\r\n\t\t\t:host {\r\n\t\t\t\tposition: absolute;\r\n\t\t\t\tz-index: 1000;\r\n\t\t\t}\r\n\r\n\t\t\t:host([fill-background]) {\r\n\t\t\t\t--uui-modal-dialog-border-radius: 0;\r\n\t\t\t\t--uui-shadow-depth-5: 0;\r\n\t\t\t}\r\n\r\n\t\t\t:host([fill-background]) #container::after {\r\n\t\t\t\tbackground: var(--backdrop-background);\r\n\t\t\t}\r\n\t\t`,\r\n\t];\r\n}\r\n\r\ndeclare global {\r\n\tinterface HTMLElementTagNameMap {\r\n\t\t'umb-backoffice-modal-container': UmbBackofficeModalContainerElement;\r\n\t}\r\n}\r\n","import { UmbTextStyles } from '@umbraco-cms/backoffice/style';\r\nimport type { CSSResultGroup } from '@umbraco-cms/backoffice/external/lit';\r\nimport { css, html, customElement, state, repeat, query } from '@umbraco-cms/backoffice/external/lit';\r\nimport type { UmbNotificationHandler, UmbNotificationContext } from '@umbraco-cms/backoffice/notification';\r\nimport { UMB_NOTIFICATION_CONTEXT } from '@umbraco-cms/backoffice/notification';\r\nimport { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';\r\n\r\n@customElement('umb-backoffice-notification-container')\r\nexport class UmbBackofficeNotificationContainerElement extends UmbLitElement {\r\n\t@query('#notifications')\r\n\tprivate _notificationsElement?: HTMLElement;\r\n\r\n\t@state()\r\n\tprivate _notifications?: UmbNotificationHandler[];\r\n\r\n\tprivate _notificationContext?: UmbNotificationContext;\r\n\r\n\tconstructor() {\r\n\t\tsuper();\r\n\r\n\t\tthis.consumeContext(UMB_NOTIFICATION_CONTEXT, (instance) => {\r\n\t\t\tthis._notificationContext = instance;\r\n\t\t\tthis._observeNotifications();\r\n\t\t});\r\n\t}\r\n\r\n\tprivate _observeNotifications() {\r\n\t\tif (!this._notificationContext) return;\r\n\r\n\t\tthis.observe(this._notificationContext.notifications, (notifications) => {\r\n\t\t\tthis._notifications = notifications;\r\n\r\n\t\t\t// Close and instantly open the popover again to make sure it stays on top of all other content on the page\r\n\t\t\t// TODO: This ignorer is just needed for JSON SCHEMA TO WORK, As its not updated with latest TS jet.\r\n\t\t\t// eslint-disable-next-line @typescript-eslint/ban-ts-comment\r\n\t\t\t// @ts-ignore\r\n\t\t\tthis._notificationsElement?.hidePopover?.(); // To prevent issues in FireFox I added `?.` before `()` [NL]\r\n\t\t\t// TODO: This ignorer is just needed for JSON SCHEMA TO WORK, As its not updated with latest TS jet.\r\n\t\t\t// eslint-disable-next-line @typescript-eslint/ban-ts-comment\r\n\t\t\t// @ts-ignore\r\n\t\t\tthis._notificationsElement?.showPopover?.(); // To prevent issues in FireFox I added `?.` before `()` [NL]\r\n\t\t});\r\n\t}\r\n\r\n\toverride render() {\r\n\t\treturn html`\r\n\t\t\t\r\n\t\t\t\t${this._notifications\r\n\t\t\t\t\t? repeat(\r\n\t\t\t\t\t\t\tthis._notifications,\r\n\t\t\t\t\t\t\t(notification: UmbNotificationHandler) => notification.key,\r\n\t\t\t\t\t\t\t(notification) => html`${notification.element}`,\r\n\t\t\t\t\t\t)\r\n\t\t\t\t\t: ''}\r\n\t\t\t\r\n\t\t`;\r\n\t}\r\n\r\n\tstatic override styles: CSSResultGroup = [\r\n\t\tUmbTextStyles,\r\n\t\tcss`\r\n\t\t\t#notifications {\r\n\t\t\t\ttop: 0;\r\n\t\t\t\tleft: 0;\r\n\t\t\t\tright: 0;\r\n\t\t\t\tbottom: 45px;\r\n\t\t\t\theight: auto;\r\n\t\t\t\tpadding: var(--uui-size-layout-1);\r\n\r\n\t\t\t\tposition: fixed;\r\n\t\t\t\twidth: 100vw;\r\n\t\t\t\tbackground: 0;\r\n\t\t\t\toutline: 0;\r\n\t\t\t\tborder: 0;\r\n\t\t\t\tmargin: 0;\r\n\t\t\t}\r\n\t\t`,\r\n\t];\r\n}\r\n\r\ndeclare global {\r\n\tinterface HTMLElementTagNameMap {\r\n\t\t'umb-backoffice-notification-container': UmbBackofficeNotificationContainerElement;\r\n\t}\r\n}\r\n","import { UmbTextStyles } from '@umbraco-cms/backoffice/style';\r\nimport {\r\n\tcss,\r\n\thtml,\r\n\tLitElement,\r\n\tnothing,\r\n\tcustomElement,\r\n\tproperty,\r\n\tstate,\r\n\tquery,\r\n} from '@umbraco-cms/backoffice/external/lit';\r\n\r\n//TODO: Add the following attributes to JSDocs: header-transparent, main-no-padding, header-no-padding, header-fit-height\r\n\r\n/**\r\n * @element umb-body-layout\r\n * @description Layout element to arrange elements in a body layout. A general layout for most views.\r\n * @slot - Slot for main content\r\n * @slot icon - Slot for icon\r\n * @slot name - Slot for name\r\n * @slot header - Slot for header element\r\n * @slot footer - Slot for footer element\r\n * @slot footer-info - Slot for info in the footer\r\n * @slot actions - Slot for actions in the footer\r\n * @slot default - slot for main content\r\n * @class UmbBodyLayout\r\n * @augments {UmbLitElement}\r\n */\r\n@customElement('umb-body-layout')\r\nexport class UmbBodyLayoutElement extends LitElement {\r\n\t@query('#main')\r\n\tprivate _scrollContainer?: HTMLElement;\r\n\r\n\t@property()\r\n\tpublic headline = '';\r\n\r\n\t@property({ type: Boolean, reflect: true, attribute: 'header-transparent' })\r\n\tpublic headerTransparent = false;\r\n\r\n\t@property({ type: Boolean })\r\n\tloading = false;\r\n\r\n\t@state()\r\n\tprivate _headerSlotHasChildren = false;\r\n\r\n\t@state()\r\n\tprivate _navigationSlotHasChildren = false;\r\n\r\n\t@state()\r\n\tprivate _actionsMenuSlotHasChildren = false;\r\n\r\n\t@state()\r\n\tprivate _footerSlotHasChildren = false;\r\n\r\n\t@state()\r\n\tprivate _actionsSlotHasChildren = false;\r\n\r\n\t#hasNodes = (e: Event) => {\r\n\t\treturn (e.target as HTMLSlotElement).assignedNodes({ flatten: true }).length > 0;\r\n\t};\r\n\r\n\toverride connectedCallback(): void {\r\n\t\tsuper.connectedCallback();\r\n\t\tif (this.headerTransparent) {\r\n\t\t\trequestAnimationFrame(() => {\r\n\t\t\t\tthis._scrollContainer?.addEventListener('scroll', this.#onScroll);\r\n\t\t\t});\r\n\t\t}\r\n\t}\r\n\r\n\toverride disconnectedCallback(): void {\r\n\t\tsuper.disconnectedCallback();\r\n\t\tthis._scrollContainer?.removeEventListener('scroll', this.#onScroll);\r\n\t}\r\n\r\n\t#onScroll = () => {\r\n\t\tif (!this._scrollContainer) return;\r\n\t\tthis.toggleAttribute('scrolling', this._scrollContainer.scrollTop > 0);\r\n\t};\r\n\r\n\t#setSlotVisibility(target: HTMLElement, hasChildren: boolean) {\r\n\t\ttarget.style.display = hasChildren ? 'flex' : 'none';\r\n\t}\r\n\r\n\toverride render() {\r\n\t\treturn html`\r\n\t\t\t\r\n\t\t\t\t${this.headline ? html`

${this.headline}

` : nothing}\r\n\r\n\t\t\t\t {\r\n\t\t\t\t\t\tthis._headerSlotHasChildren = this.#hasNodes(e);\r\n\t\t\t\t\t\tthis.#setSlotVisibility(e.target as HTMLElement, this._headerSlotHasChildren);\r\n\t\t\t\t\t}}>\r\n\t\t\t\t {\r\n\t\t\t\t\t\tthis._navigationSlotHasChildren = this.#hasNodes(e);\r\n\t\t\t\t\t\tthis.#setSlotVisibility(e.target as HTMLElement, this._navigationSlotHasChildren);\r\n\t\t\t\t\t}}>\r\n\t\t\t\t {\r\n\t\t\t\t\t\tthis._actionsMenuSlotHasChildren = this.#hasNodes(e);\r\n\t\t\t\t\t\tthis.#setSlotVisibility(e.target as HTMLElement, this._actionsMenuSlotHasChildren);\r\n\t\t\t\t\t}}>\r\n\t\t\t\r\n\r\n\t\t\t\r\n\t\t\t
\r\n\t\t\t\t${this.loading ? html`` : nothing}\r\n\t\t\t\t\r\n\t\t\t
\r\n\r\n\t\t\t\r\n\t\t\t\r\n\t\t\t\t {\r\n\t\t\t\t\t\tthis._footerSlotHasChildren = this.#hasNodes(e);\r\n\t\t\t\t\t}}>\r\n\t\t\t\t {\r\n\t\t\t\t\t\tthis._actionsSlotHasChildren = this.#hasNodes(e);\r\n\t\t\t\t\t}}>\r\n\t\t\t\r\n\t\t`;\r\n\t}\r\n\r\n\tstatic override styles = [\r\n\t\tUmbTextStyles,\r\n\t\tcss`\r\n\t\t\t:host {\r\n\t\t\t\tdisplay: flex;\r\n\t\t\t\tbackground-color: var(--umb-body-layout-color-background, var(--uui-color-background));\r\n\t\t\t\twidth: 100%;\r\n\t\t\t\theight: 100%;\r\n\t\t\t\tflex-direction: column;\r\n\t\t\t}\r\n\r\n\t\t\t#header {\r\n\t\t\t\tdisplay: flex;\r\n\t\t\t\talign-items: center;\r\n\t\t\t\tjustify-content: space-between;\r\n\t\t\t\twidth: 100%;\r\n\t\t\t\theight: var(--umb-header-layout-height);\r\n\t\t\t\tbackground-color: var(--uui-color-surface);\r\n\t\t\t\tborder-bottom: 1px solid var(--uui-color-border);\r\n\t\t\t\tbox-sizing: border-box;\r\n\t\t\t\tz-index: 1;\r\n\t\t\t}\r\n\t\t\t:host([header-transparent]) #header {\r\n\t\t\t\tbackground-color: transparent;\r\n\t\t\t\tborder-color: transparent;\r\n\t\t\t\ttransition: box-shadow 150ms ease-in-out;\r\n\t\t\t\tbox-shadow: 0 -1px 0px 0px rgba(0, 0, 0, 0.5);\r\n\t\t\t}\r\n\t\t\t:host([header-transparent][scrolling]) #header {\r\n\t\t\t\t/* This should be using the uui-shadows but for now they are too drastic for this use case */\r\n\t\t\t\tbox-shadow: 0 1px 15px 0 rgba(0, 0, 0, 0.2);\r\n\t\t\t}\r\n\t\t\t:host([header-fit-height][header-transparent]:not([header-no-padding])) #header-slot {\r\n\t\t\t\tpadding: var(--uui-size-layout-1);\r\n\t\t\t}\r\n\t\t\t:host([header-fit-height]) #header {\r\n\t\t\t\theight: fit-content;\r\n\t\t\t}\r\n\t\t\t#header-slot {\r\n\t\t\t\tpadding: 0 var(--uui-size-layout-1);\r\n\t\t\t\tflex-grow: 1;\r\n\t\t\t}\r\n\t\t\t:host([header-no-padding]) #header-slot {\r\n\t\t\t\tpadding: 0;\r\n\t\t\t}\r\n\r\n\t\t\t:host([header-transparent]:not([main-no-padding])) #main:not(*[style='display: none'] + *) {\r\n\t\t\t\t/* The following styling is only applied if the clear-header IS present,\r\n\t\t\t\tthe main-no-padding attribute is NOT present, and the header is NOT hidden */\r\n\t\t\t\tpadding-top: var(--uui-size-space-1);\r\n\t\t\t}\r\n\t\t\t:host([main-no-padding]) #main {\r\n\t\t\t\tpadding: 0;\r\n\t\t\t}\r\n\r\n\t\t\t#header-slot,\r\n\t\t\t#action-menu-slot,\r\n\t\t\t#navigation-slot {\r\n\t\t\t\tdisplay: none;\r\n\t\t\t\theight: 100%;\r\n\t\t\t\talign-items: center;\r\n\t\t\t\tbox-sizing: border-box;\r\n\t\t\t\tmin-width: 0;\r\n\t\t\t}\r\n\r\n\t\t\t#navigation-slot {\r\n\t\t\t\tmargin-left: auto;\r\n\t\t\t}\r\n\r\n\t\t\t#headline {\r\n\t\t\t\tdisplay: block;\r\n\t\t\t\tmargin: 0 var(--uui-size-layout-1);\r\n\t\t\t}\r\n\r\n\t\t\t#main {\r\n\t\t\t\tdisplay: block;\r\n\t\t\t\tflex: 1;\r\n\t\t\t\tflex-direction: column;\r\n\t\t\t\toverflow-y: auto;\r\n\t\t\t\tpadding: var(--uui-size-layout-1);\r\n\t\t\t}\r\n\r\n\t\t\t#main > slot::slotted(*:first-child) {\r\n\t\t\t\tpadding-top: 0;\r\n\t\t\t\tmargin-top: 0;\r\n\t\t\t}\r\n\t\t`,\r\n\t];\r\n}\r\n\r\ndeclare global {\r\n\tinterface HTMLElementTagNameMap {\r\n\t\t'umb-body-layout': UmbBodyLayoutElement;\r\n\t}\r\n}\r\n","import { UmbTextStyles } from '@umbraco-cms/backoffice/style';\r\nimport { css, customElement, html, property, state, when, LitElement } from '@umbraco-cms/backoffice/external/lit';\r\n\r\n//TODO consider adding a highlight prop to the code block, that could spin up/access monaco instance and highlight the code\r\n\r\n/**\r\n * A simple styled box for showing code-based error messages or blocks od code.\r\n * @slot - the default slot where the full message resides\r\n */\r\n@customElement('umb-code-block')\r\nexport class UmbCodeBlockElement extends LitElement {\r\n\t@property()\r\n\tlanguage = '';\r\n\r\n\t@property({ type: Boolean })\r\n\tcopy = false;\r\n\r\n\t@state()\r\n\tprivate _copyState: 'idle' | 'success' = 'idle';\r\n\r\n\tasync copyCode() {\r\n\t\tconst text = this.textContent;\r\n\t\tif (text) {\r\n\t\t\tawait navigator.clipboard.writeText(text);\r\n\t\t\tthis._copyState = 'success';\r\n\t\t\tsetTimeout(() => {\r\n\t\t\t\tthis._copyState = 'idle';\r\n\t\t\t}, 2000);\r\n\t\t}\r\n\t}\r\n\r\n\toverride render() {\r\n\t\treturn html`\r\n\t\t\t${this.#renderHeader()}\r\n\t\t\t
\r\n\t\t`; // Avoid breaks between elements of
\r\n\t}\r\n\r\n\t#renderHeader() {\r\n\t\tif (!this.language && !this.copy) return;\r\n\t\treturn html`\r\n\t\t\t
\r\n\t\t\t\t${this.language}\r\n\t\t\t\t${when(\r\n\t\t\t\t\tthis.copy,\r\n\t\t\t\t\t() => html`\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t${when(\r\n\t\t\t\t\t\t\t\tthis._copyState === 'idle',\r\n\t\t\t\t\t\t\t\t() => html` Copy`,\r\n\t\t\t\t\t\t\t\t() =>\r\n\t\t\t\t\t\t\t\t\thtml` Copied!`,\r\n\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t`,\r\n\t\t\t\t)}\r\n\t\t\t
\r\n\t\t`;\r\n\t}\r\n\r\n\tstatic override readonly styles = [\r\n\t\tUmbTextStyles,\r\n\t\tcss`\r\n\t\t\t:host {\r\n\t\t\t\tdisplay: block;\r\n\t\t\t\tborder: 1px solid var(--uui-color-divider-emphasis);\r\n\t\t\t\tborder-radius: var(--uui-border-radius);\r\n\t\t\t}\r\n\r\n\t\t\tuui-scroll-container {\r\n\t\t\t\tmax-height: 500px;\r\n\t\t\t\toverflow-y: auto;\r\n\t\t\t\toverflow-wrap: anywhere;\r\n\t\t\t}\r\n\r\n\t\t\tpre {\r\n\t\t\t\tfont-family: monospace;\r\n\t\t\t\tbackground-color: var(--uui-color-surface-alt);\r\n\t\t\t\tcolor: #303033;\r\n\t\t\t\tdisplay: block;\r\n\t\t\t\tmargin: 0;\r\n\t\t\t\toverflow-x: auto;\r\n\t\t\t\tpadding: 9.5px;\r\n\t\t\t}\r\n\r\n\t\t\tpre,\r\n\t\t\tcode {\r\n\t\t\t\tword-wrap: normal;\r\n\t\t\t\twhite-space: pre;\r\n\t\t\t}\r\n\r\n\t\t\t#header {\r\n\t\t\t\tdisplay: flex;\r\n\t\t\t\tjustify-content: space-between;\r\n\t\t\t\talign-items: center;\r\n\t\t\t\tbackground-color: var(--uui-color-surface-alt);\r\n\t\t\t\tborder-bottom: 1px solid var(--uui-color-divider-emphasis);\r\n\t\t\t}\r\n\r\n\t\t\t#lang {\r\n\t\t\t\tmargin-left: 16px;\r\n\t\t\t\tfont-weight: bold;\r\n\t\t\t}\r\n\r\n\t\t\tbutton {\r\n\t\t\t\tfont-family: inherit;\r\n\t\t\t\tpadding: 6px 16px;\r\n\t\t\t\tbackground-color: transparent;\r\n\t\t\t\tborder: none;\r\n\t\t\t\tborder-left: 1px solid var(--uui-color-divider-emphasis);\r\n\t\t\t\tborder-radius: 0;\r\n\t\t\t\tcolor: #000;\r\n\t\t\t\tdisplay: flex;\r\n\t\t\t\talign-items: center;\r\n\t\t\t\tgap: 8px;\r\n\t\t\t}\r\n\r\n\t\t\tbutton:hover {\r\n\t\t\t\tbackground-color: var(--uui-color-surface-emphasis);\r\n\t\t\t}\r\n\t\t`,\r\n\t];\r\n}\r\n\r\ndeclare global {\r\n\tinterface HTMLElementTagNameMap {\r\n\t\t'umb-code-block': UmbCodeBlockElement;\r\n\t}\r\n}\r\n","import type {\r\n\tUUIInterfaceColor,\r\n\tUUIInterfaceLook,\r\n\tPopoverContainerPlacement,\r\n\tUUIPopoverContainerElement,\r\n} from '@umbraco-cms/backoffice/external/uui';\r\nimport { UmbTextStyles } from '@umbraco-cms/backoffice/style';\r\nimport type { PropertyValueMap } from '@umbraco-cms/backoffice/external/lit';\r\nimport { css, html, customElement, property, query, when } from '@umbraco-cms/backoffice/external/lit';\r\nimport { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';\r\n\r\n// TODO: maybe move this to UI Library.\r\n@customElement('umb-dropdown')\r\nexport class UmbDropdownElement extends UmbLitElement {\r\n\t@query('#dropdown-popover')\r\n\tpopoverContainerElement?: UUIPopoverContainerElement;\r\n\t@property({ type: Boolean, reflect: true })\r\n\topen = false;\r\n\r\n\t@property()\r\n\tlabel = '';\r\n\r\n\t@property()\r\n\tlook: UUIInterfaceLook = 'default';\r\n\r\n\t@property()\r\n\tcolor: UUIInterfaceColor = 'default';\r\n\r\n\t@property()\r\n\tplacement: PopoverContainerPlacement = 'bottom-start';\r\n\r\n\t@property({ type: Boolean })\r\n\tcompact = false;\r\n\r\n\t@property({ type: Boolean, attribute: 'hide-expand' })\r\n\thideExpand = false;\r\n\r\n\tprotected override updated(_changedProperties: PropertyValueMap | Map): void {\r\n\t\tsuper.updated(_changedProperties);\r\n\t\tif (_changedProperties.has('open') && this.popoverContainerElement) {\r\n\t\t\tif (this.open) {\r\n\t\t\t\t// TODO: This ignorer is just needed for JSON SCHEMA TO WORK, As its not updated with latest TS jet.\r\n\t\t\t\t// eslint-disable-next-line @typescript-eslint/ban-ts-comment\r\n\t\t\t\t// @ts-ignore\r\n\t\t\t\tthis.popoverContainerElement.showPopover();\r\n\t\t\t} else {\r\n\t\t\t\t// TODO: This ignorer is just needed for JSON SCHEMA TO WORK, As its not updated with latest TS jet.\r\n\t\t\t\t// eslint-disable-next-line @typescript-eslint/ban-ts-comment\r\n\t\t\t\t// @ts-ignore\r\n\t\t\t\tthis.popoverContainerElement.hidePopover();\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\t#onToggle(event: ToggleEvent) {\r\n\t\t// TODO: This ignorer is just needed for JSON SCHEMA TO WORK, As its not updated with latest TS jet.\r\n\t\t// eslint-disable-next-line @typescript-eslint/ban-ts-comment\r\n\t\t// @ts-ignore\r\n\t\tthis.open = event.newState === 'open';\r\n\t}\r\n\r\n\toverride render() {\r\n\t\treturn html`\r\n\t\t\t\r\n\t\t\t\t\r\n\t\t\t\t${when(\r\n\t\t\t\t\t!this.hideExpand,\r\n\t\t\t\t\t() => html``,\r\n\t\t\t\t)}\r\n\t\t\t\r\n\t\t\t\r\n\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\r\n\t\t\t\r\n\t\t`;\r\n\t}\r\n\r\n\tstatic override styles = [\r\n\t\tUmbTextStyles,\r\n\t\tcss`\r\n\t\t\t#dropdown-button {\r\n\t\t\t\tmin-width: max-content;\r\n\t\t\t}\r\n\t\t\t:host(:not([hide-expand]):not([compact])) #dropdown-button {\r\n\t\t\t\t--uui-button-padding-right-factor: 2;\r\n\t\t\t}\r\n\r\n\t\t\t:host(:not([compact])) #symbol-expand {\r\n\t\t\t\tmargin-left: var(--uui-size-space-2);\r\n\t\t\t}\r\n\t\t`,\r\n\t];\r\n}\r\n\r\ndeclare global {\r\n\tinterface HTMLElementTagNameMap {\r\n\t\t'umb-dropdown': UmbDropdownElement;\r\n\t}\r\n}\r\n","import { UmbEntityContext } from '../../entity/entity.context.js';\r\nimport type { UmbEntityAction, ManifestEntityActionDefaultKind } from '@umbraco-cms/backoffice/entity-action';\r\nimport type { PropertyValueMap } from '@umbraco-cms/backoffice/external/lit';\r\nimport { html, nothing, customElement, property, state, ifDefined } from '@umbraco-cms/backoffice/external/lit';\r\nimport type { UmbSectionSidebarContext } from '@umbraco-cms/backoffice/section';\r\nimport { UMB_SECTION_SIDEBAR_CONTEXT } from '@umbraco-cms/backoffice/section';\r\nimport { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';\r\nimport { umbExtensionsRegistry } from '@umbraco-cms/backoffice/extension-registry';\r\nimport { UmbExtensionsManifestInitializer, createExtensionApi } from '@umbraco-cms/backoffice/extension-api';\r\n\r\n@customElement('umb-entity-actions-bundle')\r\nexport class UmbEntityActionsBundleElement extends UmbLitElement {\r\n\t@property({ type: String, attribute: 'entity-type' })\r\n\tentityType?: string;\r\n\r\n\t@property({ type: String })\r\n\tunique?: string | null;\r\n\r\n\t@property({ type: String })\r\n\tpublic label?: string;\r\n\r\n\t@state()\r\n\tprivate _numberOfActions = 0;\r\n\r\n\t@state()\r\n\tprivate _firstActionManifest?: ManifestEntityActionDefaultKind;\r\n\r\n\t@state()\r\n\tprivate _firstActionApi?: UmbEntityAction;\r\n\r\n\t@state()\r\n\t_dropdownIsOpen = false;\r\n\r\n\t#sectionSidebarContext?: UmbSectionSidebarContext;\r\n\r\n\t// TODO: provide the entity context on a higher level, like the root element of this entity, tree-item/workspace/... [NL]\r\n\t#entityContext = new UmbEntityContext(this);\r\n\r\n\tconstructor() {\r\n\t\tsuper();\r\n\r\n\t\tthis.consumeContext(UMB_SECTION_SIDEBAR_CONTEXT, (sectionContext) => {\r\n\t\t\tthis.#sectionSidebarContext = sectionContext;\r\n\t\t});\r\n\t}\r\n\r\n\tprotected override updated(_changedProperties: PropertyValueMap | Map): void {\r\n\t\tif (_changedProperties.has('entityType') && _changedProperties.has('unique')) {\r\n\t\t\tthis.#entityContext.setEntityType(this.entityType);\r\n\t\t\tthis.#entityContext.setUnique(this.unique ?? null);\r\n\t\t\tthis.#observeEntityActions();\r\n\t\t}\r\n\t}\r\n\r\n\t#observeEntityActions() {\r\n\t\tnew UmbExtensionsManifestInitializer(\r\n\t\t\tthis,\r\n\t\t\tumbExtensionsRegistry,\r\n\t\t\t'entityAction',\r\n\t\t\t(ext) => ext.forEntityTypes.includes(this.entityType!),\r\n\t\t\tasync (actions) => {\r\n\t\t\t\tthis._numberOfActions = actions.length;\r\n\t\t\t\tthis._firstActionManifest =\r\n\t\t\t\t\tthis._numberOfActions > 0 ? (actions[0].manifest as ManifestEntityActionDefaultKind) : undefined;\r\n\t\t\t\tthis.#createFirstActionApi();\r\n\t\t\t},\r\n\t\t\t'umbEntityActionsObserver',\r\n\t\t);\r\n\t}\r\n\r\n\tasync #createFirstActionApi() {\r\n\t\tif (!this._firstActionManifest) return;\r\n\t\tthis._firstActionApi = await createExtensionApi(this, this._firstActionManifest, [\r\n\t\t\t{ unique: this.unique, entityType: this.entityType, meta: this._firstActionManifest.meta },\r\n\t\t]);\r\n\t}\r\n\r\n\t#openContextMenu() {\r\n\t\tif (!this.entityType) throw new Error('Entity type is not defined');\r\n\t\tif (this.unique === undefined) throw new Error('Unique is not defined');\r\n\r\n\t\tif (this.#sectionSidebarContext) {\r\n\t\t\tthis.#sectionSidebarContext.toggleContextMenu(this, {\r\n\t\t\t\tentityType: this.entityType,\r\n\t\t\t\tunique: this.unique,\r\n\t\t\t\theadline: this.label,\r\n\t\t\t});\r\n\t\t} else {\r\n\t\t\tthis._dropdownIsOpen = !this._dropdownIsOpen;\r\n\t\t}\r\n\t}\r\n\r\n\tasync #onFirstActionClick(event: PointerEvent) {\r\n\t\tevent.stopPropagation();\r\n\t\tthis.#sectionSidebarContext?.closeContextMenu();\r\n\t\tawait this._firstActionApi?.execute();\r\n\t}\r\n\r\n\t#onActionExecuted() {\r\n\t\tthis._dropdownIsOpen = false;\r\n\t}\r\n\r\n\t#onDropdownClick(event: Event) {\r\n\t\tevent.stopPropagation();\r\n\t}\r\n\r\n\toverride render() {\r\n\t\tif (this._numberOfActions === 0) return nothing;\r\n\t\treturn html`${this.#renderMore()} ${this.#renderFirstAction()} `;\r\n\t}\r\n\r\n\t#renderMore() {\r\n\t\tif (this._numberOfActions === 1) return nothing;\r\n\r\n\t\tif (this.#sectionSidebarContext) {\r\n\t\t\treturn html`\r\n\t\t\t\t\r\n\t\t\t`;\r\n\t\t}\r\n\r\n\t\treturn html`\r\n\t\t\t\r\n\t\t\t\t\r\n\t\t\t\t\r\n\t\t\t\r\n\t\t`;\r\n\t}\r\n\r\n\t#renderFirstAction() {\r\n\t\tif (!this._firstActionApi) return nothing;\r\n\t\treturn html`\r\n\t\t\t\r\n\t\t`;\r\n\t}\r\n}\r\n\r\ndeclare global {\r\n\tinterface HTMLElementTagNameMap {\r\n\t\t'umb-entity-actions-bundle': UmbEntityActionsBundleElement;\r\n\t}\r\n}\r\n","import { css, html, LitElement, customElement } from '@umbraco-cms/backoffice/external/lit';\r\nimport { UmbTextStyles } from '@umbraco-cms/backoffice/style';\r\n\r\n/**\r\n * @element umb-footer-layout\r\n * @description\r\n * @slot default - Slot footer items\r\n * @slot actions - Slot actions\r\n * @class UmbFooterLayout\r\n * @augments {UmbLitElement}\r\n */\r\n@customElement('umb-footer-layout')\r\nexport class UmbFooterLayoutElement extends LitElement {\r\n\toverride render() {\r\n\t\treturn html`\r\n\t\t\t\r\n\t\t\t\r\n\t\t`;\r\n\t}\r\n\r\n\tstatic override styles = [\r\n\t\tUmbTextStyles,\r\n\t\tcss`\r\n\t\t\t:host {\r\n\t\t\t\tdisplay: flex;\r\n\t\t\t\talign-items: center;\r\n\t\t\t\tjustify-content: space-between;\r\n\t\t\t\twidth: 100%;\r\n\t\t\t\theight: var(--umb-footer-layout-height);\r\n\t\t\t\tborder-top: 1px solid var(--uui-color-border);\r\n\t\t\t\tbackground-color: var(--uui-color-surface);\r\n\t\t\t\tbox-sizing: border-box;\r\n\t\t\t}\r\n\r\n\t\t\t#actions {\r\n\t\t\t\tdisplay: flex;\r\n\t\t\t\tgap: var(--uui-size-space-2);\r\n\t\t\t\tmargin: 0 var(--uui-size-layout-1);\r\n\t\t\t\tmargin-left: auto;\r\n\t\t\t}\r\n\t\t`,\r\n\t];\r\n}\r\n\r\ndeclare global {\r\n\tinterface HTMLElementTagNameMap {\r\n\t\t'umb-footer-layout': UmbFooterLayoutElement;\r\n\t}\r\n}\r\n","import { UmbTextStyles } from '@umbraco-cms/backoffice/style';\r\nimport type { CSSResultGroup } from '@umbraco-cms/backoffice/external/lit';\r\nimport { css, html, customElement, ifDefined } from '@umbraco-cms/backoffice/external/lit';\r\nimport type { ManifestHeaderAppButtonKind, UmbExtensionManifestKind } from '@umbraco-cms/backoffice/extension-registry';\r\nimport { umbExtensionsRegistry } from '@umbraco-cms/backoffice/extension-registry';\r\nimport { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';\r\n\r\nconst manifest: UmbExtensionManifestKind = {\r\n\ttype: 'kind',\r\n\talias: 'Umb.Kind.Button',\r\n\tmatchKind: 'button',\r\n\tmatchType: 'headerApp',\r\n\tmanifest: {\r\n\t\ttype: 'headerApp',\r\n\t\tkind: 'button',\r\n\t\telementName: 'umb-header-app-button',\r\n\t},\r\n};\r\numbExtensionsRegistry.register(manifest);\r\n\r\n@customElement('umb-header-app-button')\r\nexport class UmbHeaderAppButtonElement extends UmbLitElement {\r\n\tpublic manifest?: ManifestHeaderAppButtonKind;\r\n\r\n\toverride render() {\r\n\t\treturn html`\r\n\t\t\t\r\n\t\t\t\t\r\n\t\t\t\r\n\t\t`;\r\n\t}\r\n\r\n\tstatic override styles: CSSResultGroup = [\r\n\t\tUmbTextStyles,\r\n\t\tcss`\r\n\t\t\tuui-button {\r\n\t\t\t\tfont-size: 18px;\r\n\t\t\t\t--uui-button-background-color: var(--umb-header-app-button-background-color, transparent);\r\n\t\t\t\t--uui-button-background-color-hover: var(\r\n\t\t\t\t\t--umb-header-app-button-background-color-hover,\r\n\t\t\t\t\tvar(--uui-color-emphasis)\r\n\t\t\t\t);\r\n\t\t\t}\r\n\t\t`,\r\n\t];\r\n}\r\n\r\nexport default UmbHeaderAppButtonElement;\r\n\r\ndeclare global {\r\n\tinterface HTMLElementTagNameMap {\r\n\t\t'umb-header-app-button': UmbHeaderAppButtonElement;\r\n\t}\r\n}\r\n","import { css, html, customElement, property } from '@umbraco-cms/backoffice/external/lit';\r\nimport { UmbTextStyles } from '@umbraco-cms/backoffice/style';\r\nimport { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';\r\n\r\n@customElement('umb-history-item')\r\nexport class UmbHistoryItemElement extends UmbLitElement {\r\n\t@property({ type: String })\r\n\tname?: string;\r\n\r\n\t@property({ type: String })\r\n\tdetail?: string;\r\n\r\n\toverride render() {\r\n\t\treturn html`\r\n\t\t\t
\r\n\t\t\t\t\r\n\t\t\t\t
\r\n\t\t\t\t\t${this.name}\r\n\t\t\t\t\t${this.detail}\r\n\t\t\t\t
\r\n\t\t\t
\r\n\t\t\t\r\n\t\t\t\r\n\t\t`;\r\n\t}\r\n\r\n\tstatic override styles = [\r\n\t\tUmbTextStyles,\r\n\t\tcss`\r\n\t\t\t:host {\r\n\t\t\t\t--avatar-size: calc(2em + 4px);\r\n\t\t\t\tdisplay: contents;\r\n\t\t\t}\r\n\r\n\t\t\tslot[name='actions'] {\r\n\t\t\t\t--uui-button-border-radius: 50px 50px 50px 50px;\r\n\t\t\t\tdisplay: flex;\r\n\t\t\t\talign-items: center;\r\n\t\t\t\t--uui-button-height: calc(var(--uui-size-2) * 4);\r\n\t\t\t\tmargin-right: var(--uui-size-2);\r\n\t\t\t}\r\n\r\n\t\t\t#actions-container {\r\n\t\t\t\topacity: 0;\r\n\t\t\t\ttransition: opacity 120ms;\r\n\t\t\t}\r\n\r\n\t\t\t:host(:hover) #actions-container {\r\n\t\t\t\topacity: 1;\r\n\t\t\t}\r\n\r\n\t\t\t:host(:hover) #actions-container {\r\n\t\t\t\topacity: 1;\r\n\t\t\t}\r\n\r\n\t\t\t.user-info {\r\n\t\t\t\tposition: relative;\r\n\t\t\t\tdisplay: flex;\r\n\t\t\t\talign-items: flex-end;\r\n\t\t\t\tgap: var(--uui-size-space-5);\r\n\t\t\t}\r\n\r\n\t\t\t.user-info div {\r\n\t\t\t\tdisplay: flex;\r\n\t\t\t\tflex-direction: column;\r\n\t\t\t\tmin-width: var(--uui-size-60);\r\n\t\t\t}\r\n\r\n\t\t\t.detail {\r\n\t\t\t\tfont-size: var(--uui-size-4);\r\n\t\t\t\tcolor: var(--uui-color-text-alt);\r\n\t\t\t\tline-height: 1;\r\n\t\t\t}\r\n\t\t`,\r\n\t];\r\n}\r\n\r\nexport default UmbHistoryItemElement;\r\n\r\ndeclare global {\r\n\tinterface HTMLElementTagNameMap {\r\n\t\t'umb-history-item': UmbHistoryItemElement;\r\n\t}\r\n}\r\n","import { css, html, customElement } from '@umbraco-cms/backoffice/external/lit';\r\nimport { UmbTextStyles } from '@umbraco-cms/backoffice/style';\r\nimport { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';\r\n\r\n@customElement('umb-history-list')\r\nexport class UmbHistoryListElement extends UmbLitElement {\r\n\toverride render() {\r\n\t\treturn html` `;\r\n\t}\r\n\r\n\tstatic override styles = [\r\n\t\tUmbTextStyles,\r\n\t\tcss`\r\n\t\t\t:host {\r\n\t\t\t\tdisplay: grid;\r\n\t\t\t\tgrid-template-columns: auto 1fr auto;\r\n\t\t\t\talign-items: center;\r\n\t\t\t\t--avatar-size: calc(2em + 4px);\r\n\t\t\t\tgap: var(--uui-size-6);\r\n\t\t\t\tposition: relative;\r\n\t\t\t}\r\n\r\n\t\t\t/** TODO: This doesn't work due to \"display:contents\" in umb-history-item, but is needed for the way I put the grid together.\r\n\t\t\t* Find a different solution so we can have the grey line that links each history item together (this is purely a visual effect, no rush)\r\n\r\n\t\t\t::slotted(*) {\r\n\t\t\t\tposition: relative;\r\n\t\t\t}\r\n\r\n\t\t\t::slotted(*:not(:last-child)) {\r\n\t\t\t\tmargin-bottom: calc(2 * var(--uui-size-space-3));\r\n\t\t\t}\r\n\t\t\t::slotted(*:not(:last-child))::before {\r\n\t\t\t\tcontent: '';\r\n\t\t\t\tborder: 1px solid var(--uui-color-border);\r\n\t\t\t\tposition: absolute;\r\n\t\t\t\tdisplay: block;\r\n\t\t\t\theight: calc(1.5 * var(--avatar-size));\r\n\t\t\t\ttop: var(--avatar-size);\r\n\t\t\t\tleft: calc(-1px + var(--avatar-size) / 2);\r\n\t\t\t}\r\n\t\t\t*/\r\n\t\t`,\r\n\t];\r\n}\r\n\r\nexport default UmbHistoryListElement;\r\n\r\ndeclare global {\r\n\tinterface HTMLElementTagNameMap {\r\n\t\t'umb-history-list': UmbHistoryListElement;\r\n\t}\r\n}\r\n","import { extractUmbColorVariable } from '../../resources/extractUmbColorVariable.function.js';\r\nimport { UmbTextStyles } from '@umbraco-cms/backoffice/style';\r\nimport { html, customElement, property, state, ifDefined, css, styleMap } from '@umbraco-cms/backoffice/external/lit';\r\nimport type { StyleInfo } from '@umbraco-cms/backoffice/external/lit';\r\nimport { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';\r\n\r\n/**\r\n * @element umb-icon\r\n * @description A wrapper for the uui-icon component with color alias support\r\n * @augments {UmbLitElement}\r\n */\r\n@customElement('umb-icon')\r\nexport class UmbIconElement extends UmbLitElement {\r\n\t#color?: string;\r\n\t#fallbackColor?: string;\r\n\r\n\t@state()\r\n\tprivate _icon?: string;\r\n\r\n\t@state()\r\n\tprivate _style: StyleInfo = {};\r\n\r\n\t/**\r\n\t * Color alias or a color code directly.\\\r\n\t * If a color has been set via the name property, this property will override it.\r\n\t */\r\n\t@property({ type: String })\r\n\tpublic set color(value: string) {\r\n\t\tthis.#color = value;\r\n\t\tthis.#updateColorStyle();\r\n\t}\r\n\tpublic get color(): string | undefined {\r\n\t\treturn this.#color || this.#fallbackColor;\r\n\t}\r\n\r\n\t/**\r\n\t * The icon name. Can be appended with a color.\\\r\n\t * Example **icon-heart color-red**\r\n\t */\r\n\t@property({ type: String })\r\n\tpublic set name(value: string | undefined) {\r\n\t\tconst [icon, color] = value ? value.split(' ') : [];\r\n\t\tthis.#fallbackColor = color;\r\n\t\tthis._icon = icon;\r\n\t\tthis.#updateColorStyle();\r\n\t}\r\n\tpublic get name(): string | undefined {\r\n\t\treturn this._icon;\r\n\t}\r\n\r\n\t#updateColorStyle() {\r\n\t\tconst value = this.#color || this.#fallbackColor;\r\n\r\n\t\tif (!value) {\r\n\t\t\tthis._style = { '--uui-icon-color': 'inherit' };\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tconst color = value.replace('color-', '');\r\n\t\tconst variable = extractUmbColorVariable(color);\r\n\t\tconst styling = variable ? `var(${variable})` : color;\r\n\r\n\t\tthis._style = { '--uui-icon-color': styling };\r\n\t}\r\n\r\n\toverride render() {\r\n\t\treturn html``;\r\n\t}\r\n\r\n\tstatic override styles = [\r\n\t\tUmbTextStyles,\r\n\t\tcss`\r\n\t\t\t:host {\r\n\t\t\t\tdisplay: flex;\r\n\t\t\t\tjustify-content: center;\r\n\t\t\t\talign-items: center;\r\n\t\t\t}\r\n\t\t`,\r\n\t];\r\n}\r\n\r\ndeclare global {\r\n\tinterface HTMLElementTagNameMap {\r\n\t\t'umb-icon': UmbIconElement;\r\n\t}\r\n}\r\n","import { html, customElement, property, css, state, nothing } from '@umbraco-cms/backoffice/external/lit';\r\nimport { UmbChangeEvent } from '@umbraco-cms/backoffice/event';\r\nimport { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';\r\nimport {\r\n\tUMB_DATATYPE_WORKSPACE_MODAL,\r\n\tUMB_DATA_TYPE_ENTITY_TYPE,\r\n\tUMB_DATA_TYPE_PICKER_FLOW_DATA_TYPE_PICKER_MODAL,\r\n} from '@umbraco-cms/backoffice/data-type';\r\nimport { UmbModalRouteRegistrationController } from '@umbraco-cms/backoffice/router';\r\nimport { UmbFormControlMixin } from '@umbraco-cms/backoffice/validation';\r\n\r\n@customElement('umb-input-collection-configuration')\r\nexport class UmbInputCollectionConfigurationElement extends UmbFormControlMixin(\r\n\tUmbLitElement,\r\n) {\r\n\tprotected override getFormElement() {\r\n\t\treturn undefined;\r\n\t}\r\n\r\n\t#dataTypeModal;\r\n\r\n\t#propertyEditorUiAlias = 'Umb.PropertyEditorUi.Collection';\r\n\r\n\t@state()\r\n\tprivate _dataTypePickerModalPath?: string;\r\n\r\n\t@property({ attribute: 'default-value' })\r\n\tdefaultValue?: string;\r\n\r\n\t#setValue(value: string | undefined) {\r\n\t\tthis.value = value;\r\n\t\tthis.dispatchEvent(new UmbChangeEvent());\r\n\t}\r\n\r\n\tconstructor() {\r\n\t\tsuper();\r\n\r\n\t\tnew UmbModalRouteRegistrationController(this, UMB_DATA_TYPE_PICKER_FLOW_DATA_TYPE_PICKER_MODAL)\r\n\t\t\t.addAdditionalPath(':uiAlias')\r\n\t\t\t.onSetup((routingInfo) => {\r\n\t\t\t\treturn {\r\n\t\t\t\t\tdata: {\r\n\t\t\t\t\t\tpropertyEditorUiAlias: routingInfo.uiAlias,\r\n\t\t\t\t\t},\r\n\t\t\t\t\tvalue: undefined,\r\n\t\t\t\t};\r\n\t\t\t})\r\n\t\t\t.onSubmit((submitData) => {\r\n\t\t\t\tif (submitData?.createNewWithPropertyEditorUiAlias) {\r\n\t\t\t\t\tthis.#createDataType();\r\n\t\t\t\t} else {\r\n\t\t\t\t\tthis.#setValue(submitData?.dataTypeId ?? this.defaultValue ?? '');\r\n\t\t\t\t}\r\n\t\t\t})\r\n\t\t\t.observeRouteBuilder((routeBuilder) => {\r\n\t\t\t\tthis._dataTypePickerModalPath = routeBuilder({ uiAlias: this.#propertyEditorUiAlias });\r\n\t\t\t});\r\n\r\n\t\tthis.#dataTypeModal = new UmbModalRouteRegistrationController(this, UMB_DATATYPE_WORKSPACE_MODAL)\r\n\t\t\t.addAdditionalPath(':uiAlias')\r\n\t\t\t.onSetup((params) => {\r\n\t\t\t\treturn { data: { entityType: UMB_DATA_TYPE_ENTITY_TYPE, preset: { editorUiAlias: params.uiAlias } } };\r\n\t\t\t})\r\n\t\t\t.onSubmit((value) => {\r\n\t\t\t\tthis.#setValue(value?.unique ?? this.defaultValue ?? '');\r\n\t\t\t});\r\n\t}\r\n\r\n\t#clearDataType() {\r\n\t\tthis.#setValue(undefined);\r\n\t}\r\n\r\n\t#createDataType() {\r\n\t\tthis.#dataTypeModal.open(\r\n\t\t\t{ uiAlias: this.#propertyEditorUiAlias },\r\n\t\t\t`create/parent/${UMB_DATA_TYPE_ENTITY_TYPE}/null`,\r\n\t\t);\r\n\t}\r\n\r\n\t#editDataType() {\r\n\t\tthis.#dataTypeModal?.open({}, `edit/${this.value}`);\r\n\t}\r\n\r\n\toverride render() {\r\n\t\treturn !this.value ? this.#renderCreate() : this.#renderConfigured();\r\n\t}\r\n\r\n\t#renderCreate() {\r\n\t\tif (!this._dataTypePickerModalPath) return nothing;\r\n\t\treturn html`\r\n\t\t\t\r\n\t\t`;\r\n\t}\r\n\r\n\t#renderConfigured() {\r\n\t\tif (!this.value || !this._dataTypePickerModalPath) return nothing;\r\n\t\treturn html`\r\n\t\t\t\r\n\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\r\n\t\t\t\r\n\t\t`;\r\n\t}\r\n\r\n\tstatic override styles = [\r\n\t\tcss`\r\n\t\t\t#create-button {\r\n\t\t\t\twidth: 100%;\r\n\t\t\t}\r\n\t\t`,\r\n\t];\r\n}\r\n\r\nexport default UmbInputCollectionConfigurationElement;\r\n\r\ndeclare global {\r\n\tinterface HTMLElementTagNameMap {\r\n\t\t'umb-input-collection-configuration': UmbInputCollectionConfigurationElement;\r\n\t}\r\n}\r\n","import { html, customElement, property, map, nothing } from '@umbraco-cms/backoffice/external/lit';\r\nimport { UmbChangeEvent } from '@umbraco-cms/backoffice/event';\r\nimport { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';\r\nimport { UUIFormControlMixin } from '@umbraco-cms/backoffice/external/uui';\r\nimport type { UmbSwatchDetails } from '@umbraco-cms/backoffice/models';\r\nimport type { UUIColorSwatchesEvent } from '@umbraco-cms/backoffice/external/uui';\r\n\r\n/*\r\n * This wraps the UUI library uui-color-swatches component\r\n * @element umb-input-color\r\n */\r\n@customElement('umb-input-color')\r\nexport class UmbInputColorElement extends UUIFormControlMixin(UmbLitElement, '') {\r\n\tprotected override getFormElement() {\r\n\t\treturn undefined;\r\n\t}\r\n\r\n\t/**\r\n\t * Sets the input to readonly mode, meaning value cannot be changed but still able to read and select its content.\r\n\t * @attr\r\n\t * @default false\r\n\t */\r\n\t@property({ type: Boolean, reflect: true })\r\n\treadonly = false;\r\n\r\n\t@property({ type: Boolean })\r\n\tshowLabels = false;\r\n\r\n\t@property({ type: Array })\r\n\tswatches?: Array;\r\n\r\n\t#onChange(event: UUIColorSwatchesEvent) {\r\n\t\tthis.value = event.target.value;\r\n\t\tthis.dispatchEvent(new UmbChangeEvent());\r\n\t}\r\n\r\n\toverride render() {\r\n\t\treturn html`\r\n\t\t\t\r\n\t\t\t\t${this.#renderColors()}\r\n\t\t\t\r\n\t\t`;\r\n\t}\r\n\r\n\t#renderColors() {\r\n\t\tif (!this.swatches) return nothing;\r\n\t\treturn map(\r\n\t\t\tthis.swatches,\r\n\t\t\t(swatch) => html`\r\n\t\t\t\t\r\n\t\t\t`,\r\n\t\t);\r\n\t}\r\n}\r\n\r\nexport default UmbInputColorElement;\r\n\r\ndeclare global {\r\n\tinterface HTMLElementTagNameMap {\r\n\t\t'umb-input-color': UmbInputColorElement;\r\n\t}\r\n}\r\n","import { html, customElement, property, ifDefined } from '@umbraco-cms/backoffice/external/lit';\r\nimport { UmbChangeEvent } from '@umbraco-cms/backoffice/event';\r\nimport { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';\r\nimport { UUIFormControlMixin } from '@umbraco-cms/backoffice/external/uui';\r\nimport type { UUIInputEvent } from '@umbraco-cms/backoffice/external/uui';\r\n\r\n/**\r\n * This element passes a datetime string to a regular HTML input element.\r\n * @remark Be aware that you cannot include a time demonination, i.e. \"10:44:00\" if you\r\n * set the input type of this element to \"date\". If you do, the browser will not show\r\n * the value at all.\r\n * @element umb-input-date\r\n */\r\n@customElement('umb-input-date')\r\nexport class UmbInputDateElement extends UUIFormControlMixin(UmbLitElement, '') {\r\n\tprotected override getFormElement() {\r\n\t\treturn undefined;\r\n\t}\r\n\r\n\t/**\r\n\t * Sets the input to readonly mode, meaning value cannot be changed but still able to read and select its content.\r\n\t * @type {boolean}\r\n\t * @attr\r\n\t * @default false\r\n\t */\r\n\t@property({ type: Boolean, reflect: true })\r\n\treadonly: boolean = false;\r\n\r\n\t/**\r\n\t * Specifies the type of input that will be rendered.\r\n\t * @type {'date'| 'time'| 'datetime-local'}\r\n\t * @attr\r\n\t * @default date\r\n\t */\r\n\t@property()\r\n\ttype: 'date' | 'time' | 'datetime-local' = 'date';\r\n\r\n\t@property({ type: String })\r\n\tmin?: string;\r\n\r\n\t@property({ type: String })\r\n\tmax?: string;\r\n\r\n\t@property({ type: Number })\r\n\tstep?: number;\r\n\r\n\t#onChange(event: UUIInputEvent) {\r\n\t\tthis.value = event.target.value;\r\n\t\tthis.dispatchEvent(new UmbChangeEvent());\r\n\t}\r\n\r\n\toverride render() {\r\n\t\treturn html`\r\n\t\t`;\r\n\t}\r\n}\r\n\r\nexport default UmbInputDateElement;\r\n\r\ndeclare global {\r\n\tinterface HTMLElementTagNameMap {\r\n\t\t'umb-input-date': UmbInputDateElement;\r\n\t}\r\n}\r\n","import { css, html, customElement, property, query } from '@umbraco-cms/backoffice/external/lit';\r\nimport { UUIFormControlMixin } from '@umbraco-cms/backoffice/external/uui';\r\nimport { UmbChangeEvent } from '@umbraco-cms/backoffice/event';\r\nimport { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';\r\nimport type { UUISelectEvent } from '@umbraco-cms/backoffice/external/uui';\r\n\r\n@customElement('umb-input-dropdown-list')\r\nexport class UmbInputDropdownListElement extends UUIFormControlMixin(UmbLitElement, undefined) {\r\n\t@property({ type: Array })\r\n\tpublic options?: Array