@crombolo/backoffice-dist 0.42.1 → 0.44.0

package/dist/chunks/property-editor-ui-block-grid.element-qz9exw2b.js

@@ -0,0 +1,719 @@
+import{yt,C,kt,R,pk,y,U,Mt,oe,L}from"./app.element-0rg25qzq.js";import{bm,N_,ab,zt,vm}from"./app.element-24wk4csv.js";import"./app.element-k2q5cknn.js";import"./app.element-1fcz6x5m.js";import"./app.element-mfaddkz2.js";import"./app.element-gf2wyrb5.js";import"./app.element-2w5fhqht.js";import{yn,Pa,Ra,Eo,Is,Hi}from"./app.element-hr8wgyf7.js";import{Re,Qe}from"./app.element-gxz004dr.js";import"./app.element-ae0qtn7c.js";import"./app.element-pm61zrdq.js";import"./app.element-bmybjrsv.js";import{ze}from"./app.element-v6hmw8m4.js";import{l}from"./app.element-wq0yt6tm.js";import"./app.element-ybstaxs1.js";import"./app.element-99h05p0d.js";import{t,Li}from"./app.element-1y6a3nxg.js";import{Jo,M}from"./app.element-628afer9.js";import{i}from"./app.element-m7ak5dt7.js";import"./app.element-0g1w9h5z.js";import"./app.element-6c83ssfn.js";import"./app.element-wnh4xgv8.js";import"./app.element-rqyta8jv.js";import"./app.element-52n4j0e1.js";import"./app.element-9xtz5gph.js";import{Ze}from"./app.element-rtzv1k4q.js";import{el}from"./app.element-p0q78ewt.js";import"./app.element-qqff9xjj.js";import"./app.element-ng9z6334.js";import"./app.element-b8ygzyh6.js";import"./app.element-24wj3svp.js";import"./app.element-ytjz2a4d.js";import"./app.element-cqgtdtst.js";import"./app.element-77gzpawp.js";import"./app.element-f3j3kge4.js";import"./app.element-k8nha5kd.js";import{A,St,md,Ui,b,Dr}from"./app.element-fpbymb7g.js";import"./app.element-7bwz3mk4.js";import"./app.element-4ncybypa.js";import"./app.element-5pzxzhkp.js";import{le,ee}from"./app.element-8hnxpehs.js";import"./app.element-97gzj1hz.js";import"./app.element-aywhmr2c.js";import"./app.element-yc1fkn22.js";import{X}from"./app.element-h5mv1qzs.js";import"./app.element-cd8gn3ay.js";import"./app.element-ekrqc172.js";import"./app.element-ekkqgwwz.js";import"./app.element-55z4v1kb.js";import"./app.element-jpvpf8xy.js";import{Fo}from"./app.element-qqamkxqf.js";import"./app.element-34bant6r.js";import"./app.element-rp7r7hdk.js";import"./app.element-td0ywwqq.js";import"./app.element-zmnyjx6f.js";import"./app.element-p1gnn2m8.js";import"./app.element-50f65g3c.js";import"./app.element-1qkdmfcd.js";import"./app.element-t9nj9sd2.js";import"./app.element-thamx8hz.js";import{ta}from"./app.element-70j50zhq.js";import"./app.element-xjhf5psb.js";import{ti}from"./app.element-f38q3eka.js";import"./app.element-9fm9shb8.js";import{mt,wi,bp,Gy,jc,Ky,If,VI}from"./app.element-g6nj5c7w.js";import"./app.element-8fh3vav1.js";import"./app.element-ejsprm7m.js";import"./app.element-asfjj1d6.js";import{At}from"./app.element-93k0qrnt.js";import"./app.element-e4j3jwjr.js";import"./app.element-e1t7azza.js";import"./app.element-v86sy7z1.js";import{Tk,wb,Tb}from"./app.element-0entfg43.js";import"./app.element-hfc00pk0.js";import{Ur}from"./app.element-fdm4sed0.js";class J extends Ra{#t;setInlineEditingMode(r){this.#t.setValue(r??!1)}getInlineEditingMode(){return this.#t.getValue()}#e;#r;setIsSortMode(r){this.#e?.setIsSortMode(r)}getIsSortMode(){return this.#e?.getIsSortMode()}#i;#n;#o;getMinAllowed(){return this._editorConfiguration.getValue()?.getValueByAlias("validationLimit")?.min??0}getMaxAllowed(){return this._editorConfiguration.getValue()?.getValueByAlias("validationLimit")?.max??1/0}setEditorConfiguration(r){this.#i.then(()=>{super.setEditorConfiguration(r)})}setBlockGroups(r){this.#o.setValue(r)}getBlockGroups(){return this.#o.value}getBlockGroupName(r){return this.#o.getValue().find((e)=>e.key===r)?.name}constructor(r){super(r);this.#t=new C(void 0),this.inlineEditingMode=this.#t.asObservable(),this.#r=new C(void 0),this.isSortMode=this.#r.asObservable(),this.#o=new y([],(e)=>e.key),this.blockGroups=this.#o.asObservable(),this.layoutStylesheet=this._editorConfiguration.asObservablePart((e)=>{if(!e)return;let o=e.getValueByAlias("layoutStylesheet");if(!o)return Ky;if(o)return new URL(vm(o),this.#n).href;return}),this.gridColumns=this._editorConfiguration.asObservablePart((e)=>{let o=e?.getValueByAlias("gridColumns");return parseInt(o&&o!==""?o:"12")}),this.#i=this.consumeContext(ze,(e)=>{this.#n=e?.getServerUrl()}).asPromise({preventTimeout:!0}),this.consumeContext(ta,(e)=>{this.#e=e,this.observe(this.#e?.isSortMode,(o)=>{this.#r.setValue(o)})})}async createWithPresets(r,e,o){return await super._createBlockData(r,e)}#s(r,e,o,n,a){let s=e.length;while(s--){let u=e[s];if(u.contentKey===o){let c=u.areas?.map((h)=>h.key===n?{...h,items:pk([...h.items],r,(w)=>w.contentKey===r.contentKey,a)}:h)??[];return Mt(e,{...u,areas:c},(h)=>h.contentKey===u.contentKey)}if(u.areas){let c=u.areas.length;while(c--){let h=this.#s(r,u.areas[c].items,o,n,a);if(h){let w=u.areas[c];return Mt(e,{...u,areas:Mt(u.areas,{...w,items:h},(x)=>x.key===w.key)},(x)=>x.contentKey===u.contentKey)}}}}return}insert(r,e,o,n){return this.setOneLayout(r,n),this.insertBlockData(r,e,o,n),this.notifyBlockInserted(r,n),!0}setOneLayout(r,e){let o=e?.index??-1;if(e?.parentUnique&&e?.areaKey){let n=this.#s(r,this._layouts.getValue(),e?.parentUnique,e?.areaKey,o);if(n)this._layouts.setValue(n)}else this._layouts.appendOneAt(r,o)}onDragStart(){this.getHostElement().style.setProperty("--umb-block-grid--is-dragging"," ")}onDragEnd(){this.getHostElement().style.removeProperty("--umb-block-grid--is-dragging")}}import{css as He,customElement as Je,html as ge,nothing as _e,property as se,ref as et,state as ae}from"@umbraco-cms/backoffice/external/lit";import{debounceTime as tt}from"@umbraco-cms/backoffice/external/rxjs";import{css as ve,customElement as ke,html as he,nothing as we,repeat as Ce,state as te}from"@umbraco-cms/backoffice/external/lit";var Z=function(r,e,o,n){var a=arguments.length,s=a<3?e:n===null?n=Object.getOwnPropertyDescriptor(e,o):n,u;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")s=Reflect.decorate(r,e,o,n);else for(var c=r.length-1;c>=0;c--)if(u=r[c])s=(a<3?u(s):a>3?u(e,o,s):u(e,o))||s;return a>3&&s&&Object.defineProperty(e,o,s),s},j=class extends t{constructor(){super();this._areas=[],this.consumeContext(jc,(e)=>{this.observe(e?.areas,(o)=>{this._areas=o},"observeAreas"),this.observe(e?.areaGridColumns,(o)=>{this._areaGridColumns=o},"observeAreaGridColumns")}),this.consumeContext(bp,(e)=>{this.observe(e?.layoutStylesheet,(o)=>{if(!o||this._styleElement?.href===o)return;this._styleElement=document.createElement("link"),this._styleElement.rel="stylesheet",this._styleElement.href=o},"observeStylesheet")})}render(){if(!this._areas?.length)return we;return he`
+			${this._styleElement}
+			<div
+				class="umb-block-grid__area-container"
+				part="area-container"
+				style="--umb-block-grid--area-grid-columns: ${this._areaGridColumns}">
+				${Ce(this._areas,(e)=>e.key,(e)=>he`
+						<umb-block-grid-entries
+							part="area"
+							class="umb-block-grid__area"
+							.areaKey=${e.key}
+							.layoutColumns=${e.columnSpan}>
+						</umb-block-grid-entries>
+					`)}
+			</div>
+		`}static{this.styles=[ve`
+			:host {
+				display: block;
+				width: 100%;
+			}
+		`]}};Z([te()],j.prototype,"_styleElement",void 0);Z([te()],j.prototype,"_areas",void 0);Z([te()],j.prototype,"_areaGridColumns",void 0);j=Z([ke("umb-block-grid-areas-container")],j);import{css as Ee,customElement as xe,html as F,property as D,state as Y,when as Te}from"@umbraco-cms/backoffice/external/lit";var _=function(r,e,o,n){var a=arguments.length,s=a<3?e:n===null?n=Object.getOwnPropertyDescriptor(e,o):n,u;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")s=Reflect.decorate(r,e,o,n);else for(var c=r.length-1;c>=0;c--)if(u=r[c])s=(a<3?u(s):a>3?u(e,o,s):u(e,o))||s;return a>3&&s&&Object.defineProperty(e,o,s),s},Be=(r)=>[{manifest:r}],f=class extends t{#t;#e;#r;#i;#n;#o;constructor(){super();this.consumeContext(jc,(e)=>{this.#t=e,this.observe(this.#t?.unique,(o)=>{this.#i=o,this.#l()},"observeContentKey")}),this.consumeContext(Gy,(e)=>{this.#n=e?.getParentUnique(),this.#o=e?.getAreaKey(),this.#a()})}#s;#a(){if(this.#s?.destroy(),this.#n===void 0||this.#o===void 0)return;this.#s=new Re(this,l,Eo,Be,(e,o)=>{let n=o.api;if(e&&n){if(this.#n===void 0||this.#o===void 0)throw Error("Parent unique and area key must be defined");this.#e=n,n.setOriginData({areaKey:this.#o,parentUnique:this.#n}),this.#e.establishLiveSync(),this.#e.autoReportValidation(),this.#l(),this.observe(this.#e.content.structure.contentTypeProperties,(a)=>{this._inlineProperty=a[0],this.#u();let s=this._inlineProperty?.dataType.unique;if(s)this.observe(this.#e.content.structure.contentTypeDataTypeDetailOf(s),(u)=>{this._inlinePropertyDataTypeDetail=u},"observeInlinePropertyDataTypeDetail")},"observeProperties"),this.observe(n.content.structure.ownerContentTypeName,(a)=>{this._ownerContentTypeName=a},"observeContentTypeName"),this.observe(n.variantId,async(a)=>{if(this.#r=a,this.#u(),a){n.content.setup(this,a);let s=a.culture;if(s){let u=new Fo(this),{data:c}=await u.requestItems([s]),h=c?.[0].name;this._variantName=h?this.localize.string(h):void 0}}},"observeVariant"),new Qe(this,l,"workspaceContext",[this.#e])}})}#l(){if(!this.#e||!this.#i)return;this.#e.load(this.#i)}#u(){if(!this.#r||!this._inlineProperty)return;let e=this._inlineProperty;this._inlinePropertyDataPath=`$.values[${Dr({alias:e.alias,culture:e.variesByCulture?this.#r.culture:null,segment:e.variesBySegment?this.#r.segment:null})}].value`}#c=()=>{this.#e?.expose()};#p=(e)=>{this.#t?.setName(e.detail.text)};render(){return F`
+			<div id="host">
+				<button id="open-part" tabindex="0">
+					${this.#h()}
+					<slot></slot>
+					<slot name="tag"></slot>
+				</button>
+				${this.#d()}
+			</div>
+		`}#h(){let e={...this.content,$settings:this.settings,$index:this.index};return F`
+			<span id="content">
+				<span id="icon">
+					<umb-icon .name=${this.icon}></umb-icon>
+				</span>
+				<div id="info">
+					<umb-ufm-render
+						id="name"
+						inline
+						.markdown=${this.label}
+						.value=${e}
+						@umb-ufm-resolved=${this.#p}>
+					</umb-ufm-render>
+				</div>
+			</span>
+			${Te(this.unpublished,()=>F`
+					<uui-tag slot="name" look="secondary" title=${this.localize.term("blockEditor_notExposedDescription")}>
+						<umb-localize key="blockEditor_notExposedLabel"></umb-localize>
+					</uui-tag>
+				`)}
+		`}#d(){if(this.unpublished===!0)return F`
+				<uui-button id="exposeButton" @click=${this.#c}>
+					<uui-icon name="icon-add"></uui-icon>
+					<umb-localize
+						key="blockEditor_createThisFor"
+						.args=${[this._ownerContentTypeName,this._variantName]}></umb-localize>
+				</uui-button>
+			`;else return F`
+				<div id="inside" draggable="false">
+					<umb-property-type-based-property
+						.property=${this._inlineProperty}
+						.dataTypeDetail=${this._inlinePropertyDataTypeDetail}
+						.dataPath=${this._inlinePropertyDataPath??""}
+						slot="areas"></umb-property-type-based-property>
+					<umb-block-grid-areas-container slot="areas" draggable="false"></umb-block-grid-areas-container>
+				</div>
+			`}static{this.styles=[i,Ee`
+			umb-block-grid-areas-container::part(area) {
+				margin: var(--uui-size-2);
+			}
+
+			#exposeButton {
+				width: 100%;
+				min-height: var(--uui-size-16);
+			}
+
+			#host {
+				position: relative;
+				display: block;
+				width: 100%;
+				margin-bottom: 1px;
+
+				box-sizing: border-box;
+				border-radius: var(--uui-border-radius);
+				background-color: var(--uui-color-surface);
+
+				border: 1px solid var(--uui-color-border);
+				transition: border-color 80ms;
+
+				min-width: 250px;
+			}
+			#open-part + * {
+				border-top: 1px solid var(--uui-color-border);
+			}
+			:host([disabled]) #open-part {
+				cursor: default;
+				transition: border-color 80ms;
+			}
+			:host(:not([disabled])) #host:has(#open-part:hover) {
+				border-color: var(--uui-color-border-emphasis);
+			}
+			:host(:not([disabled])) #open-part:hover + * {
+				border-color: var(--uui-color-border-emphasis);
+			}
+			:host([disabled]) #host {
+				border-color: var(--uui-color-disabled-standalone);
+			}
+
+			:host([unpublished]) #open-part #content {
+				opacity: 0.6;
+			}
+
+			slot[name='tag'] {
+				flex-grow: 1;
+
+				display: flex;
+				justify-content: flex-end;
+				align-items: center;
+			}
+
+			button {
+				font-size: inherit;
+				font-family: inherit;
+				border: 0;
+				padding: 0;
+				background-color: transparent;
+				text-align: left;
+				color: var(--uui-color-text);
+			}
+
+			#content {
+				align-self: stretch;
+				line-height: normal;
+				display: flex;
+				position: relative;
+				align-items: center;
+			}
+
+			#open-part {
+				color: inherit;
+				text-decoration: none;
+				cursor: pointer;
+
+				display: flex;
+				text-align: left;
+				align-items: center;
+				justify-content: flex-start;
+				width: 100%;
+				border: none;
+				background: none;
+
+				min-height: var(--uui-size-16);
+				padding: calc(var(--uui-size-2) + 1px);
+			}
+
+			#icon {
+				font-size: 1.2em;
+				margin-left: var(--uui-size-2);
+				margin-right: var(--uui-size-1);
+			}
+
+			#info {
+				display: flex;
+				flex-direction: column;
+				align-items: start;
+				justify-content: center;
+				height: 100%;
+				padding-left: var(--uui-size-2, 6px);
+			}
+
+			uui-tag {
+				margin-left: 0.5em;
+				margin-bottom: -0.3em;
+				margin-top: -0.3em;
+				vertical-align: text-top;
+			}
+
+			:host(:not([disabled])) #open-part:hover #icon {
+				color: var(--uui-color-interactive-emphasis);
+			}
+			:host(:not([disabled])) #open-part:hover #name {
+				color: var(--uui-color-interactive-emphasis);
+			}
+
+			:host([disabled]) #icon {
+				color: var(--uui-color-disabled-contrast);
+			}
+			:host([disabled]) #name {
+				color: var(--uui-color-disabled-contrast);
+			}
+
+			#inside {
+				position: relative;
+				display: block;
+				padding: calc(var(--uui-size-layout-1));
+			}
+		`]}};_([D({attribute:!1})],f.prototype,"config",void 0);_([D({type:String,reflect:!1})],f.prototype,"label",void 0);_([D({type:String,reflect:!1})],f.prototype,"icon",void 0);_([D({type:Number,attribute:!1})],f.prototype,"index",void 0);_([D({type:Boolean,reflect:!0})],f.prototype,"unpublished",void 0);_([D({attribute:!1})],f.prototype,"content",void 0);_([D({attribute:!1})],f.prototype,"settings",void 0);_([Y()],f.prototype,"_inlineProperty",void 0);_([Y()],f.prototype,"_inlinePropertyDataTypeDetail",void 0);_([Y()],f.prototype,"_inlinePropertyDataPath",void 0);_([Y()],f.prototype,"_ownerContentTypeName",void 0);_([Y()],f.prototype,"_variantName",void 0);f=_([xe("umb-block-grid-block-inline")],f);import{css as Pe,customElement as Se,html as ie}from"@umbraco-cms/backoffice/external/lit";var Oe=function(r,e,o,n){var a=arguments.length,s=a<3?e:n===null?n=Object.getOwnPropertyDescriptor(e,o):n,u;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")s=Reflect.decorate(r,e,o,n);else for(var c=r.length-1;c>=0;c--)if(u=r[c])s=(a<3?u(s):a>3?u(e,o,s):u(e,o))||s;return a>3&&s&&Object.defineProperty(e,o,s),s},de=class extends t{render(){return ie`
+			<div id="host">
+				<div id="open-part">
+					${this.#t()}
+					<slot></slot>
+					<slot name="tag"></slot>
+				</div>
+				${this.#e()}
+			</div>
+		`}#t(){return ie`
+			<span id="content">
+				<span id="icon">
+					<umb-icon name="icon-alert"></umb-icon>
+				</span>
+				<div id="info">
+					<span id="name">${this.localize.term("blockEditor_unsupportedBlockName")}</span>
+				</div>
+			</span>
+		`}#e(){return ie`
+			<div id="inside" draggable="false">
+				${this.localize.term("blockEditor_unsupportedBlockDescription")}
+				<umb-block-grid-areas-container slot="areas"></umb-block-grid-areas-container>
+			</div>
+		`}static{this.styles=[i,Pe`
+			umb-block-grid-areas-container::part(area) {
+				margin: var(--uui-size-2);
+			}
+
+			#exposeButton {
+				width: 100%;
+				min-height: var(--uui-size-16);
+			}
+
+			#host {
+				position: relative;
+				display: block;
+				width: 100%;
+				margin-bottom: 1px;
+
+				box-sizing: border-box;
+				border-radius: var(--uui-border-radius);
+				background-color: var(--uui-color-surface);
+
+				border: 1px solid var(--uui-color-border);
+				transition: border-color 80ms;
+
+				min-width: 250px;
+			}
+			#open-part + * {
+				border-top: 1px solid var(--uui-color-border);
+			}
+			#open-part {
+				cursor: default;
+				transition: border-color 80ms;
+			}
+			#host {
+				border-color: var(--uui-color-disabled-standalone);
+			}
+
+			:host([unpublished]) #open-part #content {
+				opacity: 0.6;
+			}
+
+			slot[name='tag'] {
+				flex-grow: 1;
+
+				display: flex;
+				justify-content: flex-end;
+				align-items: center;
+			}
+
+			#content {
+				align-self: stretch;
+				line-height: normal;
+				display: flex;
+				position: relative;
+				align-items: center;
+			}
+
+			#open-part {
+				color: inherit;
+				text-decoration: none;
+
+				display: flex;
+				text-align: left;
+				align-items: center;
+				justify-content: flex-start;
+				width: 100%;
+				border: none;
+				background: none;
+
+				min-height: var(--uui-size-16);
+				padding: calc(var(--uui-size-2) + 1px);
+			}
+
+			#icon {
+				font-size: 1.2em;
+				margin-left: var(--uui-size-2);
+				margin-right: var(--uui-size-1);
+			}
+
+			#info {
+				display: flex;
+				flex-direction: column;
+				align-items: start;
+				justify-content: center;
+				height: 100%;
+				padding-left: var(--uui-size-2, 6px);
+			}
+
+			#name {
+				font-weight: 700;
+			}
+
+			uui-tag {
+				margin-left: 0.5em;
+				margin-bottom: -0.3em;
+				margin-top: -0.3em;
+				vertical-align: text-top;
+			}
+
+			#inside {
+				position: relative;
+				display: block;
+				padding: calc(var(--uui-size-layout-1));
+			}
+		`]}};de=Oe([Se("umb-block-grid-block-unsupported")],de);import{css as Ae,customElement as Ve,html as pe,property as N,when as Ue}from"@umbraco-cms/backoffice/external/lit";var P=function(r,e,o,n){var a=arguments.length,s=a<3?e:n===null?n=Object.getOwnPropertyDescriptor(e,o):n,u;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")s=Reflect.decorate(r,e,o,n);else for(var c=r.length-1;c>=0;c--)if(u=r[c])s=(a<3?u(s):a>3?u(e,o,s):u(e,o))||s;return a>3&&s&&Object.defineProperty(e,o,s),s},T=class extends t{#t;constructor(){super();this.consumeContext(jc,(e)=>{this.#t=e})}#e=(e)=>{this.#t?.setName(e.detail.text)};render(){let e={...this.content,$settings:this.settings,$index:this.index};return pe`
+			<umb-ref-grid-block
+				standalone
+				.readonly=${!(this.config?.showContentEdit??!1)}
+				.href=${this.config?.showContentEdit?this.config?.editContentPath:void 0}>
+				<umb-icon slot="icon" .name=${this.icon}></umb-icon>
+				<umb-ufm-render
+					slot="name"
+					inline
+					.markdown=${this.label}
+					.value=${e}
+					@umb-ufm-resolved=${this.#e}>
+				</umb-ufm-render>
+				${Ue(this.unpublished,()=>pe`
+						<uui-tag slot="name" look="secondary" title=${this.localize.term("blockEditor_notExposedDescription")}>
+							<umb-localize key="blockEditor_notExposedLabel"></umb-localize>
+						</uui-tag>
+					`)}
+				<umb-block-grid-areas-container slot="areas" draggable="false"></umb-block-grid-areas-container>
+			</umb-ref-grid-block>
+		`}static{this.styles=[Ae`
+			:host {
+				display: block;
+				margin-bottom: 1px;
+			}
+
+			umb-block-grid-areas-container::part(area) {
+				margin: var(--uui-size-2);
+			}
+
+			umb-ufm-render {
+				user-select: none;
+			}
+
+			uui-tag {
+				margin-left: 0.5em;
+				margin-bottom: -0.3em;
+				margin-top: -0.3em;
+				vertical-align: text-top;
+			}
+
+			:host([unpublished]) umb-icon,
+			:host([unpublished]) umb-ufm-render {
+				opacity: 0.6;
+			}
+
+			@keyframes umb-icon-jiggle {
+				0%,
+				100% {
+					transform: rotate(6deg);
+				}
+				50% {
+					transform: rotate(-6deg);
+				}
+			}
+
+			:host(.sortable) {
+				umb-icon {
+					animation: umb-icon-jiggle 500ms infinite ease-in-out;
+				}
+			}
+		`]}};P([N({attribute:!1})],T.prototype,"label",void 0);P([N({type:String,reflect:!1})],T.prototype,"icon",void 0);P([N({type:Number,attribute:!1})],T.prototype,"index",void 0);P([N({attribute:!1})],T.prototype,"config",void 0);P([N({type:Boolean,reflect:!0})],T.prototype,"unpublished",void 0);P([N({attribute:!1})],T.prototype,"content",void 0);P([N({attribute:!1})],T.prototype,"settings",void 0);T=P([Ve("umb-block-grid-block")],T);class re extends Pa{#t;#e;#r;#i;#n;#o;#s;#a;#l;firstAllowedBlockTypeName(){if(!this._manager)throw Error("Manager not ready");let r=new R(void 0);return this.observe(this.allowedBlockTypes,(e)=>{if(e.length===1)this.observe(this._manager.contentTypeNameOf(e[0].contentElementTypeKey),(o)=>{r.setValue(o)},"getFirstAllowedBlockTypeName");else this.removeUmbControllerByAlias("getFirstAllowedBlockTypeName")}),r.asObservable()}setParentUnique(r){this.#n=r}getParentUnique(){return this.#n}setAreaKey(r){this.#o=r,this.#t.setAddendum(r??""),this.#c()}getAreaKey(){return this.#o}setLayoutColumns(r){this.#r.setValue(r)}getLayoutColumns(){return this.#r.getValue()}getMinAllowed(){if(this.#o)return this.#i.getValue()?.minAllowed??0;return this._manager?.getMinAllowed()??0}getMaxAllowed(){if(this.#o)return this.#i.getValue()?.maxAllowed??1/0;return this._manager?.getMaxAllowed()??1/0}getLayoutContainerElement(){return this.getHostElement().shadowRoot?.querySelector(".umb-block-grid__layout-container")}constructor(r){super(r,bp);this.#t=new Jo(this),this.#r=new kt(void 0),this.layoutColumns=this.#r.asObservable(),this.#i=new U(void 0),this.areaType=this.#i.asObservable(),this.areaTypeCreateLabel=this.#i.asObservablePart((e)=>e?.createLabel),this.#s=new U(void 0),this.rangeLimits=this.#s.asObservable(),this.#a=new y([],(e)=>e.contentElementTypeKey),this.allowedBlockTypes=this.#a.asObservable(),this.amountOfAllowedBlockTypes=this.#a.asObservablePart((e)=>e.length),this.canCreate=this.#a.asObservablePart((e)=>e.length>0),this.#l=new C(void 0),this.hasTypeLimits=this.#l.asObservable(),this.consumeContext(jc,(e)=>{this.#e=e,this.#p()}),new M(this,Is).addAdditionalPath("_catalogue/:view/:index").onSetup(async(e)=>{if(!this._manager)return!1;let o=e.index?parseInt(e.index):-1,n=await this.getContext(At);if(!n)throw Error("Clipboard context not available");let a=n.getPasteTranslatorManifests(wi),s=await this.getContext(ee);if(!s)throw Error("Property context not available");let u=s.getConfig(),c=new Ur(this),h=this.#a.getValue();return{modal:{size:this._manager.getEditorConfiguration()?.getValueByAlias("createModalSize")??(h.length>12?"large":h.length>8?"medium":"small")},data:{blocks:h,blockGroups:this._manager.getBlockGroups()??[],openClipboard:e.view==="clipboard",clipboardFilter:async(K)=>{if(!n.hasSupportedPasteTranslator(a,K.values))return!1;let g=await c.getPasteTranslator(K.values,wi);if(g.isCompatibleValue){let O=await c.resolve(K.values,wi);return g.isCompatibleValue(O,u,(I)=>this.#u(I))}return!0},originData:{index:o,areaKey:this.#o,parentUnique:this.#n},createBlockInWorkspace:this._manager.getInlineEditingMode()===!1}}}).onSubmit(async(e,o)=>{if(e?.create&&o){let n=await this.create(e.create.contentElementTypeKey,{},o.originData);if(n)await this.insert(n.layout,n.content,n.settings,o.originData);else throw Error("Failed to create block")}else if(e?.clipboard&&e.clipboard.selection?.length&&o){let n=await this.getContext(At);if(!n)throw Error("Clipboard context not available");let a=await n.readMultiple(e.clipboard.selection,wi);this._insertFromPropertyValues(a,o.originData)}}).observeRouteBuilder((e)=>{this._catalogueRouteBuilderState.setValue(e)}),new M(this,VI).addAdditionalPath("block").onSetup(()=>({data:{entityType:"block",preset:{},originData:{index:-1,areaKey:this.#o,parentUnique:this.#n,baseDataPath:this._dataPath}},modal:{size:"medium"}})).observeRouteBuilder((e)=>{let o=e({});this._workspacePath.setValue(o)})}async#u(r){let e=this.#f().map((s)=>s.contentElementTypeKey),o=r.layout[mt]?.map((s)=>s.contentKey)??[];return r.contentData.filter((s)=>o.includes(s.key)).map((s)=>s.contentTypeKey).every((s)=>e.includes(s))}_gotBlockManager(){if(!this._manager)return;this.#h(),this.#d()}#c(){if(this.#o===void 0)return;this.#p()}async#p(){if(this.#o===void 0)return;if(this.#o===null){if(await this._retrieveManager,!this._manager)return;this.removeUmbControllerByAlias("observeParentUnique"),this.setParentUnique(null),this.observe(this._manager.layouts,(e)=>{this._layoutEntries.setValue(e)},"observeParentLayouts"),this.observe(this.layoutEntries,(e)=>{this._manager?.setLayouts(e)},"observeThisLayouts");let r=this.getHostElement();if(r)r.removeAttribute("data-area-alias"),r.removeAttribute("data-area-col-span"),r.removeAttribute("data-area-row-span"),r.style.removeProperty("--umb-block-grid--grid-columns"),r.style.removeProperty("--umb-block-grid--area-column-span"),r.style.removeProperty("--umb-block-grid--area-row-span");this.removeUmbControllerByAlias("observeAreaType"),this.#h(),this.#d()}else{if(!this.#e)return;this.observe(this.#e.unique,(r)=>{this.setParentUnique(r??null)},"observeParentUnique"),this.observe(this.#e.layoutsOfArea(this.#o),(r)=>{if(r)this._layoutEntries.setValue(r)},"observeParentLayouts"),this.observe(this.layoutEntries,(r)=>{if(this.#o)this.#e?.setLayoutsOfArea(this.#o,r)},"observeThisLayouts"),this.observe(this.#e.areaType(this.#o),(r)=>{this.#i.setValue(r);let e=this.getHostElement();if(!e)return;e.setAttribute("data-area-alias",r?.alias??""),e.setAttribute("data-area-col-span",r?.columnSpan?.toString()??""),e.setAttribute("data-area-row-span",r?.rowSpan?.toString()??""),e.style.setProperty("--umb-block-grid--grid-columns",r?.columnSpan?.toString()??""),e.style.setProperty("--umb-block-grid--area-column-span",r?.columnSpan?.toString()??""),e.style.setProperty("--umb-block-grid--area-row-span",r?.rowSpan?.toString()??""),this.#h(),this.#d()},"observeAreaType")}}#h(){if(!this._manager)return;this.#a.setValue(this.#f()),this.#y()}#d(){if(!this._manager)return;if(this.#o!=null){let r=this.#i.getValue();if(this.removeUmbControllerByAlias("observeConfigurationRootLimits"),!r)return;this.#s.setValue({min:r.minAllowed??0,max:r.maxAllowed??1/0})}else if(this.#o===null){if(!this._manager)return;this.observe(this._manager.editorConfiguration,(r)=>{let e=r?.getValueByAlias("validationLimit")?.min??0,o=r?.getValueByAlias("validationLimit")?.max??1/0;this.#s.setValue({min:e,max:o})},"observeConfigurationRootLimits")}}getPathForCreateBlock(r){let e=this._catalogueRouteBuilderState.getValue();if(!e)return;return e({view:"create",index:r})}getPathForClipboard(r){return this._catalogueRouteBuilderState.getValue()?.({view:"clipboard",index:r})}isBlockTypeAllowed(r){return this.#a.asObservablePart((e)=>e.some((o)=>o.contentElementTypeKey===r))}async create(r,e,o){return await this._retrieveManager,await this._manager?.createWithPresets(r,e,o)}async insert(r,e,o,n){return await this._retrieveManager,this._manager?.insert(r,e,o,n)??!1}async delete(r){let e=this._layoutEntries.getValue().find((o)=>o.contentKey===r);if(!e)throw Error(`Cannot delete block, missing layout for ${r}`);await wb(e,async(o)=>{if(o.settingsKey)this._manager.removeOneSettings(o.settingsKey);this._manager.removeOneContent(o.contentKey),this._manager.removeExposesOf(o.contentKey)}),await super.delete(r)}async _insertFromPropertyValue(r,e){let o=r.layout[mt];if(!o)throw Error("No layout entries found");return await Promise.all(o.map(async(n)=>{if(await this._insertBlockFromPropertyValue(n,r,e),e.index!==-1)e={...e,index:e.index+1}})),e}async _insertBlockFromPropertyValue(r,e,o){await super._insertBlockFromPropertyValue(r,e,o),await wb(r,async(n,a,s)=>{let u={index:-1,parentUnique:a,areaKey:s};await this._insertBlockFromPropertyValue(n,e,u)})}#f(){if(!this._manager)return[];if(this.#o){let r=this.#i.getValue();if(!r)return[];if(r.specifiedAllowance&&r.specifiedAllowance?.length>0)return r.specifiedAllowance.flatMap((e)=>{if(e.groupKey)return this._manager?.getBlockTypes().filter((o)=>o.groupKey===e.groupKey)??[];else if(e.elementTypeKey)return this._manager?.getBlockTypes().filter((o)=>o.contentElementTypeKey===e.elementTypeKey)??[];return[]}).filter((e,o,n)=>n.findIndex((a)=>a.contentElementTypeKey===e.contentElementTypeKey)===o);return this._manager.getBlockTypes().filter((e)=>e.allowInAreas)}else if(this.#o===null)return this._manager.getBlockTypes().filter((r)=>r.allowAtRoot);return[]}#y(){if(!this._manager)return;if(this.#o){let r=this.#i.getValue();if(!r)return;if(r.specifiedAllowance&&r.specifiedAllowance?.length>0)this.#l.setValue(!0)}else if(this.#o===null);}#m;getInvalidBlockTypeLimits(){return this.#m??[]}checkBlockTypeLimitsValidity(){let r=this.#i.getValue();if(!r||!r.specifiedAllowance)return!1;let e=this._layoutEntries.getValue();return this.#m=r.specifiedAllowance.map((o)=>{if(!this._manager)return;let n=o.minAllowed||0,a=o.maxAllowed||0;if(o.groupKey){let s=this._manager.getBlockTypes().filter((c)=>c.groupKey===o.groupKey&&c.allowInAreas===!0).map((c)=>c.contentElementTypeKey)??[],u=e.filter((c)=>{let h=this._manager.getContentTypeKeyOfContentKey(c.contentKey);return h?s.indexOf(h)!==-1:!1}).length;if(u<n||a>0&&u>a)return{groupKey:o.groupKey,name:this._manager.getBlockGroupName(o.groupKey)??"?",amount:u,minRequirement:n,maxRequirement:a};return}else if(o.elementTypeKey){let s=e.filter((u)=>this._manager.getContentOf(u.contentKey)?.contentTypeKey===o.elementTypeKey).length;if(s<n||(a>0?s>a:!1))return{key:o.elementTypeKey,name:this._manager.getContentTypeNameOf(o.elementTypeKey)??"?",amount:s,minRequirement:n,maxRequirement:a};return}console.error("Invalid block type limit rule.",o);return}).filter((o)=>o!==void 0),this.#m.length===0}#b;getInvalidBlockTypeConfigurations(){return this.#b??[]}checkBlockTypeConfigurationValidity(){this.#b=[];let r=this._layoutEntries.getValue();if(r.length===0)return!0;let e=this.#a.getValue();if(e.length===0)return!1;if(!this._manager)return!0;let o=e.map((a)=>a.contentElementTypeKey);return r.filter((a)=>{let s=this._manager?.getContentTypeKeyOfContentKey(a.contentKey);if(!s)return!1;let u=o.indexOf(s)===-1;if(s&&u)this.#b?.push(this._manager?.getContentTypeNameOf(s)??s);return u}).length===0}allowDrop(r){let e=this._manager?.getContentOf(r),o=this.#a.getValue();if(!e||!o)return!1;return o.map((n)=>n.contentElementTypeKey).indexOf(e.contentTypeKey)!==-1}onDragStart(){this._manager?.onDragStart()}onDragEnd(){this._manager?.onDragEnd()}}import{css as Me,customElement as Ke,html as z,ifDefined as Ie,nothing as W,property as be,repeat as $e,state as S,when as me}from"@umbraco-cms/backoffice/external/lit";var E=function(r,e,o,n){var a=arguments.length,s=a<3?e:n===null?n=Object.getOwnPropertyDescriptor(e,o):n,u;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")s=Reflect.decorate(r,e,o,n);else for(var c=r.length-1;c>=0;c--)if(u=r[c])s=(a<3?u(s):a>3?u(e,o,s):u(e,o))||s;return a>3&&s&&Object.defineProperty(e,o,s),s};function Le(r){if(r.relatedModel.areas&&r.relatedModel.areas.length>0&&ab(r.pointerX,r.pointerY,r.relatedRect,-10))return null;let e=getComputedStyle(r.containerElement),o=Number(e.columnGap.split("px")[0])||0,n=parseInt(e.getPropertyValue("--umb-block-grid--grid-columns"),10),a=parseInt(r.relatedElement.dataset.colSpan??"",10),s=r.item.columnSpan;if(s>=n)return!0;let u=e.gridTemplateColumns.trim().split("px").map((g)=>Number(g)).filter((g)=>g>0).map((g,O,I)=>I.length===O?g:g+o),c=u.length,h=n-c;if(h>0){let g=N_(c,u)||0,O=(r.containerRect.width-g)/h;if(O>0)while(c++<n)u.push(O)}let w=0;if(r.placeholderIsInThisRow&&r.elementRect.left<r.relatedRect.left)w=-(r.elementRect.width+o);let x=Math.max(r.relatedRect.left-r.containerRect.left+w,0);return Math.round(bm(x,u))+a+s>n}var De={getUniqueOfElement:(r)=>r.contentKey,getUniqueOfModel:(r)=>r.contentKey,resolvePlacement:Le,identifier:"block-grid-editor",itemSelector:"umb-block-grid-entry",containerSelector:".umb-block-grid__layout-container"},k=class extends b(t){#t;#e;#r;#i;#n;#o;set areaKey(e){if(this._areaKey=e,this.#e.setAreaKey(e??null),this.#r?.destroy(),this.areaKey)this.#r=new md(this,this)}get areaKey(){return this._areaKey}set layoutColumns(e){this.#e.setLayoutColumns(e)}get layoutColumns(){return this.#e.getLayoutColumns()}constructor(){super();this.#t=new X(this,{...De,onStart:()=>{this.#e.onDragStart()},onEnd:()=>{this.#e.onDragEnd()},onChange:({model:e})=>{this.#e.setLayouts(e)},onRequestMove:({item:e})=>this.#e.allowDrop(e.contentKey),onDisallowed:()=>{this.setAttribute("disallow-drop","")},onAllowed:()=>{this.removeAttribute("disallow-drop")}}),this.#e=new re(this),this._isReadOnly=!1,this._layoutEntries=[],this.observe(this.#e.layoutEntries,(e)=>{this.#t.setModel(e),this._layoutEntries=e},null),this.observe(this.#e.allowedBlockTypes,(e)=>{if(this._allowedBlockTypes=e,e.length===1)this.observe(this.#e.firstAllowedBlockTypeName(),(o)=>{this._createLabel=this.localize.term("blockEditor_addThis",this.localize.string(o))},"observeSingleBlockTypeName");else this.removeUmbControllerByAlias("observeSingleBlockTypeName"),this._createLabel=this.localize.term("blockEditor_addBlock")},null),this.observe(this.#e.rangeLimits,(e)=>{this.#s(e)},null),this.observe(this.#e.hasTypeLimits,(e)=>{this.#a(e)},null),this.#e.getManager().then((e)=>{if(this.observe(e.layoutStylesheet,(o)=>{if(!o||this._styleElement?.href===o)return;this._styleElement=document.createElement("link"),this._styleElement.rel="stylesheet",this._styleElement.href=o},"observeStylesheet"),this.observe(e.readOnlyState.permitted,(o)=>this._isReadOnly=o,"observeIsReadOnly"),this.observe(e.variantId,(o)=>{if(o)this.#t.identifier="umb-block-grid-"+o.toString()},"observeVariantId"),this.areaKey)this.observe(this.#e.areaTypeCreateLabel,(o)=>this._configCreateLabel=o,"observeConfigCreateLabel");else this.observe(e.editorConfigurationPart((o)=>o?.find((n)=>n.alias==="createLabel")?.value),(o)=>this._configCreateLabel=o,"observeConfigCreateLabel")}),new md(this,this)}async#s(e){if(this._limitMax=e?.max,this.#n)this.removeValidator(this.#n),this.#n=void 0;if(e?.min!==0)this.#n=this.addValidator("rangeUnderflow",()=>this.localize.term("validation_entriesShort",e.min,(e.min??0)-this._layoutEntries.length),()=>this._layoutEntries.length<(e?.min??0));if(this.#o)this.removeValidator(this.#o),this.#o=void 0;if(e?.max!==1/0)this.#o=this.addValidator("rangeOverflow",()=>this.localize.term("validation_entriesExceed",e.max,this._layoutEntries.length-(e.max??this._layoutEntries.length)),()=>this._layoutEntries.length>(e?.max??1/0))}async#a(e){if(this.#i)this.removeValidator(this.#i),this.#i=void 0;if(e)this.#i=this.addValidator("customError",()=>this.#e.getInvalidBlockTypeLimits().map((n)=>this.localize.term(n.amount<n.minRequirement?"blockEditor_areaValidationEntriesShort":"blockEditor_areaValidationEntriesExceed",n.name,n.amount,n.minRequirement,n.maxRequirement)).join(", "),()=>!this.#e.checkBlockTypeLimitsValidity());else this.#i=this.addValidator("customError",()=>{let o=this.#e.getInvalidBlockTypeConfigurations().filter((n,a,s)=>s.indexOf(n)===a).join(", ");return this.localize.term(this._areaKey?"blockEditor_areaValidationEntriesNotAllowed":"blockEditor_rootValidationEntriesNotAllowed",o)},()=>!this.#e.checkBlockTypeConfigurationValidity())}render(){return z`
+			${this._styleElement}
+			<div class="umb-block-grid__layout-container" data-area-length=${this._layoutEntries.length}>
+				${$e(this._layoutEntries,(e)=>e.contentKey,(e,o)=>z`<umb-block-grid-entry
+							class="umb-block-grid__layout-item"
+							index=${o}
+							.contentKey=${e.contentKey}
+							.layout=${e}>
+						</umb-block-grid-entry> `)}
+			</div>
+			${me(this._allowedBlockTypes&&this._allowedBlockTypes.length>0,()=>this.#l())}
+			${me(this._areaKey,()=>z`<uui-form-validation-message .for=${this}></uui-form-validation-message>`)}
+		`}#l(){if(this._limitMax===1&&this._layoutEntries.length>0)return W;if(this._areaKey===null||this._layoutEntries.length===0)return z`
+				<uui-button-group id="createButton">
+					${this.#u()} ${this.#c()}
+				</uui-button-group>
+			`;else if(this._isReadOnly===!1)return z`
+				<uui-button-inline-create
+					href=${this.#e.getPathForCreateBlock(-1)??""}
+					label=${this.localize.term("blockEditor_addBlock")}></uui-button-inline-create>
+			`;else return W}#u(){if(this._isReadOnly&&this._layoutEntries.length>0)return W;let e=this.#e.getPathForCreateBlock(-1);return z`
+			<uui-button
+				look="placeholder"
+				color=${this.pristine===!1&&this.validity.valid===!1?"invalid":"default"}
+				label=${this._configCreateLabel??this._createLabel??""}
+				href=${Ie(e)}
+				@click=${async()=>{if(e===void 0){if(!this._allowedBlockTypes||this._allowedBlockTypes.length===0)throw Error("No block types are configured for this Block List property editor");let o=this._areaKey,n=this.#e.getParentUnique();if(o===void 0||n===void 0)throw Error("Cannot create block without a defined areaKey and parentUnique");let a={index:-1,areaKey:o??void 0,parentUnique:n},s=await this.#e.create(this._allowedBlockTypes[0].contentElementTypeKey,{},a);if(s)this.#e.insert(s.layout,s.content,s.settings,a);else throw Error("Failed to create block")}}}
+				?disabled=${this._isReadOnly}></uui-button>
+		`}#c(){if(this._areaKey)return W;if(this._isReadOnly&&this._layoutEntries.length>0)return W;return z`
+			<uui-button
+				label=${this.localize.term("content_createFromClipboard")}
+				look="placeholder"
+				href=${this.#e.getPathForClipboard(-1)??""}
+				?disabled=${this._isReadOnly}
+				title=${this.localize.term("general_clipboard")}>
+				<uui-icon name="icon-clipboard-paste"></uui-icon>
+			</uui-button>
+		`}static{this.styles=[i,Me`
+			:host {
+				position: relative;
+				display: grid;
+			}
+			:host([disallow-drop])::before {
+				content: '';
+				position: absolute;
+				z-index: 1;
+				inset: 0;
+				border: 2px solid var(--uui-color-danger);
+				border-radius: calc(var(--uui-border-radius) * 2);
+				pointer-events: none;
+			}
+			:host([disallow-drop])::after {
+				content: '';
+				position: absolute;
+				z-index: 1;
+				inset: 0;
+				border-radius: calc(var(--uui-border-radius) * 2);
+				background-color: var(--uui-color-danger);
+				opacity: 0.2;
+				pointer-events: none;
+			}
+
+			> div {
+				display: flex;
+				flex-direction: column;
+				align-items: stretch;
+			}
+
+			#createButton {
+				margin-top: 1px;
+				grid-template-columns: 1fr auto;
+				display: grid;
+			}
+
+			/* Only when we are n an area, we like to hide the button on drag */
+			:host([area-key]) #createButton {
+				--umb-block-grid--create-button--is-dragging--variable: var(--umb-block-grid--is-dragging) none;
+				display: var(--umb-block-grid--create-button--is-dragging--variable, grid);
+			}
+
+			.umb-block-grid__layout-container[data-area-length='0'] {
+				--umb-block-grid--layout-container--is-dragging--variable: var(--umb-block-grid--is-dragging) 1;
+				min-height: calc(var(--umb-block-grid--layout-container--is-dragging--variable, 0) * var(--uui-size-11));
+			}
+
+			.umb-block-grid__layout-container[data-area-length='0']::after {
+				content: '';
+				position: absolute;
+				inset: 0;
+				top: 1px;
+				border: calc(var(--umb-block-grid--layout-container--is-dragging--variable, 0) * 1px) dashed
+					var(--uui-color-border);
+				border-radius: var(--uui-border-radius);
+			}
+		`]}};E([be({type:String,attribute:"area-key",reflect:!0})],k.prototype,"areaKey",null);E([be({attribute:!1})],k.prototype,"layoutColumns",null);E([S()],k.prototype,"_areaKey",void 0);E([S()],k.prototype,"_allowedBlockTypes",void 0);E([S()],k.prototype,"_configCreateLabel",void 0);E([S()],k.prototype,"_createLabel",void 0);E([S()],k.prototype,"_isReadOnly",void 0);E([S()],k.prototype,"_layoutEntries",void 0);E([S()],k.prototype,"_limitMax",void 0);E([S()],k.prototype,"_styleElement",void 0);k=E([Ke("umb-block-grid-entries")],k);class ne extends yn{getMinMaxRowSpan(){let r=this._blockType.getValue();if(!r)return;return[r.rowMinSpan??1,r.rowMaxSpan??1]}#t;getRelevantColumnSpanOptions(){return this.#t.getValue()}#e;#r;#i;#n;constructor(r){super(r,bp,Gy);this.columnSpan=this._layout.asObservablePart((e)=>e?e.columnSpan??null:void 0),this.rowSpan=this._layout.asObservablePart((e)=>e?e.rowSpan??null:void 0),this.layoutAreas=this._layout.asObservablePart((e)=>e?.areas),this.columnSpanOptions=this._blockType.asObservablePart((e)=>e?.columnSpanOptions??[]),this.areaTypeGridColumns=this._blockType.asObservablePart((e)=>e?.areaGridColumns),this.areas=this._blockType.asObservablePart((e)=>e?.areas??[]),this.minMaxRowSpan=this._blockType.asObservablePart((e)=>e?[e.rowMinSpan??1,e.rowMaxSpan??1]:void 0),this.forceHideContentEditorInOverlay=this._blockType.asObservablePart((e)=>e?e.forceHideContentEditorInOverlay??!1:void 0),this.inlineEditingMode=this._blockType.asObservablePart((e)=>e?.inlineEditing===!0),this.#t=new y([],(e)=>e),this.relevantColumnSpanOptions=this.#t.asObservable(),this.#e=new C(!1),this.canScale=this.#e.asObservable(),this.#r=new C(!1),this.isAllowed=this.#r.asObservable(),this.#i=new kt(void 0),this.areaGridColumns=this.#i.asObservable(),this.showContentEdit=oe([this._contentStructureHasProperties,this.forceHideContentEditorInOverlay],([e,o])=>e===!0&&o===!1),this.#n=new C(void 0),this.isSortMode=this.#n.asObservable(),this.scaleManager=new Tb(this)}_needsLegacyLabelRenderer(){return!1}layoutsOfArea(r){return this._layout.asObservablePart((e)=>e?.areas?.find((o)=>o.key===r)?.items)}areaType(r){return this._blockType.asObservablePart((e)=>e?.areas?.find((o)=>o.key===r))}setLayoutsOfArea(r,e){let o=this._layout.value;if(!o)return;let n=Mt(o?.areas??[],{key:r,items:e},(a)=>a.key);this._layout.update({areas:n})}setColumnSpan(r){if(!this._entries)return;let e=this._entries.getLayoutColumns();if(!e)return;if(r=this.#s(r,this.getRelevantColumnSpanOptions(),e),r===this.getColumnSpan())return;let o=this._layout.getValue();if(!o)return;this._layout.setValue({...o,columnSpan:r})}getColumnSpan(){return this._layout.getValue()?.columnSpan}setRowSpan(r){let e=this.getMinMaxRowSpan();if(!e)return;if(r=Math.max(e[0],Math.min(r,e[1])),r===this.getRowSpan())return;let o=this._layout.getValue();if(!o)return;this._layout.setValue({...o,rowSpan:r})}getRowSpan(){return this._layout.getValue()?.rowSpan}_gotManager(){this.#o()}_gotEntries(){if(this.scaleManager.setEntriesContext(this._entries),!this._entries)return;this.#o(),this.observe(this.contentElementTypeKey,(r)=>{this.observe(r?this._entries?.isBlockTypeAllowed(r):void 0,(e)=>{if(e===void 0)return;this.#r.setValue(e)},"observeIsAllowed")},"observeContentElementTypeKey"),this.observe(L([this.minMaxRowSpan,this.columnSpanOptions,this._entries.layoutColumns]),([r,e,o])=>{if(!o||!r)return;let n=e?e.filter((c)=>c.columnSpan<=o).map((c)=>c.columnSpan).sort((c,h)=>c>h?1:h>c?-1:0):[];this.#t.setValue(n);let a=n.length>1,s=r[0]!==r[1],u=a||s;this.#e.setValue(u)},"observeScaleOptions"),this.observe(L([this.areaTypeGridColumns,this._entries.layoutColumns]),([r,e])=>{this.#i.setValue(r??e)},"observeAreaGridColumns")}#o(){if(!this._entries||!this._manager)return;this.observe(L([this.areas,this.layoutAreas]),([r,e])=>{if(!r||!e)return;if((r.length===e.length&&r.every((n)=>e.some((a)=>a.key===n.key)))===!1){let n=this._layout.getValue();if(!n)return;this._layout.setValue({...n,areas:e.map((a)=>r.find((s)=>s.key===a.key)?a:{key:a.key,items:[]})})}},"observeAreaValidation"),this.observe(L([this.columnSpan,this.relevantColumnSpanOptions,this._entries.layoutColumns]),([r,e,o])=>{if(!o||r===void 0)return;let n=this.#s(r??o,e,o);if(n!==r){let a=this._layout.getValue();if(!a)return;this._layout.setValue({...a,columnSpan:n})}},"observeColumnSpanValidation"),this.observe(L([this.minMaxRowSpan,this.rowSpan]),([r,e])=>{if(!r||e===void 0)return;let o=Math.max(r[0],Math.min(e??1,r[1]));if(o!==e){let n=this._layout.getValue();if(!n)return;this._layout.setValue({...n,rowSpan:o})}},"observeRowSpanValidation"),this.observe(this._manager.isSortMode,(r)=>this.#n.setValue(r??!1),"observeIsSortMode")}_gotContentType(){}#s(r,e,o){if(e.length>0){let n=Tk(r,e,o)??o;if(n!==r)return n}else return o;return r}async copyToClipboard(){if(!this._manager)return;let r=await this.getContext(le),e=await this.getContext(ee),o=await this.getContext(At);if(!o)throw Error("No clipboard context found");let n=this.localize.string(r?.getName()),a=this.localize.string(e?.getLabel()),s=this.getName(),u=n?`${n} - ${a} - ${s}`:`${a} - ${s}`,c=this.getLayout();if(!c)throw Error("No layout found");let h=this.getContent(),w=this.getSettings(),x=this.getExpose(),K=h?[structuredClone(h)]:[],Q=w?[structuredClone(w)]:[],g=x?[structuredClone(x)]:[];wb(c,async(I)=>{let ue=this._manager.getContentOf(I.contentKey);if(!ue)throw Error("No content found");if(K.push(structuredClone(ue)),I.settingsKey){let ce=this._manager.getSettingsOf(I.settingsKey);if(ce)Q.push(structuredClone(ce))}});let O={layout:{[mt]:c?[structuredClone(c)]:void 0},contentData:K,settingsData:Q,expose:g};o.write({icon:this.getContentElementTypeIcon(),name:u,propertyValue:O,propertyEditorUiAlias:wi})}}import{css as Ne,customElement as Ge,html as v,nothing as V,property as H,state as m,when as q}from"@umbraco-cms/backoffice/external/lit";import{UUIBlinkAnimationValue as qe,UUIBlinkKeyframes as je}from"@umbraco-cms/backoffice/external/uui";var p=function(r,e,o,n){var a=arguments.length,s=a<3?e:n===null?n=Object.getOwnPropertyDescriptor(e,o):n,u;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")s=Reflect.decorate(r,e,o,n);else for(var c=r.length-1;c>=0;c--)if(u=r[c])s=(a<3?u(s):a>3?u(e,o,s):u(e,o))||s;return a>3&&s&&Object.defineProperty(e,o,s),s},d=class extends t{get index(){return this.#t.getIndex()}set index(e){this.#t.setIndex(e)}get contentKey(){return this._contentKey}set contentKey(e){if(!e||e===this._contentKey)return;this._contentKey=e,this._blockViewProps.contentKey=e,this.setAttribute("data-element-key",e),this.#t.setContentKey(e),new Ui(this,`$.contentData[${Hi({key:e})}]`,(o)=>{this._contentInvalid=o,this._blockViewProps.contentInvalid=o},"observeMessagesForContent")}#t;#e;#r;#i(e){this._blockViewProps={...this._blockViewProps,...e},this.requestUpdate("_blockViewProps")}constructor(){super();this.#t=new ne(this),this.#r=new ResizeObserver(()=>this.#u()),this._showContentEdit=!1,this._label="",this._blockViewProps={contentKey:void 0,config:{showContentEdit:!1,showSettingsEdit:!1}},this._isReadOnly=!1,this.#s=()=>{this.#t.expose()},this.#a=(e)=>{this.#t.setName(e.detail.text)},this.#c=()=>{let e=this.parentElement;if(!e)return;let o=e.getBoundingClientRect();if(o.width===0){this._showInlineCreateBefore=!1,this._showInlineCreateAfter=!1,this._inlineCreateAboveWidth=void 0,this.#e=setTimeout(this.#c,100);return}let n=this.getBoundingClientRect();if(n.right>o.right-5)this._showInlineCreateAfter=!1;else this._showInlineCreateAfter=!0;if(n.left>o.left+5)this._showInlineCreateBefore=!1,this._inlineCreateAboveWidth=void 0;else this._inlineCreateAboveWidth=getComputedStyle(e).width,this._showInlineCreateBefore=!0},this.#p=(e)=>{if(!this._contentTypeAlias)return!1;if(e.forContentTypeAlias&&!zt(e.forContentTypeAlias,this._contentTypeAlias))return!1;if(e.forBlockEditor&&!zt(e.forBlockEditor,If))return!1;return!0},this.#h=(e)=>{if(e.component)e.component.classList.add("umb-block-grid__block--view"),e.component.setAttribute("part","component");return v`${this.#l()}
+		${q(this._exposed||this._isReadOnly,()=>e.component,()=>v`
+				<div>
+					${e.component}
+					<umb-block-overlay-expose-button .contentTypeName=${this._contentTypeName} @click=${this.#s}>
+					</umb-block-overlay-expose-button>
+				</div>
+			`)}`},this.#d=()=>{if(this._unsupported)return this.#f();if(this._inlineEditingMode)return this.#y();return this.#m()},this.#n()}#n(){this.observe(this.#t.showContentEdit,(e)=>{this._showContentEdit=e,this.#i({config:{...this._blockViewProps.config,showContentEdit:e}})},null),this.observe(this.#t.settingsElementTypeKey,(e)=>{this.#i({config:{...this._blockViewProps.config,showSettingsEdit:!!e}})},null),this.observe(this.#t.canScale,(e)=>this._canScale=e,null),this.observe(this.#t.isAllowed,(e)=>this._invalidLocation=!e,null),this.observe(this.#t.blockType,(e)=>{this.#i({blockType:e})},null),this.observe(this.#t.index,(e)=>this.#i({index:e}),null),this.observe(this.#t.label,(e)=>{this.#i({label:e}),this._label=e},null),this.observe(this.#t.contentElementTypeIcon,(e)=>{this.#i({icon:e}),this._icon=e},null),this.observe(this.#t.hasExpose,(e)=>{this.#i({unpublished:!e}),this._exposed=e},null),this.observe(this.#t.unsupported,(e)=>{if(e===void 0)return;this.#i({unsupported:e}),this._unsupported=e,this.toggleAttribute("unsupported",e)},null),this.observe(this.#t.actionsVisibility,(e)=>this._showActions=e,null),this.observe(this.#t.inlineEditingMode,(e)=>this._inlineEditingMode=e,null),this.observe(this.#t.isSortMode,(e)=>this._isSortMode=e,null),this.observe(this.#t.name,(e)=>this._name=e,null),this.observe(this.#t.layout,(e)=>{this.#i({layout:e})},null),this.#o(),this.observe(this.#t.settingsKey,(e)=>{if(this.removeUmbControllerByAlias("observeMessagesForSettings"),e)new Ui(this,`$.settingsData[${Hi({key:e})}]`,(o)=>{this._settingsInvalid=o,this._blockViewProps.settingsInvalid=o},"observeMessagesForSettings")},null),this.observe(this.#t.createBeforePath,(e)=>{this._createBeforePath=e},null),this.observe(this.#t.createAfterPath,(e)=>{this._createAfterPath=e},null),this.observe(this.#t.workspaceEditContentPath,(e)=>{this.#i({config:{...this._blockViewProps.config,editContentPath:e}})},null),this.observe(this.#t.workspaceEditSettingsPath,(e)=>{this.#i({config:{...this._blockViewProps.config,editSettingsPath:e}})},null),this.observe(this.#t.readOnlyGuard.permitted,(e)=>{this._isReadOnly=e,this.#i({readonly:e})},"umbReadOnlyObserver")}async#o(){this.observe(await this.#t.contentValues(),(e)=>{this.#i({content:e})},null),this.observe(await this.#t.settingsValues(),(e)=>{this.#i({settings:e})},null)}connectedCallback(){if(super.connectedCallback(),this.observe(this.#t.columnSpan,(e)=>{this._columnSpan=e,this.setAttribute("data-col-span",e?e.toString():""),this.style.setProperty("--umb-block-grid--item-column-span",e?e.toString():"")},"columnSpan"),this.observe(this.#t.rowSpan,(e)=>{this._rowSpan=e,this.setAttribute("data-row-span",e?e.toString():""),this.style.setProperty("--umb-block-grid--item-row-span",e?e.toString():"")},"rowSpan"),this.observe(this.#t.contentElementTypeKey,(e)=>{if(e)this.setAttribute("data-content-element-type-key",e)},"contentElementTypeKey"),this.observe(this.#t.contentElementTypeAlias,(e)=>{if(e)this._contentTypeAlias=e,this.setAttribute("data-content-element-type-alias",e)},"contentElementTypeAlias"),this.observe(this.#t.contentElementTypeName,(e)=>{this._contentTypeName=e},"contentElementTypeName"),this.#u(),this.parentElement)this.#r.observe(this.parentElement)}disconnectedCallback(){super.disconnectedCallback(),this.#r.disconnect()}destroy(){this.#r.disconnect(),super.destroy()}updated(e){if(super.updated(e),e.has("_blockViewProps")||e.has("_columnSpan"))this.#u()}#s;#a;#l(){let e={...this._blockViewProps.content,$settings:this._blockViewProps.settings,$index:this.index};return el(this._label,e,this.#a)}#u(){clearTimeout(this.#e),this.#e=setTimeout(this.#c,100)}#c;#p;#h;render(){return q(this.contentKey&&(this._contentTypeAlias||this._unsupported),()=>v`
+				${this.#b()}
+				<div class="umb-block-grid__block" part="umb-block-grid__block">
+					${q(this._isSortMode,()=>this.#m(),()=>v`
+							<umb-extension-slot
+								single
+								type="blockEditorCustomView"
+								.filter=${this.#p}
+								.renderMethod=${this.#h}
+								.fallbackRenderMethod=${this.#d}
+								.props=${this._blockViewProps}></umb-extension-slot>
+						`)}
+					${this.#_()}
+					${q(!this._showContentEdit&&this._contentInvalid,()=>v`<uui-badge attention color="invalid" label="Invalid content">!</uui-badge>`)}
+					${q(this._invalidLocation,()=>v`
+							<uui-tag id="invalidLocation" color="danger">
+								<umb-localize
+									key="blockEditor_invalidDropPosition"
+									.args=${[this._contentTypeName??this.localize.term("blockEditor_unsupportedBlockName")]}></umb-localize>
+							</uui-tag>
+						`)}
+					${q(this._canScale,()=>v`
+							<umb-block-scale-handler @mousedown=${(e)=>this.#t.scaleManager.onScaleMouseDown(e)}>
+								${this._columnSpan}x${this._rowSpan}
+							</umb-block-scale-handler>
+						`)}
+				</div>
+				${this.#g()}
+			`)}#d;#f(){return v`
+			${this.#l()}
+			<umb-block-grid-block-unsupported
+				class="umb-block-grid__block--view"
+				.config=${this._blockViewProps.config}
+				.content=${this._blockViewProps.content}
+				.settings=${this._blockViewProps.settings}
+				${Li()}>
+			</umb-block-grid-block-unsupported>
+		`}#y(){return v`
+			<umb-block-grid-block-inline
+				class="umb-block-grid__block--view"
+				.label=${this._label}
+				.icon=${this._icon}
+				.index=${this._blockViewProps.index}
+				.unpublished=${!this._exposed}
+				.config=${this._blockViewProps.config}
+				.content=${this._blockViewProps.content}
+				.settings=${this._blockViewProps.settings}
+				${Li()}>
+			</umb-block-grid-block-inline>
+		`}#m(){return v`
+			<umb-block-grid-block
+				class="umb-block-grid__block--view ${this._isSortMode?"sortable":""}"
+				.label=${this._label}
+				.icon=${this._icon}
+				.index=${this._blockViewProps.index}
+				.unpublished=${!this._exposed}
+				.config=${this._blockViewProps.config}
+				.content=${this._blockViewProps.content}
+				.settings=${this._blockViewProps.settings}
+				${Li()}>
+			</umb-block-grid-block>
+		`}#b(){if(this._isReadOnly)return V;if(!this._createBeforePath)return V;if(!this._showInlineCreateBefore)return V;return v`
+			<uui-button-inline-create
+				href=${this._createBeforePath}
+				label=${this.localize.term("blockEditor_addBlock")}
+				style=${this._inlineCreateAboveWidth?`width: ${this._inlineCreateAboveWidth}`:""}>
+			</uui-button-inline-create>
+		`}#g(){if(this._isReadOnly)return V;if(!this._createAfterPath)return V;if(!this._showInlineCreateAfter)return V;return v`
+			<uui-button-inline-create
+				vertical
+				label=${this.localize.term("blockEditor_addBlock")}
+				href=${this._createAfterPath}></uui-button-inline-create>
+		`}#_(){if(this._isSortMode)return V;if(!this._showActions)return V;return v`<umb-block-action-list id="actions" block-editor=${If}></umb-block-action-list>`}static{this.styles=[je,Ne`
+			:host {
+				position: relative;
+				display: block;
+				--umb-block-grid-entry-actions-opacity: 0;
+			}
+
+			:host([settings-invalid]),
+			:host([content-invalid]),
+			:host(:hover),
+			:host(:focus-within) {
+				--umb-block-grid-entry-actions-opacity: 1;
+			}
+
+			:host::after {
+				content: '';
+				position: absolute;
+				z-index: 1;
+				pointer-events: none;
+				inset: 0;
+				border: 1px solid transparent;
+				border-radius: var(--uui-border-radius);
+
+				transition: border-color 240ms ease-in;
+			}
+
+			:host([location-invalid])::after,
+			:host([settings-invalid])::after,
+			:host([content-invalid])::after {
+				border-color: var(--uui-color-invalid);
+			}
+
+			umb-extension-slot::part(component) {
+				position: relative;
+				z-index: 0;
+			}
+
+			#invalidLocation {
+				position: absolute;
+				top: -1em;
+				left: var(--uui-size-space-2);
+				z-index: 2;
+			}
+
+			uui-button-inline-create {
+				top: 0px;
+				position: absolute;
+
+				--umb-block-grid__block--inline-create-button-display--condition: var(--umb-block-grid--dragging-mode) none;
+				display: var(--umb-block-grid__block--inline-create-button-display--condition);
+			}
+
+			uui-button-inline-create:not([vertical]) {
+				left: 0;
+				width: var(--umb-block-grid-editor--inline-create-width, 100%);
+			}
+
+			:host(:not([index='0'])) uui-button-inline-create:not([vertical]) {
+				top: calc(var(--umb-block-grid--row-gap, 0px) * -0.5);
+			}
+
+			#actions {
+				position: absolute;
+				top: var(--uui-size-2);
+				right: var(--uui-size-2);
+				opacity: var(--umb-block-grid-entry-actions-opacity, 0);
+				transition: opacity 120ms;
+				z-index: 1;
+			}
+
+			uui-button-inline-create[vertical] {
+				right: calc(1px - (var(--umb-block-grid--column-gap, 0px) * 0.5));
+			}
+
+			.umb-block-grid__block {
+				height: 100%;
+			}
+
+			:host(:hover):not(:drop)::after {
+				display: block;
+				border-color: var(--uui-color-interactive-emphasis);
+				box-shadow:
+					0 0 0 1px rgba(255, 255, 255, 0.7),
+					inset 0 0 0 1px rgba(255, 255, 255, 0.7);
+			}
+
+			:host([drag-placeholder])::after {
+				display: block;
+				border-width: 2px;
+				border-color: var(--uui-color-interactive-emphasis);
+				animation: ${qe};
+			}
+
+			:host([drag-placeholder])::before {
+				content: '';
+				position: absolute;
+				pointer-events: none;
+				inset: 0;
+				border-radius: var(--uui-border-radius);
+				background-color: var(--uui-color-interactive-emphasis);
+				opacity: 0.12;
+			}
+
+			:host([drag-placeholder]) .umb-block-grid__block {
+				transition: opacity 50ms 16ms;
+				opacity: 0;
+			}
+
+			uui-badge {
+				z-index: 2;
+			}
+
+			.umb-block-grid__block {
+				--umb-block-scale-handler-opacity: 0;
+
+				&:hover,
+				&:focus-within {
+					--umb-block-scale-handler-opacity: 1;
+				}
+			}
+		`]}};p([H({type:Number,reflect:!0})],d.prototype,"index",null);p([H({attribute:!1})],d.prototype,"contentKey",null);p([m()],d.prototype,"_contentTypeAlias",void 0);p([m()],d.prototype,"_contentTypeName",void 0);p([m()],d.prototype,"_columnSpan",void 0);p([m()],d.prototype,"_rowSpan",void 0);p([m()],d.prototype,"_showContentEdit",void 0);p([m()],d.prototype,"_createBeforePath",void 0);p([m()],d.prototype,"_createAfterPath",void 0);p([m()],d.prototype,"_label",void 0);p([m()],d.prototype,"_icon",void 0);p([m()],d.prototype,"_exposed",void 0);p([m()],d.prototype,"_unsupported",void 0);p([m()],d.prototype,"_showActions",void 0);p([m()],d.prototype,"_inlineEditingMode",void 0);p([m()],d.prototype,"_isSortMode",void 0);p([m()],d.prototype,"_canScale",void 0);p([m()],d.prototype,"_showInlineCreateBefore",void 0);p([m()],d.prototype,"_showInlineCreateAfter",void 0);p([m()],d.prototype,"_inlineCreateAboveWidth",void 0);p([H({type:Boolean,attribute:"location-invalid",reflect:!0})],d.prototype,"_invalidLocation",void 0);p([H({type:Boolean,attribute:"content-invalid",reflect:!0})],d.prototype,"_contentInvalid",void 0);p([H({type:Boolean,attribute:"settings-invalid",reflect:!0})],d.prototype,"_settingsInvalid",void 0);p([m()],d.prototype,"_blockViewProps",void 0);p([m()],d.prototype,"_isReadOnly",void 0);d=p([Ge("umb-block-grid-entry")],d);import{UUIRefNodeElement as fe}from"@umbraco-cms/backoffice/external/uui";import{css as Xe,customElement as Ye,html as We}from"@umbraco-cms/backoffice/external/lit";var Fe=function(r,e,o,n){var a=arguments.length,s=a<3?e:n===null?n=Object.getOwnPropertyDescriptor(e,o):n,u;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")s=Reflect.decorate(r,e,o,n);else for(var c=r.length-1;c>=0;c--)if(u=r[c])s=(a<3?u(s):a>3?u(e,o,s):u(e,o))||s;return a>3&&s&&Object.defineProperty(e,o,s),s},ye=class extends fe{render(){return We`
+			${super.render()}
+			<div class="break"></div>
+			<slot name="areas"></slot>
+		`}static{this.styles=[...fe.styles,Xe`
+			:host {
+				min-width: 20px; /* Set to something, to overwrite UUI min width. */
+				height: 100%; /* Help to fill out the whole layout entry. */
+				min-height: var(--uui-size-16);
+				flex-flow: row wrap;
+				background-color: var(--uui-color-surface);
+				padding: 0;
+			}
+
+			.break {
+				flex-basis: 100%;
+				height: 0;
+			}
+
+			#open-part {
+				display: flex;
+				align-self: start;
+				box-sizing: border-box;
+				min-height: var(--uui-size-16);
+				margin: 0;
+			}
+
+			:host([unpublished]) #open-part {
+				opacity: 0.6;
+			}
+		`]}};ye=Fe([Ye("umb-ref-grid-block")],ye);var G=function(r,e,o,n){var a=arguments.length,s=a<3?e:n===null?n=Object.getOwnPropertyDescriptor(e,o):n,u;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")s=Reflect.decorate(r,e,o,n);else for(var c=r.length-1;c>=0;c--)if(u=r[c])s=(a<3?u(s):a>3?u(e,o,s):u(e,o))||s;return a>3&&s&&Object.defineProperty(e,o,s),s},B=class extends b(t){#t;#e;#r;set config(e){if(!e)return;let o=e.getValueByAlias("blocks")??[];this.#e.setBlockTypes(o);let n=e.getValueByAlias("blockGroups")??[];this.#e.setBlockGroups(n);let a=e.getValueByAlias("useInlineEditingAsDefault");this.#e.setInlineEditingMode(a),this.style.maxWidth=e.getValueByAlias("maxPropertyWidth")??"",this.#e.setEditorConfiguration(e)}set readonly(e){if(this.#i=e,this.#i)this.#e.readOnlyState.fallbackToPermitted();else this.#e.readOnlyState.fallbackToNotPermitted()}get readonly(){return this.#i}#i;set value(e){if(this.#t=e,!e){super.value=void 0,this.#e.setLayouts([]),this.#e.setContents([]),this.#e.setSettings([]),this.#e.setExposes([]);return}let o=e?{...e}:{};o.layout??={},o.contentData??=[],o.settingsData??=[],o.expose??=[],super.value=o,this.#e.setLayouts(super.value.layout[mt]??[]),this.#e.setContents(super.value.contentData),this.#e.setSettings(super.value.settingsData),this.#e.setExposes(super.value.expose)}get value(){return super.value}constructor(){super();this.#t=void 0,this.#e=new J(this),this.#r=new St(this),this._isSortMode=!1,this.#i=!1,this.mandatoryMessage=A,this.addValidator("valueMissing",()=>this.mandatoryMessage,()=>{if(!this.mandatory||this.readonly)return!1;return(this.value?.layout?.[mt]?.length??0)===0}),this.consumeContext(ti,(e)=>{if(e)this.observe(L([this.#e.blockTypes,e.structure.variesByCulture,e.structure.variesBySegment]),async([o,n,a])=>{if(o.length>0&&(n===!1||a===!1)){let s=await Promise.all(o.map(async(u)=>{let c=u.contentElementTypeKey;await this.#e.contentTypesLoaded;let h=await this.#e.getStructure(c);if(n===!1&&h?.getVariesByCulture()===!0)return!0;else if(a===!1&&h?.getVariesBySegment()===!0)return!0;return!1}));if(this._notSupportedVariantSetting=s.filter((u)=>u===!0).length>0,this._notSupportedVariantSetting)this.#r.messages.addMessage("config","$","#blockEditor_blockVariantConfigurationNotSupported")}},"observeBlockTypes");else this.removeUmbControllerByAlias("observeBlockTypes")}).passContextAliasMatches(),this.consumeContext(ee,(e)=>{this.observe(e?.dataPath,(o)=>{if(o)this.#r.setDataPath(o),this.#r.autoReport()},"observeDataPath"),this.observe(L([this.#e.layouts,this.#e.contents,this.#e.settings,this.#e.exposes]).pipe(tt(20)),([o,n,a,s])=>{if(o.length===0){if(this.value===void 0)return;super.value=void 0}else{let u={...super.value,layout:{[mt]:o},contentData:n,settingsData:a,expose:s};if(yt(this.value,u))return;super.value=u}if(this.#t===void 0&&super.value===void 0)return;e?.setValue(super.value)},"motherObserver"),this.observe(e?.alias,(o)=>{this.#e.setPropertyAlias(o)},"observePropertyAlias")}),this.consumeContext(Ze,async(e)=>{this.observe(e?.displayVariantId,(o)=>{this.#e.setVariantId(o)},"observeContextualVariantId")}),this.observe(this.#e.isSortMode,(e)=>this._isSortMode=e??!1,null)}firstUpdated(e){super.firstUpdated(e),this.observe(this.#e.gridColumns,(o)=>{if(o)this._layoutColumns=o,this.style.setProperty("--umb-block-grid--grid-columns",o.toString())})}#n;#o(e){if(this.#n===e)return;if(this.#n)this.removeFormControlElement(this.#n);if(this.#n=e,e)this.addFormControlElement(e)}render(){if(this._notSupportedVariantSetting)return _e;return ge`
+			${this.#s()}
+			<umb-block-grid-entries
+				${et(this.#o)}
+				.areaKey=${null}
+				.layoutColumns=${this._layoutColumns}>
+			</umb-block-grid-entries>
+		`}#s(){if(!this._isSortMode)return _e;return ge`<umb-property-sort-mode-toolbar></umb-property-sort-mode-toolbar>`}static{this.styles=[i,He`
+			:host {
+				display: flex;
+				flex-direction: column;
+				gap: var(--uui-size-1);
+			}
+		`]}};G([ae()],B.prototype,"_layoutColumns",void 0);G([ae()],B.prototype,"_notSupportedVariantSetting",void 0);G([ae()],B.prototype,"_isSortMode",void 0);G([se({type:Boolean})],B.prototype,"mandatory",void 0);G([se({type:String})],B.prototype,"mandatoryMessage",void 0);G([se({attribute:!1})],B.prototype,"value",null);B=G([Je("umb-property-editor-ui-block-grid")],B);var ro=B;export{B as UmbPropertyEditorUIBlockGridElement,ro as default};