@operato/context 2.0.0-alpha.7 → 2.0.0-alpha.77

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.
Files changed (61) hide show
  1. package/CHANGELOG.md +382 -0
  2. package/demo/index.html +13 -2
  3. package/dist/src/layouts/ox-context-page-toolbar.d.ts +9 -4
  4. package/dist/src/layouts/ox-context-page-toolbar.js +30 -10
  5. package/dist/src/layouts/ox-context-page-toolbar.js.map +1 -1
  6. package/dist/src/layouts/ox-context-toolbar.d.ts +2 -2
  7. package/dist/src/layouts/ox-context-toolbar.js +98 -70
  8. package/dist/src/layouts/ox-context-toolbar.js.map +1 -1
  9. package/dist/src/styles/ox-context-toolbar-overlay-style.js +2 -2
  10. package/dist/src/styles/ox-context-toolbar-overlay-style.js.map +1 -1
  11. package/dist/src/tools/ox-page-action-context-bar.d.ts +12 -5
  12. package/dist/src/tools/ox-page-action-context-bar.js +74 -45
  13. package/dist/src/tools/ox-page-action-context-bar.js.map +1 -1
  14. package/dist/src/tools/ox-page-action-overlay-template.d.ts +2 -2
  15. package/dist/src/tools/ox-page-action-overlay-template.js +27 -21
  16. package/dist/src/tools/ox-page-action-overlay-template.js.map +1 -1
  17. package/dist/src/tools/ox-page-title-bar.d.ts +2 -2
  18. package/dist/src/tools/ox-page-title-bar.js +6 -8
  19. package/dist/src/tools/ox-page-title-bar.js.map +1 -1
  20. package/dist/src/tools/ox-title-bar.d.ts +2 -2
  21. package/dist/src/tools/ox-title-bar.js +6 -8
  22. package/dist/src/tools/ox-title-bar.js.map +1 -1
  23. package/dist/stories/ox-context-page-toolbar-select-buttons.stories.d.ts +25 -0
  24. package/dist/stories/ox-context-page-toolbar-select-buttons.stories.js +127 -0
  25. package/dist/stories/ox-context-page-toolbar-select-buttons.stories.js.map +1 -0
  26. package/dist/stories/ox-context-page-toolbar-select.stories.d.ts +24 -0
  27. package/dist/stories/ox-context-page-toolbar-select.stories.js +85 -0
  28. package/dist/stories/ox-context-page-toolbar-select.stories.js.map +1 -0
  29. package/dist/stories/ox-context-page-toolbar.stories.d.ts +24 -0
  30. package/dist/stories/ox-context-page-toolbar.stories.js +90 -0
  31. package/dist/stories/ox-context-page-toolbar.stories.js.map +1 -0
  32. package/dist/stories/ox-context-toolbar-complex.stories.d.ts +19 -0
  33. package/dist/stories/ox-context-toolbar-complex.stories.js +146 -0
  34. package/dist/stories/ox-context-toolbar-complex.stories.js.map +1 -0
  35. package/dist/stories/ox-context-toolbar-empty.stories.d.ts +19 -0
  36. package/dist/stories/ox-context-toolbar-empty.stories.js +48 -0
  37. package/dist/stories/ox-context-toolbar-empty.stories.js.map +1 -0
  38. package/dist/stories/ox-context-toolbar-overflow.stories.d.ts +19 -0
  39. package/dist/stories/ox-context-toolbar-overflow.stories.js +127 -0
  40. package/dist/stories/ox-context-toolbar-overflow.stories.js.map +1 -0
  41. package/dist/stories/ox-context-toolbar.stories.d.ts +19 -0
  42. package/dist/stories/ox-context-toolbar.stories.js +82 -0
  43. package/dist/stories/ox-context-toolbar.stories.js.map +1 -0
  44. package/dist/tsconfig.tsbuildinfo +1 -1
  45. package/package.json +20 -20
  46. package/src/layouts/ox-context-page-toolbar.ts +33 -10
  47. package/src/layouts/ox-context-toolbar.ts +98 -70
  48. package/src/styles/ox-context-toolbar-overlay-style.ts +2 -2
  49. package/src/tools/ox-page-action-context-bar.ts +102 -64
  50. package/src/tools/ox-page-action-overlay-template.ts +47 -41
  51. package/src/tools/ox-page-title-bar.ts +6 -8
  52. package/src/tools/ox-title-bar.ts +6 -8
  53. package/stories/ox-context-page-toolbar-select-buttons.stories.ts +141 -0
  54. package/stories/ox-context-page-toolbar-select.stories.ts +99 -0
  55. package/stories/ox-context-page-toolbar.stories.ts +104 -0
  56. package/stories/ox-context-toolbar-complex.stories.ts +158 -0
  57. package/stories/ox-context-toolbar-empty.stories.ts +61 -0
  58. package/stories/ox-context-toolbar-overflow.stories.ts +139 -0
  59. package/stories/ox-context-toolbar.stories.ts +94 -0
  60. package/themes/app-theme.css +145 -0
  61. package/themes/context-theme.css +74 -0
package/CHANGELOG.md CHANGED
@@ -3,6 +3,388 @@
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.77](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.76...v2.0.0-alpha.77) (2024-04-14)
7
+
8
+ **Note:** Version bump only for package @operato/context
9
+
10
+
11
+
12
+
13
+
14
+ ## [2.0.0-alpha.71](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.70...v2.0.0-alpha.71) (2024-04-13)
15
+
16
+ **Note:** Version bump only for package @operato/context
17
+
18
+
19
+
20
+
21
+
22
+ ## [2.0.0-alpha.69](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.68...v2.0.0-alpha.69) (2024-04-13)
23
+
24
+
25
+ ### :bug: Bug Fix
26
+
27
+ * mwc=>md for context ([972f5fd](https://github.com/hatiolab/operato/commit/972f5fd8da02820b6d6238cf1dd099591f97d8df))
28
+
29
+
30
+
31
+ ## [2.0.0-alpha.68](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.67...v2.0.0-alpha.68) (2024-04-13)
32
+
33
+
34
+ ### :bug: Bug Fix
35
+
36
+ * mwc=>md for context ([2bc13f2](https://github.com/hatiolab/operato/commit/2bc13f285f257782f73e5d7b5d1ddd197df85393))
37
+
38
+
39
+
40
+ ## [2.0.0-alpha.67](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.66...v2.0.0-alpha.67) (2024-04-13)
41
+
42
+
43
+ ### :bug: Bug Fix
44
+
45
+ * mwc=>md for context ([eacd9a5](https://github.com/hatiolab/operato/commit/eacd9a5b698969156f430f3d26233fdf7edccdf3))
46
+
47
+
48
+
49
+ ## [2.0.0-alpha.66](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.65...v2.0.0-alpha.66) (2024-04-13)
50
+
51
+
52
+ ### :bug: Bug Fix
53
+
54
+ * mwc=>md for context ([3d4217a](https://github.com/hatiolab/operato/commit/3d4217ae178ce568823697af2bdfbb244fda93c3))
55
+
56
+
57
+
58
+ ## [2.0.0-alpha.65](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.64...v2.0.0-alpha.65) (2024-04-13)
59
+
60
+
61
+ ### :bug: Bug Fix
62
+
63
+ * mwc=>md for context ([2b1a13b](https://github.com/hatiolab/operato/commit/2b1a13b9a214836ac7135717afd2dda536f1f487))
64
+
65
+
66
+
67
+ ## [2.0.0-alpha.64](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.63...v2.0.0-alpha.64) (2024-04-13)
68
+
69
+
70
+ ### :bug: Bug Fix
71
+
72
+ * context button style ([8b169de](https://github.com/hatiolab/operato/commit/8b169de8c18919c36e9e8a69059046046fb5293a))
73
+ * icon size ([b2e93e0](https://github.com/hatiolab/operato/commit/b2e93e04200145b2547edd11208ed6c895c156bc))
74
+ * mwc=>md for context ([269d5fe](https://github.com/hatiolab/operato/commit/269d5fedca38096ce41850afe88a17ed1fd656dd))
75
+
76
+
77
+
78
+ ## [2.0.0-alpha.63](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.62...v2.0.0-alpha.63) (2024-04-12)
79
+
80
+ **Note:** Version bump only for package @operato/context
81
+
82
+
83
+
84
+
85
+
86
+ ## [2.0.0-alpha.62](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.61...v2.0.0-alpha.62) (2024-04-12)
87
+
88
+
89
+ ### :bug: Bug Fix
90
+
91
+ * mwc=>md for context ([2a469f4](https://github.com/hatiolab/operato/commit/2a469f429544bd0cf9947a2efc381efafe8b0336))
92
+
93
+
94
+
95
+ ## [2.0.0-alpha.61](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.60...v2.0.0-alpha.61) (2024-04-11)
96
+
97
+ **Note:** Version bump only for package @operato/context
98
+
99
+
100
+
101
+
102
+
103
+ ## [2.0.0-alpha.60](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.59...v2.0.0-alpha.60) (2024-04-11)
104
+
105
+ **Note:** Version bump only for package @operato/context
106
+
107
+
108
+
109
+
110
+
111
+ ## [2.0.0-alpha.59](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.58...v2.0.0-alpha.59) (2024-04-11)
112
+
113
+ **Note:** Version bump only for package @operato/context
114
+
115
+
116
+
117
+
118
+
119
+ ## [2.0.0-alpha.57](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.56...v2.0.0-alpha.57) (2024-04-07)
120
+
121
+ **Note:** Version bump only for package @operato/context
122
+
123
+
124
+
125
+
126
+
127
+
128
+
129
+ **Note:** Version bump only for package @operato/context
130
+
131
+
132
+
133
+
134
+
135
+ ## [2.0.0-alpha.54](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.53...v2.0.0-alpha.54) (2024-04-01)
136
+
137
+ **Note:** Version bump only for package @operato/context
138
+
139
+
140
+
141
+
142
+
143
+ ## [2.0.0-alpha.53](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.52...v2.0.0-alpha.53) (2024-04-01)
144
+
145
+
146
+ ### :bug: Bug Fix
147
+
148
+ * storybook for ox-context-page-toolbar ([fa5b32d](https://github.com/hatiolab/operato/commit/fa5b32dfffd36db262e51c2706a5fbd719eed8ba))
149
+
150
+
151
+
152
+ ## [2.0.0-alpha.52](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.51...v2.0.0-alpha.52) (2024-03-29)
153
+
154
+ **Note:** Version bump only for package @operato/context
155
+
156
+
157
+
158
+
159
+
160
+ ## [2.0.0-alpha.51](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.50...v2.0.0-alpha.51) (2024-03-29)
161
+
162
+
163
+ ### :bug: Bug Fix
164
+
165
+ * upgrade lit ([e661c33](https://github.com/hatiolab/operato/commit/e661c333d2bb97f784b5ac2c0e365714ee5e80ff))
166
+
167
+
168
+
169
+ ## [2.0.0-alpha.49](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.48...v2.0.0-alpha.49) (2024-03-28)
170
+
171
+ **Note:** Version bump only for package @operato/context
172
+
173
+
174
+
175
+
176
+
177
+ ## [2.0.0-alpha.48](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.47...v2.0.0-alpha.48) (2024-03-28)
178
+
179
+
180
+ ### :bug: Bug Fix
181
+
182
+ * context module stories ([052ac6a](https://github.com/hatiolab/operato/commit/052ac6adc0c7cae6ddaff2babc3b344302e2aca8))
183
+
184
+
185
+
186
+ ## [2.0.0-alpha.47](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.46...v2.0.0-alpha.47) (2024-03-27)
187
+
188
+
189
+ ### :bug: Bug Fix
190
+
191
+ * storybook 실행 환경 ([6a2940f](https://github.com/hatiolab/operato/commit/6a2940fb89dc26566acdce7cf1781a71cbad61c5))
192
+
193
+
194
+
195
+ ## [2.0.0-alpha.46](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.45...v2.0.0-alpha.46) (2024-03-26)
196
+
197
+ **Note:** Version bump only for package @operato/context
198
+
199
+
200
+
201
+
202
+
203
+ ## [2.0.0-alpha.44](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.43...v2.0.0-alpha.44) (2024-03-24)
204
+
205
+ **Note:** Version bump only for package @operato/context
206
+
207
+
208
+
209
+
210
+
211
+ ## [2.0.0-alpha.43](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.42...v2.0.0-alpha.43) (2024-03-24)
212
+
213
+ **Note:** Version bump only for package @operato/context
214
+
215
+
216
+
217
+
218
+
219
+ ## [2.0.0-alpha.37](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.36...v2.0.0-alpha.37) (2024-03-18)
220
+
221
+ **Note:** Version bump only for package @operato/context
222
+
223
+
224
+
225
+
226
+
227
+ ## [2.0.0-alpha.35](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.34...v2.0.0-alpha.35) (2024-03-13)
228
+
229
+ **Note:** Version bump only for package @operato/context
230
+
231
+
232
+
233
+
234
+
235
+ ## [2.0.0-alpha.34](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.33...v2.0.0-alpha.34) (2024-03-12)
236
+
237
+ **Note:** Version bump only for package @operato/context
238
+
239
+
240
+
241
+
242
+
243
+ ## [2.0.0-alpha.32](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.31...v2.0.0-alpha.32) (2024-03-12)
244
+
245
+ **Note:** Version bump only for package @operato/context
246
+
247
+
248
+
249
+
250
+
251
+ ## [2.0.0-alpha.31](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.30...v2.0.0-alpha.31) (2024-03-03)
252
+
253
+ **Note:** Version bump only for package @operato/context
254
+
255
+
256
+
257
+
258
+
259
+ ## [2.0.0-alpha.30](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.29...v2.0.0-alpha.30) (2024-03-03)
260
+
261
+ **Note:** Version bump only for package @operato/context
262
+
263
+
264
+
265
+
266
+
267
+ ## [2.0.0-alpha.28](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.27...v2.0.0-alpha.28) (2024-02-20)
268
+
269
+
270
+ ### :bug: Bug Fix
271
+
272
+ * upgrade devDependencies for webcomponents ([1489b8b](https://github.com/hatiolab/operato/commit/1489b8b790d9bcee779a070a630697f25c01728f))
273
+
274
+
275
+
276
+ ## [2.0.0-alpha.27](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.26...v2.0.0-alpha.27) (2024-02-17)
277
+
278
+ **Note:** Version bump only for package @operato/context
279
+
280
+
281
+
282
+
283
+
284
+ ## [2.0.0-alpha.23](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.22...v2.0.0-alpha.23) (2024-02-10)
285
+
286
+ **Note:** Version bump only for package @operato/context
287
+
288
+
289
+
290
+
291
+
292
+ ## [2.0.0-alpha.22](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.21...v2.0.0-alpha.22) (2024-02-10)
293
+
294
+ **Note:** Version bump only for package @operato/context
295
+
296
+
297
+
298
+
299
+
300
+ ## [2.0.0-alpha.21](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.20...v2.0.0-alpha.21) (2024-02-09)
301
+
302
+ **Note:** Version bump only for package @operato/context
303
+
304
+
305
+
306
+
307
+
308
+ ## [2.0.0-alpha.20](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.19...v2.0.0-alpha.20) (2024-02-05)
309
+
310
+ **Note:** Version bump only for package @operato/context
311
+
312
+
313
+
314
+
315
+
316
+ ## [2.0.0-alpha.19](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.18...v2.0.0-alpha.19) (2024-02-05)
317
+
318
+ **Note:** Version bump only for package @operato/context
319
+
320
+
321
+
322
+
323
+
324
+ ## [2.0.0-alpha.17](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.16...v2.0.0-alpha.17) (2024-02-04)
325
+
326
+ **Note:** Version bump only for package @operato/context
327
+
328
+
329
+
330
+
331
+
332
+ ## [2.0.0-alpha.16](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.15...v2.0.0-alpha.16) (2024-02-03)
333
+
334
+ **Note:** Version bump only for package @operato/context
335
+
336
+
337
+
338
+
339
+
340
+ ## [2.0.0-alpha.13](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.12...v2.0.0-alpha.13) (2024-01-28)
341
+
342
+ **Note:** Version bump only for package @operato/context
343
+
344
+
345
+
346
+
347
+
348
+ ## [2.0.0-alpha.12](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.11...v2.0.0-alpha.12) (2024-01-24)
349
+
350
+ **Note:** Version bump only for package @operato/context
351
+
352
+
353
+
354
+
355
+
356
+ ## [2.0.0-alpha.11](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.10...v2.0.0-alpha.11) (2024-01-24)
357
+
358
+ **Note:** Version bump only for package @operato/context
359
+
360
+
361
+
362
+
363
+
364
+ ## [2.0.0-alpha.10](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.9...v2.0.0-alpha.10) (2024-01-22)
365
+
366
+ **Note:** Version bump only for package @operato/context
367
+
368
+
369
+
370
+
371
+
372
+ ## [2.0.0-alpha.9](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.8...v2.0.0-alpha.9) (2024-01-20)
373
+
374
+ **Note:** Version bump only for package @operato/context
375
+
376
+
377
+
378
+
379
+
380
+ ## [2.0.0-alpha.8](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.7...v2.0.0-alpha.8) (2024-01-20)
381
+
382
+ **Note:** Version bump only for package @operato/context
383
+
384
+
385
+
386
+
387
+
6
388
  ## [2.0.0-alpha.7](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.6...v2.0.0-alpha.7) (2024-01-15)
7
389
 
8
390
  **Note:** Version bump only for package @operato/context
package/demo/index.html CHANGED
@@ -1,4 +1,4 @@
1
- <!DOCTYPE html>
1
+ <!doctype html>
2
2
  <html lang="en-GB">
3
3
  <head>
4
4
  <meta charset="utf-8" />
@@ -16,7 +16,18 @@
16
16
  }
17
17
  </style>
18
18
  <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet" />
19
- <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
19
+ <link
20
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
21
+ rel="stylesheet"
22
+ />
23
+ <link
24
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
25
+ rel="stylesheet"
26
+ />
27
+ <link
28
+ href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
29
+ rel="stylesheet"
30
+ />
20
31
  </head>
21
32
  <body>
22
33
  <div id="demo"></div>
@@ -1,5 +1,6 @@
1
- import '@material/mwc-icon';
2
- import { LitElement } from 'lit';
1
+ import '@material/web/icon/icon.js';
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
- private tools?;
14
- render(): import("lit").TemplateResult<1>;
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
- import '@material/mwc-icon';
2
+ import '@material/web/icon/icon.js';
3
3
  import { css, html, LitElement, nothing } from 'lit';
4
- import { customElement, property, state } from 'lit/decorators.js';
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';
@@ -20,9 +20,7 @@ let ContextPageToolbar = class ContextPageToolbar extends connect(store)(LitElem
20
20
  --context-action-bar-button-margin: 0px;
21
21
  --context-action-bar-more-button-border-radius: 2px;
22
22
 
23
- --mdc-icon-size: 20px;
24
- --mdc-button-height: 20px;
25
- --mdc-button-horizontal-padding: 2px;
23
+ --md-icon-size: 20px;
26
24
  }
27
25
 
28
26
  :host > div {
@@ -30,17 +28,36 @@ let ContextPageToolbar = class ContextPageToolbar extends connect(store)(LitElem
30
28
  flex-direction: row;
31
29
 
32
30
  align-items: center;
31
+ gap: var(--padding-narrow);
33
32
  }
34
33
 
35
34
  * {
36
35
  cursor: pointer;
37
36
  }
38
37
 
39
- mwc-icon {
40
- background-color: var(--theme-white-color);
38
+ md-icon {
39
+ background-color: var(--button-background-color, #fafbfc);
41
40
  border: 1px solid rgba(var(--primary-color-rgb), 0.5);
42
- padding: 1px 2px;
41
+ border-radius: var(--button-border-radius);
42
+ padding: var(--iconbtn-padding, 4px);
43
+
43
44
  color: var(--primary-color);
45
+
46
+ &:hover {
47
+ background-color: var(--primary-color);
48
+
49
+ color: var(--theme-white-color);
50
+ }
51
+ }
52
+
53
+ @media screen and (max-width: 460px) {
54
+ :host > div {
55
+ gap: 0;
56
+ }
57
+
58
+ md-icon {
59
+ border-radius: 0;
60
+ }
44
61
  }
45
62
  `
46
63
  ];
@@ -74,14 +91,17 @@ let ContextPageToolbar = class ContextPageToolbar extends connect(store)(LitElem
74
91
  `;
75
92
  }
76
93
  stateChanged(state) {
77
- this.tools = state.context.tools;
94
+ var _a;
95
+ if (state.context) {
96
+ this.tools = (_a = state.context) === null || _a === void 0 ? void 0 : _a.tools;
97
+ }
78
98
  }
79
99
  };
80
100
  __decorate([
81
101
  property({ type: Object })
82
102
  ], ContextPageToolbar.prototype, "context", void 0);
83
103
  __decorate([
84
- state()
104
+ property({ type: Array })
85
105
  ], ContextPageToolbar.prototype, "tools", void 0);
86
106
  ContextPageToolbar = __decorate([
87
107
  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":"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","sourcesContent":["import '@material/mwc-icon'\n\nimport { css, html, LitElement, 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 @state() private tools?: any[]\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 this.tools = state.context.tools\n }\n}\n"]}
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/web/icon/icon.js'\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 --md-icon-size: 20px;\n }\n\n :host > div {\n display: flex;\n flex-direction: row;\n\n align-items: center;\n gap: var(--padding-narrow);\n }\n\n * {\n cursor: pointer;\n }\n\n md-icon {\n background-color: var(--button-background-color, #fafbfc);\n border: 1px solid rgba(var(--primary-color-rgb), 0.5);\n border-radius: var(--button-border-radius);\n padding: var(--iconbtn-padding, 4px);\n\n color: var(--primary-color);\n\n &:hover {\n background-color: var(--primary-color);\n\n color: var(--theme-white-color);\n }\n }\n\n @media screen and (max-width: 460px) {\n :host > div {\n gap: 0;\n }\n\n md-icon {\n border-radius: 0;\n }\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"]}
@@ -1,4 +1,4 @@
1
- import '@material/mwc-icon';
1
+ import '@material/web/icon/icon.js';
2
2
  import { LitElement, nothing } from 'lit';
3
3
  declare const ContextToolbar_base: (new (...args: any[]) => {
4
4
  _storeUnsubscribe: import("redux").Unsubscribe;
@@ -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 {};