@ptsecurity/mosaic 17.2.0 → 17.3.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 (128) hide show
  1. package/autocomplete/_autocomplete-theme.scss +2 -2
  2. package/autocomplete/autocomplete.scss +0 -2
  3. package/button/_button-theme.scss +3 -3
  4. package/button-toggle/_button-toggle-theme.scss +2 -2
  5. package/button-toggle/button-toggle.scss +2 -2
  6. package/checkbox/_checkbox-theme.scss +1 -1
  7. package/code-block/_code-block-theme.scss +3 -3
  8. package/core/form-field/form-field-ref.d.ts +13 -0
  9. package/core/form-field/index.d.ts +1 -0
  10. package/core/forms/_forms-theme.scss +3 -3
  11. package/core/option/_optgroup-theme.scss +1 -1
  12. package/core/option/_option-theme.scss +1 -1
  13. package/core/public-api.d.ts +1 -0
  14. package/core/select/common.d.ts +35 -0
  15. package/core/select/index.d.ts +1 -0
  16. package/core/selection/pseudo-checkbox/_pseudo-checkbox-theme.scss +16 -11
  17. package/core/styles/common/_groups.scss +3 -2
  18. package/core/styles/common/_popup.scss +1 -1
  19. package/core/styles/common/_tokens.scss +33 -14
  20. package/core/styles/theming/_alerts.scss +20 -19
  21. package/core/styles/theming/_badges.scss +38 -36
  22. package/core/styles/theming/_components-theming.scss +13 -13
  23. package/core/styles/theming/_scrollbars.scss +24 -27
  24. package/core/styles/theming/_theming.scss +10 -8
  25. package/core/styles/typography/_typography-utils.scss +1 -1
  26. package/core/styles/typography/_typography.scss +29 -28
  27. package/core/styles/visual/_layout.scss +14 -13
  28. package/datepicker/_datepicker-theme.scss +5 -6
  29. package/divider/_divider-theme.scss +1 -1
  30. package/dl/_dl-theme.scss +9 -9
  31. package/dropdown/_dropdown-theme.scss +4 -4
  32. package/esm2022/button-toggle/button-toggle.component.mjs +2 -2
  33. package/esm2022/core/form-field/form-field-ref.mjs +8 -0
  34. package/esm2022/core/form-field/index.mjs +2 -0
  35. package/esm2022/core/public-api.mjs +2 -1
  36. package/esm2022/core/select/common.mjs +119 -0
  37. package/esm2022/core/select/index.mjs +2 -1
  38. package/esm2022/core/version.mjs +2 -2
  39. package/esm2022/datepicker/calendar-header.component.mjs +1 -1
  40. package/esm2022/file-upload/multiple-file-upload.component.mjs +2 -2
  41. package/esm2022/file-upload/single-file-upload.component.mjs +2 -2
  42. package/esm2022/form-field/form-field.mjs +5 -11
  43. package/esm2022/form-field/password-hint.mjs +5 -4
  44. package/esm2022/modal/modal.component.mjs +2 -2
  45. package/esm2022/navbar/navbar.component.mjs +2 -2
  46. package/esm2022/navbar/vertical-navbar.component.mjs +3 -3
  47. package/esm2022/select/select.component.mjs +17 -113
  48. package/esm2022/select/select.module.mjs +17 -17
  49. package/esm2022/tabs/tab-header.component.mjs +2 -2
  50. package/esm2022/tabs/tab-nav-bar/tab-nav-bar.mjs +2 -2
  51. package/esm2022/tags/tag-default-options.mjs +1 -1
  52. package/esm2022/tags/tag-input.mjs +17 -3
  53. package/esm2022/timepicker/timepicker.directive.mjs +10 -2
  54. package/esm2022/timezone/timezone-select.component.mjs +5 -5
  55. package/esm2022/toast/toast.service.mjs +17 -11
  56. package/esm2022/tree-select/tree-select.component.mjs +6 -7
  57. package/fesm2022/ptsecurity-mosaic-button-toggle.mjs +2 -2
  58. package/fesm2022/ptsecurity-mosaic-button-toggle.mjs.map +1 -1
  59. package/fesm2022/ptsecurity-mosaic-core.mjs +125 -4
  60. package/fesm2022/ptsecurity-mosaic-core.mjs.map +1 -1
  61. package/fesm2022/ptsecurity-mosaic-datepicker.mjs +1 -1
  62. package/fesm2022/ptsecurity-mosaic-datepicker.mjs.map +1 -1
  63. package/fesm2022/ptsecurity-mosaic-file-upload.mjs +4 -4
  64. package/fesm2022/ptsecurity-mosaic-file-upload.mjs.map +1 -1
  65. package/fesm2022/ptsecurity-mosaic-form-field.mjs +7 -13
  66. package/fesm2022/ptsecurity-mosaic-form-field.mjs.map +1 -1
  67. package/fesm2022/ptsecurity-mosaic-modal.mjs +2 -2
  68. package/fesm2022/ptsecurity-mosaic-modal.mjs.map +1 -1
  69. package/fesm2022/ptsecurity-mosaic-navbar.mjs +4 -4
  70. package/fesm2022/ptsecurity-mosaic-navbar.mjs.map +1 -1
  71. package/fesm2022/ptsecurity-mosaic-select.mjs +35 -131
  72. package/fesm2022/ptsecurity-mosaic-select.mjs.map +1 -1
  73. package/fesm2022/ptsecurity-mosaic-tabs.mjs +4 -4
  74. package/fesm2022/ptsecurity-mosaic-tabs.mjs.map +1 -1
  75. package/fesm2022/ptsecurity-mosaic-tags.mjs +17 -4
  76. package/fesm2022/ptsecurity-mosaic-tags.mjs.map +1 -1
  77. package/fesm2022/ptsecurity-mosaic-timepicker.mjs +9 -1
  78. package/fesm2022/ptsecurity-mosaic-timepicker.mjs.map +1 -1
  79. package/fesm2022/ptsecurity-mosaic-timezone.mjs +4 -4
  80. package/fesm2022/ptsecurity-mosaic-timezone.mjs.map +1 -1
  81. package/fesm2022/ptsecurity-mosaic-toast.mjs +15 -9
  82. package/fesm2022/ptsecurity-mosaic-toast.mjs.map +1 -1
  83. package/fesm2022/ptsecurity-mosaic-tree-select.mjs +6 -6
  84. package/fesm2022/ptsecurity-mosaic-tree-select.mjs.map +1 -1
  85. package/file-upload/_file-upload-theme.scss +7 -7
  86. package/file-upload/multiple-file-upload.component.scss +9 -9
  87. package/file-upload/single-file-upload.component.scss +3 -3
  88. package/form-field/_form-field-theme.scss +7 -5
  89. package/form-field/form-field.d.ts +1 -7
  90. package/form-field/form-field.scss +1 -1
  91. package/icon/_icon-theme.scss +1 -1
  92. package/input/_input-theme.scss +4 -4
  93. package/link/_link-theme.scss +3 -3
  94. package/list/_list-theme.scss +1 -1
  95. package/loader-overlay/_loader-overlay-theme.scss +2 -2
  96. package/markdown/_markdown-theme.scss +15 -15
  97. package/modal/_modal-theme.scss +4 -4
  98. package/modal/modal.scss +2 -2
  99. package/navbar/_navbar-theme.scss +6 -6
  100. package/navbar/navbar-item.scss +2 -2
  101. package/package.json +5 -5
  102. package/popover/_popover-theme.scss +4 -4
  103. package/prebuilt-themes/dark-theme.css +1 -1
  104. package/prebuilt-themes/default-theme.css +1 -1
  105. package/radio/_radio-theme.scss +2 -2
  106. package/select/_select-theme.scss +4 -4
  107. package/select/select.component.d.ts +2 -32
  108. package/select/select.module.d.ts +1 -1
  109. package/select/select.scss +1 -1
  110. package/sidepanel/_sidepanel-theme.scss +5 -5
  111. package/table/_table-theme.scss +2 -2
  112. package/tabs/_tabs-theme.scss +3 -3
  113. package/tabs/tab-header.scss +16 -12
  114. package/tabs/tab-nav-bar/tab-nav-bar.scss +15 -13
  115. package/tags/_tag-theme.scss +7 -7
  116. package/tags/tag-default-options.d.ts +1 -0
  117. package/tags/tag-input.d.ts +7 -1
  118. package/textarea/_textarea-theme.scss +2 -2
  119. package/timezone/_timezone-option-theme.scss +4 -4
  120. package/timezone/timezone-select.component.d.ts +2 -1
  121. package/toast/_toast-theme.scss +3 -3
  122. package/toast/toast.service.d.ts +8 -4
  123. package/toggle/_toggle-theme.scss +3 -3
  124. package/tooltip/_tooltip-theme.scss +4 -4
  125. package/tree/_tree-theme.scss +1 -1
  126. package/tree-select/_tree-select-theme.scss +1 -1
  127. package/tree-select/tree-select.component.d.ts +1 -2
  128. package/tree-select/tree-select.scss +1 -1
@@ -133,7 +133,7 @@
133
133
  @mixin mc-link-theme($theme) {
134
134
  $foreground: map.get($theme, foreground);
135
135
 
136
- $link: map.get(map.get($theme, components), link);
136
+ $link: map.get($theme, components, link);
137
137
 
138
138
  .mc-link:not(.mc-link_use-visited) {
139
139
  &:visited {
@@ -182,10 +182,10 @@
182
182
 
183
183
  @mixin mc-link-typography($config) {
184
184
  .mc-link {
185
- @include mc-typography-css-variables(link, default);
185
+ @include mc-typography-css-variables($config, link, default);
186
186
  }
187
187
 
188
188
  .mc-link.mc-link_caption {
189
- @include mc-typography-css-variables(link, caption);
189
+ @include mc-typography-css-variables($config, link, caption);
190
190
  }
191
191
  }
@@ -41,6 +41,6 @@
41
41
  @mixin mc-list-typography($config) {
42
42
  .mc-list-item,
43
43
  .mc-list-option {
44
- @include mc-typography-css-variables(list, item);
44
+ @include mc-typography-css-variables($config, list, item);
45
45
  }
46
46
  }
@@ -23,11 +23,11 @@
23
23
 
24
24
  @mixin mc-loader-overlay-typography($config) {
25
25
  .mc-loader-overlay-text {
26
- @include mc-typography-css-variables(loader-overlay, text);
26
+ @include mc-typography-css-variables($config, loader-overlay, text);
27
27
  }
28
28
 
29
29
  .mc-loader-overlay-caption {
30
- @include mc-typography-css-variables(loader-overlay, caption);
30
+ @include mc-typography-css-variables($config, loader-overlay, caption);
31
31
  }
32
32
  }
33
33
 
@@ -9,7 +9,7 @@
9
9
  $foreground: map.get($theme, foreground);
10
10
  $background: map.get($theme, background);
11
11
 
12
- $markdown: map.get(map.get($theme, components), markdown);
12
+ $markdown: map.get($theme, components, markdown);
13
13
 
14
14
  .mc-markdown {
15
15
  color: mc-css-variable(foreground-text, map-get($foreground, text));
@@ -98,60 +98,60 @@
98
98
  @mixin mc-markdown-typography($config) {
99
99
  .mc-markdown {
100
100
  .mc-markdown__h1 {
101
- @include mc-typography-css-variables(markdown-h1, default);
101
+ @include mc-typography-css-variables($config, markdown-h1, default);
102
102
  }
103
103
 
104
104
  .mc-markdown__h2 {
105
- @include mc-typography-css-variables(markdown-h2, default);
105
+ @include mc-typography-css-variables($config, markdown-h2, default);
106
106
  }
107
107
 
108
108
  .mc-markdown__h3 {
109
- @include mc-typography-css-variables(markdown-h3, default);
109
+ @include mc-typography-css-variables($config, markdown-h3, default);
110
110
  }
111
111
 
112
112
  .mc-markdown__h4 {
113
- @include mc-typography-css-variables(markdown-h4, default);
113
+ @include mc-typography-css-variables($config, markdown-h4, default);
114
114
  }
115
115
 
116
116
  .mc-markdown__h5 {
117
- @include mc-typography-css-variables(markdown-h5, default);
117
+ @include mc-typography-css-variables($config, markdown-h5, default);
118
118
  }
119
119
 
120
120
  .mc-markdown__h6 {
121
- @include mc-typography-css-variables(markdown-h6, default);
121
+ @include mc-typography-css-variables($config, markdown-h6, default);
122
122
  }
123
123
 
124
124
  .mc-markdown__p {
125
- @include mc-typography-css-variables(markdown-p, default);
125
+ @include mc-typography-css-variables($config, markdown-p, default);
126
126
  }
127
127
 
128
128
  .mc-markdown__ul,
129
129
  .mc-markdown__ol {
130
- @include mc-typography-css-variables(markdown-list, default);
130
+ @include mc-typography-css-variables($config, markdown-list, default);
131
131
  }
132
132
 
133
133
  .mc-markdown__blockquote > .mc-markdown__p {
134
- @include mc-typography-css-variables(markdown-blockquote, default);
134
+ @include mc-typography-css-variables($config, markdown-blockquote, default);
135
135
  }
136
136
 
137
137
  .mc-markdown__code {
138
- @include mc-typography-css-variables(markdown-code, default);
138
+ @include mc-typography-css-variables($config, markdown-code, default);
139
139
  }
140
140
 
141
141
  .mc-markdown__a {
142
- @include mc-typography-css-variables(markdown-link, default);
142
+ @include mc-typography-css-variables($config, markdown-link, default);
143
143
  }
144
144
 
145
145
  .mc-markdown__img + em {
146
- @include mc-typography-css-variables(markdown-image, caption);
146
+ @include mc-typography-css-variables($config, markdown-image, caption);
147
147
  }
148
148
 
149
149
  .mc-markdown__table > .mc-markdown__thead {
150
- @include mc-typography-css-variables(markdown-table, header);
150
+ @include mc-typography-css-variables($config, markdown-table, header);
151
151
  }
152
152
 
153
153
  .mc-markdown__table > .mc-markdown__tbody {
154
- @include mc-typography-css-variables(markdown-table, body);
154
+ @include mc-typography-css-variables($config, markdown-table, body);
155
155
  }
156
156
  }
157
157
  }
@@ -9,8 +9,8 @@
9
9
  $foreground: map.get($theme, foreground);
10
10
  $background: map.get($theme, background);
11
11
 
12
- $modal: map.get(map.get($theme, components), modal);
13
- $popup: map.get(map.get($theme, components), popup);
12
+ $modal: map.get($theme, components, modal);
13
+ $popup: map.get($theme, components, popup);
14
14
 
15
15
  .mc-modal {
16
16
  .mc-modal-content {
@@ -78,10 +78,10 @@
78
78
 
79
79
  @mixin mc-modal-typography($config) {
80
80
  .mc-modal-title {
81
- @include mc-typography-css-variables(modal-header, default);
81
+ @include mc-typography-css-variables($config, modal-header, default);
82
82
  }
83
83
 
84
84
  .mc-modal-body {
85
- @include mc-typography-css-variables(modal-body, default);
85
+ @include mc-typography-css-variables($config, modal-body, default);
86
86
  }
87
87
  }
package/modal/modal.scss CHANGED
@@ -73,8 +73,8 @@ $tokens: meta.module-variables(tokens) !default;
73
73
  }
74
74
 
75
75
  .mc-modal-title {
76
- margin-top: map.get($tokens, size-s);
77
- margin-bottom: map.get($tokens, size-s);
76
+ margin-top: mc-css-variable(size-s);
77
+ margin-bottom: mc-css-variable(size-s);
78
78
 
79
79
  display: -webkit-box;
80
80
  -webkit-box-orient: vertical;
@@ -8,8 +8,8 @@
8
8
  $background: map.get($theme, background);
9
9
  $primary: map.get($theme, primary);
10
10
 
11
- $navbar: map.get(map.get($theme, components), navbar);
12
- $navbar-item: map.get(map.get($theme, components), navbar-item);
11
+ $navbar: map.get($theme, components, navbar);
12
+ $navbar-item: map.get($theme, components, navbar-item);
13
13
 
14
14
  .mc-navbar,
15
15
  .mc-vertical-navbar .mc-vertical-navbar__container {
@@ -101,19 +101,19 @@ button {
101
101
 
102
102
  @mixin mc-navbar-typography($config) {
103
103
  .mc-navbar-title {
104
- @include mc-typography-css-variables(navbar, title);
104
+ @include mc-typography-css-variables($config, navbar, title);
105
105
  }
106
106
 
107
107
  .mc-navbar-subtitle {
108
- @include mc-typography-level-to-styles($config, extra-small-text);
108
+ @include mc-typography-level-to-styles_css-variables($config, typography, extra-small-text);
109
109
  }
110
110
 
111
111
  .mc-navbar-brand {
112
112
  .mc-navbar-title {
113
- @include mc-typography-css-variables(navbar-brand, title);
113
+ @include mc-typography-css-variables($config, navbar-brand, title);
114
114
 
115
115
  &.mc-navbar-title_small {
116
- @include mc-typography-level-to-styles($config, subheading);
116
+ @include mc-typography-level-to-styles_css-variables($config, typography, subheading);
117
117
 
118
118
  white-space: unset;
119
119
  }
@@ -82,8 +82,8 @@ $tokens: meta.module-variables(tokens) !default;
82
82
  }
83
83
 
84
84
  &.mc-navbar-item_has-nested {
85
- padding-left: map.get($tokens, size-s);
86
- padding-right: map.get($tokens, size-s);
85
+ padding-left: mc-css-variable(size-s);
86
+ padding-right: mc-css-variable(size-s);
87
87
  }
88
88
  }
89
89
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ptsecurity/mosaic",
3
- "version": "17.2.0",
3
+ "version": "17.3.0",
4
4
  "description": "Mosaic",
5
5
  "repository": {
6
6
  "type": "git",
@@ -19,10 +19,10 @@
19
19
  "peerDependencies": {
20
20
  "@angular/cdk": "^17.2.0",
21
21
  "@angular/forms": "^17.2.0",
22
- "@ptsecurity/cdk": "^17.2.0",
23
- "@ptsecurity/mosaic-moment-adapter": "^17.2.0",
24
- "@ptsecurity/mosaic-luxon-adapter": "^17.2.0",
25
- "@mosaic-design/date-formatter": "^2.1.5",
22
+ "@ptsecurity/cdk": "^17.3.0",
23
+ "@ptsecurity/mosaic-moment-adapter": "^17.3.0",
24
+ "@ptsecurity/mosaic-luxon-adapter": "^17.3.0",
25
+ "@mosaic-design/date-formatter": "^2.1.6",
26
26
  "@ptsecurity/mosaic-icons": "^7.0.8",
27
27
  "@mosaic-design/tokens-builder": "^3.0.0",
28
28
  "@mosaic-design/tokens-fe-2022": "^3.0.0",
@@ -7,7 +7,7 @@
7
7
  @mixin mc-popover-theme($theme) {
8
8
  $foreground: map.get($theme, foreground);
9
9
 
10
- $popover: map.get(map.get($theme, components), popover);
10
+ $popover: map.get($theme, components, popover);
11
11
 
12
12
  $header: map.get($popover, header);
13
13
  $footer: map.get($popover, footer);
@@ -96,14 +96,14 @@
96
96
 
97
97
  @mixin mc-popover-typography($config) {
98
98
  .mc-popover__header {
99
- @include mc-typography-css-variables(popover-header, default);
99
+ @include mc-typography-css-variables($config, popover-header, default);
100
100
  }
101
101
 
102
102
  .mc-popover__content {
103
- @include mc-typography-css-variables(popover, default);
103
+ @include mc-typography-css-variables($config, popover, default);
104
104
  }
105
105
 
106
106
  .mc-popover__footer {
107
- @include mc-typography-css-variables(popover-footer, default);
107
+ @include mc-typography-css-variables($config, popover-footer, default);
108
108
  }
109
109
  }