@operato/layout 2.0.0-alpha.129 → 2.0.0-alpha.138
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 +17 -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/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 +5 -5
- package/src/components/ox-resize-splitter.ts +13 -0
- 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/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,23 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [2.0.0-alpha.138](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.137...v2.0.0-alpha.138) (2024-05-15)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### :bug: Bug Fix
|
|
10
|
+
|
|
11
|
+
* ox-resize-splitter 를 더 부드럽게 동작하도록 개선함 ([3487481](https://github.com/hatiolab/operato/commit/34874813f4c78df8fafbe202bce46e98df09f667))
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
## [2.0.0-alpha.134](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.133...v2.0.0-alpha.134) (2024-05-13)
|
|
16
|
+
|
|
17
|
+
**Note:** Version bump only for package @operato/layout
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
|
|
6
23
|
## [2.0.0-alpha.129](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.128...v2.0.0-alpha.129) (2024-05-08)
|
|
7
24
|
|
|
8
25
|
**Note:** Version bump only for package @operato/layout
|
|
@@ -52,6 +52,7 @@ let ResizeSplitter = class ResizeSplitter extends LitElement {
|
|
|
52
52
|
if (!this.dragstart) {
|
|
53
53
|
return;
|
|
54
54
|
}
|
|
55
|
+
e.preventDefault();
|
|
55
56
|
this.dispatchEvent(new CustomEvent('splitter-drag', {
|
|
56
57
|
bubbles: true,
|
|
57
58
|
composed: true,
|
|
@@ -63,6 +64,13 @@ let ResizeSplitter = class ResizeSplitter extends LitElement {
|
|
|
63
64
|
requestAnimationFrame(() => {
|
|
64
65
|
dispatchEvent(new Event('resize'));
|
|
65
66
|
});
|
|
67
|
+
if (this.hasAttribute('vertical')) {
|
|
68
|
+
document.body.style.cursor = 'col-resize';
|
|
69
|
+
}
|
|
70
|
+
else {
|
|
71
|
+
document.body.style.cursor = 'row-resize';
|
|
72
|
+
}
|
|
73
|
+
document.body.style.userSelect = 'none';
|
|
66
74
|
e.stopPropagation();
|
|
67
75
|
}
|
|
68
76
|
onMouseUp(e) {
|
|
@@ -80,6 +88,8 @@ let ResizeSplitter = class ResizeSplitter extends LitElement {
|
|
|
80
88
|
dispatchEvent(new Event('resize'));
|
|
81
89
|
delete this.dragstart;
|
|
82
90
|
});
|
|
91
|
+
document.body.style.cursor = '';
|
|
92
|
+
document.body.style.userSelect = '';
|
|
83
93
|
e.stopPropagation();
|
|
84
94
|
}
|
|
85
95
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ox-resize-splitter.js","sourceRoot":"","sources":["../../../src/components/ox-resize-splitter.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAE3C,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAA;AAG1C,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,UAAU;IAAvC;;QAuEL,uBAAkB,GAAG,IAAI,CAAC,UAAU,CAAC,GAAG,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA,CAAC,8BAA8B;QACrG,qBAAgB,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;
|
|
1
|
+
{"version":3,"file":"ox-resize-splitter.js","sourceRoot":"","sources":["../../../src/components/ox-resize-splitter.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, css, html } from 'lit'\n\nimport { customElement } from 'lit/decorators.js'\n\n@customElement('ox-resize-splitter')\nexport class ResizeSplitter extends LitElement {\n static styles = css`\n :host {\n position: relative;\n opacity: 0.7;\n background-color: var(--splitter-background-color);\n }\n\n :host(:hover) {\n background-color: var(--splitter-hover-background-color);\n }\n\n div {\n position: absolute;\n width: 100%;\n height: 100%;\n }\n `\n\n private dragstart?: { x: number; y: number }\n\n connectedCallback() {\n super.connectedCallback()\n\n if (this.hasAttribute('vertical')) {\n this.style.width = '3px'\n this.style.height = '100%'\n this.style.cursor = 'col-resize'\n } else {\n this.style.width = '100%'\n this.style.height = '3px'\n this.style.cursor = 'row-resize'\n }\n }\n\n render() {\n return html` <div @mousedown=${(e: MouseEvent) => this.onMouseDown(e)}></div> `\n }\n\n // TODO onDrag 이벤트가 계속 발생하므로 처리하는 성능 저하됨. 그래서 throttling 하도록 함\n _throttled(delay: number, fn: (...args: any) => void) {\n let lastCall = 0\n return function (...args: any) {\n const now = new Date().getTime()\n if (now - lastCall < delay) {\n return\n }\n lastCall = now\n return fn(...args)\n }\n }\n\n private onMouseDown(e: MouseEvent) {\n this.dragstart = {\n x: e.clientX,\n y: e.clientY\n }\n\n this.dispatchEvent(\n new CustomEvent('splitter-dragstart', {\n bubbles: true,\n composed: true\n })\n )\n\n window.addEventListener('mousemove', this.onMouseMoveHandler)\n window.addEventListener('mouseup', this.onMouseUpHandler)\n\n e.stopPropagation()\n }\n\n onMouseMoveHandler = this._throttled(100, this.onMouseMove.bind(this)) // this.onMouseMove.bind(this)\n onMouseUpHandler = this.onMouseUp.bind(this)\n\n private onMouseMove(e: MouseEvent) {\n if (!this.dragstart) {\n return\n }\n\n e.preventDefault()\n\n this.dispatchEvent(\n new CustomEvent('splitter-drag', {\n bubbles: true,\n composed: true,\n detail: {\n x: e.clientX - this.dragstart!.x,\n y: e.clientY - this.dragstart!.y\n }\n })\n )\n requestAnimationFrame(() => {\n dispatchEvent(new Event('resize'))\n })\n\n if (this.hasAttribute('vertical')) {\n document.body.style.cursor = 'col-resize'\n } else {\n document.body.style.cursor = 'row-resize'\n }\n\n document.body.style.userSelect = 'none'\n\n e.stopPropagation()\n }\n\n private onMouseUp(e: MouseEvent) {\n window.removeEventListener('mousemove', this.onMouseMoveHandler)\n window.removeEventListener('mouseup', this.onMouseUpHandler)\n\n this.dispatchEvent(\n new CustomEvent('splitter-dragend', {\n bubbles: true,\n composed: true,\n detail: {\n x: e.clientX - this.dragstart!.x,\n y: e.clientY - this.dragstart!.y\n }\n })\n )\n\n requestAnimationFrame(() => {\n dispatchEvent(new Event('resize'))\n delete this.dragstart\n })\n\n document.body.style.cursor = ''\n document.body.style.userSelect = ''\n\n e.stopPropagation()\n }\n}\n"]}
|
|
@@ -34,35 +34,35 @@ let AsideBar = class AsideBar extends connect(store)(LitElement) {
|
|
|
34
34
|
? html ``
|
|
35
35
|
: asidebar.hovering
|
|
36
36
|
? html `
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
37
|
+
<ox-floating-overlay
|
|
38
|
+
.backdrop=${asidebar.backdrop}
|
|
39
|
+
direction="left"
|
|
40
|
+
.hovering=${asidebar.hovering}
|
|
41
|
+
.name=${asidebar.name}
|
|
42
|
+
.size=${asidebar.size}
|
|
43
|
+
.title=${asidebar.title}
|
|
44
|
+
.help=${asidebar.help}
|
|
45
|
+
.closable=${asidebar.closable}
|
|
46
|
+
.templateProperties=${asidebar.templateProperties}
|
|
47
|
+
.historical=${true}
|
|
48
|
+
.search=${asidebar.search}
|
|
49
|
+
.filter=${asidebar.filter}
|
|
50
|
+
z-index=${ifDefined(asidebar.zIndex)}
|
|
51
|
+
>${asidebar.template}</ox-floating-overlay
|
|
52
|
+
>
|
|
53
|
+
`
|
|
54
54
|
: html `
|
|
55
|
-
|
|
56
|
-
|
|
55
|
+
<div asidebar>${asidebar.template}</div>
|
|
56
|
+
${asidebar.resizable
|
|
57
57
|
? html `
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
58
|
+
<ox-resize-splitter
|
|
59
|
+
@splitter-dragstart=${(e) => this.resizeStart(e)}
|
|
60
|
+
@splitter-drag=${(e) => this.resizeDrag(e)}
|
|
61
|
+
vertical
|
|
62
|
+
></ox-resize-splitter>
|
|
63
|
+
`
|
|
64
64
|
: html ``}
|
|
65
|
-
|
|
65
|
+
`)}
|
|
66
66
|
`;
|
|
67
67
|
}
|
|
68
68
|
resizeStart(e) {
|
|
@@ -72,7 +72,7 @@ let AsideBar = class AsideBar extends connect(store)(LitElement) {
|
|
|
72
72
|
resizeDrag(e) {
|
|
73
73
|
var _a, _b;
|
|
74
74
|
var delta = e.detail;
|
|
75
|
-
var x = (_b = (_a = e.target) === null || _a === void 0 ? void 0 : _a.previousElementSibling) === null || _b === void 0 ? void 0 : _b.
|
|
75
|
+
var x = (_b = (_a = e.target) === null || _a === void 0 ? void 0 : _a.previousElementSibling) === null || _b === void 0 ? void 0 : _b.children;
|
|
76
76
|
Array.from(x).forEach(ele => {
|
|
77
77
|
;
|
|
78
78
|
ele.style.width = `${this._startWidth - delta.x}px`;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ox-aside-bar.js","sourceRoot":"","sources":["../../../src/layouts/ox-aside-bar.ts"],"names":[],"mappings":";AAAA,OAAO,uCAAuC,CAAA;AAC9C,OAAO,qCAAqC,CAAA;AAE5C,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAA;AACxD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAClE,OAAO,EAAE,OAAO,EAAE,MAAM,8BAA8B,CAAA;AAEtD,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAEjD,OAAO,EAAY,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAC/D,OAAO,KAAK,MAAM,mBAAmB,CAAA;AAGrC,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,OAAO,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC;IAAjD;;QAmBuD,cAAS,GAAY,KAAK,CAAA;QAEtE,cAAS,GAAiC,EAAE,CAAA;QAE7C,gBAAW,GAAW,CAAC,CAAA;IAyEjC,CAAC;IAvEC,MAAM;QACJ,IAAI,SAAS,GAAG,IAAI,CAAC,SAAS,CAAA;QAC9B,IAAI,SAAS,GAAG,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC;aACnC,GAAG,CAAC,IAAI,CAAC,EAAE;YACV,OAAO;gBACL,IAAI;gBACJ,GAAG,SAAS,CAAC,IAAI,CAAC;aACnB,CAAA;QACH,CAAC,CAAC;aACD,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,QAAQ,IAAI,UAAU,IAAI,CAAC,CAAC,IAAI,CAAC,SAAS,IAAI,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAA;QAEhG,SAAS,GAAG;YACV,GAAG,SAAS,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,KAAK,IAAI,cAAc,CAAC,OAAO,CAAC;YACzE,GAAG,SAAS,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,KAAK,KAAK,cAAc,CAAC,OAAO,CAAC;SAC3E,CAAA;QAED,OAAO,IAAI,CAAA;QACP,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CACzB,CAAC,QAAQ,CAAC,IAAI;YACZ,CAAC,CAAC,IAAI,CAAA,EAAE;YACR,CAAC,CAAC,QAAQ,CAAC,QAAQ;
|
|
1
|
+
{"version":3,"file":"ox-aside-bar.js","sourceRoot":"","sources":["../../../src/layouts/ox-aside-bar.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/popup/ox-floating-overlay.js'\nimport '../components/ox-resize-splitter.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { ifDefined } from 'lit/directives/if-defined.js'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { connect } from 'pwa-helpers/connect-mixin.js'\n\nimport { ScrollbarStyles } from '@operato/styles'\n\nimport { Viewpart, VIEWPART_LEVEL } from '../actions/layout.js'\nimport store from '../initializer.js'\n\n@customElement('ox-aside-bar')\nclass AsideBar extends connect(store)(LitElement) {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-flow: row-reverse nowrap;\n align-items: stretch;\n\n position: relative;\n }\n\n *[asidebar] {\n display: block;\n overflow-y: auto;\n }\n `\n ]\n\n @property({ type: Boolean, attribute: 'fullbleed' }) fullbleed: boolean = false\n\n @state() viewparts: { [name: string]: Viewpart } = {}\n\n private _startWidth: number = 0\n\n render() {\n var viewparts = this.viewparts\n var asidebars = Object.keys(viewparts)\n .map(name => {\n return {\n name,\n ...viewparts[name]\n }\n })\n .filter(viewpart => viewpart.position == 'asidebar' && (!this.fullbleed || viewpart.hovering))\n\n asidebars = [\n ...asidebars.filter(viewpart => viewpart.level == VIEWPART_LEVEL.TOPMOST),\n ...asidebars.filter(viewpart => viewpart.level !== VIEWPART_LEVEL.TOPMOST)\n ]\n\n return html`\n ${asidebars.map(asidebar =>\n !asidebar.show\n ? html``\n : asidebar.hovering\n ? html`\n <ox-floating-overlay\n .backdrop=${asidebar.backdrop}\n direction=\"left\"\n .hovering=${asidebar.hovering}\n .name=${asidebar.name}\n .size=${asidebar.size}\n .title=${asidebar.title}\n .help=${asidebar.help}\n .closable=${asidebar.closable}\n .templateProperties=${asidebar.templateProperties}\n .historical=${true}\n .search=${asidebar.search}\n .filter=${asidebar.filter}\n z-index=${ifDefined(asidebar.zIndex)}\n >${asidebar.template}</ox-floating-overlay\n >\n `\n : html`\n <div asidebar>${asidebar.template}</div>\n ${asidebar.resizable\n ? html`\n <ox-resize-splitter\n @splitter-dragstart=${(e: CustomEvent) => this.resizeStart(e)}\n @splitter-drag=${(e: CustomEvent) => this.resizeDrag(e)}\n vertical\n ></ox-resize-splitter>\n `\n : html``}\n `\n )}\n `\n }\n\n resizeStart(e: CustomEvent) {\n this._startWidth = ((e.target as HTMLElement)?.previousElementSibling as HTMLElement)?.offsetWidth\n }\n\n resizeDrag(e: CustomEvent) {\n var delta = e.detail\n\n var x = ((e.target as HTMLElement)?.previousElementSibling as HTMLElement)?.children\n Array.from(x).forEach(ele => {\n ;(ele as HTMLElement).style.width = `${this._startWidth - delta.x}px`\n })\n }\n\n stateChanged(state: any) {\n this.viewparts = state.layout.viewparts || {}\n }\n}\n"]}
|
|
@@ -33,34 +33,34 @@ let FooterBar = class FooterBar extends connect(store)(LitElement) {
|
|
|
33
33
|
? html ``
|
|
34
34
|
: footerbar.hovering
|
|
35
35
|
? html `
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
36
|
+
<ox-floating-overlay
|
|
37
|
+
.backdrop=${footerbar.backdrop}
|
|
38
|
+
direction="up"
|
|
39
|
+
.hovering=${footerbar.hovering}
|
|
40
|
+
.name=${footerbar.name}
|
|
41
|
+
.title=${footerbar.title || ''}
|
|
42
|
+
.help=${footerbar.help}
|
|
43
|
+
.size=${footerbar.size}
|
|
44
|
+
.closable=${footerbar.closable}
|
|
45
|
+
.templateProperties=${footerbar.templateProperties}
|
|
46
|
+
.historical=${true}
|
|
47
|
+
.search=${footerbar.search}
|
|
48
|
+
.filter=${footerbar.filter}
|
|
49
|
+
z-index=${ifDefined(footerbar.zIndex)}
|
|
50
|
+
>${footerbar.template}</ox-floating-overlay
|
|
51
|
+
>
|
|
52
|
+
`
|
|
53
53
|
: html `
|
|
54
|
-
|
|
55
|
-
|
|
54
|
+
<div footerbar>${footerbar.template}</div>
|
|
55
|
+
${footerbar.resizable
|
|
56
56
|
? html `
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
57
|
+
<ox-resize-splitter
|
|
58
|
+
@splitter-dragstart=${(e) => this.resizeStart(e)}
|
|
59
|
+
@splitter-drag=${(e) => this.resizeDrag(e)}
|
|
60
|
+
></ox-resize-splitter>
|
|
61
|
+
`
|
|
62
62
|
: html ``}
|
|
63
|
-
|
|
63
|
+
`)}
|
|
64
64
|
`;
|
|
65
65
|
}
|
|
66
66
|
resizeStart(e) {
|
|
@@ -70,7 +70,7 @@ let FooterBar = class FooterBar extends connect(store)(LitElement) {
|
|
|
70
70
|
resizeDrag(e) {
|
|
71
71
|
var _a;
|
|
72
72
|
var delta = e.detail;
|
|
73
|
-
var x = ((_a = e.target) === null || _a === void 0 ? void 0 : _a.previousElementSibling).
|
|
73
|
+
var x = ((_a = e.target) === null || _a === void 0 ? void 0 : _a.previousElementSibling).children;
|
|
74
74
|
Array.from(x).forEach(ele => {
|
|
75
75
|
;
|
|
76
76
|
ele.style.height = `${this._startHeight - delta.y}px`;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ox-footer-bar.js","sourceRoot":"","sources":["../../../src/layouts/ox-footer-bar.ts"],"names":[],"mappings":";AAAA,OAAO,uCAAuC,CAAA;AAC9C,OAAO,qCAAqC,CAAA;AAE5C,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAA;AACxD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAClE,OAAO,EAAE,OAAO,EAAE,MAAM,8BAA8B,CAAA;AAEtD,OAAO,EAAY,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAC/D,OAAO,KAAK,MAAM,mBAAmB,CAAA;AAGrC,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,OAAO,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC;IAAlD;;QAuBuD,cAAS,GAAY,KAAK,CAAA;QAEtE,cAAS,GAAiC,EAAE,CAAA;QAE7C,iBAAY,GAAW,CAAC,CAAA;IAwElC,CAAC;IAtEC,MAAM;QACJ,IAAI,SAAS,GAAG,IAAI,CAAC,SAAS,CAAA;QAC9B,IAAI,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC;aACpC,GAAG,CAAC,IAAI,CAAC,EAAE;YACV,OAAO;gBACL,IAAI;gBACJ,GAAG,SAAS,CAAC,IAAI,CAAC;aACnB,CAAA;QACH,CAAC,CAAC;aACD,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,QAAQ,IAAI,WAAW,IAAI,CAAC,CAAC,IAAI,CAAC,SAAS,IAAI,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAA;QAEjG,UAAU,GAAG;YACX,GAAG,UAAU,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,KAAK,IAAI,cAAc,CAAC,OAAO,CAAC;YAC1E,GAAG,UAAU,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,KAAK,KAAK,cAAc,CAAC,OAAO,CAAC;SAC5E,CAAA;QAED,OAAO,IAAI,CAAA;QACP,UAAU,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE,CAC3B,CAAC,SAAS,CAAC,IAAI;YACb,CAAC,CAAC,IAAI,CAAA,EAAE;YACR,CAAC,CAAC,SAAS,CAAC,QAAQ;
|
|
1
|
+
{"version":3,"file":"ox-footer-bar.js","sourceRoot":"","sources":["../../../src/layouts/ox-footer-bar.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/popup/ox-floating-overlay.js'\nimport '../components/ox-resize-splitter.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { ifDefined } from 'lit/directives/if-defined.js'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { connect } from 'pwa-helpers/connect-mixin.js'\n\nimport { Viewpart, VIEWPART_LEVEL } from '../actions/layout.js'\nimport store from '../initializer.js'\n\n@customElement('ox-footer-bar')\nclass FooterBar extends connect(store)(LitElement) {\n static styles = [\n css`\n :host {\n display: flex;\n flex-flow: column-reverse nowrap;\n align-items: stretch;\n position: relative;\n }\n\n *[footerbar] {\n display: block;\n max-width: 100vw;\n }\n\n @media screen and (max-width: 460px) {\n :host {\n padding-bottom: 0;\n }\n }\n `\n ]\n\n @property({ type: Boolean, attribute: 'fullbleed' }) fullbleed: boolean = false\n\n @state() viewparts: { [name: string]: Viewpart } = {}\n\n private _startHeight: number = 0\n\n render() {\n var viewparts = this.viewparts\n var footerbars = Object.keys(viewparts)\n .map(name => {\n return {\n name,\n ...viewparts[name]\n }\n })\n .filter(viewpart => viewpart.position == 'footerbar' && (!this.fullbleed || viewpart.hovering))\n\n footerbars = [\n ...footerbars.filter(viewpart => viewpart.level == VIEWPART_LEVEL.TOPMOST),\n ...footerbars.filter(viewpart => viewpart.level !== VIEWPART_LEVEL.TOPMOST)\n ]\n\n return html`\n ${footerbars.map(footerbar =>\n !footerbar.show\n ? html``\n : footerbar.hovering\n ? html`\n <ox-floating-overlay\n .backdrop=${footerbar.backdrop}\n direction=\"up\"\n .hovering=${footerbar.hovering}\n .name=${footerbar.name}\n .title=${footerbar.title || ''}\n .help=${footerbar.help}\n .size=${footerbar.size}\n .closable=${footerbar.closable}\n .templateProperties=${footerbar.templateProperties}\n .historical=${true}\n .search=${footerbar.search}\n .filter=${footerbar.filter}\n z-index=${ifDefined(footerbar.zIndex)}\n >${footerbar.template}</ox-floating-overlay\n >\n `\n : html`\n <div footerbar>${footerbar.template}</div>\n ${footerbar.resizable\n ? html`\n <ox-resize-splitter\n @splitter-dragstart=${(e: CustomEvent) => this.resizeStart(e)}\n @splitter-drag=${(e: CustomEvent) => this.resizeDrag(e)}\n ></ox-resize-splitter>\n `\n : html``}\n `\n )}\n `\n }\n\n resizeStart(e: CustomEvent) {\n this._startHeight = ((e.target as HTMLElement)?.previousElementSibling as HTMLElement).offsetHeight\n }\n\n resizeDrag(e: CustomEvent) {\n var delta = e.detail\n\n var x = ((e.target as HTMLElement)?.previousElementSibling as HTMLElement).children\n Array.from(x).forEach(ele => {\n ;(ele as HTMLElement).style.height = `${this._startHeight - delta.y}px`\n })\n }\n\n stateChanged(state: any) {\n this.viewparts = state.layout.viewparts || {}\n }\n}\n"]}
|
|
@@ -33,34 +33,34 @@ let HeaderBar = class HeaderBar extends connect(store)(LitElement) {
|
|
|
33
33
|
? html ``
|
|
34
34
|
: headerbar.hovering
|
|
35
35
|
? html `
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
36
|
+
<ox-floating-overlay
|
|
37
|
+
.backdrop=${headerbar.backdrop}
|
|
38
|
+
direction="down"
|
|
39
|
+
.hovering=${headerbar.hovering}
|
|
40
|
+
.name=${headerbar.name}
|
|
41
|
+
.title=${headerbar.title}
|
|
42
|
+
.help=${headerbar.help}
|
|
43
|
+
.size=${headerbar.size}
|
|
44
|
+
.closable=${headerbar.closable}
|
|
45
|
+
.templateProperties=${headerbar.templateProperties}
|
|
46
|
+
.historical=${true}
|
|
47
|
+
.search=${headerbar.search}
|
|
48
|
+
.filter=${headerbar.filter}
|
|
49
|
+
z-index=${ifDefined(headerbar.zIndex)}
|
|
50
|
+
>${headerbar.template}</ox-floating-overlay
|
|
51
|
+
>
|
|
52
|
+
`
|
|
53
53
|
: html `
|
|
54
|
-
|
|
55
|
-
|
|
54
|
+
<div headerbar>${headerbar.template}</div>
|
|
55
|
+
${headerbar.resizable
|
|
56
56
|
? html `
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
57
|
+
<ox-resize-splitter
|
|
58
|
+
@splitter-dragstart=${(e) => this.resizeStart(e)}
|
|
59
|
+
@splitter-drag=${(e) => this.resizeDrag(e)}
|
|
60
|
+
></ox-resize-splitter>
|
|
61
|
+
`
|
|
62
62
|
: html ``}
|
|
63
|
-
|
|
63
|
+
`)}
|
|
64
64
|
`;
|
|
65
65
|
}
|
|
66
66
|
resizeStart(e) {
|
|
@@ -70,7 +70,7 @@ let HeaderBar = class HeaderBar extends connect(store)(LitElement) {
|
|
|
70
70
|
resizeDrag(e) {
|
|
71
71
|
var _a;
|
|
72
72
|
var delta = e.detail;
|
|
73
|
-
var x = ((_a = e.target) === null || _a === void 0 ? void 0 : _a.previousElementSibling).
|
|
73
|
+
var x = ((_a = e.target) === null || _a === void 0 ? void 0 : _a.previousElementSibling).children;
|
|
74
74
|
Array.from(x).forEach(ele => {
|
|
75
75
|
;
|
|
76
76
|
ele.style.height = `${this._startHeight + delta.y}px`;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ox-header-bar.js","sourceRoot":"","sources":["../../../src/layouts/ox-header-bar.ts"],"names":[],"mappings":";AAAA,OAAO,uCAAuC,CAAA;AAC9C,OAAO,qCAAqC,CAAA;AAE5C,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAA;AACxD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAClE,OAAO,EAAE,OAAO,EAAE,MAAM,8BAA8B,CAAA;AAEtD,OAAO,EAAY,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAC/D,OAAO,KAAK,MAAM,mBAAmB,CAAA;AAGrC,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,OAAO,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC;IAAlD;;QAmBuD,cAAS,GAAY,KAAK,CAAA;QAEtE,cAAS,GAAiC,EAAE,CAAA;QAE7C,iBAAY,GAAW,CAAC,CAAA;IAwElC,CAAC;IAtEC,MAAM;QACJ,IAAI,SAAS,GAAG,IAAI,CAAC,SAAS,CAAA;QAC9B,IAAI,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC;aACpC,GAAG,CAAC,IAAI,CAAC,EAAE;YACV,OAAO;gBACL,IAAI;gBACJ,GAAG,SAAS,CAAC,IAAI,CAAC;aACnB,CAAA;QACH,CAAC,CAAC;aACD,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,QAAQ,IAAI,WAAW,IAAI,CAAC,CAAC,IAAI,CAAC,SAAS,IAAI,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAA;QAEjG,UAAU,GAAG;YACX,GAAG,UAAU,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,KAAK,IAAI,cAAc,CAAC,OAAO,CAAC;YAC1E,GAAG,UAAU,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,KAAK,KAAK,cAAc,CAAC,OAAO,CAAC;SAC5E,CAAA;QAED,OAAO,IAAI,CAAA;QACP,UAAU,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE,CAC3B,CAAC,SAAS,CAAC,IAAI;YACb,CAAC,CAAC,IAAI,CAAA,EAAE;YACR,CAAC,CAAC,SAAS,CAAC,QAAQ;
|
|
1
|
+
{"version":3,"file":"ox-header-bar.js","sourceRoot":"","sources":["../../../src/layouts/ox-header-bar.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/popup/ox-floating-overlay.js'\nimport '../components/ox-resize-splitter.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { ifDefined } from 'lit/directives/if-defined.js'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { connect } from 'pwa-helpers/connect-mixin.js'\n\nimport { Viewpart, VIEWPART_LEVEL } from '../actions/layout.js'\nimport store from '../initializer.js'\n\n@customElement('ox-header-bar')\nclass HeaderBar extends connect(store)(LitElement) {\n static styles = [\n css`\n :host {\n display: flex;\n flex-flow: column nowrap;\n align-items: stretch;\n\n position: relative;\n\n background-color: var(--header-bar-background-color);\n }\n\n *[headerbar] {\n display: block;\n }\n `\n ]\n\n @property({ type: Boolean, attribute: 'fullbleed' }) fullbleed: boolean = false\n\n @state() viewparts: { [name: string]: Viewpart } = {}\n\n private _startHeight: number = 0\n\n render() {\n var viewparts = this.viewparts\n var headerbars = Object.keys(viewparts)\n .map(name => {\n return {\n name,\n ...viewparts[name]\n }\n })\n .filter(viewpart => viewpart.position == 'headerbar' && (!this.fullbleed || viewpart.hovering))\n\n headerbars = [\n ...headerbars.filter(viewpart => viewpart.level == VIEWPART_LEVEL.TOPMOST),\n ...headerbars.filter(viewpart => viewpart.level !== VIEWPART_LEVEL.TOPMOST)\n ]\n\n return html`\n ${headerbars.map(headerbar =>\n !headerbar.show\n ? html``\n : headerbar.hovering\n ? html`\n <ox-floating-overlay\n .backdrop=${headerbar.backdrop}\n direction=\"down\"\n .hovering=${headerbar.hovering}\n .name=${headerbar.name}\n .title=${headerbar.title}\n .help=${headerbar.help}\n .size=${headerbar.size}\n .closable=${headerbar.closable}\n .templateProperties=${headerbar.templateProperties}\n .historical=${true}\n .search=${headerbar.search}\n .filter=${headerbar.filter}\n z-index=${ifDefined(headerbar.zIndex)}\n >${headerbar.template}</ox-floating-overlay\n >\n `\n : html`\n <div headerbar>${headerbar.template}</div>\n ${headerbar.resizable\n ? html`\n <ox-resize-splitter\n @splitter-dragstart=${(e: CustomEvent) => this.resizeStart(e)}\n @splitter-drag=${(e: CustomEvent) => this.resizeDrag(e)}\n ></ox-resize-splitter>\n `\n : html``}\n `\n )}\n `\n }\n\n resizeStart(e: CustomEvent) {\n this._startHeight = ((e.target as HTMLElement)?.previousElementSibling as HTMLElement).offsetHeight\n }\n\n resizeDrag(e: CustomEvent) {\n var delta = e.detail\n\n var x = ((e.target as HTMLElement)?.previousElementSibling as HTMLElement).children\n Array.from(x).forEach(ele => {\n ;(ele as HTMLElement).style.height = `${this._startHeight + delta.y}px`\n })\n }\n\n stateChanged(state: any) {\n this.viewparts = state.layout.viewparts || {}\n }\n}\n"]}
|
|
@@ -34,35 +34,35 @@ let NavBar = class NavBar extends connect(store)(LitElement) {
|
|
|
34
34
|
? html ``
|
|
35
35
|
: navbar.hovering
|
|
36
36
|
? html `
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
37
|
+
<ox-floating-overlay
|
|
38
|
+
.backdrop=${navbar.backdrop}
|
|
39
|
+
direction="right"
|
|
40
|
+
.hovering=${navbar.hovering}
|
|
41
|
+
.name=${navbar.name}
|
|
42
|
+
.title=${navbar.title}
|
|
43
|
+
.help=${navbar.help}
|
|
44
|
+
.size=${navbar.size}
|
|
45
|
+
.closable=${navbar.closable}
|
|
46
|
+
.templateProperties=${navbar.templateProperties}
|
|
47
|
+
.historical=${true}
|
|
48
|
+
.search=${navbar.search}
|
|
49
|
+
.filter=${navbar.filter}
|
|
50
|
+
z-index=${ifDefined(navbar.zIndex)}
|
|
51
|
+
>${navbar.template}</ox-floating-overlay
|
|
52
|
+
>
|
|
53
|
+
`
|
|
54
54
|
: html `
|
|
55
|
-
|
|
56
|
-
|
|
55
|
+
<div navbar>${navbar.template}</div>
|
|
56
|
+
${navbar.resizable
|
|
57
57
|
? html `
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
58
|
+
<ox-resize-splitter
|
|
59
|
+
@splitter-dragstart=${(e) => this.resizeStart(e)}
|
|
60
|
+
@splitter-drag=${(e) => this.resizeDrag(e)}
|
|
61
|
+
vertical
|
|
62
|
+
></ox-resize-splitter>
|
|
63
|
+
`
|
|
64
64
|
: html ``}
|
|
65
|
-
|
|
65
|
+
`)}
|
|
66
66
|
`;
|
|
67
67
|
}
|
|
68
68
|
resizeStart(e) {
|
|
@@ -72,7 +72,7 @@ let NavBar = class NavBar extends connect(store)(LitElement) {
|
|
|
72
72
|
resizeDrag(e) {
|
|
73
73
|
var _a;
|
|
74
74
|
var delta = e.detail;
|
|
75
|
-
var x = ((_a = e.target) === null || _a === void 0 ? void 0 : _a.previousElementSibling).
|
|
75
|
+
var x = ((_a = e.target) === null || _a === void 0 ? void 0 : _a.previousElementSibling).children;
|
|
76
76
|
Array.from(x).forEach(ele => {
|
|
77
77
|
;
|
|
78
78
|
ele.style.width = `${this._startWidth + delta.x}px`;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ox-nav-bar.js","sourceRoot":"","sources":["../../../src/layouts/ox-nav-bar.ts"],"names":[],"mappings":";AAAA,OAAO,uCAAuC,CAAA;AAC9C,OAAO,qCAAqC,CAAA;AAE5C,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAA;AACxD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAClE,OAAO,EAAE,OAAO,EAAE,MAAM,8BAA8B,CAAA;AAEtD,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAEjD,OAAO,EAAY,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAC/D,OAAO,KAAK,MAAM,mBAAmB,CAAA;AAGrC,IAAM,MAAM,GAAZ,MAAM,MAAO,SAAQ,OAAO,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC;IAA/C;;QAqBuD,cAAS,GAAY,KAAK,CAAA;QAEtE,cAAS,GAAiC,EAAE,CAAA;QAE7C,gBAAW,GAAW,CAAC,CAAA;IAyEjC,CAAC;IAvEC,MAAM;QACJ,IAAI,SAAS,GAAG,IAAI,CAAC,SAAS,CAAA;QAC9B,IAAI,OAAO,GAAG,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC;aACjC,GAAG,CAAC,IAAI,CAAC,EAAE;YACV,OAAO;gBACL,IAAI;gBACJ,GAAG,SAAS,CAAC,IAAI,CAAC;aACnB,CAAA;QACH,CAAC,CAAC;aACD,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,QAAQ,IAAI,QAAQ,IAAI,CAAC,CAAC,IAAI,CAAC,SAAS,IAAI,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAA;QAE9F,OAAO,GAAG;YACR,GAAG,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,KAAK,IAAI,cAAc,CAAC,OAAO,CAAC;YACvE,GAAG,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,KAAK,KAAK,cAAc,CAAC,OAAO,CAAC;SACzE,CAAA;QAED,OAAO,IAAI,CAAA;QACP,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CACrB,CAAC,MAAM,CAAC,IAAI;YACV,CAAC,CAAC,IAAI,CAAA,EAAE;YACR,CAAC,CAAC,MAAM,CAAC,QAAQ;
|
|
1
|
+
{"version":3,"file":"ox-nav-bar.js","sourceRoot":"","sources":["../../../src/layouts/ox-nav-bar.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/popup/ox-floating-overlay.js'\nimport '../components/ox-resize-splitter.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { ifDefined } from 'lit/directives/if-defined.js'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { connect } from 'pwa-helpers/connect-mixin.js'\n\nimport { ScrollbarStyles } from '@operato/styles'\n\nimport { Viewpart, VIEWPART_LEVEL } from '../actions/layout.js'\nimport store from '../initializer.js'\n\n@customElement('ox-nav-bar')\nclass NavBar extends connect(store)(LitElement) {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-flow: row nowrap;\n align-items: stretch;\n\n position: relative;\n\n background-color: var(--nav-bar-background-color);\n }\n\n *[navbar] {\n display: flex;\n flex-direction: row;\n }\n `\n ]\n\n @property({ type: Boolean, attribute: 'fullbleed' }) fullbleed: boolean = false\n\n @state() viewparts: { [name: string]: Viewpart } = {}\n\n private _startWidth: number = 0\n\n render() {\n var viewparts = this.viewparts\n var navbars = Object.keys(viewparts)\n .map(name => {\n return {\n name,\n ...viewparts[name]\n }\n })\n .filter(viewpart => viewpart.position == 'navbar' && (!this.fullbleed || viewpart.hovering))\n\n navbars = [\n ...navbars.filter(viewpart => viewpart.level == VIEWPART_LEVEL.TOPMOST),\n ...navbars.filter(viewpart => viewpart.level !== VIEWPART_LEVEL.TOPMOST)\n ]\n\n return html`\n ${navbars.map(navbar =>\n !navbar.show\n ? html``\n : navbar.hovering\n ? html`\n <ox-floating-overlay\n .backdrop=${navbar.backdrop}\n direction=\"right\"\n .hovering=${navbar.hovering}\n .name=${navbar.name}\n .title=${navbar.title}\n .help=${navbar.help}\n .size=${navbar.size}\n .closable=${navbar.closable}\n .templateProperties=${navbar.templateProperties}\n .historical=${true}\n .search=${navbar.search}\n .filter=${navbar.filter}\n z-index=${ifDefined(navbar.zIndex)}\n >${navbar.template}</ox-floating-overlay\n >\n `\n : html`\n <div navbar>${navbar.template}</div>\n ${navbar.resizable\n ? html`\n <ox-resize-splitter\n @splitter-dragstart=${(e: CustomEvent) => this.resizeStart(e)}\n @splitter-drag=${(e: CustomEvent) => this.resizeDrag(e)}\n vertical\n ></ox-resize-splitter>\n `\n : html``}\n `\n )}\n `\n }\n\n resizeStart(e: CustomEvent) {\n this._startWidth = ((e.target as HTMLElement)?.previousElementSibling as HTMLElement).offsetWidth\n }\n\n resizeDrag(e: CustomEvent) {\n var delta = e.detail\n\n var x = ((e.target as HTMLElement)?.previousElementSibling as HTMLElement).children\n Array.from(x).forEach(ele => {\n ;(ele as HTMLElement).style.width = `${this._startWidth + delta.x}px`\n })\n }\n\n stateChanged(state: any) {\n this.viewparts = state.layout.viewparts || {}\n }\n}\n"]}
|
|
@@ -33,34 +33,34 @@ let PageFooterBar = class PageFooterBar extends connect(store)(LitElement) {
|
|
|
33
33
|
? html ``
|
|
34
34
|
: footerbar.hovering
|
|
35
35
|
? html `
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
36
|
+
<ox-floating-overlay
|
|
37
|
+
.backdrop=${footerbar.backdrop}
|
|
38
|
+
direction="up"
|
|
39
|
+
.hovering=${footerbar.hovering}
|
|
40
|
+
.name=${footerbar.name}
|
|
41
|
+
.title=${footerbar.title || ''}
|
|
42
|
+
.help=${footerbar.help}
|
|
43
|
+
.size=${footerbar.size}
|
|
44
|
+
.closable=${footerbar.closable}
|
|
45
|
+
.templateProperties=${footerbar.templateProperties}
|
|
46
|
+
.historical=${true}
|
|
47
|
+
.search=${footerbar.search}
|
|
48
|
+
.filter=${footerbar.filter}
|
|
49
|
+
z-index=${ifDefined(footerbar.zIndex)}
|
|
50
|
+
>${footerbar.template}</ox-floating-overlay
|
|
51
|
+
>
|
|
52
|
+
`
|
|
53
53
|
: html `
|
|
54
|
-
|
|
55
|
-
|
|
54
|
+
<div footerbar>${footerbar.template}</div>
|
|
55
|
+
${footerbar.resizable
|
|
56
56
|
? html `
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
57
|
+
<ox-resize-splitter
|
|
58
|
+
@splitter-dragstart=${(e) => this.resizeStart(e)}
|
|
59
|
+
@splitter-drag=${(e) => this.resizeDrag(e)}
|
|
60
|
+
></ox-resize-splitter>
|
|
61
|
+
`
|
|
62
62
|
: html ``}
|
|
63
|
-
|
|
63
|
+
`)}
|
|
64
64
|
`;
|
|
65
65
|
}
|
|
66
66
|
resizeStart(e) {
|
|
@@ -70,7 +70,7 @@ let PageFooterBar = class PageFooterBar extends connect(store)(LitElement) {
|
|
|
70
70
|
resizeDrag(e) {
|
|
71
71
|
var _a;
|
|
72
72
|
var delta = e.detail;
|
|
73
|
-
var x = ((_a = e.target) === null || _a === void 0 ? void 0 : _a.previousElementSibling).
|
|
73
|
+
var x = ((_a = e.target) === null || _a === void 0 ? void 0 : _a.previousElementSibling).children;
|
|
74
74
|
Array.from(x).forEach(ele => {
|
|
75
75
|
;
|
|
76
76
|
ele.style.height = `${this._startHeight - delta.y}px`;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ox-page-footer-bar.js","sourceRoot":"","sources":["../../../src/layouts/ox-page-footer-bar.ts"],"names":[],"mappings":";AAAA,OAAO,uCAAuC,CAAA;AAC9C,OAAO,qCAAqC,CAAA;AAE5C,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAA;AACxD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAClE,OAAO,EAAE,OAAO,EAAE,MAAM,8BAA8B,CAAA;AAEtD,OAAO,EAAY,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAC/D,OAAO,KAAK,MAAM,mBAAmB,CAAA;AAGrC,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,OAAO,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC;IAAtD;;QAuBuD,cAAS,GAAY,KAAK,CAAA;QAEtE,cAAS,GAAiC,EAAE,CAAA;QAE7C,iBAAY,GAAW,CAAC,CAAA;IAwElC,CAAC;IAtEC,MAAM;QACJ,IAAI,SAAS,GAAG,IAAI,CAAC,SAAS,CAAA;QAC9B,IAAI,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC;aACpC,GAAG,CAAC,IAAI,CAAC,EAAE;YACV,OAAO;gBACL,IAAI;gBACJ,GAAG,SAAS,CAAC,IAAI,CAAC;aACnB,CAAA;QACH,CAAC,CAAC;aACD,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,QAAQ,IAAI,gBAAgB,IAAI,CAAC,CAAC,IAAI,CAAC,SAAS,IAAI,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAA;QAEtG,UAAU,GAAG;YACX,GAAG,UAAU,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,KAAK,IAAI,cAAc,CAAC,OAAO,CAAC;YAC1E,GAAG,UAAU,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,KAAK,KAAK,cAAc,CAAC,OAAO,CAAC;SAC5E,CAAA;QAED,OAAO,IAAI,CAAA;QACP,UAAU,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE,CAC3B,CAAC,SAAS,CAAC,IAAI;YACb,CAAC,CAAC,IAAI,CAAA,EAAE;YACR,CAAC,CAAC,SAAS,CAAC,QAAQ;
|
|
1
|
+
{"version":3,"file":"ox-page-footer-bar.js","sourceRoot":"","sources":["../../../src/layouts/ox-page-footer-bar.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/popup/ox-floating-overlay.js'\nimport '../components/ox-resize-splitter.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { ifDefined } from 'lit/directives/if-defined.js'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { connect } from 'pwa-helpers/connect-mixin.js'\n\nimport { Viewpart, VIEWPART_LEVEL } from '../actions/layout.js'\nimport store from '../initializer.js'\n\n@customElement('ox-page-footer-bar')\nclass PageFooterBar extends connect(store)(LitElement) {\n static styles = [\n css`\n :host {\n display: flex;\n flex-flow: column-reverse nowrap;\n align-items: stretch;\n position: relative;\n }\n\n *[footerbar] {\n display: block;\n max-width: 100vw;\n }\n\n @media screen and (max-width: 460px) {\n :host {\n padding-bottom: 0;\n }\n }\n `\n ]\n\n @property({ type: Boolean, attribute: 'fullbleed' }) fullbleed: boolean = false\n\n @state() viewparts: { [name: string]: Viewpart } = {}\n\n private _startHeight: number = 0\n\n render() {\n var viewparts = this.viewparts\n var footerbars = Object.keys(viewparts)\n .map(name => {\n return {\n name,\n ...viewparts[name]\n }\n })\n .filter(viewpart => viewpart.position == 'page-footerbar' && (!this.fullbleed || viewpart.hovering))\n\n footerbars = [\n ...footerbars.filter(viewpart => viewpart.level == VIEWPART_LEVEL.TOPMOST),\n ...footerbars.filter(viewpart => viewpart.level !== VIEWPART_LEVEL.TOPMOST)\n ]\n\n return html`\n ${footerbars.map(footerbar =>\n !footerbar.show\n ? html``\n : footerbar.hovering\n ? html`\n <ox-floating-overlay\n .backdrop=${footerbar.backdrop}\n direction=\"up\"\n .hovering=${footerbar.hovering}\n .name=${footerbar.name}\n .title=${footerbar.title || ''}\n .help=${footerbar.help}\n .size=${footerbar.size}\n .closable=${footerbar.closable}\n .templateProperties=${footerbar.templateProperties}\n .historical=${true}\n .search=${footerbar.search}\n .filter=${footerbar.filter}\n z-index=${ifDefined(footerbar.zIndex)}\n >${footerbar.template}</ox-floating-overlay\n >\n `\n : html`\n <div footerbar>${footerbar.template}</div>\n ${footerbar.resizable\n ? html`\n <ox-resize-splitter\n @splitter-dragstart=${(e: CustomEvent) => this.resizeStart(e)}\n @splitter-drag=${(e: CustomEvent) => this.resizeDrag(e)}\n ></ox-resize-splitter>\n `\n : html``}\n `\n )}\n `\n }\n\n resizeStart(e: CustomEvent) {\n this._startHeight = ((e.target as HTMLElement)?.previousElementSibling as HTMLElement).offsetHeight\n }\n\n resizeDrag(e: CustomEvent) {\n var delta = e.detail\n\n var x = ((e.target as HTMLElement)?.previousElementSibling as HTMLElement).children\n Array.from(x).forEach(ele => {\n ;(ele as HTMLElement).style.height = `${this._startHeight - delta.y}px`\n })\n }\n\n stateChanged(state: any) {\n this.viewparts = state.layout.viewparts || {}\n }\n}\n"]}
|