@m3e/progress-indicator 1.1.2 → 1.1.4

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.
@@ -12,7 +12,27 @@
12
12
  "name": "M3eCircularProgressIndicatorElement",
13
13
  "cssProperties": [
14
14
  {
15
- "description": "Track color of the progress bar (background/buffer).",
15
+ "description": "Diameter of the `flat` variant.",
16
+ "name": "--m3e-circular-flat-progress-indicator-diameter"
17
+ },
18
+ {
19
+ "description": "Diameter of the `wavy` variant.",
20
+ "name": "--m3e-circular-wavy-progress-indicator-diameter"
21
+ },
22
+ {
23
+ "description": "Amplitude of the `wavy` variant.",
24
+ "name": "--m3e-circular-wavy-progress-indicator-amplitude"
25
+ },
26
+ {
27
+ "description": "Wavelength of the `wavy` variant.",
28
+ "name": "--m3e-circular-wavy-progress-indicator-wavelength"
29
+ },
30
+ {
31
+ "description": "Thickness of the progress indicator.",
32
+ "name": "--m3e-circular-progress-indicator-thickness"
33
+ },
34
+ {
35
+ "description": "Track color of the progress indicator (background).",
16
36
  "name": "--m3e-progress-indicator-track-color"
17
37
  },
18
38
  {
@@ -27,24 +47,88 @@
27
47
  }
28
48
  ],
29
49
  "members": [
50
+ {
51
+ "kind": "field",
52
+ "name": "__nextMaskId",
53
+ "type": {
54
+ "text": "number"
55
+ },
56
+ "privacy": "private",
57
+ "static": true,
58
+ "default": "0"
59
+ },
60
+ {
61
+ "kind": "field",
62
+ "name": "#maskId",
63
+ "privacy": "private",
64
+ "default": "`m3e-circular-progress-mask-${M3eCircularProgressIndicatorElement.__nextMaskId++}`"
65
+ },
30
66
  {
31
67
  "kind": "field",
32
68
  "name": "#diameter",
33
69
  "privacy": "private",
34
- "default": "40",
35
70
  "type": {
36
71
  "text": "number"
37
- }
72
+ },
73
+ "default": "0"
38
74
  },
39
75
  {
40
76
  "kind": "field",
41
77
  "name": "#strokeWidth",
42
78
  "privacy": "private",
43
- "default": "10",
44
79
  "type": {
45
80
  "text": "number"
81
+ },
82
+ "default": "0"
83
+ },
84
+ {
85
+ "kind": "field",
86
+ "name": "#amplitude",
87
+ "privacy": "private",
88
+ "type": {
89
+ "text": "number"
90
+ },
91
+ "default": "0"
92
+ },
93
+ {
94
+ "kind": "field",
95
+ "name": "#wavelength",
96
+ "privacy": "private",
97
+ "type": {
98
+ "text": "number"
99
+ },
100
+ "default": "0"
101
+ },
102
+ {
103
+ "kind": "field",
104
+ "name": "#spinnerActiveTrack",
105
+ "privacy": "private",
106
+ "type": {
107
+ "text": "SVGPathElement | null | undefined"
46
108
  }
47
109
  },
110
+ {
111
+ "kind": "field",
112
+ "name": "#spinnerTrack",
113
+ "privacy": "private",
114
+ "type": {
115
+ "text": "SVGPathElement | null | undefined"
116
+ }
117
+ },
118
+ {
119
+ "kind": "field",
120
+ "name": "#resizeController",
121
+ "privacy": "private",
122
+ "readonly": true,
123
+ "default": "new ResizeController(this, { skipInitial: true, target: null, callback: () => { this.#updateDiameterAndStroke(); this.#updateAmplitudeAndWavelength(); }, })"
124
+ },
125
+ {
126
+ "kind": "field",
127
+ "name": "#indeterminateWavyAnimationLoop",
128
+ "privacy": "private",
129
+ "readonly": true,
130
+ "default": "new AnimationLoopController(this, (_, t) => this.#updateWavyIndeterminateSpinner(t) )"
131
+ },
48
132
  {
49
133
  "kind": "field",
50
134
  "name": "indeterminate",
@@ -57,24 +141,193 @@
57
141
  "reflects": true
58
142
  },
59
143
  {
60
- "kind": "field",
61
- "name": "diameter",
62
- "type": {
63
- "text": "number"
144
+ "kind": "method",
145
+ "name": "#renderFlatIndicator",
146
+ "privacy": "private",
147
+ "return": {
148
+ "type": {
149
+ "text": "unknown"
150
+ }
151
+ }
152
+ },
153
+ {
154
+ "kind": "method",
155
+ "name": "#renderWavyIndicator",
156
+ "privacy": "private",
157
+ "return": {
158
+ "type": {
159
+ "text": "unknown"
160
+ }
161
+ }
162
+ },
163
+ {
164
+ "kind": "method",
165
+ "name": "#renderResizeObservedElements",
166
+ "privacy": "private",
167
+ "return": {
168
+ "type": {
169
+ "text": "unknown"
170
+ }
171
+ }
172
+ },
173
+ {
174
+ "kind": "method",
175
+ "name": "#renderContent",
176
+ "privacy": "private",
177
+ "return": {
178
+ "type": {
179
+ "text": "unknown"
180
+ }
181
+ }
182
+ },
183
+ {
184
+ "kind": "method",
185
+ "name": "#updateDiameterAndStroke",
186
+ "privacy": "private",
187
+ "return": {
188
+ "type": {
189
+ "text": "void"
190
+ }
191
+ }
192
+ },
193
+ {
194
+ "kind": "method",
195
+ "name": "#updateAmplitudeAndWavelength",
196
+ "privacy": "private",
197
+ "return": {
198
+ "type": {
199
+ "text": "void"
200
+ }
201
+ }
202
+ },
203
+ {
204
+ "kind": "method",
205
+ "name": "#updateWavyIndeterminateSpinner",
206
+ "privacy": "private",
207
+ "return": {
208
+ "type": {
209
+ "text": "void"
210
+ }
64
211
  },
65
- "description": "The diameter, in pixels, of the progress spinner.",
66
- "default": "40",
67
- "attribute": "diameter"
212
+ "parameters": [
213
+ {
214
+ "name": "t",
215
+ "type": {
216
+ "text": "number"
217
+ }
218
+ }
219
+ ]
68
220
  },
69
221
  {
70
- "kind": "field",
71
- "name": "strokeWidth",
72
- "type": {
73
- "text": "number"
222
+ "kind": "method",
223
+ "name": "#computeWavyIndeterminateSweep",
224
+ "privacy": "private",
225
+ "return": {
226
+ "type": {
227
+ "text": "number"
228
+ }
74
229
  },
75
- "description": "The stroke width, in pixels, of the progress spinner.",
76
- "default": "10",
77
- "attribute": "stroke-width"
230
+ "parameters": [
231
+ {
232
+ "name": "t",
233
+ "type": {
234
+ "text": "number"
235
+ }
236
+ }
237
+ ]
238
+ },
239
+ {
240
+ "kind": "method",
241
+ "name": "#sizeToDegrees",
242
+ "privacy": "private",
243
+ "return": {
244
+ "type": {
245
+ "text": "number"
246
+ }
247
+ },
248
+ "parameters": [
249
+ {
250
+ "name": "size",
251
+ "type": {
252
+ "text": "number"
253
+ }
254
+ },
255
+ {
256
+ "name": "padding",
257
+ "default": "this.#amplitude"
258
+ }
259
+ ]
260
+ },
261
+ {
262
+ "kind": "method",
263
+ "name": "#degreesToRadians",
264
+ "privacy": "private",
265
+ "parameters": [
266
+ {
267
+ "name": "degrees",
268
+ "type": {
269
+ "text": "number"
270
+ }
271
+ }
272
+ ]
273
+ },
274
+ {
275
+ "kind": "method",
276
+ "name": "#polarToCartesian",
277
+ "privacy": "private",
278
+ "parameters": [
279
+ {
280
+ "name": "circle",
281
+ "type": {
282
+ "text": "{ cx: number; cy: number; r: number }"
283
+ }
284
+ },
285
+ {
286
+ "name": "degrees",
287
+ "type": {
288
+ "text": "number"
289
+ }
290
+ }
291
+ ]
292
+ },
293
+ {
294
+ "kind": "method",
295
+ "name": "#computeCircle",
296
+ "privacy": "private",
297
+ "parameters": [
298
+ {
299
+ "name": "padding",
300
+ "type": {
301
+ "text": "number"
302
+ }
303
+ }
304
+ ]
305
+ },
306
+ {
307
+ "kind": "method",
308
+ "name": "#drawArc",
309
+ "privacy": "private",
310
+ "parameters": [
311
+ {
312
+ "name": "{\r\n startAngle = 0,\r\n endAngle = 360,\r\n gap = 0,\r\n padding = this.#amplitude,\r\n }",
313
+ "type": {
314
+ "text": "{\r\n startAngle?: number;\r\n endAngle?: number;\r\n gap?: number;\r\n padding?: number;\r\n }"
315
+ }
316
+ }
317
+ ]
318
+ },
319
+ {
320
+ "kind": "method",
321
+ "name": "#drawWavyArc",
322
+ "privacy": "private",
323
+ "parameters": [
324
+ {
325
+ "name": "{\r\n startAngle = 0,\r\n endAngle = 360,\r\n gap = 0,\r\n padding = this.#amplitude,\r\n amplitude = this.#amplitude,\r\n steps = 200,\r\n }",
326
+ "type": {
327
+ "text": "{\r\n startAngle?: number;\r\n endAngle?: number;\r\n gap?: number;\r\n padding?: number;\r\n amplitude?: number;\r\n steps?: number;\r\n }"
328
+ }
329
+ }
330
+ ]
78
331
  },
79
332
  {
80
333
  "kind": "field",
@@ -128,18 +381,24 @@
128
381
  "name": "ProgressElementIndicatorBase",
129
382
  "module": "src/ProgressElementIndicatorBase.ts"
130
383
  }
131
- }
132
- ],
133
- "attributes": [
384
+ },
134
385
  {
135
- "description": "The diameter, in pixels, of the progress spinner.",
136
- "name": "diameter",
386
+ "kind": "field",
387
+ "name": "variant",
137
388
  "type": {
138
- "text": "number"
389
+ "text": "ProgressIndicatorVariant"
139
390
  },
140
- "default": "40",
141
- "fieldName": "diameter"
142
- },
391
+ "default": "\"flat\"",
392
+ "description": "The appearance of the indicator.",
393
+ "attribute": "variant",
394
+ "reflects": true,
395
+ "inheritedFrom": {
396
+ "name": "ProgressElementIndicatorBase",
397
+ "module": "src/ProgressElementIndicatorBase.ts"
398
+ }
399
+ }
400
+ ],
401
+ "attributes": [
143
402
  {
144
403
  "description": "Whether to show something is happening without conveying progress.",
145
404
  "name": "indeterminate",
@@ -162,15 +421,6 @@
162
421
  "module": "src/ProgressElementIndicatorBase.ts"
163
422
  }
164
423
  },
165
- {
166
- "description": "The stroke width, in pixels, of the progress spinner.",
167
- "name": "stroke-width",
168
- "type": {
169
- "text": "number"
170
- },
171
- "default": "10",
172
- "fieldName": "strokeWidth"
173
- },
174
424
  {
175
425
  "name": "value",
176
426
  "type": {
@@ -183,6 +433,19 @@
183
433
  "name": "ProgressElementIndicatorBase",
184
434
  "module": "src/ProgressElementIndicatorBase.ts"
185
435
  }
436
+ },
437
+ {
438
+ "name": "variant",
439
+ "type": {
440
+ "text": "ProgressIndicatorVariant"
441
+ },
442
+ "default": "\"flat\"",
443
+ "description": "The appearance of the indicator.",
444
+ "fieldName": "variant",
445
+ "inheritedFrom": {
446
+ "name": "ProgressElementIndicatorBase",
447
+ "module": "src/ProgressElementIndicatorBase.ts"
448
+ }
186
449
  }
187
450
  ],
188
451
  "superclass": {
@@ -275,12 +538,24 @@
275
538
  {
276
539
  "description": "Color of the progress indicator (foreground).",
277
540
  "name": "--m3e-progress-indicator-color"
541
+ },
542
+ {
543
+ "description": "Amplitude of the `wavy` variant.",
544
+ "name": "--m3e-linear-wavy-progress-indicator-amplitude"
545
+ },
546
+ {
547
+ "description": "Wavelength of the `wavy` variant.",
548
+ "name": "--m3e-linear-wavy-progress-indicator-wavelength"
549
+ },
550
+ {
551
+ "description": "Wavelength of the indeterminate/query `wavy` variant.",
552
+ "name": "--m3e-linear-wavy-indeterminate-progress-indicator-wavelength"
278
553
  }
279
554
  ],
280
555
  "members": [
281
556
  {
282
557
  "kind": "field",
283
- "name": "__nextPatternId",
558
+ "name": "__nextMaskId",
284
559
  "type": {
285
560
  "text": "number"
286
561
  },
@@ -290,18 +565,43 @@
290
565
  },
291
566
  {
292
567
  "kind": "field",
293
- "name": "#patternId",
568
+ "name": "#maskId",
294
569
  "privacy": "private",
295
- "default": "`m3e-progress-pattern-${M3eLinearProgressIndicatorElement.__nextPatternId++}`"
570
+ "default": "`m3e-linear-progress-mask-${M3eLinearProgressIndicatorElement.__nextMaskId++}`"
296
571
  },
297
572
  {
298
573
  "kind": "field",
299
- "name": "#patternFill",
574
+ "name": "#strokeWidth",
300
575
  "privacy": "private",
301
576
  "type": {
302
- "text": "string"
577
+ "text": "number"
303
578
  },
304
- "default": "\"\""
579
+ "default": "0"
580
+ },
581
+ {
582
+ "kind": "field",
583
+ "name": "#amplitude",
584
+ "privacy": "private",
585
+ "type": {
586
+ "text": "number"
587
+ },
588
+ "default": "0"
589
+ },
590
+ {
591
+ "kind": "field",
592
+ "name": "#wavelength",
593
+ "privacy": "private",
594
+ "type": {
595
+ "text": "number"
596
+ },
597
+ "default": "0"
598
+ },
599
+ {
600
+ "kind": "field",
601
+ "name": "#resizeController",
602
+ "privacy": "private",
603
+ "readonly": true,
604
+ "default": "new ResizeController(this, { skipInitial: true, target: null, callback: () => { this.#updateStroke(); this.#updateAmplitudeAndWavelength(); }, })"
305
605
  },
306
606
  {
307
607
  "kind": "field",
@@ -325,6 +625,92 @@
325
625
  "attribute": "buffer-value",
326
626
  "reflects": true
327
627
  },
628
+ {
629
+ "kind": "method",
630
+ "name": "#renderWave",
631
+ "privacy": "private",
632
+ "return": {
633
+ "type": {
634
+ "text": "unknown"
635
+ }
636
+ },
637
+ "parameters": [
638
+ {
639
+ "name": "width",
640
+ "type": {
641
+ "text": "number"
642
+ }
643
+ },
644
+ {
645
+ "name": "height",
646
+ "type": {
647
+ "text": "number"
648
+ }
649
+ },
650
+ {
651
+ "name": "viewBox",
652
+ "type": {
653
+ "text": "string"
654
+ }
655
+ },
656
+ {
657
+ "name": "path",
658
+ "type": {
659
+ "text": "string"
660
+ }
661
+ }
662
+ ]
663
+ },
664
+ {
665
+ "kind": "method",
666
+ "name": "#renderResizeObservedElements",
667
+ "privacy": "private",
668
+ "return": {
669
+ "type": {
670
+ "text": "unknown"
671
+ }
672
+ }
673
+ },
674
+ {
675
+ "kind": "method",
676
+ "name": "#updateStroke",
677
+ "privacy": "private",
678
+ "return": {
679
+ "type": {
680
+ "text": "void"
681
+ }
682
+ }
683
+ },
684
+ {
685
+ "kind": "method",
686
+ "name": "#updateAmplitudeAndWavelength",
687
+ "privacy": "private",
688
+ "return": {
689
+ "type": {
690
+ "text": "void"
691
+ }
692
+ }
693
+ },
694
+ {
695
+ "kind": "method",
696
+ "name": "#drawWavyPath",
697
+ "privacy": "private",
698
+ "parameters": [
699
+ {
700
+ "name": "width",
701
+ "type": {
702
+ "text": "number"
703
+ }
704
+ },
705
+ {
706
+ "name": "phase",
707
+ "default": "0",
708
+ "type": {
709
+ "text": "number"
710
+ }
711
+ }
712
+ ]
713
+ },
328
714
  {
329
715
  "kind": "field",
330
716
  "name": "formAssociated",
@@ -377,6 +763,21 @@
377
763
  "name": "ProgressElementIndicatorBase",
378
764
  "module": "src/ProgressElementIndicatorBase.ts"
379
765
  }
766
+ },
767
+ {
768
+ "kind": "field",
769
+ "name": "variant",
770
+ "type": {
771
+ "text": "ProgressIndicatorVariant"
772
+ },
773
+ "default": "\"flat\"",
774
+ "description": "The appearance of the indicator.",
775
+ "attribute": "variant",
776
+ "reflects": true,
777
+ "inheritedFrom": {
778
+ "name": "ProgressElementIndicatorBase",
779
+ "module": "src/ProgressElementIndicatorBase.ts"
780
+ }
380
781
  }
381
782
  ],
382
783
  "attributes": [
@@ -423,6 +824,19 @@
423
824
  "name": "ProgressElementIndicatorBase",
424
825
  "module": "src/ProgressElementIndicatorBase.ts"
425
826
  }
827
+ },
828
+ {
829
+ "name": "variant",
830
+ "type": {
831
+ "text": "ProgressIndicatorVariant"
832
+ },
833
+ "default": "\"flat\"",
834
+ "description": "The appearance of the indicator.",
835
+ "fieldName": "variant",
836
+ "inheritedFrom": {
837
+ "name": "ProgressElementIndicatorBase",
838
+ "module": "src/ProgressElementIndicatorBase.ts"
839
+ }
426
840
  }
427
841
  ],
428
842
  "superclass": {
@@ -488,6 +902,17 @@
488
902
  "description": "The maximum progress value.",
489
903
  "attribute": "max"
490
904
  },
905
+ {
906
+ "kind": "field",
907
+ "name": "variant",
908
+ "type": {
909
+ "text": "ProgressIndicatorVariant"
910
+ },
911
+ "default": "\"flat\"",
912
+ "description": "The appearance of the indicator.",
913
+ "attribute": "variant",
914
+ "reflects": true
915
+ },
491
916
  {
492
917
  "kind": "field",
493
918
  "name": "formAssociated",
@@ -531,6 +956,15 @@
531
956
  "default": "100",
532
957
  "description": "The maximum progress value.",
533
958
  "fieldName": "max"
959
+ },
960
+ {
961
+ "name": "variant",
962
+ "type": {
963
+ "text": "ProgressIndicatorVariant"
964
+ },
965
+ "default": "\"flat\"",
966
+ "description": "The appearance of the indicator.",
967
+ "fieldName": "variant"
534
968
  }
535
969
  ],
536
970
  "mixins": [
@@ -561,6 +995,12 @@
561
995
  }
562
996
  ]
563
997
  },
998
+ {
999
+ "kind": "javascript-module",
1000
+ "path": "src/ProgressIndicatorVariant.ts",
1001
+ "declarations": [],
1002
+ "exports": []
1003
+ },
564
1004
  {
565
1005
  "kind": "javascript-module",
566
1006
  "path": "../core/src/shared/mixins/AttachInternals.ts",
@@ -2191,12 +2631,51 @@
2191
2631
  "description": "Mixin to augment an element with behavior emits a click event on keyboard events.",
2192
2632
  "name": "KeyboardClick",
2193
2633
  "members": [
2634
+ {
2635
+ "kind": "field",
2636
+ "name": "#keyPressed",
2637
+ "privacy": "private",
2638
+ "type": {
2639
+ "text": "boolean"
2640
+ },
2641
+ "default": "false"
2642
+ },
2643
+ {
2644
+ "kind": "field",
2645
+ "name": "#keyDownHandler",
2646
+ "privacy": "private",
2647
+ "readonly": true
2648
+ },
2194
2649
  {
2195
2650
  "kind": "field",
2196
2651
  "name": "#keyUpHandler",
2197
2652
  "privacy": "private",
2198
2653
  "readonly": true
2199
2654
  },
2655
+ {
2656
+ "kind": "field",
2657
+ "name": "#focusOutHandler",
2658
+ "privacy": "private",
2659
+ "readonly": true
2660
+ },
2661
+ {
2662
+ "kind": "method",
2663
+ "name": "#handleKeyDown",
2664
+ "privacy": "private",
2665
+ "return": {
2666
+ "type": {
2667
+ "text": "void"
2668
+ }
2669
+ },
2670
+ "parameters": [
2671
+ {
2672
+ "name": "e",
2673
+ "type": {
2674
+ "text": "KeyboardEvent"
2675
+ }
2676
+ }
2677
+ ]
2678
+ },
2200
2679
  {
2201
2680
  "kind": "method",
2202
2681
  "name": "#handleKeyUp",