Skip to content

Commit 0ffbe9d

Browse files
nnaydenowdimovpetar
authored andcommitted
refactor(framework): remove render method (#8501)
Removed the deprecated `UI5Element#render` method of the UI5Element class and replaced it with `UI5Element#renderer`. BREAKING CHANGE: Removed `UI5Element#render` method in favour of `UI5Element#renderer`. If you previously used "render" ```js class MyClass extends UI5Element { static get render() { return litRenderer; } } ``` start using "renderer" ```ts class MyClass extends UI5Element { static get renderer() { return litRenderer; } } ``` Related to [#8461](#8461)
1 parent bf8ce4a commit 0ffbe9d

File tree

1 file changed

+77
-0
lines changed

1 file changed

+77
-0
lines changed
Lines changed: 77 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
import UI5Element from "../../dist/UI5Element.js";
2+
import litRender, { html } from "../../dist/renderer/LitRenderer.js";
3+
4+
const metadata = {
5+
tag: "ui5-with-static-area",
6+
properties: {
7+
/**
8+
* Defines whether the static area item will be rendered
9+
*/
10+
staticContent: {
11+
type: Boolean,
12+
}
13+
},
14+
slots: {
15+
16+
}
17+
};
18+
19+
class WithStaticArea extends UI5Element {
20+
static get metadata() {
21+
return metadata;
22+
}
23+
24+
static get renderer() {
25+
return litRender;
26+
}
27+
28+
static get template() {
29+
return element => {
30+
// access effectiveDir getter to mark control as RTL-aware (test changes dir attribute and expects rerender)
31+
return html`
32+
<div dir=${element.effectiveDir}>
33+
WithStaticArea works!
34+
</div>`;
35+
};
36+
}
37+
38+
static get staticAreaTemplate() {
39+
return element => {
40+
return html`
41+
<div class="ui5-with-static-area-content">
42+
Static area content.
43+
</div>`;
44+
};
45+
}
46+
47+
static get styles() {
48+
return `
49+
:host {
50+
display: inline-block;
51+
border: 1px solid black;
52+
color: red;
53+
}`;
54+
}
55+
56+
async addStaticArea() {
57+
if (!this.staticContent) {
58+
return;
59+
}
60+
61+
// Require static area item
62+
const staticArea = await this.getStaticAreaItemDomRef();
63+
this.responsivePopover = staticArea.querySelector(".ui5-with-static-area-content");
64+
return this.responsivePopover;
65+
}
66+
67+
onBeforeRendering() {
68+
this.addStaticArea();
69+
}
70+
onAfterRendering() {}
71+
onEnterDOM() {}
72+
onExitDOM() {}
73+
}
74+
75+
WithStaticArea.define();
76+
77+
export default WithStaticArea;

0 commit comments

Comments
 (0)