@factor_ec/ui 4.0.10 → 5.0.0

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 (59) hide show
  1. package/README.md +49 -10
  2. package/fesm2022/factor_ec-ui.mjs +617 -532
  3. package/fesm2022/factor_ec-ui.mjs.map +1 -1
  4. package/lib/avatar/avatar.component.d.ts +17 -0
  5. package/lib/chart.service.d.ts +18 -0
  6. package/lib/icon/icon.component.d.ts +14 -0
  7. package/lib/message.service.d.ts +14 -4
  8. package/lib/models/chart.d.ts +12 -0
  9. package/lib/models/ui-options.d.ts +9 -0
  10. package/lib/observe-intersecting.directive.d.ts +8 -9
  11. package/lib/progress/progress.component.d.ts +10 -0
  12. package/lib/ui.service.d.ts +9 -0
  13. package/package.json +7 -7
  14. package/public-api.d.ts +8 -8
  15. package/esm2022/factor_ec-ui.mjs +0 -5
  16. package/esm2022/lib/io/avatar/avatar.component.mjs +0 -75
  17. package/esm2022/lib/io/icon/icon.component.mjs +0 -96
  18. package/esm2022/lib/io/image/image.component.mjs +0 -84
  19. package/esm2022/lib/io/progress/progress.component.mjs +0 -43
  20. package/esm2022/lib/io/rating/rating.component.mjs +0 -74
  21. package/esm2022/lib/message-content/message-content.component.mjs +0 -20
  22. package/esm2022/lib/message-dialog/message-dialog.component.mjs +0 -33
  23. package/esm2022/lib/message.service.mjs +0 -60
  24. package/esm2022/lib/models/message-content.mjs +0 -2
  25. package/esm2022/lib/models/message-options.mjs +0 -2
  26. package/esm2022/lib/models/task.mjs +0 -2
  27. package/esm2022/lib/models/ui-configuration.mjs +0 -2
  28. package/esm2022/lib/nav/timeline/timeline.component.mjs +0 -102
  29. package/esm2022/lib/observe-intersecting.directive.mjs +0 -44
  30. package/esm2022/lib/progress.service.mjs +0 -48
  31. package/esm2022/public-api.mjs +0 -13
  32. package/lib/io/avatar/avatar.component.d.ts +0 -21
  33. package/lib/io/icon/icon.component.d.ts +0 -22
  34. package/lib/io/image/image.component.d.ts +0 -15
  35. package/lib/io/progress/progress.component.d.ts +0 -14
  36. package/lib/io/rating/rating.component.d.ts +0 -22
  37. package/lib/message-content/message-content.component.d.ts +0 -7
  38. package/lib/message-dialog/message-dialog.component.d.ts +0 -10
  39. package/lib/models/task.d.ts +0 -10
  40. package/lib/models/ui-configuration.d.ts +0 -7
  41. package/lib/nav/timeline/timeline.component.d.ts +0 -18
  42. package/lib/progress.service.d.ts +0 -15
  43. package/scss/components/avatar.scss +0 -15
  44. package/scss/components/collapsible.scss +0 -46
  45. package/scss/components/dropdown.scss +0 -56
  46. package/scss/components/icon.scss +0 -40
  47. package/scss/components/image.scss +0 -62
  48. package/scss/components/index.scss +0 -10
  49. package/scss/components/list.scss +0 -63
  50. package/scss/components/ph.scss +0 -27
  51. package/scss/components/popup.scss +0 -7
  52. package/scss/components/progress.scss +0 -119
  53. package/scss/components/rating.scss +0 -61
  54. package/scss/index.scss +0 -5
  55. package/scss/mixins/breakpoints.scss +0 -123
  56. package/scss/mixins.scss +0 -1
  57. package/scss/reboot.scss +0 -586
  58. package/scss/root.scss +0 -52
  59. package/scss/variables.scss +0 -116
package/scss/reboot.scss DELETED
@@ -1,586 +0,0 @@
1
- @import "variables";
2
-
3
- // stylelint-disable declaration-no-important, selector-no-qualifying-type, property-no-vendor-prefix
4
-
5
- // Reboot
6
- //
7
- // Normalization of HTML elements, manually forked from Normalize.css to remove
8
- // styles targeting irrelevant browsers while applying new styles.
9
- //
10
- // Normalize is licensed MIT. https://github.com/necolas/normalize.css
11
-
12
- // Document
13
- //
14
- // Change from `box-sizing: content-box` so that `width` is not affected by `padding` or `border`.
15
-
16
- *,
17
- *::before,
18
- *::after {
19
- box-sizing: border-box;
20
- }
21
-
22
- // Root
23
- //
24
- // Ability to the value of the root font sizes, affecting the value of `rem`.
25
- // null by default, thus nothing is generated.
26
- /*
27
- :root {
28
- @if $font-size-root != null {
29
- @include font-size(var(--ft-root-font-size));
30
- }
31
-
32
- @if $enable-smooth-scroll {
33
- @media (prefers-reduced-motion: no-preference) {
34
- scroll-behavior: smooth;
35
- }
36
- }
37
- }
38
- */
39
-
40
- // Body
41
- //
42
- // 1. Remove the margin in all browsers.
43
- // 2. As a best practice, apply a default `background-color`.
44
- // 3. Prevent adjustments of font size after orientation changes in iOS.
45
- // 4. Change the default tap highlight to be completely transparent in iOS.
46
-
47
- // scss-docs-start reboot-body-rules
48
- body {
49
- margin: 0; // 1
50
- font-family: var(--ft-text-font-family);
51
- // @include font-size(var(--ft-body-font-size));
52
- font-size: var(--ft-text-font-size);
53
- font-weight: var(--ft-text-font-weight);
54
- line-height: var(--ft-text-line-height);
55
- color: var(--ft-text-color);
56
- // text-align: var(--ft-body-text-align);
57
- background-color: var(--ft-body-bg); // 2
58
- -webkit-text-size-adjust: 100%; // 3
59
- // -webkit-tap-highlight-color: rgba($black, 0); // 4
60
- }
61
- // scss-docs-end reboot-body-rules
62
-
63
- // Content grouping
64
- //
65
- // 1. Reset Firefox's gray color
66
-
67
- hr {
68
- margin: 1rem 0;
69
- color: inherit;
70
- border: 0;
71
- border-top: 1px solid;
72
- border-left: 1px solid;
73
- border-color: var(--ft-border-color);
74
- }
75
-
76
- // Typography
77
- //
78
- // 1. Remove top margins from headings
79
- // By default, `<h1>`-`<h6>` all receive top and bottom margins. We nuke the top
80
- // margin for easier control within type scales as it avoids margin collapsing.
81
-
82
- %heading {
83
- margin-top: 0; // 1
84
- margin-bottom: var(--ft-headings-margin-bottom);
85
- font-family: var(--ft-headings-font-family);
86
- // font-style: $headings-font-style;
87
- font-weight: var(--ft-headings-font-weight);
88
- line-height: var(--ft-headings-line-height);
89
- color: var(--ft-heading-color, inherit);
90
- }
91
-
92
- h1 {
93
- @extend %heading;
94
- // @include font-size($h1-font-size);
95
- }
96
-
97
- h2 {
98
- @extend %heading;
99
- // @include font-size($h2-font-size);
100
- }
101
-
102
- h3 {
103
- @extend %heading;
104
- // @include font-size($h3-font-size);
105
- }
106
-
107
- h4 {
108
- @extend %heading;
109
- // @include font-size($h4-font-size);
110
- }
111
-
112
- h5 {
113
- @extend %heading;
114
- // @include font-size($h5-font-size);
115
- }
116
-
117
- h6 {
118
- @extend %heading;
119
- // @include font-size($h6-font-size);
120
- }
121
-
122
- // Reset margins on paragraphs
123
- //
124
- // Similarly, the top margin on `<p>`s get reset. However, we also reset the
125
- // bottom margin to use `rem` units instead of `em`.
126
-
127
- p {
128
- margin-top: 0;
129
- margin-bottom: 1rem;
130
- }
131
-
132
- // Abbreviations
133
- //
134
- // 1. Add the correct text decoration in Chrome, Edge, Opera, and Safari.
135
- // 2. Add explicit cursor to indicate changed behavior.
136
- // 3. Prevent the text-decoration to be skipped.
137
-
138
- abbr[title] {
139
- text-decoration: underline dotted; // 1
140
- cursor: help; // 2
141
- text-decoration-skip-ink: none; // 3
142
- }
143
-
144
- // Address
145
-
146
- address {
147
- margin-bottom: 1rem;
148
- font-style: normal;
149
- line-height: inherit;
150
- }
151
-
152
- // Lists
153
-
154
- ol,
155
- ul {
156
- padding-left: 2rem;
157
- }
158
-
159
- ol,
160
- ul,
161
- dl {
162
- margin-top: 0;
163
- margin-bottom: 1rem;
164
- }
165
-
166
- ol ol,
167
- ul ul,
168
- ol ul,
169
- ul ol {
170
- margin-bottom: 0;
171
- }
172
- /*
173
- dt {
174
- font-weight: $dt-font-weight;
175
- }
176
- */
177
- // 1. Undo browser default
178
-
179
- dd {
180
- margin-bottom: 0.5rem;
181
- margin-left: 0; // 1
182
- }
183
-
184
- // Blockquote
185
-
186
- blockquote {
187
- margin: 0 0 1rem;
188
- }
189
-
190
- // Strong
191
- //
192
- // Add the correct font weight in Chrome, Edge, and Safari
193
-
194
- b,
195
- strong {
196
- font-weight: bolder;
197
- }
198
-
199
- // Small
200
- //
201
- // Add the correct font size in all browsers
202
- /*
203
- small {
204
- @include font-size($small-font-size);
205
- }
206
- */
207
-
208
- // Mark
209
- /*
210
- mark {
211
- padding: $mark-padding;
212
- background-color: var(--ft-highlight-bg);
213
- }
214
- */
215
-
216
- // Sub and Sup
217
- //
218
- // Prevent `sub` and `sup` elements from affecting the line height in
219
- // all browsers.
220
- /*
221
- sub,
222
- sup {
223
- position: relative;
224
- @include font-size($sub-sup-font-size);
225
- line-height: 0;
226
- vertical-align: baseline;
227
- }
228
-
229
- sub { bottom: -.25em; }
230
- sup { top: -.5em; }
231
- */
232
-
233
- // Links
234
-
235
- a {
236
- color: rgba(var(--ft-text-link-color-rgb), var(--ft-text-link-opacity, 1));
237
- &:hover {
238
- --ft-text-link-color-rgb: var(--ft-text-link-hover-color-rgb);
239
- }
240
- }
241
-
242
- // And undo these styles for placeholder links/named anchors (without href).
243
- // It would be more straightforward to just use a[href] in previous block, but that
244
- // causes specificity issues in many other styles that are too complex to fix.
245
- // See https://github.com/twbs/bootstrap/issues/19402
246
-
247
- a:not([href]):not([class]) {
248
- &,
249
- &:hover {
250
- color: inherit;
251
- text-decoration: none;
252
- }
253
- }
254
-
255
- // Code
256
- /*
257
- pre,
258
- code,
259
- kbd,
260
- samp {
261
- font-family: $font-family-code;
262
- @include font-size(1em); // Correct the odd `em` font sizing in all browsers.
263
- }
264
-
265
- // 1. Remove browser default top margin
266
- // 2. Reset browser default of `1em` to use `rem`s
267
- // 3. Don't allow content to break outside
268
-
269
- pre {
270
- display: block;
271
- margin-top: 0; // 1
272
- margin-bottom: 1rem; // 2
273
- overflow: auto; // 3
274
- @include font-size($code-font-size);
275
- color: $pre-color;
276
-
277
- // Account for some code outputs that place code tags in pre tags
278
- code {
279
- @include font-size(inherit);
280
- color: inherit;
281
- word-break: normal;
282
- }
283
- }
284
-
285
- code {
286
- @include font-size($code-font-size);
287
- color: var(--ft-code-color);
288
- word-wrap: break-word;
289
-
290
- // Streamline the style when inside anchors to avoid broken underline and more
291
- a > & {
292
- color: inherit;
293
- }
294
- }
295
-
296
- kbd {
297
- padding: $kbd-padding-y $kbd-padding-x;
298
- @include font-size($kbd-font-size);
299
- color: $kbd-color;
300
- background-color: $kbd-bg;
301
- @include border-radius($border-radius-sm);
302
-
303
- kbd {
304
- padding: 0;
305
- @include font-size(1em);
306
- font-weight: $nested-kbd-font-weight;
307
- }
308
- }
309
-
310
-
311
- // Figures
312
- //
313
- // Apply a consistent margin strategy (matches our type styles).
314
-
315
- figure {
316
- margin: 0 0 1rem;
317
- }
318
- */
319
-
320
- // Images and content
321
-
322
- img,
323
- svg {
324
- vertical-align: middle;
325
- }
326
-
327
- // Tables
328
- //
329
- // Prevent double borders
330
-
331
- table {
332
- caption-side: bottom;
333
- border-collapse: collapse;
334
- }
335
- /*
336
- caption {
337
- padding-top: $table-cell-padding-y;
338
- padding-bottom: $table-cell-padding-y;
339
- color: $table-caption-color;
340
- text-align: left;
341
- }
342
- */
343
- // 1. Removes font-weight bold by inheriting
344
- // 2. Matches default `<td>` alignment by inheriting `text-align`.
345
- // 3. Fix alignment for Safari
346
- /*
347
- th {
348
- font-weight: $table-th-font-weight; // 1
349
- text-align: inherit; // 2
350
- text-align: -webkit-match-parent; // 3
351
- }
352
-
353
- thead,
354
- tbody,
355
- tfoot,
356
- tr,
357
- td,
358
- th {
359
- border-color: inherit;
360
- border-style: solid;
361
- border-width: 0;
362
- }
363
-
364
-
365
- // Forms
366
- //
367
- // 1. Allow labels to use `margin` for spacing.
368
-
369
- label {
370
- display: inline-block; // 1
371
- }
372
-
373
- // Remove the default `border-radius` that macOS Chrome adds.
374
- // See https://github.com/twbs/bootstrap/issues/24093
375
-
376
- button {
377
- // stylelint-disable-next-line property-disallowed-list
378
- border-radius: 0;
379
- }
380
-
381
- // Explicitly remove focus outline in Chromium when it shouldn't be
382
- // visible (e.g. as result of mouse click or touch tap). It already
383
- // should be doing this automatically, but seems to currently be
384
- // confused and applies its very visible two-tone outline anyway.
385
-
386
- button:focus:not(:focus-visible) {
387
- outline: 0;
388
- }
389
- */
390
-
391
- // 1. Remove the margin in Firefox and Safari
392
-
393
- input,
394
- button,
395
- select,
396
- optgroup,
397
- textarea {
398
- margin: 0; // 1
399
- font-family: inherit;
400
- font-size: inherit;
401
- line-height: inherit;
402
- }
403
-
404
- // Remove the inheritance of text transform in Firefox
405
- button,
406
- select {
407
- text-transform: none;
408
- }
409
- // Set the cursor for non-`<button>` buttons
410
- //
411
- // Details at https://github.com/twbs/bootstrap/pull/30562
412
- [role="button"] {
413
- cursor: pointer;
414
- }
415
-
416
- select {
417
- // Remove the inheritance of word-wrap in Safari.
418
- // See https://github.com/twbs/bootstrap/issues/24990
419
- word-wrap: normal;
420
-
421
- // Undo the opacity change from Chrome
422
- &:disabled {
423
- opacity: 1;
424
- }
425
- }
426
-
427
- // Remove the dropdown arrow only from text type inputs built with datalists in Chrome.
428
- // See https://stackoverflow.com/a/54997118
429
-
430
- [list]:not([type="date"]):not([type="datetime-local"]):not([type="month"]):not([type="week"]):not(
431
- [type="time"]
432
- )::-webkit-calendar-picker-indicator {
433
- display: none !important;
434
- }
435
-
436
- // 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
437
- // controls in Android 4.
438
- // 2. Correct the inability to style clickable types in iOS and Safari.
439
- // 3. Opinionated: add "hand" cursor to non-disabled button elements.
440
-
441
- button,
442
- [type="button"], // 1
443
- [type="reset"],
444
- [type="submit"] {
445
- -webkit-appearance: button; // 2
446
- &:not(:disabled) {
447
- cursor: pointer; // 3
448
- }
449
- }
450
-
451
- // Remove inner border and padding from Firefox, but don't restore the outline like Normalize.
452
-
453
- ::-moz-focus-inner {
454
- padding: 0;
455
- border-style: none;
456
- }
457
-
458
- // 1. Textareas should really only resize vertically so they don't break their (horizontal) containers.
459
-
460
- textarea {
461
- resize: vertical; // 1
462
- }
463
-
464
- // 1. Browsers set a default `min-width: min-content;` on fieldsets,
465
- // unlike e.g. `<div>`s, which have `min-width: 0;` by default.
466
- // So we reset that to ensure fieldsets behave more like a standard block element.
467
- // See https://github.com/twbs/bootstrap/issues/12359
468
- // and https://html.spec.whatwg.org/multipage/#the-fieldset-and-legend-elements
469
- // 2. Reset the default outline behavior of fieldsets so they don't affect page layout.
470
-
471
- fieldset {
472
- min-width: 0; // 1
473
- padding: 0; // 2
474
- margin: 0; // 2
475
- border: 0; // 2
476
- }
477
-
478
- // 1. By using `float: left`, the legend will behave like a block element.
479
- // This way the border of a fieldset wraps around the legend if present.
480
- // 2. Fix wrapping bug.
481
- // See https://github.com/twbs/bootstrap/issues/29712
482
-
483
- legend {
484
- float: left; // 1
485
- width: 100%;
486
- padding: 0;
487
- // margin-bottom: $legend-margin-bottom;
488
- // @include font-size($legend-font-size);
489
- // font-weight: $legend-font-weight;
490
- line-height: inherit;
491
-
492
- + * {
493
- clear: left; // 2
494
- }
495
- }
496
-
497
- // Fix height of inputs with a type of datetime-local, date, month, week, or time
498
- // See https://github.com/twbs/bootstrap/issues/18842
499
-
500
- ::-webkit-datetime-edit-fields-wrapper,
501
- ::-webkit-datetime-edit-text,
502
- ::-webkit-datetime-edit-minute,
503
- ::-webkit-datetime-edit-hour-field,
504
- ::-webkit-datetime-edit-day-field,
505
- ::-webkit-datetime-edit-month-field,
506
- ::-webkit-datetime-edit-year-field {
507
- padding: 0;
508
- }
509
-
510
- ::-webkit-inner-spin-button {
511
- height: auto;
512
- }
513
-
514
- // 1. Correct the outline style in Safari.
515
- // 2. This overrides the extra rounded corners on search inputs in iOS so that our
516
- // `.form-control` class can properly style them. Note that this cannot simply
517
- // be added to `.form-control` as it's not specific enough. For details, see
518
- // https://github.com/twbs/bootstrap/issues/11586.
519
-
520
- [type="search"] {
521
- outline-offset: -2px; // 1
522
- -webkit-appearance: textfield; // 2
523
- &::-webkit-search-decoration,
524
- &::-webkit-search-cancel-button,
525
- &::-webkit-search-results-button,
526
- &::-webkit-search-results-decoration {
527
- -webkit-appearance: none;
528
- }
529
- }
530
-
531
- // Remove the inner padding in Chrome and Safari on macOS.
532
-
533
- ::-webkit-search-decoration {
534
- -webkit-appearance: none;
535
- }
536
-
537
- // Remove padding around color pickers in webkit browsers
538
-
539
- ::-webkit-color-swatch-wrapper {
540
- padding: 0;
541
- }
542
-
543
- // 1. Inherit font family and line height for file input buttons
544
- // 2. Correct the inability to style clickable types in iOS and Safari.
545
-
546
- ::file-selector-button {
547
- font: inherit; // 1
548
- -webkit-appearance: button; // 2
549
- }
550
-
551
- // Correct element displays
552
-
553
- output {
554
- display: inline-block;
555
- }
556
-
557
- // Remove border from iframe
558
-
559
- iframe {
560
- border: 0;
561
- }
562
-
563
- // Summary
564
- //
565
- // 1. Add the correct display in all browsers
566
-
567
- summary {
568
- display: list-item; // 1
569
- cursor: pointer;
570
- }
571
-
572
- // Progress
573
- //
574
- // Add the correct vertical alignment in Chrome, Firefox, and Opera.
575
-
576
- progress {
577
- vertical-align: baseline;
578
- }
579
-
580
- // Hidden attribute
581
- //
582
- // Always hide an element with the `hidden` HTML attribute.
583
-
584
- [hidden] {
585
- display: none !important;
586
- }
package/scss/root.scss DELETED
@@ -1,52 +0,0 @@
1
- :root {
2
- --ft-heading-font-family: var(--ft-text-font-family);
3
- --ft-heading-font-weight: 500;
4
- --ft-heading-line-height: 1.2;
5
- --ft-heading-color: var(--ft-text-dark-color);
6
- --ft-heading-margin-bottom: calc(1rem * 0.5);
7
-
8
- --ft-text-font-family: sans-serif;
9
- --ft-text-font-size: 1rem;
10
- --ft-text-font-size-sm: calc(var(--ft-text-font-size) * 0.875);
11
- --ft-text-font-size-lg: calc(var(--ft-text-font-size) * 1.25);
12
- --ft-text-font-weight: 300;
13
- --ft-text-line-height: normal;
14
- --ft-text-color: var(--ft-text-dark-color);
15
- --ft-text-color-rgb: var(--ft-text-dark-color-rgb);
16
- --ft-text-muted-color: rgba(var(--ft-text-color-rgb), 0.5);
17
- --ft-text-light-color: #fff;
18
- --ft-text-light-color-rgb: 255, 255, 255;
19
- --ft-text-dark-color: #333;
20
- --ft-text-dark-color-rgb: 51, 51, 51;
21
- --ft-text-link-color: var(--ft-primary-color);
22
- --ft-text-link-hover-color: rgb(var(--ft-primary-color-rgb), 0.9);
23
- --ft-text-link-opacity: 1;
24
-
25
- --ft-danger-color: #dc3545;
26
- --ft-danger-color-rgb: 220, 53, 69;
27
- --ft-warning-color: #ffc107;
28
- --ft-warning-color-rgb: 255, 193, 7;
29
- --ft-success-color: #198754;
30
- --ft-success-color-rgb: 25, 135, 84;
31
- --ft-info-color: #0dcaf0;
32
- --ft-info-color-rgb: 13, 202, 240;
33
-
34
- --ft-avatar-size: 2.25rem;
35
- --ft-avatar-bg: #fff;
36
-
37
- --ft-button-bg: unset;
38
- --ft-button-bg-rgb: 0, 0, 0;
39
- --ft-button-border-color: unset;
40
- --ft-button-border-radius: 0.25rem;
41
- --ft-button-color: var(--ft-primary-color);
42
- --ft-button-hover-bg: rgba(var(--ft-button-bg-rgb), 0.1);
43
- --ft-button-focus-bg: rgba(var(--ft-button-bg-rgb), 0.1);
44
- --ft-button-active-bg: rgba(var(--ft-button-bg-rgb), 0.2);
45
-
46
- --ft-field-label-color: rgba(var(--ft-text-color-rgb), 0.7);
47
- --ft-field-label-font-size: var(--ft-text-font-size-sm);
48
- --ft-field-label-line-height: var(--ft-text-line-height);
49
-
50
- --ft-popup-box-shadow: 0px 24px 38px rgba(0, 0, 0, 0.14), 0px 9px 46px rgba(0, 0, 0, 0.12),
51
- 0px 11px 15px rgba(0, 0, 0, 0.2);
52
- }