@operato/help 2.0.0-alpha.9 → 2.0.0-alpha.90

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 CHANGED
@@ -3,6 +3,403 @@
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.90](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.89...v2.0.0-alpha.90) (2024-04-18)
7
+
8
+ **Note:** Version bump only for package @operato/help
9
+
10
+
11
+
12
+
13
+
14
+ ## [2.0.0-alpha.89](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.88...v2.0.0-alpha.89) (2024-04-18)
15
+
16
+ **Note:** Version bump only for package @operato/help
17
+
18
+
19
+
20
+
21
+
22
+ ## [2.0.0-alpha.88](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.87...v2.0.0-alpha.88) (2024-04-18)
23
+
24
+ **Note:** Version bump only for package @operato/help
25
+
26
+
27
+
28
+
29
+
30
+ ## [2.0.0-alpha.87](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.86...v2.0.0-alpha.87) (2024-04-17)
31
+
32
+ **Note:** Version bump only for package @operato/help
33
+
34
+
35
+
36
+
37
+
38
+ ## [2.0.0-alpha.86](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.85...v2.0.0-alpha.86) (2024-04-16)
39
+
40
+ **Note:** Version bump only for package @operato/help
41
+
42
+
43
+
44
+
45
+
46
+ ## [2.0.0-alpha.85](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.84...v2.0.0-alpha.85) (2024-04-16)
47
+
48
+ **Note:** Version bump only for package @operato/help
49
+
50
+
51
+
52
+
53
+
54
+ ## [2.0.0-alpha.82](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.81...v2.0.0-alpha.82) (2024-04-15)
55
+
56
+ **Note:** Version bump only for package @operato/help
57
+
58
+
59
+
60
+
61
+
62
+ ## [2.0.0-alpha.81](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.80...v2.0.0-alpha.81) (2024-04-15)
63
+
64
+ **Note:** Version bump only for package @operato/help
65
+
66
+
67
+
68
+
69
+
70
+ ## [2.0.0-alpha.80](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.79...v2.0.0-alpha.80) (2024-04-15)
71
+
72
+ **Note:** Version bump only for package @operato/help
73
+
74
+
75
+
76
+
77
+
78
+ ## [2.0.0-alpha.77](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.76...v2.0.0-alpha.77) (2024-04-14)
79
+
80
+ **Note:** Version bump only for package @operato/help
81
+
82
+
83
+
84
+
85
+
86
+ ## [2.0.0-alpha.71](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.70...v2.0.0-alpha.71) (2024-04-13)
87
+
88
+
89
+ ### :bug: Bug Fix
90
+
91
+ * help-panel style ([31aad28](https://github.com/hatiolab/operato/commit/31aad28dc730e8f2dbe4ec8a8318639175795a45))
92
+
93
+
94
+
95
+ ## [2.0.0-alpha.69](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.68...v2.0.0-alpha.69) (2024-04-13)
96
+
97
+
98
+ ### :bug: Bug Fix
99
+
100
+ * mwc=>md for context ([972f5fd](https://github.com/hatiolab/operato/commit/972f5fd8da02820b6d6238cf1dd099591f97d8df))
101
+
102
+
103
+
104
+ ## [2.0.0-alpha.68](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.67...v2.0.0-alpha.68) (2024-04-13)
105
+
106
+
107
+ ### :bug: Bug Fix
108
+
109
+ * mwc=>md for context ([2bc13f2](https://github.com/hatiolab/operato/commit/2bc13f285f257782f73e5d7b5d1ddd197df85393))
110
+
111
+
112
+
113
+ ## [2.0.0-alpha.64](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.63...v2.0.0-alpha.64) (2024-04-13)
114
+
115
+ **Note:** Version bump only for package @operato/help
116
+
117
+
118
+
119
+
120
+
121
+ ## [2.0.0-alpha.63](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.62...v2.0.0-alpha.63) (2024-04-12)
122
+
123
+ **Note:** Version bump only for package @operato/help
124
+
125
+
126
+
127
+
128
+
129
+ ## [2.0.0-alpha.62](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.61...v2.0.0-alpha.62) (2024-04-12)
130
+
131
+ **Note:** Version bump only for package @operato/help
132
+
133
+
134
+
135
+
136
+
137
+ ## [2.0.0-alpha.61](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.60...v2.0.0-alpha.61) (2024-04-11)
138
+
139
+ **Note:** Version bump only for package @operato/help
140
+
141
+
142
+
143
+
144
+
145
+ ## [2.0.0-alpha.60](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.59...v2.0.0-alpha.60) (2024-04-11)
146
+
147
+ **Note:** Version bump only for package @operato/help
148
+
149
+
150
+
151
+
152
+
153
+ ## [2.0.0-alpha.59](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.58...v2.0.0-alpha.59) (2024-04-11)
154
+
155
+ **Note:** Version bump only for package @operato/help
156
+
157
+
158
+
159
+
160
+
161
+ ## [2.0.0-alpha.57](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.56...v2.0.0-alpha.57) (2024-04-07)
162
+
163
+ **Note:** Version bump only for package @operato/help
164
+
165
+
166
+
167
+
168
+
169
+
170
+
171
+ **Note:** Version bump only for package @operato/help
172
+
173
+
174
+
175
+
176
+
177
+ ## [2.0.0-alpha.54](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.53...v2.0.0-alpha.54) (2024-04-01)
178
+
179
+ **Note:** Version bump only for package @operato/help
180
+
181
+
182
+
183
+
184
+
185
+ ## [2.0.0-alpha.52](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.51...v2.0.0-alpha.52) (2024-03-29)
186
+
187
+ **Note:** Version bump only for package @operato/help
188
+
189
+
190
+
191
+
192
+
193
+ ## [2.0.0-alpha.51](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.50...v2.0.0-alpha.51) (2024-03-29)
194
+
195
+
196
+ ### :bug: Bug Fix
197
+
198
+ * upgrade lit ([e661c33](https://github.com/hatiolab/operato/commit/e661c333d2bb97f784b5ac2c0e365714ee5e80ff))
199
+
200
+
201
+
202
+ ## [2.0.0-alpha.49](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.48...v2.0.0-alpha.49) (2024-03-28)
203
+
204
+ **Note:** Version bump only for package @operato/help
205
+
206
+
207
+
208
+
209
+
210
+ ## [2.0.0-alpha.48](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.47...v2.0.0-alpha.48) (2024-03-28)
211
+
212
+ **Note:** Version bump only for package @operato/help
213
+
214
+
215
+
216
+
217
+
218
+ ## [2.0.0-alpha.47](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.46...v2.0.0-alpha.47) (2024-03-27)
219
+
220
+ **Note:** Version bump only for package @operato/help
221
+
222
+
223
+
224
+
225
+
226
+ ## [2.0.0-alpha.46](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.45...v2.0.0-alpha.46) (2024-03-26)
227
+
228
+ **Note:** Version bump only for package @operato/help
229
+
230
+
231
+
232
+
233
+
234
+ ## [2.0.0-alpha.44](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.43...v2.0.0-alpha.44) (2024-03-24)
235
+
236
+ **Note:** Version bump only for package @operato/help
237
+
238
+
239
+
240
+
241
+
242
+ ## [2.0.0-alpha.43](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.42...v2.0.0-alpha.43) (2024-03-24)
243
+
244
+ **Note:** Version bump only for package @operato/help
245
+
246
+
247
+
248
+
249
+
250
+ ## [2.0.0-alpha.37](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.36...v2.0.0-alpha.37) (2024-03-18)
251
+
252
+ **Note:** Version bump only for package @operato/help
253
+
254
+
255
+
256
+
257
+
258
+ ## [2.0.0-alpha.35](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.34...v2.0.0-alpha.35) (2024-03-13)
259
+
260
+ **Note:** Version bump only for package @operato/help
261
+
262
+
263
+
264
+
265
+
266
+ ## [2.0.0-alpha.34](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.33...v2.0.0-alpha.34) (2024-03-12)
267
+
268
+ **Note:** Version bump only for package @operato/help
269
+
270
+
271
+
272
+
273
+
274
+ ## [2.0.0-alpha.32](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.31...v2.0.0-alpha.32) (2024-03-12)
275
+
276
+ **Note:** Version bump only for package @operato/help
277
+
278
+
279
+
280
+
281
+
282
+ ## [2.0.0-alpha.31](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.30...v2.0.0-alpha.31) (2024-03-03)
283
+
284
+ **Note:** Version bump only for package @operato/help
285
+
286
+
287
+
288
+
289
+
290
+ ## [2.0.0-alpha.30](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.29...v2.0.0-alpha.30) (2024-03-03)
291
+
292
+ **Note:** Version bump only for package @operato/help
293
+
294
+
295
+
296
+
297
+
298
+ ## [2.0.0-alpha.28](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.27...v2.0.0-alpha.28) (2024-02-20)
299
+
300
+
301
+ ### :bug: Bug Fix
302
+
303
+ * upgrade devDependencies for webcomponents ([1489b8b](https://github.com/hatiolab/operato/commit/1489b8b790d9bcee779a070a630697f25c01728f))
304
+
305
+
306
+
307
+ ## [2.0.0-alpha.27](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.26...v2.0.0-alpha.27) (2024-02-17)
308
+
309
+ **Note:** Version bump only for package @operato/help
310
+
311
+
312
+
313
+
314
+
315
+ ## [2.0.0-alpha.23](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.22...v2.0.0-alpha.23) (2024-02-10)
316
+
317
+ **Note:** Version bump only for package @operato/help
318
+
319
+
320
+
321
+
322
+
323
+ ## [2.0.0-alpha.22](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.21...v2.0.0-alpha.22) (2024-02-10)
324
+
325
+ **Note:** Version bump only for package @operato/help
326
+
327
+
328
+
329
+
330
+
331
+ ## [2.0.0-alpha.21](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.20...v2.0.0-alpha.21) (2024-02-09)
332
+
333
+ **Note:** Version bump only for package @operato/help
334
+
335
+
336
+
337
+
338
+
339
+ ## [2.0.0-alpha.20](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.19...v2.0.0-alpha.20) (2024-02-05)
340
+
341
+ **Note:** Version bump only for package @operato/help
342
+
343
+
344
+
345
+
346
+
347
+ ## [2.0.0-alpha.19](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.18...v2.0.0-alpha.19) (2024-02-05)
348
+
349
+ **Note:** Version bump only for package @operato/help
350
+
351
+
352
+
353
+
354
+
355
+ ## [2.0.0-alpha.17](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.16...v2.0.0-alpha.17) (2024-02-04)
356
+
357
+ **Note:** Version bump only for package @operato/help
358
+
359
+
360
+
361
+
362
+
363
+ ## [2.0.0-alpha.16](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.15...v2.0.0-alpha.16) (2024-02-03)
364
+
365
+ **Note:** Version bump only for package @operato/help
366
+
367
+
368
+
369
+
370
+
371
+ ## [2.0.0-alpha.13](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.12...v2.0.0-alpha.13) (2024-01-28)
372
+
373
+ **Note:** Version bump only for package @operato/help
374
+
375
+
376
+
377
+
378
+
379
+ ## [2.0.0-alpha.12](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.11...v2.0.0-alpha.12) (2024-01-24)
380
+
381
+ **Note:** Version bump only for package @operato/help
382
+
383
+
384
+
385
+
386
+
387
+ ## [2.0.0-alpha.11](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.10...v2.0.0-alpha.11) (2024-01-24)
388
+
389
+ **Note:** Version bump only for package @operato/help
390
+
391
+
392
+
393
+
394
+
395
+ ## [2.0.0-alpha.10](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.9...v2.0.0-alpha.10) (2024-01-22)
396
+
397
+ **Note:** Version bump only for package @operato/help
398
+
399
+
400
+
401
+
402
+
6
403
  ## [2.0.0-alpha.9](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.8...v2.0.0-alpha.9) (2024-01-20)
7
404
 
8
405
  **Note:** Version bump only for package @operato/help
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,4 +1,4 @@
1
- import '@material/mwc-icon';
1
+ import '@material/web/icon/icon.js';
2
2
  import { LitElement } from 'lit';
3
3
  export declare class HelpIcon extends LitElement {
4
4
  static styles: import("lit").CSSResult;
@@ -6,5 +6,5 @@ export declare class HelpIcon extends LitElement {
6
6
  onclick: (e: Event) => void;
7
7
  onmousedown: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
8
8
  onmouseup: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
9
- render(): import("lit").TemplateResult<1>;
9
+ render(): import("lit-html").TemplateResult<1>;
10
10
  }
@@ -1,5 +1,5 @@
1
1
  import { __decorate } from "tslib";
2
- import '@material/mwc-icon';
2
+ import '@material/web/icon/icon.js';
3
3
  import { css, html, LitElement } from 'lit';
4
4
  import { customElement, property } from 'lit/decorators.js';
5
5
  import { openHelp } from '../controller/help.js';
@@ -19,23 +19,24 @@ let HelpIcon = class HelpIcon extends LitElement {
19
19
  }
20
20
  render() {
21
21
  const topic = this.topic;
22
- return html `${topic ? html `<mwc-icon>help</mwc-icon>` : html ``}`;
22
+ return html `${topic ? html `<md-icon>help</md-icon>` : html ``}`;
23
23
  }
24
24
  };
25
25
  HelpIcon.styles = css `
26
- mwc-icon {
26
+ md-icon {
27
27
  position: relative;
28
28
  top: 4px;
29
29
  cursor: help;
30
30
  opacity: var(--help-icon-opacity);
31
31
  color: var(--help-icon-color);
32
- font-size: var(--help-icon-size);
33
32
  line-height: 0;
34
- }
35
33
 
36
- mwc-icon:hover {
37
- opacity: var(--help-icon-hover-opacity);
38
- color: var(--help-icon-hover-color);
34
+ --md-icon-size: var(--help-icon-size);
35
+
36
+ &:hover {
37
+ opacity: var(--help-icon-hover-opacity);
38
+ color: var(--help-icon-hover-color);
39
+ }
39
40
  }
40
41
  `;
41
42
  __decorate([
@@ -1 +1 @@
1
- {"version":3,"file":"ox-help-icon.js","sourceRoot":"","sources":["../../../src/components/ox-help-icon.ts"],"names":[],"mappings":";AAAA,OAAO,oBAAoB,CAAA;AAE3B,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAGzC,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,UAAU;IAAjC;;QAoBL,YAAO,GAAG,CAAC,CAAQ,EAAE,EAAE;YACrB,CAAC,CAAC,eAAe,EAAE,CAAA;YAEnB,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QACtB,CAAC,CAAA;QAED,gBAAW,GAAgE,CAAC,CAAQ,EAAE,EAAE;YACtF,CAAC,CAAC,eAAe,EAAE,CAAA;QACrB,CAAC,CAAA;QAED,cAAS,GAAgE,CAAC,CAAQ,EAAE,EAAE;YACpF,CAAC,CAAC,eAAe,EAAE,CAAA;QACrB,CAAC,CAAA;IAOH,CAAC;IALC,MAAM;QACJ,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAA;QAExB,OAAO,IAAI,CAAA,GAAG,KAAK,CAAC,CAAC,CAAC,IAAI,CAAA,2BAA2B,CAAC,CAAC,CAAC,IAAI,CAAA,EAAE,EAAE,CAAA;IAClE,CAAC;;AArCM,eAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;GAelB,AAfY,CAeZ;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uCAAe;AAlB/B,QAAQ;IADpB,aAAa,CAAC,cAAc,CAAC;GACjB,QAAQ,CAuCpB","sourcesContent":["import '@material/mwc-icon'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { openHelp } from '../controller/help.js'\n\n@customElement('ox-help-icon')\nexport class HelpIcon extends LitElement {\n static styles = css`\n mwc-icon {\n position: relative;\n top: 4px;\n cursor: help;\n opacity: var(--help-icon-opacity);\n color: var(--help-icon-color);\n font-size: var(--help-icon-size);\n line-height: 0;\n }\n\n mwc-icon:hover {\n opacity: var(--help-icon-hover-opacity);\n color: var(--help-icon-hover-color);\n }\n `\n\n @property({ type: String }) topic!: string\n\n onclick = (e: Event) => {\n e.stopPropagation()\n\n openHelp(this.topic)\n }\n\n onmousedown: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null = (e: Event) => {\n e.stopPropagation()\n }\n\n onmouseup: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null = (e: Event) => {\n e.stopPropagation()\n }\n\n render() {\n const topic = this.topic\n\n return html`${topic ? html`<mwc-icon>help</mwc-icon>` : html``}`\n }\n}\n"]}
1
+ {"version":3,"file":"ox-help-icon.js","sourceRoot":"","sources":["../../../src/components/ox-help-icon.ts"],"names":[],"mappings":";AAAA,OAAO,4BAA4B,CAAA;AAEnC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAGzC,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,UAAU;IAAjC;;QAqBL,YAAO,GAAG,CAAC,CAAQ,EAAE,EAAE;YACrB,CAAC,CAAC,eAAe,EAAE,CAAA;YAEnB,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QACtB,CAAC,CAAA;QAED,gBAAW,GAAgE,CAAC,CAAQ,EAAE,EAAE;YACtF,CAAC,CAAC,eAAe,EAAE,CAAA;QACrB,CAAC,CAAA;QAED,cAAS,GAAgE,CAAC,CAAQ,EAAE,EAAE;YACpF,CAAC,CAAC,eAAe,EAAE,CAAA;QACrB,CAAC,CAAA;IAOH,CAAC;IALC,MAAM;QACJ,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAA;QAExB,OAAO,IAAI,CAAA,GAAG,KAAK,CAAC,CAAC,CAAC,IAAI,CAAA,yBAAyB,CAAC,CAAC,CAAC,IAAI,CAAA,EAAE,EAAE,CAAA;IAChE,CAAC;;AAtCM,eAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;GAgBlB,AAhBY,CAgBZ;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uCAAe;AAnB/B,QAAQ;IADpB,aAAa,CAAC,cAAc,CAAC;GACjB,QAAQ,CAwCpB","sourcesContent":["import '@material/web/icon/icon.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { openHelp } from '../controller/help.js'\n\n@customElement('ox-help-icon')\nexport class HelpIcon extends LitElement {\n static styles = css`\n md-icon {\n position: relative;\n top: 4px;\n cursor: help;\n opacity: var(--help-icon-opacity);\n color: var(--help-icon-color);\n line-height: 0;\n\n --md-icon-size: var(--help-icon-size);\n\n &:hover {\n opacity: var(--help-icon-hover-opacity);\n color: var(--help-icon-hover-color);\n }\n }\n `\n\n @property({ type: String }) topic!: string\n\n onclick = (e: Event) => {\n e.stopPropagation()\n\n openHelp(this.topic)\n }\n\n onmousedown: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null = (e: Event) => {\n e.stopPropagation()\n }\n\n onmouseup: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null = (e: Event) => {\n e.stopPropagation()\n }\n\n render() {\n const topic = this.topic\n\n return html`${topic ? html`<md-icon>help</md-icon>` : html``}`\n }\n}\n"]}
@@ -3,6 +3,6 @@ export declare class InlineHelp extends LitElement {
3
3
  static styles: import("lit").CSSResult;
4
4
  topic: string;
5
5
  type: string;
6
- render(): import("lit").TemplateResult<1>;
6
+ render(): import("lit-html").TemplateResult<1>;
7
7
  connectedCallback(): void;
8
8
  }
@@ -1,10 +1,10 @@
1
- import '@material/mwc-icon';
1
+ import '@material/web/icon/icon.js';
2
2
  import { LitElement } from 'lit';
3
3
  declare const TitleWithHelp_base: (new (...args: any[]) => LitElement) & typeof LitElement;
4
4
  export declare class TitleWithHelp extends TitleWithHelp_base {
5
5
  static styles: import("lit").CSSResult;
6
6
  msgid: string;
7
7
  topic: string;
8
- render(): import("lit").TemplateResult<1>;
8
+ render(): import("lit-html").TemplateResult<1>;
9
9
  }
10
10
  export {};
@@ -1,5 +1,5 @@
1
1
  import { __decorate } from "tslib";
2
- import '@material/mwc-icon';
2
+ import '@material/web/icon/icon.js';
3
3
  import { css, html, LitElement } from 'lit';
4
4
  import { customElement, property } from 'lit/decorators.js';
5
5
  import { i18next, localize } from '@operato/i18n';
@@ -8,22 +8,24 @@ let TitleWithHelp = class TitleWithHelp extends localize(i18next)(LitElement) {
8
8
  render() {
9
9
  const title = i18next.t(this.msgid);
10
10
  const topic = this.topic;
11
- return html ` ${title} ${topic ? html `<mwc-icon @click=${() => openHelp(topic)}>help</mwc-icon>` : html ``} `;
11
+ return html ` ${title} ${topic ? html `<md-icon @click=${() => openHelp(topic)}>help</md-icon>` : html ``} `;
12
12
  }
13
13
  };
14
14
  TitleWithHelp.styles = css `
15
- mwc-icon {
15
+ md-icon {
16
16
  position: relative;
17
17
  top: 4px;
18
18
  cursor: help;
19
19
  opacity: var(--help-icon-opacity);
20
20
  color: var(--help-icon-color);
21
- font-size: var(--help-icon-size);
22
21
  line-height: 0;
23
- }
24
- mwc-icon:hover {
25
- opacity: var(--help-icon-hover-opacity);
26
- color: var(--help-icon-hover-color);
22
+
23
+ --md-icon-size: var(--help-icon-size);
24
+
25
+ &:hover {
26
+ opacity: var(--help-icon-hover-opacity);
27
+ color: var(--help-icon-hover-color);
28
+ }
27
29
  }
28
30
  `;
29
31
  __decorate([
@@ -1 +1 @@
1
- {"version":3,"file":"ox-title-with-help.js","sourceRoot":"","sources":["../../../src/components/ox-title-with-help.ts"],"names":[],"mappings":";AAAA,OAAO,oBAAoB,CAAA;AAE3B,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAEjD,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAGzC,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,QAAQ,CAAC,OAAO,CAAC,CAAC,UAAU,CAAC;IAoB9D,MAAM;QACJ,MAAM,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QACnC,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAA;QAExB,OAAO,IAAI,CAAA,IAAI,KAAK,IAAI,KAAK,CAAC,CAAC,CAAC,IAAI,CAAA,oBAAoB,GAAG,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,kBAAkB,CAAC,CAAC,CAAC,IAAI,CAAA,EAAE,GAAG,CAAA;IAC7G,CAAC;;AAxBM,oBAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;GAclB,AAdY,CAcZ;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAe;AACd;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAe;AAlB/B,aAAa;IADzB,aAAa,CAAC,oBAAoB,CAAC;GACvB,aAAa,CA0BzB","sourcesContent":["import '@material/mwc-icon'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\n\nimport { openHelp } from '../controller/help.js'\n\n@customElement('ox-title-with-help')\nexport class TitleWithHelp extends localize(i18next)(LitElement) {\n static styles = css`\n mwc-icon {\n position: relative;\n top: 4px;\n cursor: help;\n opacity: var(--help-icon-opacity);\n color: var(--help-icon-color);\n font-size: var(--help-icon-size);\n line-height: 0;\n }\n mwc-icon:hover {\n opacity: var(--help-icon-hover-opacity);\n color: var(--help-icon-hover-color);\n }\n `\n\n @property({ type: String }) msgid!: string\n @property({ type: String }) topic!: string\n\n render() {\n const title = i18next.t(this.msgid)\n const topic = this.topic\n\n return html` ${title} ${topic ? html`<mwc-icon @click=${() => openHelp(topic)}>help</mwc-icon>` : html``} `\n }\n}\n"]}
1
+ {"version":3,"file":"ox-title-with-help.js","sourceRoot":"","sources":["../../../src/components/ox-title-with-help.ts"],"names":[],"mappings":";AAAA,OAAO,4BAA4B,CAAA;AAEnC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAEjD,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAGzC,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,QAAQ,CAAC,OAAO,CAAC,CAAC,UAAU,CAAC;IAsB9D,MAAM;QACJ,MAAM,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QACnC,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAA;QAExB,OAAO,IAAI,CAAA,IAAI,KAAK,IAAI,KAAK,CAAC,CAAC,CAAC,IAAI,CAAA,mBAAmB,GAAG,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,iBAAiB,CAAC,CAAC,CAAC,IAAI,CAAA,EAAE,GAAG,CAAA;IAC3G,CAAC;;AA1BM,oBAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;GAgBlB,AAhBY,CAgBZ;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAe;AACd;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAe;AApB/B,aAAa;IADzB,aAAa,CAAC,oBAAoB,CAAC;GACvB,aAAa,CA4BzB","sourcesContent":["import '@material/web/icon/icon.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\n\nimport { openHelp } from '../controller/help.js'\n\n@customElement('ox-title-with-help')\nexport class TitleWithHelp extends localize(i18next)(LitElement) {\n static styles = css`\n md-icon {\n position: relative;\n top: 4px;\n cursor: help;\n opacity: var(--help-icon-opacity);\n color: var(--help-icon-color);\n line-height: 0;\n\n --md-icon-size: var(--help-icon-size);\n\n &:hover {\n opacity: var(--help-icon-hover-opacity);\n color: var(--help-icon-hover-color);\n }\n }\n `\n\n @property({ type: String }) msgid!: string\n @property({ type: String }) topic!: string\n\n render() {\n const title = i18next.t(this.msgid)\n const topic = this.topic\n\n return html` ${title} ${topic ? html`<md-icon @click=${() => openHelp(topic)}>help</md-icon>` : html``} `\n }\n}\n"]}
@@ -21,7 +21,7 @@ export const HelpStyle = css `
21
21
  font-size: var(--help-panel-h3-title-font-size);
22
22
  color: var(--help-panel-h3-title-color);
23
23
  }
24
- mwc-icon {
24
+ md-icon {
25
25
  vertical-align: middle;
26
26
  }
27
27
 
@@ -91,9 +91,10 @@ export const HelpStyle = css `
91
91
  font-size: var(--fontsize-default);
92
92
  text-decoration: underline;
93
93
  }
94
- a mwc-icon {
95
- font-size: var(--help-panel-a-icon-size);
94
+ a md-icon {
96
95
  margin: 0;
96
+
97
+ --md-icon-size: var(--help-panel-a-icon-size);
97
98
  }
98
99
  a:hover {
99
100
  background-color: var(--opacity-light-dark-color);
@@ -1 +1 @@
1
- {"version":3,"file":"help-style.js","sourceRoot":"","sources":["../../src/help-style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuH3B,CAAA","sourcesContent":["import { css } from 'lit'\n\nexport const HelpStyle = css`\n h1 {\n background-color: var(--help-panel-title-background-color);\n margin: var(--help-panel-title-margin);\n padding: var(--help-panel-title-padding);\n font-size: var(--help-panel-h1-title-font-size);\n text-transform: capitalize;\n color: var(--help-panel-h1-title-color);\n }\n h2 {\n margin: var(--help-panel-title-margin);\n padding: var(--help-panel-title-padding);\n font-size: var(--help-panel-h2-title-font-size);\n color: var(--help-panel-h2-title-color);\n text-transform: capitalize;\n }\n h3 {\n margin: var(--help-panel-title-margin);\n padding: var(--help-panel-title-padding);\n font-size: var(--help-panel-h3-title-font-size);\n color: var(--help-panel-h3-title-color);\n }\n mwc-icon {\n vertical-align: middle;\n }\n\n img {\n display: block;\n margin: var(--margin-narrow) var(--margin-default);\n max-width: 100%;\n }\n img[src*='#icon25'] {\n width: 25px;\n height: 25px;\n }\n img[src*='#icon50'] {\n width: 50px;\n height: 50px;\n }\n img[src*='#icon100'] {\n width: 100px;\n height: 100px;\n }\n img[src*='#icon25inlined'],\n img[src*='#icon50inlined'],\n img[src*='#icon100inlined'] {\n display: inline-block;\n margin: var(--margin-narrow);\n }\n p {\n margin: var(--help-panel-paragraph-margin);\n font-size: var(--help-panel-font-size);\n }\n [focusBox] {\n display: block;\n padding: var(--help-panel-focusBox-padding);\n border: var(--help-panel-focusBox-border);\n border-radius: var(--help-panel-focusBox-border-radius);\n background-color: var(--help-panel-focusBox-background-color);\n color: var(--help-panel-focusBox-color);\n }\n\n [subtitle] {\n font-weight: bold;\n }\n [subtitle]::before {\n content: '';\n width: 7px;\n height: 7px;\n display: inline-block;\n border: 3px solid var(--theme-white-color);\n border-radius: 50%;\n margin-right: var(--margin-narrow);\n }\n p + ol,\n p + ul {\n font-size: var(--help-panel-content-font-size);\n }\n ol,\n ul {\n padding: 0 0 0 30px;\n }\n ol li,\n ul li {\n margin: 0 0 2px 0;\n }\n a {\n margin-bottom: 0 !important;\n color: var(--help-panel-a-color);\n font-size: var(--fontsize-default);\n text-decoration: underline;\n }\n a mwc-icon {\n font-size: var(--help-panel-a-icon-size);\n margin: 0;\n }\n a:hover {\n background-color: var(--opacity-light-dark-color);\n font-weight: bold;\n }\n\n table {\n border-collapse: collapse;\n border: var(--border-dark-color);\n font-size: 0.9em;\n }\n th {\n border-top: 3px solid var(--primary-color);\n background-color: var(--main-section-background-color);\n color: var(--secondary-color);\n }\n th,\n td {\n border-bottom: var(--border-dark-color);\n padding: var(--padding-narrow);\n }\n tr:nth-child(even) {\n background-color: #f6f6f6;\n }\n`\n"]}
1
+ {"version":3,"file":"help-style.js","sourceRoot":"","sources":["../../src/help-style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwH3B,CAAA","sourcesContent":["import { css } from 'lit'\n\nexport const HelpStyle = css`\n h1 {\n background-color: var(--help-panel-title-background-color);\n margin: var(--help-panel-title-margin);\n padding: var(--help-panel-title-padding);\n font-size: var(--help-panel-h1-title-font-size);\n text-transform: capitalize;\n color: var(--help-panel-h1-title-color);\n }\n h2 {\n margin: var(--help-panel-title-margin);\n padding: var(--help-panel-title-padding);\n font-size: var(--help-panel-h2-title-font-size);\n color: var(--help-panel-h2-title-color);\n text-transform: capitalize;\n }\n h3 {\n margin: var(--help-panel-title-margin);\n padding: var(--help-panel-title-padding);\n font-size: var(--help-panel-h3-title-font-size);\n color: var(--help-panel-h3-title-color);\n }\n md-icon {\n vertical-align: middle;\n }\n\n img {\n display: block;\n margin: var(--margin-narrow) var(--margin-default);\n max-width: 100%;\n }\n img[src*='#icon25'] {\n width: 25px;\n height: 25px;\n }\n img[src*='#icon50'] {\n width: 50px;\n height: 50px;\n }\n img[src*='#icon100'] {\n width: 100px;\n height: 100px;\n }\n img[src*='#icon25inlined'],\n img[src*='#icon50inlined'],\n img[src*='#icon100inlined'] {\n display: inline-block;\n margin: var(--margin-narrow);\n }\n p {\n margin: var(--help-panel-paragraph-margin);\n font-size: var(--help-panel-font-size);\n }\n [focusBox] {\n display: block;\n padding: var(--help-panel-focusBox-padding);\n border: var(--help-panel-focusBox-border);\n border-radius: var(--help-panel-focusBox-border-radius);\n background-color: var(--help-panel-focusBox-background-color);\n color: var(--help-panel-focusBox-color);\n }\n\n [subtitle] {\n font-weight: bold;\n }\n [subtitle]::before {\n content: '';\n width: 7px;\n height: 7px;\n display: inline-block;\n border: 3px solid var(--theme-white-color);\n border-radius: 50%;\n margin-right: var(--margin-narrow);\n }\n p + ol,\n p + ul {\n font-size: var(--help-panel-content-font-size);\n }\n ol,\n ul {\n padding: 0 0 0 30px;\n }\n ol li,\n ul li {\n margin: 0 0 2px 0;\n }\n a {\n margin-bottom: 0 !important;\n color: var(--help-panel-a-color);\n font-size: var(--fontsize-default);\n text-decoration: underline;\n }\n a md-icon {\n margin: 0;\n\n --md-icon-size: var(--help-panel-a-icon-size);\n }\n a:hover {\n background-color: var(--opacity-light-dark-color);\n font-weight: bold;\n }\n\n table {\n border-collapse: collapse;\n border: var(--border-dark-color);\n font-size: 0.9em;\n }\n th {\n border-top: 3px solid var(--primary-color);\n background-color: var(--main-section-background-color);\n color: var(--secondary-color);\n }\n th,\n td {\n border-bottom: var(--border-dark-color);\n padding: var(--padding-narrow);\n }\n tr:nth-child(even) {\n background-color: #f6f6f6;\n }\n`\n"]}
@@ -1 +1 @@
1
- import '@material/mwc-icon-button';
1
+ import '@material/web/icon/icon.js';
@@ -1,5 +1,5 @@
1
1
  import { __decorate } from "tslib";
2
- import '@material/mwc-icon-button';
2
+ import '@material/web/icon/icon.js';
3
3
  import { css, html } from 'lit';
4
4
  import { customElement, property, query } from 'lit/decorators.js';
5
5
  import { connect } from 'pwa-helpers/connect-mixin.js';
@@ -23,13 +23,13 @@ let HelpHome = class HelpHome extends connect(store)(localize(i18next)(PageView)
23
23
  <ox-markdown id="content" .src=${src} toc></ox-markdown>
24
24
 
25
25
  <div id="navigation">
26
- <mwc-icon-button icon="home" @click=${() => navigate('help')} ?disabled=${this.topic == 'index'}></mwc-icon-button>
27
- <mwc-icon-button icon="keyboard_arrow_left" @click=${() => window.history.back()}></mwc-icon-button icon="">
28
- <mwc-icon-button icon="keyboard_arrow_right" @click=${() => window.history.forward()}></mwc-icon-button icon="">
29
- </div>
26
+ <md-icon @click=${() => navigate('help')} ?disabled=${this.topic == 'index'}>home</md-icon>
27
+ <md-icon @click=${() => window.history.back()}>keyboard_arrow_left</md-icon>
28
+ <md-icon @click=${() => window.history.forward()}>keyboard_arrow_right</md-icon>
29
+ </div>
30
30
 
31
31
  ${this.showGotoTop
32
- ? html ` <mwc-icon id="upward" @click=${(e) => this.gotoTop(e)}>arrow_upward</mwc-icon> `
32
+ ? html ` <md-icon id="upward" @click=${(e) => this.gotoTop(e)}>arrow_upward</md-icon> `
33
33
  : html ``}
34
34
  `;
35
35
  }
@@ -66,6 +66,8 @@ HelpHome.styles = [
66
66
  flex-direction: column;
67
67
  overflow: hidden;
68
68
  position: relative;
69
+
70
+ --md-icon-size: 24px;
69
71
  }
70
72
 
71
73
  #navigation {
@@ -77,8 +79,8 @@ HelpHome.styles = [
77
79
  background-color: white;
78
80
  }
79
81
 
80
- #navigation mwc-icon-button {
81
- padding: var(--help-navigation-icon-padding);
82
+ #navigation md-icon {
83
+ padding: var(--help-navigation-icon-padding, var(--padding-default));
82
84
  border-right: var(--help-navigation-icon-border);
83
85
  cursor: pointer;
84
86
  color: var(--help-icon-color);
@@ -93,7 +95,7 @@ HelpHome.styles = [
93
95
  }
94
96
 
95
97
  #upward {
96
- --mdc-icon-size: 26px;
98
+ --md-icon-size: 26px;
97
99
  position: absolute;
98
100
  bottom: var(--data-list-fab-position-vertical);
99
101
  right: var(--data-list-fab-position-horizontal);