@acrodata/gui 2.8.0 → 3.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 (76) hide show
  1. package/README.md +4 -3
  2. package/button-toggle/button-toggle.scss +6 -6
  3. package/button-toggle/icon.scss +3 -3
  4. package/codearea/codearea-dialog.scss +9 -9
  5. package/codearea/codearea.scss +2 -2
  6. package/combobox/combobox.scss +1 -1
  7. package/fesm2022/acrodata-gui.mjs +124 -124
  8. package/fesm2022/acrodata-gui.mjs.map +1 -1
  9. package/field-group/field-group.scss +1 -1
  10. package/file-uploader/file-uploader.scss +1 -1
  11. package/fill/fill-picker.scss +9 -9
  12. package/fill/fill.scss +4 -4
  13. package/gui-form.scss +10 -10
  14. package/icon-button-wrapper/icon-button-wrapper.scss +2 -2
  15. package/image-select/image-select.scss +8 -1
  16. package/index.d.ts +606 -3
  17. package/inline-group/inline-group.scss +1 -1
  18. package/package.json +7 -9
  19. package/select/select.scss +1 -1
  20. package/slider/slider.scss +10 -10
  21. package/switch/switch.scss +14 -14
  22. package/button-toggle/button-toggle.d.ts +0 -18
  23. package/button-toggle/icon.d.ts +0 -7
  24. package/codearea/codearea-config.d.ts +0 -14
  25. package/codearea/codearea-dialog.d.ts +0 -27
  26. package/codearea/codearea.d.ts +0 -37
  27. package/combobox/combobox.d.ts +0 -27
  28. package/esm2022/acrodata-gui.mjs +0 -5
  29. package/esm2022/button-toggle/button-toggle.mjs +0 -69
  30. package/esm2022/button-toggle/icon.mjs +0 -33
  31. package/esm2022/codearea/codearea-config.mjs +0 -20
  32. package/esm2022/codearea/codearea-dialog.mjs +0 -67
  33. package/esm2022/codearea/codearea.mjs +0 -148
  34. package/esm2022/combobox/combobox.mjs +0 -82
  35. package/esm2022/field-group/field-group.mjs +0 -30
  36. package/esm2022/field-label/field-label.mjs +0 -31
  37. package/esm2022/file-uploader/file-uploader-config.mjs +0 -42
  38. package/esm2022/file-uploader/file-uploader.mjs +0 -142
  39. package/esm2022/fill/fill-picker.mjs +0 -166
  40. package/esm2022/fill/fill.mjs +0 -85
  41. package/esm2022/gui-form.mjs +0 -305
  42. package/esm2022/gui-icons.mjs +0 -95
  43. package/esm2022/gui-module.mjs +0 -201
  44. package/esm2022/gui-utils.mjs +0 -128
  45. package/esm2022/icon-button-wrapper/icon-button-wrapper.mjs +0 -13
  46. package/esm2022/image-select/image-select.mjs +0 -79
  47. package/esm2022/inline-group/inline-group.mjs +0 -19
  48. package/esm2022/input-number/input-number.mjs +0 -58
  49. package/esm2022/input-text/input-text.mjs +0 -59
  50. package/esm2022/interface.mjs +0 -2
  51. package/esm2022/public-api.mjs +0 -30
  52. package/esm2022/select/select.mjs +0 -69
  53. package/esm2022/slider/slider.mjs +0 -85
  54. package/esm2022/switch/switch.mjs +0 -59
  55. package/esm2022/textarea/textarea.mjs +0 -59
  56. package/field-group/field-group.d.ts +0 -13
  57. package/field-label/field-label.d.ts +0 -12
  58. package/file-uploader/file-uploader-config.d.ts +0 -25
  59. package/file-uploader/file-uploader.d.ts +0 -38
  60. package/fill/fill-picker.d.ts +0 -39
  61. package/fill/fill.d.ts +0 -21
  62. package/gui-form.d.ts +0 -71
  63. package/gui-icons.d.ts +0 -30
  64. package/gui-module.d.ts +0 -42
  65. package/gui-utils.d.ts +0 -36
  66. package/icon-button-wrapper/icon-button-wrapper.d.ts +0 -5
  67. package/image-select/image-select.d.ts +0 -23
  68. package/inline-group/inline-group.d.ts +0 -7
  69. package/input-number/input-number.d.ts +0 -18
  70. package/input-text/input-text.d.ts +0 -18
  71. package/interface.d.ts +0 -61
  72. package/public-api.d.ts +0 -26
  73. package/select/select.d.ts +0 -18
  74. package/slider/slider.d.ts +0 -23
  75. package/switch/switch.d.ts +0 -18
  76. package/textarea/textarea.d.ts +0 -17
package/field-group/field-group.scss CHANGED
@@ -22,7 +22,7 @@
22
22
  .mat-mdc-form-field-hint-wrapper {
23
23
  position: relative;
24
24
  padding: 0 0.5rem;
25
- border-radius: var(--mdc-filled-text-field-container-shape);
25
+ border-radius: var(--mat-form-field-filled-container-shape, var(--mat-sys-corner-extra-small));
26
26
 
27
27
  [dir='rtl'] & {
28
28
  padding: 0 0.5rem;
package/file-uploader/file-uploader.scss CHANGED
@@ -15,7 +15,7 @@
15
15
  height: 7.5rem;
16
16
  margin: 0.25rem 0 0;
17
17
  padding: 0.25rem;
18
- background-color: var(--mdc-filled-text-field-container-color);
18
+ background-color: var(--mat-form-field-filled-container-color, var(--mat-sys-surface-variant));
19
19
  border: 1px solid transparent;
20
20
  border-radius: 0.25rem;
21
21
 
package/fill/fill-picker.scss CHANGED
@@ -2,8 +2,8 @@
2
2
  display: block;
3
3
  width: 15rem;
4
4
  border-radius: 0.5rem;
5
- background-color: var(--mat-expansion-container-background-color);
6
- color: var(--mat-expansion-container-text-color);
5
+ background-color: var(--mat-expansion-container-background-color, var(--mat-sys-surface));
6
+ color: var(--mat-expansion-container-text-color, var(--mat-sys-on-surface));
7
7
  box-shadow:
8
8
  inset 0 0 1px 0 rgba(255, 255, 255, 0.64),
9
9
  0 2px 4px 0 rgba(0, 0, 0, 0.16),
@@ -72,8 +72,8 @@
72
72
  input {
73
73
  background-color: transparent;
74
74
  box-shadow: none !important;
75
- color: var(--mdc-outlined-text-field-input-text-color) !important;
76
- border: 1px solid var(--mdc-outlined-text-field-outline-color) !important;
75
+ color: var(--mat-form-field-outlined-input-text-color, var(--mat-sys-on-surface)) !important;
76
+ border: 1px solid var(--mat-form-field-outlined-outline-color, var(--mat-sys-outline)) !important;
77
77
  }
78
78
  }
79
79
 
@@ -103,7 +103,7 @@
103
103
  }
104
104
 
105
105
  path {
106
- fill: var(--mdc-icon-button-icon-color);
106
+ fill: var(--mat-icon-button-icon-color, var(--mat-sys-on-surface-variant));
107
107
  }
108
108
  }
109
109
  }
@@ -115,8 +115,8 @@
115
115
  --gp-container-shape: 0;
116
116
  --gp-container-elevation-shadow: none;
117
117
  --gp-container-background-color: transparent;
118
- --gp-container-text-color: var(--mdc-filled-text-field-input-text-color);
119
- --gp-input-background-color: var(--mdc-filled-text-field-container-color);
118
+ --gp-container-text-color: var(--mat-form-field-filled-input-text-color, var(--mat-sys-on-surface));
119
+ --gp-input-background-color: var(--mat-form-field-filled-container-color, var(--mat-sys-surface-variant));
120
120
  }
121
121
  }
122
122
 
@@ -124,8 +124,8 @@
124
124
  padding: 0.375rem 0.375rem 0;
125
125
  line-height: 1;
126
126
 
127
- --mat-standard-button-toggle-shape: 0;
128
- --mat-standard-button-toggle-height: 1;
127
+ --mat-button-toggle-shape: 0;
128
+ --mat-button-toggle-height: 1;
129
129
 
130
130
  .mat-button-toggle-group-appearance-standard {
131
131
  gap: 0.25rem;
package/fill/fill.scss CHANGED
@@ -20,15 +20,15 @@
20
20
  height: 100%;
21
21
  box-sizing: border-box;
22
22
  border: 1px solid currentColor;
23
- border-top-left-radius: var(--mdc-filled-text-field-container-shape);
24
- border-bottom-left-radius: var(--mdc-filled-text-field-container-shape);
23
+ border-top-left-radius: var(--mat-form-field-filled-container-shape, var(--mat-sys-corner-extra-small));
24
+ border-bottom-left-radius: var(--mat-form-field-filled-container-shape, var(--mat-sys-corner-extra-small));
25
25
  opacity: 0.24;
26
26
  content: '';
27
27
 
28
28
  [dir='rtl'] & {
29
29
  border-radius: 0;
30
- border-top-right-radius: var(--mdc-filled-text-field-container-shape);
31
- border-bottom-right-radius: var(--mdc-filled-text-field-container-shape);
30
+ border-top-right-radius: var(--mat-form-field-filled-container-shape, var(--mat-sys-corner-extra-small));
31
+ border-bottom-right-radius: var(--mat-form-field-filled-container-shape, var(--mat-sys-corner-extra-small));
32
32
  }
33
33
  }
34
34
  }
package/gui-form.scss CHANGED
@@ -9,7 +9,7 @@
9
9
  display: block;
10
10
  font-size: 0.75rem;
11
11
 
12
- .mat-expansion-panel:not([class*="mat-elevation-z"]) {
12
+ .mat-expansion-panel:not([class*='mat-elevation-z']) {
13
13
  box-shadow: none;
14
14
  }
15
15
 
@@ -51,12 +51,12 @@
51
51
  }
52
52
 
53
53
  .mat-mdc-tab-header {
54
- --mat-tab-header-label-text-size: 0.75rem;
55
- --mdc-secondary-navigation-tab-container-height: 1.5rem;
54
+ --mat-tab-label-text-size: 0.75rem;
55
+ --mat-tab-container-height: 1.5rem;
56
56
  }
57
57
 
58
58
  .mat-mdc-tab-header-pagination {
59
- min-width: var(--mdc-secondary-navigation-tab-container-height);
59
+ min-width: var(--mat-tab-container-height);
60
60
  }
61
61
 
62
62
  .mat-mdc-tab {
@@ -71,14 +71,14 @@
71
71
  position: relative;
72
72
  padding: 0 0.75rem;
73
73
  line-height: 1.5rem;
74
- border-bottom: var(--mat-tab-header-divider-height) solid transparent;
74
+ border-bottom: var(--mat-tab-divider-height, 1px) solid transparent;
75
75
 
76
76
  &::before {
77
77
  position: absolute;
78
78
  left: 0;
79
79
  width: 0.125rem;
80
80
  height: 1rem;
81
- background-color: var(--mat-expansion-header-text-color);
81
+ background-color: var(--mat-expansion-header-text-color, var(--mat-sys-on-surface));
82
82
  content: '';
83
83
 
84
84
  [dir='rtl'] & {
@@ -108,13 +108,13 @@
108
108
 
109
109
  .gui-menu {
110
110
  .mat-mdc-tab-header {
111
- --mdc-tab-indicator-active-indicator-shape: 0.25rem;
111
+ --mat-tab-active-indicator-shape: 0.25rem;
112
112
 
113
113
  padding: 0.25rem;
114
- background-color: var(--mdc-filled-text-field-container-color);
114
+ background-color: var(--mat-form-field-filled-container-color, var(--mat-sys-surface-variant));
115
115
 
116
116
  .mdc-tab__ripple::before {
117
- border-radius: var(--mdc-tab-indicator-active-indicator-shape);
117
+ border-radius: var(--mat-tab-active-indicator-shape);
118
118
  }
119
119
  }
120
120
 
@@ -124,7 +124,7 @@
124
124
 
125
125
  .mdc-tab-indicator .mdc-tab-indicator__content {
126
126
  height: 100%;
127
- background-color: var(--mdc-tab-indicator-active-indicator-color);
127
+ background-color: var(--mat-tab-active-indicator-color, var(--mat-sys-primary));
128
128
  }
129
129
 
130
130
  .mdc-tab-indicator--active .mdc-tab-indicator__content {
package/icon-button-wrapper/icon-button-wrapper.scss CHANGED
@@ -3,8 +3,8 @@
3
3
  line-height: 1;
4
4
 
5
5
  .mat-mdc-icon-button {
6
- --mdc-icon-button-state-layer-size: 1.5rem;
7
- --mdc-icon-button-icon-size: 0.875rem;
6
+ --mat-icon-button-state-layer-size: 1.5rem;
7
+ --mat-icon-button-icon-size: 0.875rem;
8
8
  --mat-icon-button-touch-target-display: none;
9
9
 
10
10
  padding: 0;
package/image-select/image-select.scss CHANGED
@@ -3,7 +3,14 @@
3
3
  max-width: 7.5rem;
4
4
  object-fit: contain;
5
5
  border-radius: 0.25rem;
6
- background-color: var(--mat-option-hover-state-layer-color);
6
+ background-color: var(
7
+ --mat-option-hover-state-layer-color,
8
+ color-mix(
9
+ in srgb,
10
+ var(--mat-sys-on-surface) calc(var(--mat-sys-hover-state-layer-opacity) * 100%),
11
+ transparent
12
+ )
13
+ );
7
14
  }
8
15
 
9
16
  .gui-image-select {