yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

move attributes to host of entry

Browse Source
This commit is contained in:
Niels Lyngsø
2024-02-13 08:54:55 +01:00
parent 6ceb1e546e
commit 2080ed5238
3 changed files with 20 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/Umbraco.Web.UI.Client/src/mocks/data/document/document.data.ts
View File

@@ -334,6 +334,7 @@ export const data: Array<UmbMockDocumentModel> = [
{
contentUdi: '1234',
settingsUdi: '5678',
columnSpan: 6,
areas: [
{
key: 'area1',
@@ -341,6 +342,7 @@ export const data: Array<UmbMockDocumentModel> = [
{
contentUdi: 'a1234',
settingsUdi: 'a5678',
columnSpan: 6,
areas: [],
},
],
@@ -351,6 +353,7 @@ export const data: Array<UmbMockDocumentModel> = [
{
contentUdi: 'b1234',
settingsUdi: 'b5678',
columnSpan: 6,
areas: [],
},
],

6
src/Umbraco.Web.UI.Client/src/packages/block/block-grid/components/block-grid-entries/block-grid-entries.element.ts
View File

@@ -84,7 +84,11 @@ export class UmbBlockGridEntriesElement extends UmbLitElement {
this._layoutEntries,
(x) => x.contentUdi,
(layoutEntry, index) =>
html`<umb-block-grid-entry .index=${index} .contentUdi=${layoutEntry.contentUdi} .layout=${layoutEntry}>
html`<umb-block-grid-entry
class="umb-block-grid__layout-item"
.index=${index}
.contentUdi=${layoutEntry.contentUdi}
.layout=${layoutEntry}>
</umb-block-grid-entry>`,
)}
<uui-button-group>

32
src/Umbraco.Web.UI.Client/src/packages/block/block-grid/components/block-grid-entry/block-grid-entry.element.ts
View File

@@ -27,6 +27,7 @@ export class UmbBlockGridEntryElement extends UmbLitElement implements UmbProper
if (!value) return;
this._contentUdi = value;
this._blockViewProps.contentUdi = value;
this.setAttribute('data-element-udi', value);
this.#context.setContentUdi(value);
}
private _contentUdi?: string | undefined;
@@ -34,12 +35,6 @@ export class UmbBlockGridEntryElement extends UmbLitElement implements UmbProper
#context = new UmbBlockGridEntryContext(this);
@state()
_contentElementTypeKey?: string;
@state()
_contentElementTypeAlias?: string;
@state()
_columnSpan?: number;
@@ -74,7 +69,6 @@ export class UmbBlockGridEntryElement extends UmbLitElement implements UmbProper
this.observe(this.#context.createPath, (createPath) => {
const oldValue = this._createPath;
console.log('createPath', createPath);
this._createPath = createPath;
this.requestUpdate('_createPath', oldValue);
});
@@ -121,6 +115,8 @@ export class UmbBlockGridEntryElement extends UmbLitElement implements UmbProper
this.#context.columnSpan,
(columnSpan) => {
this._columnSpan = columnSpan;
this.setAttribute('data-col-span', columnSpan ? columnSpan.toString() : '');
this.style.setProperty('--umb-block-grid--item-column-span', columnSpan ? columnSpan.toString() : '');
},
'columnSpan',
);
@@ -128,14 +124,20 @@ export class UmbBlockGridEntryElement extends UmbLitElement implements UmbProper
this.#context.rowSpan,
(rowSpan) => {
this._rowSpan = rowSpan;
this.setAttribute('data-row-span', rowSpan ? rowSpan.toString() : '');
this.style.setProperty('--umb-block-grid--item-row-span', rowSpan ? rowSpan.toString() : '');
},
'rowSpan',
);
this.observe(this.#context.contentElementTypeKey, (contentElementTypeKey) => {
this._contentElementTypeKey = contentElementTypeKey;
if (contentElementTypeKey) {
this.setAttribute('data-content-element-type-key', contentElementTypeKey);
}
});
this.observe(this.#context.contentElementTypeAlias, (contentElementTypeAlias) => {
this._contentElementTypeAlias = contentElementTypeAlias;
if (contentElementTypeAlias) {
this.setAttribute('data-content-element-type-alias', contentElementTypeAlias);
}
});
}
@@ -147,17 +149,7 @@ export class UmbBlockGridEntryElement extends UmbLitElement implements UmbProper
return this.contentUdi && this._createPath
? html`
<uui-button-inline-create href=${this._createPath}></uui-button-inline-create>
<div
class="umb-block-grid__layout-item"
data-element-udi=${ifDefined(this._contentUdi)}
data-content-element-type-key=${ifDefined(this._contentElementTypeKey)}
data-content-element-type-alias=${ifDefined(this._contentElementTypeAlias)}
data-col-span=${ifDefined(this._columnSpan ? this._columnSpan.toString() : '')}
data-row-span=${ifDefined(this._rowSpan ? this._rowSpan.toString() : '')}
style="
--umb-block-grid--item-column-span: ${ifDefined(this._columnSpan ? this._columnSpan.toString() : '')};
--umb-block-grid--item-row-span: ${ifDefined(this._rowSpan ? this._rowSpan.toString() : '')};
">
<div class="umb-block-grid__block">
<umb-extension-slot
type="blockEditorCustomView"
default-element=${'umb-ref-grid-block'}