@operato/layout 2.0.0-alpha.99 → 2.0.0-beta.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +258 -0
- package/dist/src/components/ox-resize-splitter.js +10 -0
- package/dist/src/components/ox-resize-splitter.js.map +1 -1
- package/dist/src/components/ox-split-pane.js +1 -1
- package/dist/src/components/ox-split-pane.js.map +1 -1
- package/dist/src/layouts/ox-aside-bar.js +27 -27
- package/dist/src/layouts/ox-aside-bar.js.map +1 -1
- package/dist/src/layouts/ox-footer-bar.js +26 -26
- package/dist/src/layouts/ox-footer-bar.js.map +1 -1
- package/dist/src/layouts/ox-header-bar.js +26 -26
- package/dist/src/layouts/ox-header-bar.js.map +1 -1
- package/dist/src/layouts/ox-nav-bar.js +27 -27
- package/dist/src/layouts/ox-nav-bar.js.map +1 -1
- package/dist/src/layouts/ox-page-footer-bar.js +26 -26
- package/dist/src/layouts/ox-page-footer-bar.js.map +1 -1
- package/dist/src/layouts/ox-page-header-bar.js +26 -26
- package/dist/src/layouts/ox-page-header-bar.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +6 -6
- package/src/components/ox-resize-splitter.ts +13 -0
- package/src/components/ox-split-pane.ts +1 -1
- package/src/layouts/ox-aside-bar.ts +31 -31
- package/src/layouts/ox-footer-bar.ts +30 -30
- package/src/layouts/ox-header-bar.ts +30 -30
- package/src/layouts/ox-nav-bar.ts +31 -31
- package/src/layouts/ox-page-footer-bar.ts +30 -30
- package/src/layouts/ox-page-header-bar.ts +30 -30
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"name": "@operato/layout",
|
|
3
3
|
"description": "Webcomponent layout following open-wc recommendations",
|
|
4
4
|
"author": "heartyoh",
|
|
5
|
-
"version": "2.0.0-
|
|
5
|
+
"version": "2.0.0-beta.12",
|
|
6
6
|
"main": "dist/src/index.js",
|
|
7
7
|
"module": "dist/src/index.js",
|
|
8
8
|
"exports": {
|
|
@@ -60,10 +60,10 @@
|
|
|
60
60
|
},
|
|
61
61
|
"dependencies": {
|
|
62
62
|
"@material/web": "^1.4.0",
|
|
63
|
-
"@operato/popup": "^2.0.0-
|
|
64
|
-
"@operato/shell": "^2.0.0-
|
|
65
|
-
"@operato/styles": "^2.0.0-
|
|
66
|
-
"@operato/utils": "^2.0.0-
|
|
63
|
+
"@operato/popup": "^2.0.0-beta.12",
|
|
64
|
+
"@operato/shell": "^2.0.0-beta.12",
|
|
65
|
+
"@operato/styles": "^2.0.0-beta.5",
|
|
66
|
+
"@operato/utils": "^2.0.0-beta.0",
|
|
67
67
|
"lit": "^3.1.2",
|
|
68
68
|
"pwa-helpers": "^0.9.1"
|
|
69
69
|
},
|
|
@@ -99,5 +99,5 @@
|
|
|
99
99
|
"prettier --write"
|
|
100
100
|
]
|
|
101
101
|
},
|
|
102
|
-
"gitHead": "
|
|
102
|
+
"gitHead": "08cd1f9bacfca1f0559ee61089a26087cc1876ba"
|
|
103
103
|
}
|
|
@@ -82,6 +82,8 @@ export class ResizeSplitter extends LitElement {
|
|
|
82
82
|
return
|
|
83
83
|
}
|
|
84
84
|
|
|
85
|
+
e.preventDefault()
|
|
86
|
+
|
|
85
87
|
this.dispatchEvent(
|
|
86
88
|
new CustomEvent('splitter-drag', {
|
|
87
89
|
bubbles: true,
|
|
@@ -96,6 +98,14 @@ export class ResizeSplitter extends LitElement {
|
|
|
96
98
|
dispatchEvent(new Event('resize'))
|
|
97
99
|
})
|
|
98
100
|
|
|
101
|
+
if (this.hasAttribute('vertical')) {
|
|
102
|
+
document.body.style.cursor = 'col-resize'
|
|
103
|
+
} else {
|
|
104
|
+
document.body.style.cursor = 'row-resize'
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
document.body.style.userSelect = 'none'
|
|
108
|
+
|
|
99
109
|
e.stopPropagation()
|
|
100
110
|
}
|
|
101
111
|
|
|
@@ -119,6 +129,9 @@ export class ResizeSplitter extends LitElement {
|
|
|
119
129
|
delete this.dragstart
|
|
120
130
|
})
|
|
121
131
|
|
|
132
|
+
document.body.style.cursor = ''
|
|
133
|
+
document.body.style.userSelect = ''
|
|
134
|
+
|
|
122
135
|
e.stopPropagation()
|
|
123
136
|
}
|
|
124
137
|
}
|
|
@@ -20,7 +20,7 @@ export class OxSplitPane extends LitElement {
|
|
|
20
20
|
#splitter {
|
|
21
21
|
background-color: #ccc;
|
|
22
22
|
cursor: var(--cursor-shape, col-resize);
|
|
23
|
-
color: var(--primary-
|
|
23
|
+
color: var(--md-sys-color-on-primary-container, #ccc);
|
|
24
24
|
}
|
|
25
25
|
|
|
26
26
|
:host([direction='row']) #splitter {
|
|
@@ -58,36 +58,36 @@ class AsideBar extends connect(store)(LitElement) {
|
|
|
58
58
|
!asidebar.show
|
|
59
59
|
? html``
|
|
60
60
|
: asidebar.hovering
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
61
|
+
? html`
|
|
62
|
+
<ox-floating-overlay
|
|
63
|
+
.backdrop=${asidebar.backdrop}
|
|
64
|
+
direction="left"
|
|
65
|
+
.hovering=${asidebar.hovering}
|
|
66
|
+
.name=${asidebar.name}
|
|
67
|
+
.size=${asidebar.size}
|
|
68
|
+
.title=${asidebar.title}
|
|
69
|
+
.help=${asidebar.help}
|
|
70
|
+
.closable=${asidebar.closable}
|
|
71
|
+
.templateProperties=${asidebar.templateProperties}
|
|
72
|
+
.historical=${true}
|
|
73
|
+
.search=${asidebar.search}
|
|
74
|
+
.filter=${asidebar.filter}
|
|
75
|
+
z-index=${ifDefined(asidebar.zIndex)}
|
|
76
|
+
>${asidebar.template}</ox-floating-overlay
|
|
77
|
+
>
|
|
78
|
+
`
|
|
79
|
+
: html`
|
|
80
|
+
<div asidebar>${asidebar.template}</div>
|
|
81
|
+
${asidebar.resizable
|
|
82
|
+
? html`
|
|
83
|
+
<ox-resize-splitter
|
|
84
|
+
@splitter-dragstart=${(e: CustomEvent) => this.resizeStart(e)}
|
|
85
|
+
@splitter-drag=${(e: CustomEvent) => this.resizeDrag(e)}
|
|
86
|
+
vertical
|
|
87
|
+
></ox-resize-splitter>
|
|
88
|
+
`
|
|
89
|
+
: html``}
|
|
90
|
+
`
|
|
91
91
|
)}
|
|
92
92
|
`
|
|
93
93
|
}
|
|
@@ -99,7 +99,7 @@ class AsideBar extends connect(store)(LitElement) {
|
|
|
99
99
|
resizeDrag(e: CustomEvent) {
|
|
100
100
|
var delta = e.detail
|
|
101
101
|
|
|
102
|
-
var x = ((e.target as HTMLElement)?.previousElementSibling as HTMLElement)?.
|
|
102
|
+
var x = ((e.target as HTMLElement)?.previousElementSibling as HTMLElement)?.children
|
|
103
103
|
Array.from(x).forEach(ele => {
|
|
104
104
|
;(ele as HTMLElement).style.width = `${this._startWidth - delta.x}px`
|
|
105
105
|
})
|
|
@@ -60,35 +60,35 @@ class FooterBar extends connect(store)(LitElement) {
|
|
|
60
60
|
!footerbar.show
|
|
61
61
|
? html``
|
|
62
62
|
: footerbar.hovering
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
63
|
+
? html`
|
|
64
|
+
<ox-floating-overlay
|
|
65
|
+
.backdrop=${footerbar.backdrop}
|
|
66
|
+
direction="up"
|
|
67
|
+
.hovering=${footerbar.hovering}
|
|
68
|
+
.name=${footerbar.name}
|
|
69
|
+
.title=${footerbar.title || ''}
|
|
70
|
+
.help=${footerbar.help}
|
|
71
|
+
.size=${footerbar.size}
|
|
72
|
+
.closable=${footerbar.closable}
|
|
73
|
+
.templateProperties=${footerbar.templateProperties}
|
|
74
|
+
.historical=${true}
|
|
75
|
+
.search=${footerbar.search}
|
|
76
|
+
.filter=${footerbar.filter}
|
|
77
|
+
z-index=${ifDefined(footerbar.zIndex)}
|
|
78
|
+
>${footerbar.template}</ox-floating-overlay
|
|
79
|
+
>
|
|
80
|
+
`
|
|
81
|
+
: html`
|
|
82
|
+
<div footerbar>${footerbar.template}</div>
|
|
83
|
+
${footerbar.resizable
|
|
84
|
+
? html`
|
|
85
|
+
<ox-resize-splitter
|
|
86
|
+
@splitter-dragstart=${(e: CustomEvent) => this.resizeStart(e)}
|
|
87
|
+
@splitter-drag=${(e: CustomEvent) => this.resizeDrag(e)}
|
|
88
|
+
></ox-resize-splitter>
|
|
89
|
+
`
|
|
90
|
+
: html``}
|
|
91
|
+
`
|
|
92
92
|
)}
|
|
93
93
|
`
|
|
94
94
|
}
|
|
@@ -100,7 +100,7 @@ class FooterBar extends connect(store)(LitElement) {
|
|
|
100
100
|
resizeDrag(e: CustomEvent) {
|
|
101
101
|
var delta = e.detail
|
|
102
102
|
|
|
103
|
-
var x = ((e.target as HTMLElement)?.previousElementSibling as HTMLElement).
|
|
103
|
+
var x = ((e.target as HTMLElement)?.previousElementSibling as HTMLElement).children
|
|
104
104
|
Array.from(x).forEach(ele => {
|
|
105
105
|
;(ele as HTMLElement).style.height = `${this._startHeight - delta.y}px`
|
|
106
106
|
})
|
|
@@ -56,35 +56,35 @@ class HeaderBar extends connect(store)(LitElement) {
|
|
|
56
56
|
!headerbar.show
|
|
57
57
|
? html``
|
|
58
58
|
: headerbar.hovering
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
59
|
+
? html`
|
|
60
|
+
<ox-floating-overlay
|
|
61
|
+
.backdrop=${headerbar.backdrop}
|
|
62
|
+
direction="down"
|
|
63
|
+
.hovering=${headerbar.hovering}
|
|
64
|
+
.name=${headerbar.name}
|
|
65
|
+
.title=${headerbar.title}
|
|
66
|
+
.help=${headerbar.help}
|
|
67
|
+
.size=${headerbar.size}
|
|
68
|
+
.closable=${headerbar.closable}
|
|
69
|
+
.templateProperties=${headerbar.templateProperties}
|
|
70
|
+
.historical=${true}
|
|
71
|
+
.search=${headerbar.search}
|
|
72
|
+
.filter=${headerbar.filter}
|
|
73
|
+
z-index=${ifDefined(headerbar.zIndex)}
|
|
74
|
+
>${headerbar.template}</ox-floating-overlay
|
|
75
|
+
>
|
|
76
|
+
`
|
|
77
|
+
: html`
|
|
78
|
+
<div headerbar>${headerbar.template}</div>
|
|
79
|
+
${headerbar.resizable
|
|
80
|
+
? html`
|
|
81
|
+
<ox-resize-splitter
|
|
82
|
+
@splitter-dragstart=${(e: CustomEvent) => this.resizeStart(e)}
|
|
83
|
+
@splitter-drag=${(e: CustomEvent) => this.resizeDrag(e)}
|
|
84
|
+
></ox-resize-splitter>
|
|
85
|
+
`
|
|
86
|
+
: html``}
|
|
87
|
+
`
|
|
88
88
|
)}
|
|
89
89
|
`
|
|
90
90
|
}
|
|
@@ -96,7 +96,7 @@ class HeaderBar extends connect(store)(LitElement) {
|
|
|
96
96
|
resizeDrag(e: CustomEvent) {
|
|
97
97
|
var delta = e.detail
|
|
98
98
|
|
|
99
|
-
var x = ((e.target as HTMLElement)?.previousElementSibling as HTMLElement).
|
|
99
|
+
var x = ((e.target as HTMLElement)?.previousElementSibling as HTMLElement).children
|
|
100
100
|
Array.from(x).forEach(ele => {
|
|
101
101
|
;(ele as HTMLElement).style.height = `${this._startHeight + delta.y}px`
|
|
102
102
|
})
|
|
@@ -60,36 +60,36 @@ class NavBar extends connect(store)(LitElement) {
|
|
|
60
60
|
!navbar.show
|
|
61
61
|
? html``
|
|
62
62
|
: navbar.hovering
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
63
|
+
? html`
|
|
64
|
+
<ox-floating-overlay
|
|
65
|
+
.backdrop=${navbar.backdrop}
|
|
66
|
+
direction="right"
|
|
67
|
+
.hovering=${navbar.hovering}
|
|
68
|
+
.name=${navbar.name}
|
|
69
|
+
.title=${navbar.title}
|
|
70
|
+
.help=${navbar.help}
|
|
71
|
+
.size=${navbar.size}
|
|
72
|
+
.closable=${navbar.closable}
|
|
73
|
+
.templateProperties=${navbar.templateProperties}
|
|
74
|
+
.historical=${true}
|
|
75
|
+
.search=${navbar.search}
|
|
76
|
+
.filter=${navbar.filter}
|
|
77
|
+
z-index=${ifDefined(navbar.zIndex)}
|
|
78
|
+
>${navbar.template}</ox-floating-overlay
|
|
79
|
+
>
|
|
80
|
+
`
|
|
81
|
+
: html`
|
|
82
|
+
<div navbar>${navbar.template}</div>
|
|
83
|
+
${navbar.resizable
|
|
84
|
+
? html`
|
|
85
|
+
<ox-resize-splitter
|
|
86
|
+
@splitter-dragstart=${(e: CustomEvent) => this.resizeStart(e)}
|
|
87
|
+
@splitter-drag=${(e: CustomEvent) => this.resizeDrag(e)}
|
|
88
|
+
vertical
|
|
89
|
+
></ox-resize-splitter>
|
|
90
|
+
`
|
|
91
|
+
: html``}
|
|
92
|
+
`
|
|
93
93
|
)}
|
|
94
94
|
`
|
|
95
95
|
}
|
|
@@ -101,7 +101,7 @@ class NavBar extends connect(store)(LitElement) {
|
|
|
101
101
|
resizeDrag(e: CustomEvent) {
|
|
102
102
|
var delta = e.detail
|
|
103
103
|
|
|
104
|
-
var x = ((e.target as HTMLElement)?.previousElementSibling as HTMLElement).
|
|
104
|
+
var x = ((e.target as HTMLElement)?.previousElementSibling as HTMLElement).children
|
|
105
105
|
Array.from(x).forEach(ele => {
|
|
106
106
|
;(ele as HTMLElement).style.width = `${this._startWidth + delta.x}px`
|
|
107
107
|
})
|
|
@@ -60,35 +60,35 @@ class PageFooterBar extends connect(store)(LitElement) {
|
|
|
60
60
|
!footerbar.show
|
|
61
61
|
? html``
|
|
62
62
|
: footerbar.hovering
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
63
|
+
? html`
|
|
64
|
+
<ox-floating-overlay
|
|
65
|
+
.backdrop=${footerbar.backdrop}
|
|
66
|
+
direction="up"
|
|
67
|
+
.hovering=${footerbar.hovering}
|
|
68
|
+
.name=${footerbar.name}
|
|
69
|
+
.title=${footerbar.title || ''}
|
|
70
|
+
.help=${footerbar.help}
|
|
71
|
+
.size=${footerbar.size}
|
|
72
|
+
.closable=${footerbar.closable}
|
|
73
|
+
.templateProperties=${footerbar.templateProperties}
|
|
74
|
+
.historical=${true}
|
|
75
|
+
.search=${footerbar.search}
|
|
76
|
+
.filter=${footerbar.filter}
|
|
77
|
+
z-index=${ifDefined(footerbar.zIndex)}
|
|
78
|
+
>${footerbar.template}</ox-floating-overlay
|
|
79
|
+
>
|
|
80
|
+
`
|
|
81
|
+
: html`
|
|
82
|
+
<div footerbar>${footerbar.template}</div>
|
|
83
|
+
${footerbar.resizable
|
|
84
|
+
? html`
|
|
85
|
+
<ox-resize-splitter
|
|
86
|
+
@splitter-dragstart=${(e: CustomEvent) => this.resizeStart(e)}
|
|
87
|
+
@splitter-drag=${(e: CustomEvent) => this.resizeDrag(e)}
|
|
88
|
+
></ox-resize-splitter>
|
|
89
|
+
`
|
|
90
|
+
: html``}
|
|
91
|
+
`
|
|
92
92
|
)}
|
|
93
93
|
`
|
|
94
94
|
}
|
|
@@ -100,7 +100,7 @@ class PageFooterBar extends connect(store)(LitElement) {
|
|
|
100
100
|
resizeDrag(e: CustomEvent) {
|
|
101
101
|
var delta = e.detail
|
|
102
102
|
|
|
103
|
-
var x = ((e.target as HTMLElement)?.previousElementSibling as HTMLElement).
|
|
103
|
+
var x = ((e.target as HTMLElement)?.previousElementSibling as HTMLElement).children
|
|
104
104
|
Array.from(x).forEach(ele => {
|
|
105
105
|
;(ele as HTMLElement).style.height = `${this._startHeight - delta.y}px`
|
|
106
106
|
})
|
|
@@ -56,35 +56,35 @@ class PageHeaderBar extends connect(store)(LitElement) {
|
|
|
56
56
|
!headerbar.show
|
|
57
57
|
? html``
|
|
58
58
|
: headerbar.hovering
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
59
|
+
? html`
|
|
60
|
+
<ox-floating-overlay
|
|
61
|
+
.backdrop=${headerbar.backdrop}
|
|
62
|
+
direction="down"
|
|
63
|
+
.hovering=${headerbar.hovering}
|
|
64
|
+
.name=${headerbar.name}
|
|
65
|
+
.title=${headerbar.title || ''}
|
|
66
|
+
.help=${headerbar.help}
|
|
67
|
+
.size=${headerbar.size}
|
|
68
|
+
.closable=${headerbar.closable}
|
|
69
|
+
.templateProperties=${headerbar.templateProperties}
|
|
70
|
+
.historical=${true}
|
|
71
|
+
.search=${headerbar.search}
|
|
72
|
+
.filter=${headerbar.filter}
|
|
73
|
+
z-index=${ifDefined(headerbar.zIndex)}
|
|
74
|
+
>${headerbar.template}</ox-floating-overlay
|
|
75
|
+
>
|
|
76
|
+
`
|
|
77
|
+
: html`
|
|
78
|
+
<div headerbar>${headerbar.template}</div>
|
|
79
|
+
${headerbar.resizable
|
|
80
|
+
? html`
|
|
81
|
+
<ox-resize-splitter
|
|
82
|
+
@splitter-dragstart=${(e: CustomEvent) => this.resizeStart(e)}
|
|
83
|
+
@splitter-drag=${(e: CustomEvent) => this.resizeDrag(e)}
|
|
84
|
+
></ox-resize-splitter>
|
|
85
|
+
`
|
|
86
|
+
: html``}
|
|
87
|
+
`
|
|
88
88
|
)}
|
|
89
89
|
`
|
|
90
90
|
}
|
|
@@ -96,7 +96,7 @@ class PageHeaderBar extends connect(store)(LitElement) {
|
|
|
96
96
|
resizeDrag(e: CustomEvent) {
|
|
97
97
|
var delta = e.detail
|
|
98
98
|
|
|
99
|
-
var x = ((e.target as HTMLElement)?.previousElementSibling as HTMLElement).
|
|
99
|
+
var x = ((e.target as HTMLElement)?.previousElementSibling as HTMLElement).children
|
|
100
100
|
Array.from(x).forEach(ele => {
|
|
101
101
|
;(ele as HTMLElement).style.height = `${this._startHeight + delta.y}px`
|
|
102
102
|
})
|