Skip to content

Commit 9a47dc5

Browse files
JakobVogelsangJakobVogelsang
authored
refactor(zeroline): add common editor-container component (#328)
* feat(editor-container): initial commit * refactor(editor-container): further specify slots * feat(editor-container): add properties for styling * feat(zeroline/foundation): add create and create option function * refactor(zeroline/substation-editor): use editor-container * refactor(zeroline/voltage-level-editor): use editor-container * refactor(zeroline/bay-editor): use editor-container * test: fix add element integration * test(substation-editor): remove unused variables * test: update snapshots * refactor(editor-container): better naming * style(editor-container): improve styling * test(editor-container): update unit test * refactor(editor-container): move add logic into editor-container * fix(zeroline/bay-editor): fix level set low * refactor(editor-container): add internal default header * refactor(editor-container): change property marginless to nomargin * refactor(editor-container): change property colorTheme to theme * chore(package.json): fix mwc component verion to 0.22.1 to avoid build issues * refactor(editor-container): change missleading return type * reafctor(editor-container): some code improvements * refactor(editor-container): change level definition and automaticaly determin level and contrasted * chore: fix typedoc version
1 parent 14adc8b commit 9a47dc5

16 files changed

+1136
-578
lines changed

‎__snapshots__/bay-editor.md‎

Lines changed: 102 additions & 62 deletions
Original file line numberDiff line numberDiff line change
@@ -3,51 +3,58 @@
33
#### `looks like the latest snapshot`
44

55
```html
6-
<section tabindex="0">
7-
<h3>
8-
COUPLING_BAY — Bay
9-
<abbr title="[add]">
10-
<mwc-icon-button icon="playlist_add">
11-
</mwc-icon-button>
12-
</abbr>
13-
<nav>
14-
<abbr title="[lnode.tooltip]">
15-
<mwc-icon-button icon="account_tree">
16-
</mwc-icon-button>
17-
</abbr>
18-
<abbr title="[duplicate]">
19-
<mwc-icon-button icon="content_copy">
20-
</mwc-icon-button>
21-
</abbr>
22-
<abbr title="[edit]">
23-
<mwc-icon-button icon="edit">
24-
</mwc-icon-button>
25-
</abbr>
26-
<abbr title="[move]">
27-
<mwc-icon-button icon="forward">
28-
</mwc-icon-button>
29-
</abbr>
30-
<abbr title="[remove]">
31-
<mwc-icon-button icon="delete">
32-
</mwc-icon-button>
33-
</abbr>
34-
</nav>
35-
</h3>
36-
<div>
37-
<div id="ceContainer">
38-
<conducting-equipment-editor>
39-
</conducting-equipment-editor>
40-
<conducting-equipment-editor>
41-
</conducting-equipment-editor>
42-
<conducting-equipment-editor>
43-
</conducting-equipment-editor>
44-
<conducting-equipment-editor>
45-
</conducting-equipment-editor>
46-
<conducting-equipment-editor>
47-
</conducting-equipment-editor>
48-
</div>
6+
<editor-container nomargin="">
7+
<abbr
8+
slot="header"
9+
title="[lnode.tooltip]"
10+
>
11+
<mwc-icon-button icon="account_tree">
12+
</mwc-icon-button>
13+
</abbr>
14+
<abbr
15+
slot="header"
16+
title="[duplicate]"
17+
>
18+
<mwc-icon-button icon="content_copy">
19+
</mwc-icon-button>
20+
</abbr>
21+
<abbr
22+
slot="header"
23+
title="[edit]"
24+
>
25+
<mwc-icon-button icon="edit">
26+
</mwc-icon-button>
27+
</abbr>
28+
<abbr
29+
slot="header"
30+
title="[move]"
31+
>
32+
<mwc-icon-button icon="forward">
33+
</mwc-icon-button>
34+
</abbr>
35+
<abbr
36+
slot="header"
37+
title="[remove]"
38+
>
39+
<mwc-icon-button icon="delete">
40+
</mwc-icon-button>
41+
</abbr>
42+
<div
43+
id="ceContainer"
44+
slot="container"
45+
>
46+
<conducting-equipment-editor>
47+
</conducting-equipment-editor>
48+
<conducting-equipment-editor>
49+
</conducting-equipment-editor>
50+
<conducting-equipment-editor>
51+
</conducting-equipment-editor>
52+
<conducting-equipment-editor>
53+
</conducting-equipment-editor>
54+
<conducting-equipment-editor>
55+
</conducting-equipment-editor>
4956
</div>
50-
</section>
57+
</editor-container>
5158

5259
```
5360

@@ -56,25 +63,58 @@
5663
#### `looks like the latest snapshot`
5764

5865
```html
59-
<section tabindex="0">
60-
<h3>
61-
COUPLING_BAY — Bay
62-
</h3>
63-
<div>
64-
<div id="ceContainer">
65-
<conducting-equipment-editor readonly="">
66-
</conducting-equipment-editor>
67-
<conducting-equipment-editor readonly="">
68-
</conducting-equipment-editor>
69-
<conducting-equipment-editor readonly="">
70-
</conducting-equipment-editor>
71-
<conducting-equipment-editor readonly="">
72-
</conducting-equipment-editor>
73-
<conducting-equipment-editor readonly="">
74-
</conducting-equipment-editor>
75-
</div>
66+
<editor-container nomargin="">
67+
<abbr
68+
slot="header"
69+
title="[lnode.tooltip]"
70+
>
71+
<mwc-icon-button icon="account_tree">
72+
</mwc-icon-button>
73+
</abbr>
74+
<abbr
75+
slot="header"
76+
title="[duplicate]"
77+
>
78+
<mwc-icon-button icon="content_copy">
79+
</mwc-icon-button>
80+
</abbr>
81+
<abbr
82+
slot="header"
83+
title="[edit]"
84+
>
85+
<mwc-icon-button icon="edit">
86+
</mwc-icon-button>
87+
</abbr>
88+
<abbr
89+
slot="header"
90+
title="[move]"
91+
>
92+
<mwc-icon-button icon="forward">
93+
</mwc-icon-button>
94+
</abbr>
95+
<abbr
96+
slot="header"
97+
title="[remove]"
98+
>
99+
<mwc-icon-button icon="delete">
100+
</mwc-icon-button>
101+
</abbr>
102+
<div
103+
id="ceContainer"
104+
slot="container"
105+
>
106+
<conducting-equipment-editor readonly="">
107+
</conducting-equipment-editor>
108+
<conducting-equipment-editor readonly="">
109+
</conducting-equipment-editor>
110+
<conducting-equipment-editor readonly="">
111+
</conducting-equipment-editor>
112+
<conducting-equipment-editor readonly="">
113+
</conducting-equipment-editor>
114+
<conducting-equipment-editor readonly="">
115+
</conducting-equipment-editor>
76116
</div>
77-
</section>
117+
</editor-container>
78118

79119
```
80120

‎__snapshots__/substation-editor.md‎

Lines changed: 84 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -3,41 +3,47 @@
33
#### `looks like the latest snapshot`
44

55
```html
6-
<section tabindex="0">
7-
<h1>
8-
AA1 — Substation
9-
<abbr title="[add]">
10-
<mwc-icon-button icon="playlist_add">
11-
</mwc-icon-button>
12-
</abbr>
13-
<nav>
14-
<abbr title="[lnode.tooltip]">
15-
<mwc-icon-button icon="account_tree">
16-
</mwc-icon-button>
17-
</abbr>
18-
<abbr title="[duplicate]">
19-
<mwc-icon-button icon="content_copy">
20-
</mwc-icon-button>
21-
</abbr>
22-
<abbr title="[edit]">
23-
<mwc-icon-button icon="edit">
24-
</mwc-icon-button>
25-
</abbr>
26-
<abbr title="[move]">
27-
<mwc-icon-button icon="forward">
28-
</mwc-icon-button>
29-
</abbr>
30-
<abbr title="[remove]">
31-
<mwc-icon-button icon="delete">
32-
</mwc-icon-button>
33-
</abbr>
34-
</nav>
35-
</h1>
36-
<voltage-level-editor>
6+
<editor-container>
7+
<abbr
8+
slot="header"
9+
title="[lnode.tooltip]"
10+
>
11+
<mwc-icon-button icon="account_tree">
12+
</mwc-icon-button>
13+
</abbr>
14+
<abbr
15+
slot="header"
16+
title="[duplicate]"
17+
>
18+
<mwc-icon-button icon="content_copy">
19+
</mwc-icon-button>
20+
</abbr>
21+
<abbr
22+
slot="header"
23+
title="[edit]"
24+
>
25+
<mwc-icon-button icon="edit">
26+
</mwc-icon-button>
27+
</abbr>
28+
<abbr
29+
slot="header"
30+
title="[move]"
31+
>
32+
<mwc-icon-button icon="forward">
33+
</mwc-icon-button>
34+
</abbr>
35+
<abbr
36+
slot="header"
37+
title="[remove]"
38+
>
39+
<mwc-icon-button icon="delete">
40+
</mwc-icon-button>
41+
</abbr>
42+
<voltage-level-editor slot="container">
3743
</voltage-level-editor>
38-
<voltage-level-editor>
44+
<voltage-level-editor slot="container">
3945
</voltage-level-editor>
40-
</section>
46+
</editor-container>
4147

4248
```
4349

@@ -46,15 +52,53 @@
4652
#### `looks like the latest snapshot`
4753

4854
```html
49-
<section tabindex="0">
50-
<h1>
51-
AA1 — Substation
52-
</h1>
53-
<voltage-level-editor readonly="">
55+
<editor-container>
56+
<abbr
57+
slot="header"
58+
title="[lnode.tooltip]"
59+
>
60+
<mwc-icon-button icon="account_tree">
61+
</mwc-icon-button>
62+
</abbr>
63+
<abbr
64+
slot="header"
65+
title="[duplicate]"
66+
>
67+
<mwc-icon-button icon="content_copy">
68+
</mwc-icon-button>
69+
</abbr>
70+
<abbr
71+
slot="header"
72+
title="[edit]"
73+
>
74+
<mwc-icon-button icon="edit">
75+
</mwc-icon-button>
76+
</abbr>
77+
<abbr
78+
slot="header"
79+
title="[move]"
80+
>
81+
<mwc-icon-button icon="forward">
82+
</mwc-icon-button>
83+
</abbr>
84+
<abbr
85+
slot="header"
86+
title="[remove]"
87+
>
88+
<mwc-icon-button icon="delete">
89+
</mwc-icon-button>
90+
</abbr>
91+
<voltage-level-editor
92+
readonly=""
93+
slot="container"
94+
>
5495
</voltage-level-editor>
55-
<voltage-level-editor readonly="">
96+
<voltage-level-editor
97+
readonly=""
98+
slot="container"
99+
>
56100
</voltage-level-editor>
57-
</section>
101+
</editor-container>
58102

59103
```
60104

0 commit comments

Comments
 (0)