@operato/context 2.0.0-alpha.5 → 2.0.0-alpha.51
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 +244 -0
- package/dist/src/layouts/ox-context-page-toolbar.d.ts +8 -3
- package/dist/src/layouts/ox-context-page-toolbar.js +6 -3
- package/dist/src/layouts/ox-context-page-toolbar.js.map +1 -1
- package/dist/src/layouts/ox-context-toolbar.d.ts +1 -1
- package/dist/src/tools/ox-page-action-context-bar.d.ts +11 -3
- package/dist/src/tools/ox-page-action-context-bar.js +21 -18
- package/dist/src/tools/ox-page-action-context-bar.js.map +1 -1
- package/dist/src/tools/ox-page-action-overlay-template.d.ts +1 -1
- package/dist/src/tools/ox-page-title-bar.d.ts +1 -1
- package/dist/src/tools/ox-title-bar.d.ts +1 -1
- package/dist/stories/ox-context-page-toolbar-select.stories.d.ts +24 -0
- package/dist/stories/ox-context-page-toolbar-select.stories.js +82 -0
- package/dist/stories/ox-context-page-toolbar-select.stories.js.map +1 -0
- package/dist/stories/ox-context-page-toolbar.stories.d.ts +24 -0
- package/dist/stories/ox-context-page-toolbar.stories.js +87 -0
- package/dist/stories/ox-context-page-toolbar.stories.js.map +1 -0
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +19 -19
- package/src/layouts/ox-context-page-toolbar.ts +9 -3
- package/src/tools/ox-page-action-context-bar.ts +50 -38
- package/stories/ox-context-page-toolbar-select.stories.ts +96 -0
- package/stories/ox-context-page-toolbar.stories.ts +101 -0
- package/themes/app-theme.css +145 -0
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,250 @@
|
|
|
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.51](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.50...v2.0.0-alpha.51) (2024-03-29)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### :bug: Bug Fix
|
|
10
|
+
|
|
11
|
+
* upgrade lit ([e661c33](https://github.com/hatiolab/operato/commit/e661c333d2bb97f784b5ac2c0e365714ee5e80ff))
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
## [2.0.0-alpha.49](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.48...v2.0.0-alpha.49) (2024-03-28)
|
|
16
|
+
|
|
17
|
+
**Note:** Version bump only for package @operato/context
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
|
|
23
|
+
## [2.0.0-alpha.48](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.47...v2.0.0-alpha.48) (2024-03-28)
|
|
24
|
+
|
|
25
|
+
|
|
26
|
+
### :bug: Bug Fix
|
|
27
|
+
|
|
28
|
+
* context module stories ([052ac6a](https://github.com/hatiolab/operato/commit/052ac6adc0c7cae6ddaff2babc3b344302e2aca8))
|
|
29
|
+
|
|
30
|
+
|
|
31
|
+
|
|
32
|
+
## [2.0.0-alpha.47](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.46...v2.0.0-alpha.47) (2024-03-27)
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
### :bug: Bug Fix
|
|
36
|
+
|
|
37
|
+
* storybook 실행 환경 ([6a2940f](https://github.com/hatiolab/operato/commit/6a2940fb89dc26566acdce7cf1781a71cbad61c5))
|
|
38
|
+
|
|
39
|
+
|
|
40
|
+
|
|
41
|
+
## [2.0.0-alpha.46](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.45...v2.0.0-alpha.46) (2024-03-26)
|
|
42
|
+
|
|
43
|
+
**Note:** Version bump only for package @operato/context
|
|
44
|
+
|
|
45
|
+
|
|
46
|
+
|
|
47
|
+
|
|
48
|
+
|
|
49
|
+
## [2.0.0-alpha.44](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.43...v2.0.0-alpha.44) (2024-03-24)
|
|
50
|
+
|
|
51
|
+
**Note:** Version bump only for package @operato/context
|
|
52
|
+
|
|
53
|
+
|
|
54
|
+
|
|
55
|
+
|
|
56
|
+
|
|
57
|
+
## [2.0.0-alpha.43](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.42...v2.0.0-alpha.43) (2024-03-24)
|
|
58
|
+
|
|
59
|
+
**Note:** Version bump only for package @operato/context
|
|
60
|
+
|
|
61
|
+
|
|
62
|
+
|
|
63
|
+
|
|
64
|
+
|
|
65
|
+
## [2.0.0-alpha.37](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.36...v2.0.0-alpha.37) (2024-03-18)
|
|
66
|
+
|
|
67
|
+
**Note:** Version bump only for package @operato/context
|
|
68
|
+
|
|
69
|
+
|
|
70
|
+
|
|
71
|
+
|
|
72
|
+
|
|
73
|
+
## [2.0.0-alpha.35](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.34...v2.0.0-alpha.35) (2024-03-13)
|
|
74
|
+
|
|
75
|
+
**Note:** Version bump only for package @operato/context
|
|
76
|
+
|
|
77
|
+
|
|
78
|
+
|
|
79
|
+
|
|
80
|
+
|
|
81
|
+
## [2.0.0-alpha.34](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.33...v2.0.0-alpha.34) (2024-03-12)
|
|
82
|
+
|
|
83
|
+
**Note:** Version bump only for package @operato/context
|
|
84
|
+
|
|
85
|
+
|
|
86
|
+
|
|
87
|
+
|
|
88
|
+
|
|
89
|
+
## [2.0.0-alpha.32](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.31...v2.0.0-alpha.32) (2024-03-12)
|
|
90
|
+
|
|
91
|
+
**Note:** Version bump only for package @operato/context
|
|
92
|
+
|
|
93
|
+
|
|
94
|
+
|
|
95
|
+
|
|
96
|
+
|
|
97
|
+
## [2.0.0-alpha.31](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.30...v2.0.0-alpha.31) (2024-03-03)
|
|
98
|
+
|
|
99
|
+
**Note:** Version bump only for package @operato/context
|
|
100
|
+
|
|
101
|
+
|
|
102
|
+
|
|
103
|
+
|
|
104
|
+
|
|
105
|
+
## [2.0.0-alpha.30](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.29...v2.0.0-alpha.30) (2024-03-03)
|
|
106
|
+
|
|
107
|
+
**Note:** Version bump only for package @operato/context
|
|
108
|
+
|
|
109
|
+
|
|
110
|
+
|
|
111
|
+
|
|
112
|
+
|
|
113
|
+
## [2.0.0-alpha.28](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.27...v2.0.0-alpha.28) (2024-02-20)
|
|
114
|
+
|
|
115
|
+
|
|
116
|
+
### :bug: Bug Fix
|
|
117
|
+
|
|
118
|
+
* upgrade devDependencies for webcomponents ([1489b8b](https://github.com/hatiolab/operato/commit/1489b8b790d9bcee779a070a630697f25c01728f))
|
|
119
|
+
|
|
120
|
+
|
|
121
|
+
|
|
122
|
+
## [2.0.0-alpha.27](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.26...v2.0.0-alpha.27) (2024-02-17)
|
|
123
|
+
|
|
124
|
+
**Note:** Version bump only for package @operato/context
|
|
125
|
+
|
|
126
|
+
|
|
127
|
+
|
|
128
|
+
|
|
129
|
+
|
|
130
|
+
## [2.0.0-alpha.23](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.22...v2.0.0-alpha.23) (2024-02-10)
|
|
131
|
+
|
|
132
|
+
**Note:** Version bump only for package @operato/context
|
|
133
|
+
|
|
134
|
+
|
|
135
|
+
|
|
136
|
+
|
|
137
|
+
|
|
138
|
+
## [2.0.0-alpha.22](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.21...v2.0.0-alpha.22) (2024-02-10)
|
|
139
|
+
|
|
140
|
+
**Note:** Version bump only for package @operato/context
|
|
141
|
+
|
|
142
|
+
|
|
143
|
+
|
|
144
|
+
|
|
145
|
+
|
|
146
|
+
## [2.0.0-alpha.21](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.20...v2.0.0-alpha.21) (2024-02-09)
|
|
147
|
+
|
|
148
|
+
**Note:** Version bump only for package @operato/context
|
|
149
|
+
|
|
150
|
+
|
|
151
|
+
|
|
152
|
+
|
|
153
|
+
|
|
154
|
+
## [2.0.0-alpha.20](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.19...v2.0.0-alpha.20) (2024-02-05)
|
|
155
|
+
|
|
156
|
+
**Note:** Version bump only for package @operato/context
|
|
157
|
+
|
|
158
|
+
|
|
159
|
+
|
|
160
|
+
|
|
161
|
+
|
|
162
|
+
## [2.0.0-alpha.19](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.18...v2.0.0-alpha.19) (2024-02-05)
|
|
163
|
+
|
|
164
|
+
**Note:** Version bump only for package @operato/context
|
|
165
|
+
|
|
166
|
+
|
|
167
|
+
|
|
168
|
+
|
|
169
|
+
|
|
170
|
+
## [2.0.0-alpha.17](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.16...v2.0.0-alpha.17) (2024-02-04)
|
|
171
|
+
|
|
172
|
+
**Note:** Version bump only for package @operato/context
|
|
173
|
+
|
|
174
|
+
|
|
175
|
+
|
|
176
|
+
|
|
177
|
+
|
|
178
|
+
## [2.0.0-alpha.16](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.15...v2.0.0-alpha.16) (2024-02-03)
|
|
179
|
+
|
|
180
|
+
**Note:** Version bump only for package @operato/context
|
|
181
|
+
|
|
182
|
+
|
|
183
|
+
|
|
184
|
+
|
|
185
|
+
|
|
186
|
+
## [2.0.0-alpha.13](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.12...v2.0.0-alpha.13) (2024-01-28)
|
|
187
|
+
|
|
188
|
+
**Note:** Version bump only for package @operato/context
|
|
189
|
+
|
|
190
|
+
|
|
191
|
+
|
|
192
|
+
|
|
193
|
+
|
|
194
|
+
## [2.0.0-alpha.12](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.11...v2.0.0-alpha.12) (2024-01-24)
|
|
195
|
+
|
|
196
|
+
**Note:** Version bump only for package @operato/context
|
|
197
|
+
|
|
198
|
+
|
|
199
|
+
|
|
200
|
+
|
|
201
|
+
|
|
202
|
+
## [2.0.0-alpha.11](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.10...v2.0.0-alpha.11) (2024-01-24)
|
|
203
|
+
|
|
204
|
+
**Note:** Version bump only for package @operato/context
|
|
205
|
+
|
|
206
|
+
|
|
207
|
+
|
|
208
|
+
|
|
209
|
+
|
|
210
|
+
## [2.0.0-alpha.10](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.9...v2.0.0-alpha.10) (2024-01-22)
|
|
211
|
+
|
|
212
|
+
**Note:** Version bump only for package @operato/context
|
|
213
|
+
|
|
214
|
+
|
|
215
|
+
|
|
216
|
+
|
|
217
|
+
|
|
218
|
+
## [2.0.0-alpha.9](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.8...v2.0.0-alpha.9) (2024-01-20)
|
|
219
|
+
|
|
220
|
+
**Note:** Version bump only for package @operato/context
|
|
221
|
+
|
|
222
|
+
|
|
223
|
+
|
|
224
|
+
|
|
225
|
+
|
|
226
|
+
## [2.0.0-alpha.8](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.7...v2.0.0-alpha.8) (2024-01-20)
|
|
227
|
+
|
|
228
|
+
**Note:** Version bump only for package @operato/context
|
|
229
|
+
|
|
230
|
+
|
|
231
|
+
|
|
232
|
+
|
|
233
|
+
|
|
234
|
+
## [2.0.0-alpha.7](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.6...v2.0.0-alpha.7) (2024-01-15)
|
|
235
|
+
|
|
236
|
+
**Note:** Version bump only for package @operato/context
|
|
237
|
+
|
|
238
|
+
|
|
239
|
+
|
|
240
|
+
|
|
241
|
+
|
|
242
|
+
## [2.0.0-alpha.6](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.5...v2.0.0-alpha.6) (2024-01-15)
|
|
243
|
+
|
|
244
|
+
**Note:** Version bump only for package @operato/context
|
|
245
|
+
|
|
246
|
+
|
|
247
|
+
|
|
248
|
+
|
|
249
|
+
|
|
6
250
|
## [2.0.0-alpha.5](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.4...v2.0.0-alpha.5) (2024-01-15)
|
|
7
251
|
|
|
8
252
|
**Note:** Version bump only for package @operato/context
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import '@material/mwc-icon';
|
|
2
|
-
import { LitElement } from 'lit';
|
|
2
|
+
import { LitElement, TemplateResult } from 'lit';
|
|
3
|
+
import { TOOL_POSITION } from '@operato/layout';
|
|
3
4
|
declare const ContextPageToolbar_base: (new (...args: any[]) => {
|
|
4
5
|
_storeUnsubscribe: import("redux").Unsubscribe;
|
|
5
6
|
connectedCallback(): void;
|
|
@@ -10,8 +11,12 @@ declare const ContextPageToolbar_base: (new (...args: any[]) => {
|
|
|
10
11
|
export declare class ContextPageToolbar extends ContextPageToolbar_base {
|
|
11
12
|
static get styles(): import("lit").CSSResult[];
|
|
12
13
|
context: any;
|
|
13
|
-
|
|
14
|
-
|
|
14
|
+
tools?: {
|
|
15
|
+
position: TOOL_POSITION;
|
|
16
|
+
template: TemplateResult;
|
|
17
|
+
context?: string;
|
|
18
|
+
}[];
|
|
19
|
+
render(): TemplateResult<1>;
|
|
15
20
|
stateChanged(state: any): void;
|
|
16
21
|
}
|
|
17
22
|
export {};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { __decorate } from "tslib";
|
|
2
2
|
import '@material/mwc-icon';
|
|
3
3
|
import { css, html, LitElement, nothing } from 'lit';
|
|
4
|
-
import { customElement, property
|
|
4
|
+
import { customElement, property } from 'lit/decorators.js';
|
|
5
5
|
import { connect } from 'pwa-helpers/connect-mixin.js';
|
|
6
6
|
import { TOOL_POSITION } from '@operato/layout';
|
|
7
7
|
import { store } from '@operato/shell';
|
|
@@ -74,14 +74,17 @@ let ContextPageToolbar = class ContextPageToolbar extends connect(store)(LitElem
|
|
|
74
74
|
`;
|
|
75
75
|
}
|
|
76
76
|
stateChanged(state) {
|
|
77
|
-
|
|
77
|
+
var _a;
|
|
78
|
+
if (state.context) {
|
|
79
|
+
this.tools = (_a = state.context) === null || _a === void 0 ? void 0 : _a.tools;
|
|
80
|
+
}
|
|
78
81
|
}
|
|
79
82
|
};
|
|
80
83
|
__decorate([
|
|
81
84
|
property({ type: Object })
|
|
82
85
|
], ContextPageToolbar.prototype, "context", void 0);
|
|
83
86
|
__decorate([
|
|
84
|
-
|
|
87
|
+
property({ type: Array })
|
|
85
88
|
], ContextPageToolbar.prototype, "tools", void 0);
|
|
86
89
|
ContextPageToolbar = __decorate([
|
|
87
90
|
customElement('ox-context-page-toolbar')
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ox-context-page-toolbar.js","sourceRoot":"","sources":["../../../src/layouts/ox-context-page-toolbar.ts"],"names":[],"mappings":";AAAA,OAAO,oBAAoB,CAAA;AAE3B,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,
|
|
1
|
+
{"version":3,"file":"ox-context-page-toolbar.js","sourceRoot":"","sources":["../../../src/layouts/ox-context-page-toolbar.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/mwc-icon'\n\nimport { css, html, LitElement, TemplateResult, nothing } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\nimport { connect } from 'pwa-helpers/connect-mixin.js'\n\nimport { TOOL_POSITION } from '@operato/layout'\nimport { store } from '@operato/shell'\n\n@customElement('ox-context-page-toolbar')\nexport class ContextPageToolbar extends connect(store)(LitElement) {\n static get styles() {\n return [\n css`\n :host {\n display: flex;\n flex-direction: row-reverse;\n position: relative;\n\n justify-content: end;\n align-items: center;\n\n --context-action-bar-button-margin: 0px;\n --context-action-bar-more-button-border-radius: 2px;\n\n --mdc-icon-size: 20px;\n --mdc-button-height: 20px;\n --mdc-button-horizontal-padding: 2px;\n }\n\n :host > div {\n display: flex;\n flex-direction: row;\n\n align-items: center;\n }\n\n * {\n cursor: pointer;\n }\n\n mwc-icon {\n background-color: var(--theme-white-color);\n border: 1px solid rgba(var(--primary-color-rgb), 0.5);\n padding: 1px 2px;\n color: var(--primary-color);\n }\n `\n ]\n }\n\n @property({ type: Object }) context: any\n @property({ type: Array }) tools?: {\n position: TOOL_POSITION\n template: TemplateResult\n context?: string\n }[]\n\n render() {\n let contextKeys = Object.keys(this.context).filter(key => !!this.context[key])\n let tools = (this.tools || []).filter(tool => {\n if (!tool.context || contextKeys.includes(tool.context)) {\n return tool\n }\n })\n\n let frontEndTools = tools.filter(tool => tool.position == TOOL_POSITION.FRONT_END)\n let frontTools = tools.filter(tool => tool.position == TOOL_POSITION.FRONT)\n let centerTools = tools.filter(tool => tool.position == TOOL_POSITION.CENTER)\n let rearTools = tools.filter(tool => tool.position == TOOL_POSITION.REAR)\n let rearEndTools = tools.filter(tool => tool.position == TOOL_POSITION.REAR_END)\n\n return html`\n ${frontEndTools.length > 0\n ? html`<div id=\"front-end\">${frontEndTools.map(tool => html` ${tool.template} `)}</div>`\n : nothing}\n ${frontTools.length > 0\n ? html`<div id=\"front\">${frontTools.map(tool => html` ${tool.template} `)}</div>`\n : nothing}\n ${centerTools.length > 0\n ? html`<div id=\"center\">${centerTools.map(tool => html` ${tool.template} `)}</div>`\n : nothing}\n ${rearTools.length > 0 ? html`<div id=\"rear\">${rearTools.map(tool => html` ${tool.template} `)}</div>` : nothing}\n ${rearEndTools.length > 0\n ? html`<div id=\"rear-end\">${rearEndTools.map(tool => html` ${tool.template} `)}</div>`\n : nothing}\n `\n }\n\n stateChanged(state: any) {\n if (state.context) {\n this.tools = state.context?.tools\n }\n }\n}\n"]}
|
|
@@ -11,7 +11,7 @@ export declare class ContextToolbar extends ContextToolbar_base {
|
|
|
11
11
|
static get styles(): import("lit").CSSResult[];
|
|
12
12
|
private context;
|
|
13
13
|
private tools?;
|
|
14
|
-
render(): import("lit").TemplateResult<1> | typeof nothing;
|
|
14
|
+
render(): import("lit-html").TemplateResult<1> | typeof nothing;
|
|
15
15
|
stateChanged(state: any): void;
|
|
16
16
|
}
|
|
17
17
|
export {};
|
|
@@ -11,15 +11,23 @@ declare const PageActionContextBar_base: (new (...args: any[]) => {
|
|
|
11
11
|
}) & typeof LitElement;
|
|
12
12
|
export declare class PageActionContextBar extends PageActionContextBar_base {
|
|
13
13
|
static get styles(): import("lit").CSSResult[];
|
|
14
|
-
actions:
|
|
14
|
+
actions: {
|
|
15
|
+
title: string;
|
|
16
|
+
action: () => void;
|
|
17
|
+
icon: string;
|
|
18
|
+
type: string;
|
|
19
|
+
select: string[];
|
|
20
|
+
href?: string;
|
|
21
|
+
emphasis?: boolean;
|
|
22
|
+
}[];
|
|
15
23
|
private overflown;
|
|
16
24
|
private overflownUpdaterThrottle;
|
|
17
25
|
private resizeCallback;
|
|
18
26
|
get overflownUpdater(): any;
|
|
19
27
|
connectedCallback(): void;
|
|
20
28
|
disconnectedCallback(): void;
|
|
21
|
-
render(): import("lit").TemplateResult<1>;
|
|
22
|
-
renderActions(): import("lit").TemplateResult<1>;
|
|
29
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
30
|
+
renderActions(): import("lit-html").TemplateResult<1>;
|
|
23
31
|
updated(changed: PropertyValues<this>): Promise<void>;
|
|
24
32
|
stateChanged(state: any): void;
|
|
25
33
|
showMore(): void;
|
|
@@ -3,7 +3,7 @@ import '@material/mwc-button';
|
|
|
3
3
|
import '@material/mwc-icon';
|
|
4
4
|
import './ox-page-action-overlay-template.js';
|
|
5
5
|
import { css, html, LitElement } from 'lit';
|
|
6
|
-
import { customElement, state } from 'lit/decorators.js';
|
|
6
|
+
import { customElement, property, state } from 'lit/decorators.js';
|
|
7
7
|
import throttle from 'lodash-es/throttle';
|
|
8
8
|
import { connect } from 'pwa-helpers/connect-mixin';
|
|
9
9
|
import { openOverlay } from '@operato/layout';
|
|
@@ -115,23 +115,23 @@ let PageActionContextBar = class PageActionContextBar extends connect(store)(Lit
|
|
|
115
115
|
? html ` <span @click=${action}>${title}</span> `
|
|
116
116
|
: type == 'select' || (select && select.length > 0)
|
|
117
117
|
? html `
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
118
|
+
<select @change=${action}>
|
|
119
|
+
${select.map((option) => html ` <option>${option}</option> `)}
|
|
120
|
+
</select>
|
|
121
|
+
`
|
|
122
122
|
: type == 'link'
|
|
123
123
|
? html ` <a href=${href}>${title}</a> `
|
|
124
124
|
: type == 'icon'
|
|
125
125
|
? html `<mwc-icon @click=${action}>${icon}</mwc-icon>`
|
|
126
126
|
: html `
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
127
|
+
<mwc-button
|
|
128
|
+
label=${title}
|
|
129
|
+
icon=${icon || 'done_all'}
|
|
130
|
+
?dense=${dense}
|
|
131
|
+
?raised=${raised}
|
|
132
|
+
?outlined=${outlined}
|
|
133
|
+
?danger=${danger}
|
|
134
|
+
@click=${async (e) => {
|
|
135
135
|
var _a;
|
|
136
136
|
/* all actions should be bloked for a second */
|
|
137
137
|
const button = e.currentTarget;
|
|
@@ -149,8 +149,8 @@ let PageActionContextBar = class PageActionContextBar extends connect(store)(Lit
|
|
|
149
149
|
button.removeAttribute('working');
|
|
150
150
|
}
|
|
151
151
|
}}
|
|
152
|
-
|
|
153
|
-
|
|
152
|
+
></mwc-button>
|
|
153
|
+
`;
|
|
154
154
|
})}
|
|
155
155
|
`;
|
|
156
156
|
}
|
|
@@ -160,8 +160,11 @@ let PageActionContextBar = class PageActionContextBar extends connect(store)(Lit
|
|
|
160
160
|
}
|
|
161
161
|
}
|
|
162
162
|
stateChanged(state) {
|
|
163
|
-
var _a
|
|
164
|
-
|
|
163
|
+
var _a;
|
|
164
|
+
const { actions } = ((_a = state.route) === null || _a === void 0 ? void 0 : _a.context) || {};
|
|
165
|
+
if (actions) {
|
|
166
|
+
this.actions = actions.filter((action) => !!action);
|
|
167
|
+
}
|
|
165
168
|
}
|
|
166
169
|
showMore() {
|
|
167
170
|
openOverlay('context-toolbar-overlay', {
|
|
@@ -170,7 +173,7 @@ let PageActionContextBar = class PageActionContextBar extends connect(store)(Lit
|
|
|
170
173
|
}
|
|
171
174
|
};
|
|
172
175
|
__decorate([
|
|
173
|
-
|
|
176
|
+
property({ type: Array })
|
|
174
177
|
], PageActionContextBar.prototype, "actions", void 0);
|
|
175
178
|
__decorate([
|
|
176
179
|
state()
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ox-page-action-context-bar.js","sourceRoot":"","sources":["../../../src/tools/ox-page-action-context-bar.ts"],"names":[],"mappings":";AAAA,OAAO,sBAAsB,CAAA;AAC7B,OAAO,oBAAoB,CAAA;AAC3B,OAAO,sCAAsC,CAAA;AAE7C,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAkB,MAAM,KAAK,CAAA;AAC3D,OAAO,EAAE,aAAa,
|
|
1
|
+
{"version":3,"file":"ox-page-action-context-bar.js","sourceRoot":"","sources":["../../../src/tools/ox-page-action-context-bar.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/mwc-button'\nimport '@material/mwc-icon'\nimport './ox-page-action-overlay-template.js'\n\nimport { css, html, LitElement, PropertyValues } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\nimport throttle from 'lodash-es/throttle'\nimport { connect } from 'pwa-helpers/connect-mixin'\n\nimport { openOverlay } from '@operato/layout'\nimport { store } from '@operato/shell'\nimport { sleep } from '@operato/utils'\n\n@customElement('ox-page-action-context-bar')\nexport class PageActionContextBar extends connect(store)(LitElement) {\n static get styles() {\n return [\n css`\n :host {\n display: flex;\n overflow: hidden;\n position: relative;\n }\n\n :host *:focus {\n outline: none;\n }\n\n mwc-button {\n white-space: nowrap;\n margin: var(--context-action-bar-button-margin);\n border-radius: var(--context-action-bar-more-button-border-radius);\n }\n\n [danger] {\n --mdc-theme-primary: var(--mdc-danger-button-primary-color);\n --mdc-button-outline-color: var(--mdc-danger-button-outline-color);\n }\n\n [more] {\n position: absolute;\n top: 0;\n right: 38px;\n background-color: var(--context-action-bar-more-button-background-color);\n box-shadow: -2px 0px 2px 1px rgba(0, 0, 0, 0.2);\n padding: var(--context-action-bar-more-button-padding);\n color: var(--context-action-bar-more-button-color);\n font-size: 2rem;\n }\n\n mwc-icon {\n background-color: var(--theme-white-color);\n border: 1px solid rgba(var(--primary-color-rgb), 0.5);\n padding: 1px 2px;\n color: var(--primary-color);\n }\n\n @media screen and (max-width: 460px) {\n mwc-button {\n --mdc-button-horizontal-padding: var(--padding-default);\n --mdc-shape-small: var(--context-action-bar-more-button-border-radius);\n }\n\n [more] {\n position: absolute;\n margin-top: -10px;\n right: 0px;\n padding: var(--padding-default);\n font-size: 2rem;\n }\n }\n\n @keyframes rotate {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n }\n `\n ]\n }\n\n @property({ type: Array }) actions: {\n title: string\n action: () => void\n icon: string\n type: string\n select: string[]\n href?: string\n emphasis?: boolean\n }[] = []\n @state() private overflown: boolean = false\n\n private overflownUpdaterThrottle: any\n private resizeCallback: any\n\n get overflownUpdater() {\n if (!this.overflownUpdaterThrottle) {\n this.overflownUpdaterThrottle = throttle(() => {\n this.overflown = this.scrollWidth > this.clientWidth\n }, 100)\n }\n\n return this.overflownUpdaterThrottle\n }\n\n connectedCallback() {\n super.connectedCallback()\n\n this.resizeCallback = () => this.overflownUpdater()\n\n window.addEventListener('resize', this.resizeCallback)\n }\n\n disconnectedCallback() {\n super.disconnectedCallback()\n\n window.removeEventListener('resize', this.resizeCallback)\n }\n\n render() {\n return html`\n ${this.renderActions()}\n ${this.overflown ? html` <mwc-icon more @click=${this.showMore.bind(this)}>more_horiz</mwc-icon> ` : html``}\n `\n }\n\n renderActions() {\n return html`\n ${this.actions.map(($action, idx) => {\n let { type, title, icon, action, select, href, emphasis } = $action as any\n let { outlined, raised, dense, danger } = emphasis || {}\n\n return type == 'text'\n ? html` <span @click=${action}>${title}</span> `\n : type == 'select' || (select && select.length > 0)\n ? html`\n <select @change=${action}>\n ${select.map((option: any) => html` <option>${option}</option> `)}\n </select>\n `\n : type == 'link'\n ? html` <a href=${href}>${title}</a> `\n : type == 'icon'\n ? html`<mwc-icon @click=${action}>${icon}</mwc-icon>`\n : html`\n <mwc-button\n label=${title}\n icon=${icon || 'done_all'}\n ?dense=${dense}\n ?raised=${raised}\n ?outlined=${outlined}\n ?danger=${danger}\n @click=${async (e: MouseEvent) => {\n /* all actions should be bloked for a second */\n const button = e.currentTarget as any\n button.icon = 'rotate_right'\n button.setAttribute('working', true)\n button.disabled = true\n\n try {\n await action()\n } finally {\n await sleep(1000)\n button.disabled = false\n /* because icon can be changed after sleep, don't use closure 'icon'. */\n button.icon = this.actions[idx]?.icon || 'done_all'\n button.removeAttribute('working')\n }\n }}\n ></mwc-button>\n `\n })}\n `\n }\n\n async updated(changed: PropertyValues<this>) {\n if (changed.has('actions')) {\n requestAnimationFrame(this.overflownUpdater)\n }\n }\n\n stateChanged(state: any) {\n const { actions } = state.route?.context || {}\n\n if (actions) {\n this.actions = actions.filter((action: any) => !!action)\n }\n }\n\n showMore() {\n openOverlay('context-toolbar-overlay', {\n template: html`<ox-page-action-overlay-template></ox-page-action-overlay-template>`\n })\n }\n}\n"]}
|
|
@@ -10,7 +10,7 @@ declare const PageActionOverlayTemplate_base: (new (...args: any[]) => {
|
|
|
10
10
|
export declare class PageActionOverlayTemplate extends PageActionOverlayTemplate_base {
|
|
11
11
|
static get styles(): import("lit").CSSResult[];
|
|
12
12
|
private actions;
|
|
13
|
-
render(): import("lit").TemplateResult<1>;
|
|
13
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
14
14
|
stateChanged(state: any): void;
|
|
15
15
|
}
|
|
16
16
|
export {};
|
|
@@ -12,7 +12,7 @@ export declare class PageTitleBar extends PageTitleBar_base {
|
|
|
12
12
|
static styles: import("lit").CSSResult[];
|
|
13
13
|
private context;
|
|
14
14
|
mobile: boolean;
|
|
15
|
-
render(): import("lit").TemplateResult<1>;
|
|
15
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
16
16
|
stateChanged(state: any): void;
|
|
17
17
|
}
|
|
18
18
|
export {};
|
|
@@ -11,7 +11,7 @@ declare const TitleBar_base: (new (...args: any[]) => {
|
|
|
11
11
|
export declare class TitleBar extends TitleBar_base {
|
|
12
12
|
static styles: import("lit").CSSResult[];
|
|
13
13
|
private context;
|
|
14
|
-
render(): import("lit").TemplateResult<1>;
|
|
14
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
15
15
|
stateChanged(state: any): void;
|
|
16
16
|
}
|
|
17
17
|
export {};
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import '@material/mwc-icon';
|
|
2
|
+
import '../src/layouts/ox-context-page-toolbar.js';
|
|
3
|
+
import '../src/tools/ox-page-action-context-bar.js';
|
|
4
|
+
import '@operato/styles';
|
|
5
|
+
import { TemplateResult } from 'lit';
|
|
6
|
+
declare const _default: {
|
|
7
|
+
title: string;
|
|
8
|
+
component: string;
|
|
9
|
+
argTypes: {
|
|
10
|
+
label: {
|
|
11
|
+
control: string;
|
|
12
|
+
};
|
|
13
|
+
};
|
|
14
|
+
};
|
|
15
|
+
export default _default;
|
|
16
|
+
interface Story<T> {
|
|
17
|
+
(args: T): TemplateResult;
|
|
18
|
+
args?: Partial<T>;
|
|
19
|
+
argTypes?: Record<string, unknown>;
|
|
20
|
+
}
|
|
21
|
+
interface ArgTypes {
|
|
22
|
+
label?: string;
|
|
23
|
+
}
|
|
24
|
+
export declare const Regular: Story<ArgTypes>;
|
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
import '@material/mwc-icon';
|
|
2
|
+
import '../src/layouts/ox-context-page-toolbar.js';
|
|
3
|
+
import '../src/tools/ox-page-action-context-bar.js';
|
|
4
|
+
import { CommonHeaderStyles } from '@operato/styles';
|
|
5
|
+
import { TOOL_POSITION } from '@operato/layout';
|
|
6
|
+
import '@operato/styles';
|
|
7
|
+
import { html } from 'lit';
|
|
8
|
+
export default {
|
|
9
|
+
title: 'ox-context-page-toolbar-select',
|
|
10
|
+
component: 'ox-context-page-toolbar',
|
|
11
|
+
argTypes: {
|
|
12
|
+
label: { control: 'string' }
|
|
13
|
+
}
|
|
14
|
+
};
|
|
15
|
+
const Template = ({ label = '' }) => html `
|
|
16
|
+
<link href="/themes/app-theme.css" rel="stylesheet" />
|
|
17
|
+
<link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
|
|
18
|
+
|
|
19
|
+
<style>
|
|
20
|
+
body {
|
|
21
|
+
background-color: white;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
${CommonHeaderStyles.cssText}
|
|
25
|
+
</style>
|
|
26
|
+
|
|
27
|
+
<div style="height:600px;">
|
|
28
|
+
<div class="header">
|
|
29
|
+
<div class="title">
|
|
30
|
+
<mwc-icon>summarize</mwc-icon>
|
|
31
|
+
${label}
|
|
32
|
+
</div>
|
|
33
|
+
|
|
34
|
+
<div class="filters">
|
|
35
|
+
<label>Filter</label><input type="text"></input>
|
|
36
|
+
</div>
|
|
37
|
+
|
|
38
|
+
<ox-context-page-toolbar class="actions"
|
|
39
|
+
.tools=${[
|
|
40
|
+
{
|
|
41
|
+
position: TOOL_POSITION.FRONT,
|
|
42
|
+
template: html ` <mwc-icon>download</mwc-icon> `,
|
|
43
|
+
context: 'exportable'
|
|
44
|
+
},
|
|
45
|
+
{
|
|
46
|
+
position: TOOL_POSITION.FRONT,
|
|
47
|
+
template: html ` <mwc-icon>upload</mwc-icon> `,
|
|
48
|
+
context: 'importable'
|
|
49
|
+
},
|
|
50
|
+
{
|
|
51
|
+
position: TOOL_POSITION.CENTER,
|
|
52
|
+
template: html `<ox-page-action-context-bar
|
|
53
|
+
.actions=${[
|
|
54
|
+
{
|
|
55
|
+
title: 'smile',
|
|
56
|
+
action: () => { },
|
|
57
|
+
select: ['', 'delete', 'hahaha', 'hohoho']
|
|
58
|
+
},
|
|
59
|
+
{
|
|
60
|
+
title: 'save',
|
|
61
|
+
action: () => { },
|
|
62
|
+
icon: 'save'
|
|
63
|
+
}
|
|
64
|
+
]}
|
|
65
|
+
></ox-page-action-context-bar>`
|
|
66
|
+
}
|
|
67
|
+
]}
|
|
68
|
+
.context=${{
|
|
69
|
+
exportable: true,
|
|
70
|
+
importable: true,
|
|
71
|
+
toolbar: false
|
|
72
|
+
}}
|
|
73
|
+
|
|
74
|
+
}> </ox-context-page-toolbar>
|
|
75
|
+
</div>
|
|
76
|
+
</div>
|
|
77
|
+
`;
|
|
78
|
+
export const Regular = Template.bind({});
|
|
79
|
+
Regular.args = {
|
|
80
|
+
label: 'common header styles'
|
|
81
|
+
};
|
|
82
|
+
//# sourceMappingURL=ox-context-page-toolbar-select.stories.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ox-context-page-toolbar-select.stories.js","sourceRoot":"","sources":["../../stories/ox-context-page-toolbar-select.stories.ts"],"names":[],"mappings":"AAAA,OAAO,oBAAoB,CAAA;AAC3B,OAAO,2CAA2C,CAAA;AAClD,OAAO,4CAA4C,CAAA;AACnD,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAA;AACpD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAE/C,OAAO,iBAAiB,CAAA;AAExB,OAAO,EAAO,IAAI,EAA0B,MAAM,KAAK,CAAA;AAEvD,eAAe;IACb,KAAK,EAAE,gCAAgC;IACvC,SAAS,EAAE,yBAAyB;IACpC,QAAQ,EAAE;QACR,KAAK,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;KAC7B;CACF,CAAA;AAYD,MAAM,QAAQ,GAAoB,CAAC,EAAE,KAAK,GAAG,EAAE,EAAY,EAAE,EAAE,CAAC,IAAI,CAAA;;;;;;;;;MAS9D,kBAAkB,CAAC,OAAO;;;;;;;UAOtB,KAAK;;;;;;;;eAQA;IACP;QACE,QAAQ,EAAE,aAAa,CAAC,KAAK;QAC7B,QAAQ,EAAE,IAAI,CAAA,iCAAiC;QAC/C,OAAO,EAAE,YAAY;KACtB;IACD;QACE,QAAQ,EAAE,aAAa,CAAC,KAAK;QAC7B,QAAQ,EAAE,IAAI,CAAA,+BAA+B;QAC7C,OAAO,EAAE,YAAY;KACtB;IACD;QACE,QAAQ,EAAE,aAAa,CAAC,MAAM;QAC9B,QAAQ,EAAE,IAAI,CAAA;uBACD;YACT;gBACE,KAAK,EAAE,OAAO;gBACd,MAAM,EAAE,GAAG,EAAE,GAAE,CAAC;gBAChB,MAAM,EAAE,CAAC,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,CAAC;aAC3C;YACD;gBACE,KAAK,EAAE,MAAM;gBACb,MAAM,EAAE,GAAG,EAAE,GAAE,CAAC;gBAChB,IAAI,EAAE,MAAM;aACb;SACF;yCAC4B;KAChC;CACF;iBACU;IACT,UAAU,EAAE,IAAI;IAChB,UAAU,EAAE,IAAI;IAChB,OAAO,EAAE,KAAK;CACf;;;;;CAKN,CAAA;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACxC,OAAO,CAAC,IAAI,GAAG;IACb,KAAK,EAAE,sBAAsB;CAC9B,CAAA","sourcesContent":["import '@material/mwc-icon'\nimport '../src/layouts/ox-context-page-toolbar.js'\nimport '../src/tools/ox-page-action-context-bar.js'\nimport { CommonHeaderStyles } from '@operato/styles'\nimport { TOOL_POSITION } from '@operato/layout'\n\nimport '@operato/styles'\n\nimport { css, html, render, TemplateResult } from 'lit'\n\nexport default {\n title: 'ox-context-page-toolbar-select',\n component: 'ox-context-page-toolbar',\n argTypes: {\n label: { control: 'string' }\n }\n}\n\ninterface Story<T> {\n (args: T): TemplateResult\n args?: Partial<T>\n argTypes?: Record<string, unknown>\n}\n\ninterface ArgTypes {\n label?: string\n}\n\nconst Template: Story<ArgTypes> = ({ label = '' }: ArgTypes) => html`\n <link href=\"/themes/app-theme.css\" rel=\"stylesheet\" />\n <link href=\"https://fonts.googleapis.com/css?family=Material+Icons&display=block\" rel=\"stylesheet\" />\n\n <style>\n body {\n background-color: white;\n }\n\n ${CommonHeaderStyles.cssText}\n </style>\n\n <div style=\"height:600px;\">\n <div class=\"header\">\n <div class=\"title\">\n <mwc-icon>summarize</mwc-icon>\n ${label}\n </div>\n\n <div class=\"filters\">\n <label>Filter</label><input type=\"text\"></input>\n </div>\n\n <ox-context-page-toolbar class=\"actions\" \n .tools=${[\n {\n position: TOOL_POSITION.FRONT,\n template: html` <mwc-icon>download</mwc-icon> `,\n context: 'exportable'\n },\n {\n position: TOOL_POSITION.FRONT,\n template: html` <mwc-icon>upload</mwc-icon> `,\n context: 'importable'\n },\n {\n position: TOOL_POSITION.CENTER,\n template: html`<ox-page-action-context-bar\n .actions=${[\n {\n title: 'smile',\n action: () => {},\n select: ['', 'delete', 'hahaha', 'hohoho']\n },\n {\n title: 'save',\n action: () => {},\n icon: 'save'\n }\n ]}\n ></ox-page-action-context-bar>`\n }\n ]}\n .context=${{\n exportable: true,\n importable: true,\n toolbar: false\n }}\n \n }> </ox-context-page-toolbar>\n </div>\n </div>\n`\n\nexport const Regular = Template.bind({})\nRegular.args = {\n label: 'common header styles'\n}\n"]}
|