@ptsecurity/mosaic 13.1.1 → 13.3.1

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 (349) hide show
  1. package/_theming.scss +464 -165
  2. package/_visual.scss +419 -239
  3. package/button/button.component.d.ts +1 -1
  4. package/core/option/option.d.ts +1 -0
  5. package/core/validation/validation.d.ts +3 -3
  6. package/design-tokens/legacy-2017/tokens/components/alert.json5 +30 -30
  7. package/design-tokens/legacy-2017/tokens/components/badge.json5 +91 -101
  8. package/design-tokens/legacy-2017/tokens/components/button.json5 +53 -54
  9. package/design-tokens/legacy-2017/tokens/components/card.json5 +24 -24
  10. package/design-tokens/legacy-2017/tokens/components/checkbox.json5 +10 -10
  11. package/design-tokens/legacy-2017/tokens/components/datepicker.json5 +4 -4
  12. package/design-tokens/legacy-2017/tokens/components/dl.json5 +38 -0
  13. package/design-tokens/legacy-2017/tokens/components/dropdown.json5 +2 -1
  14. package/design-tokens/legacy-2017/tokens/components/form-field.json5 +48 -8
  15. package/design-tokens/legacy-2017/tokens/components/forms.json5 +4 -4
  16. package/design-tokens/legacy-2017/tokens/components/input.json5 +2 -3
  17. package/design-tokens/legacy-2017/tokens/components/link.json5 +13 -19
  18. package/design-tokens/legacy-2017/tokens/components/list.json5 +3 -5
  19. package/design-tokens/legacy-2017/tokens/components/modal.json5 +10 -8
  20. package/design-tokens/legacy-2017/tokens/components/navbar.json5 +12 -11
  21. package/design-tokens/legacy-2017/tokens/components/popover.json5 +18 -18
  22. package/design-tokens/legacy-2017/tokens/components/popup.json5 +8 -8
  23. package/design-tokens/legacy-2017/tokens/components/progress-bar.json5 +2 -2
  24. package/design-tokens/legacy-2017/tokens/components/radio.json5 +12 -12
  25. package/design-tokens/legacy-2017/tokens/components/select.json5 +0 -1
  26. package/design-tokens/legacy-2017/tokens/components/sidepanel.json5 +6 -4
  27. package/design-tokens/legacy-2017/tokens/components/table.json5 +1 -1
  28. package/design-tokens/legacy-2017/tokens/components/tabs.json5 +82 -6
  29. package/design-tokens/legacy-2017/tokens/components/tags.json5 +49 -50
  30. package/design-tokens/legacy-2017/tokens/components/toggle.json5 +17 -17
  31. package/design-tokens/legacy-2017/tokens/components/tooltip.json5 +21 -21
  32. package/design-tokens/legacy-2017/tokens/components/tree.json5 +5 -2
  33. package/design-tokens/legacy-2017/tokens/properties/colors.json5 +35 -31
  34. package/design-tokens/legacy-2017/tokens/properties/globals.json5 +20 -1
  35. package/design-tokens/legacy-2017/tokens/properties/typography.json5 +70 -35
  36. package/design-tokens/legacy-2017/tokens.d.ts +155 -56
  37. package/design-tokens/pt-2022/tokens/components/alert.json5 +30 -30
  38. package/design-tokens/pt-2022/tokens/components/badge.json5 +92 -102
  39. package/design-tokens/pt-2022/tokens/components/button.json5 +54 -55
  40. package/design-tokens/pt-2022/tokens/components/card.json5 +24 -24
  41. package/design-tokens/pt-2022/tokens/components/checkbox.json5 +10 -10
  42. package/design-tokens/pt-2022/tokens/components/datepicker.json5 +4 -4
  43. package/design-tokens/pt-2022/tokens/components/dl.json5 +38 -0
  44. package/design-tokens/pt-2022/tokens/components/dropdown.json5 +2 -1
  45. package/design-tokens/pt-2022/tokens/components/form-field.json5 +48 -8
  46. package/design-tokens/pt-2022/tokens/components/forms.json5 +4 -4
  47. package/design-tokens/pt-2022/tokens/components/input.json5 +2 -3
  48. package/design-tokens/pt-2022/tokens/components/link.json5 +17 -23
  49. package/design-tokens/pt-2022/tokens/components/list.json5 +2 -4
  50. package/design-tokens/pt-2022/tokens/components/modal.json5 +10 -8
  51. package/design-tokens/pt-2022/tokens/components/navbar.json5 +14 -13
  52. package/design-tokens/pt-2022/tokens/components/popover.json5 +21 -21
  53. package/design-tokens/pt-2022/tokens/components/popup.json5 +8 -8
  54. package/design-tokens/pt-2022/tokens/components/progress-bar.json5 +1 -1
  55. package/design-tokens/pt-2022/tokens/components/radio.json5 +12 -12
  56. package/design-tokens/pt-2022/tokens/components/select.json5 +0 -1
  57. package/design-tokens/pt-2022/tokens/components/sidepanel.json5 +7 -5
  58. package/design-tokens/pt-2022/tokens/components/table.json5 +1 -1
  59. package/design-tokens/pt-2022/tokens/components/tabs.json5 +82 -6
  60. package/design-tokens/pt-2022/tokens/components/tags.json5 +49 -50
  61. package/design-tokens/pt-2022/tokens/components/toggle.json5 +18 -18
  62. package/design-tokens/pt-2022/tokens/components/tooltip.json5 +23 -23
  63. package/design-tokens/pt-2022/tokens/components/tree.json5 +5 -2
  64. package/design-tokens/pt-2022/tokens/properties/colors.json5 +37 -33
  65. package/design-tokens/pt-2022/tokens/properties/globals.json5 +20 -1
  66. package/design-tokens/pt-2022/tokens/properties/typography.json5 +69 -34
  67. package/design-tokens/pt-2022/tokens.d.ts +151 -52
  68. package/dl/README.md +0 -0
  69. package/dl/dl.component.d.ts +26 -0
  70. package/dl/dl.module.d.ts +10 -0
  71. package/dl/index.d.ts +1 -0
  72. package/dl/package.json +10 -0
  73. package/dl/ptsecurity-mosaic-dl.d.ts +5 -0
  74. package/dl/public-api.d.ts +2 -0
  75. package/esm2020/autocomplete/autocomplete-origin.directive.mjs +3 -3
  76. package/esm2020/autocomplete/autocomplete-trigger.directive.mjs +3 -3
  77. package/esm2020/autocomplete/autocomplete.component.mjs +3 -3
  78. package/esm2020/autocomplete/autocomplete.module.mjs +4 -4
  79. package/esm2020/button/button.component.mjs +29 -21
  80. package/esm2020/button/button.module.mjs +4 -4
  81. package/esm2020/button-toggle/button-toggle.component.mjs +6 -6
  82. package/esm2020/button-toggle/button-toggle.module.mjs +4 -4
  83. package/esm2020/card/card.component.mjs +3 -3
  84. package/esm2020/card/card.module.mjs +4 -4
  85. package/esm2020/checkbox/checkbox-module.mjs +4 -4
  86. package/esm2020/checkbox/checkbox-required-validator.mjs +3 -3
  87. package/esm2020/checkbox/checkbox.mjs +3 -3
  88. package/esm2020/core/common-behaviors/common-module.mjs +4 -4
  89. package/esm2020/core/error/error-options.mjs +6 -6
  90. package/esm2020/core/formatters/date/formatter.mjs +3 -3
  91. package/esm2020/core/formatters/index.mjs +4 -4
  92. package/esm2020/core/formatters/number/formatter.mjs +4 -4
  93. package/esm2020/core/forms/forms-module.mjs +4 -4
  94. package/esm2020/core/forms/forms.directive.mjs +6 -6
  95. package/esm2020/core/highlight/highlight.pipe.mjs +3 -3
  96. package/esm2020/core/highlight/index.mjs +4 -4
  97. package/esm2020/core/line/line.mjs +7 -7
  98. package/esm2020/core/option/action.mjs +3 -3
  99. package/esm2020/core/option/optgroup.mjs +3 -3
  100. package/esm2020/core/option/option-module.mjs +4 -4
  101. package/esm2020/core/option/option.mjs +10 -7
  102. package/esm2020/core/pop-up/pop-up-trigger.mjs +3 -3
  103. package/esm2020/core/pop-up/pop-up.mjs +3 -3
  104. package/esm2020/core/selection/pseudo-checkbox/pseudo-checkbox.mjs +3 -3
  105. package/esm2020/core/selection/pseudo-checkbox/pseudo-checkbox.module.mjs +4 -4
  106. package/esm2020/core/services/measure-scrollbar.service.mjs +3 -3
  107. package/esm2020/core/validation/validation.mjs +10 -5
  108. package/esm2020/datepicker/calendar-body.component.mjs +3 -3
  109. package/esm2020/datepicker/calendar.component.mjs +6 -6
  110. package/esm2020/datepicker/datepicker-input.directive.mjs +3 -3
  111. package/esm2020/datepicker/datepicker-intl.mjs +3 -3
  112. package/esm2020/datepicker/datepicker-module.mjs +4 -4
  113. package/esm2020/datepicker/datepicker-toggle.component.mjs +6 -6
  114. package/esm2020/datepicker/datepicker.component.mjs +6 -6
  115. package/esm2020/datepicker/month-view.component.mjs +3 -3
  116. package/esm2020/datepicker/multi-year-view.component.mjs +3 -3
  117. package/esm2020/datepicker/year-view.component.mjs +3 -3
  118. package/esm2020/design-tokens/legacy-2017/tokens.mjs +156 -57
  119. package/esm2020/design-tokens/pt-2022/tokens.mjs +152 -53
  120. package/esm2020/divider/divider.component.mjs +3 -3
  121. package/esm2020/divider/divider.module.mjs +4 -4
  122. package/esm2020/dl/dl.component.mjs +78 -0
  123. package/esm2020/dl/dl.module.mjs +42 -0
  124. package/esm2020/dl/index.mjs +2 -0
  125. package/esm2020/dl/ptsecurity-mosaic-dl.mjs +5 -0
  126. package/esm2020/dl/public-api.mjs +3 -0
  127. package/esm2020/dropdown/dropdown-content.directive.mjs +3 -3
  128. package/esm2020/dropdown/dropdown-item.component.mjs +5 -5
  129. package/esm2020/dropdown/dropdown-trigger.directive.mjs +3 -3
  130. package/esm2020/dropdown/dropdown.component.mjs +6 -6
  131. package/esm2020/dropdown/dropdown.module.mjs +4 -4
  132. package/esm2020/form-field/cleaner.mjs +3 -3
  133. package/esm2020/form-field/form-field.mjs +48 -28
  134. package/esm2020/form-field/form-field.module.mjs +10 -5
  135. package/esm2020/form-field/hint.mjs +6 -6
  136. package/esm2020/form-field/password-hint.mjs +134 -0
  137. package/esm2020/form-field/prefix.mjs +3 -3
  138. package/esm2020/form-field/public-api.mjs +2 -1
  139. package/esm2020/form-field/stepper.mjs +3 -3
  140. package/esm2020/form-field/suffix.mjs +3 -3
  141. package/esm2020/icon/icon.component.mjs +6 -6
  142. package/esm2020/icon/icon.module.mjs +4 -4
  143. package/esm2020/input/input-number-validators.mjs +6 -6
  144. package/esm2020/input/input-number.mjs +3 -3
  145. package/esm2020/input/input-password.mjs +368 -0
  146. package/esm2020/input/input.mjs +12 -11
  147. package/esm2020/input/input.module.mjs +50 -8
  148. package/esm2020/input/public-api.mjs +2 -1
  149. package/esm2020/link/link.component.mjs +3 -3
  150. package/esm2020/link/link.module.mjs +4 -4
  151. package/esm2020/list/list-selection.component.mjs +11 -11
  152. package/esm2020/list/list.component.mjs +7 -7
  153. package/esm2020/list/list.module.mjs +4 -4
  154. package/esm2020/modal/css-unit.pipe.mjs +3 -3
  155. package/esm2020/modal/modal-control.service.mjs +3 -3
  156. package/esm2020/modal/modal.component.mjs +4 -4
  157. package/esm2020/modal/modal.directive.mjs +12 -12
  158. package/esm2020/modal/modal.module.mjs +4 -4
  159. package/esm2020/modal/modal.service.mjs +3 -3
  160. package/esm2020/navbar/navbar-item.component.mjs +80 -79
  161. package/esm2020/navbar/navbar.component.mjs +10 -10
  162. package/esm2020/navbar/navbar.module.mjs +4 -4
  163. package/esm2020/navbar/vertical-navbar.component.mjs +6 -6
  164. package/esm2020/popover/popover-confirm.component.mjs +8 -8
  165. package/esm2020/popover/popover.component.mjs +8 -8
  166. package/esm2020/popover/popover.module.mjs +4 -4
  167. package/esm2020/progress-bar/progress-bar.component.mjs +3 -3
  168. package/esm2020/progress-bar/progress-bar.module.mjs +4 -4
  169. package/esm2020/progress-spinner/progress-spinner.component.mjs +3 -3
  170. package/esm2020/progress-spinner/progress-spinner.module.mjs +4 -4
  171. package/esm2020/radio/radio.component.mjs +6 -6
  172. package/esm2020/radio/radio.module.mjs +4 -4
  173. package/esm2020/select/public-api.mjs +2 -1
  174. package/esm2020/select/select-option.directive.mjs +65 -0
  175. package/esm2020/select/select.component.mjs +16 -16
  176. package/esm2020/select/select.module.mjs +19 -10
  177. package/esm2020/sidebar/sidebar.component.mjs +9 -9
  178. package/esm2020/sidebar/sidebar.module.mjs +4 -4
  179. package/esm2020/sidepanel/sidepanel-container.component.mjs +5 -5
  180. package/esm2020/sidepanel/sidepanel-directives.mjs +18 -18
  181. package/esm2020/sidepanel/sidepanel.module.mjs +4 -4
  182. package/esm2020/sidepanel/sidepanel.service.mjs +3 -3
  183. package/esm2020/splitter/splitter.component.mjs +12 -12
  184. package/esm2020/splitter/splitter.module.mjs +4 -4
  185. package/esm2020/table/table.component.mjs +3 -3
  186. package/esm2020/table/table.module.mjs +4 -4
  187. package/esm2020/tabs/paginated-tab-header.mjs +3 -3
  188. package/esm2020/tabs/tab-body.component.mjs +6 -6
  189. package/esm2020/tabs/tab-content.directive.mjs +3 -3
  190. package/esm2020/tabs/tab-group.component.mjs +20 -20
  191. package/esm2020/tabs/tab-header.component.mjs +4 -4
  192. package/esm2020/tabs/tab-label-wrapper.directive.mjs +3 -3
  193. package/esm2020/tabs/tab-label.directive.mjs +3 -3
  194. package/esm2020/tabs/tab-nav-bar/tab-nav-bar.mjs +9 -9
  195. package/esm2020/tabs/tab.component.mjs +3 -3
  196. package/esm2020/tabs/tabs.module.mjs +4 -4
  197. package/esm2020/tags/tag-input.mjs +3 -3
  198. package/esm2020/tags/tag-list.component.mjs +6 -6
  199. package/esm2020/tags/tag.component.mjs +60 -60
  200. package/esm2020/tags/tag.module.mjs +4 -4
  201. package/esm2020/textarea/textarea.component.mjs +9 -8
  202. package/esm2020/textarea/textarea.module.mjs +4 -4
  203. package/esm2020/timepicker/timepicker.directive.mjs +3 -3
  204. package/esm2020/timepicker/timepicker.module.mjs +4 -4
  205. package/esm2020/toggle/toggle.component.mjs +3 -3
  206. package/esm2020/toggle/toggle.module.mjs +4 -4
  207. package/esm2020/tooltip/tooltip.component.mjs +14 -13
  208. package/esm2020/tooltip/tooltip.module.mjs +4 -4
  209. package/esm2020/tree/node.mjs +3 -3
  210. package/esm2020/tree/outlet.mjs +3 -3
  211. package/esm2020/tree/padding.directive.mjs +12 -9
  212. package/esm2020/tree/toggle.mjs +10 -10
  213. package/esm2020/tree/tree-base.mjs +6 -6
  214. package/esm2020/tree/tree-option.component.mjs +9 -9
  215. package/esm2020/tree/tree-selection.component.mjs +8 -6
  216. package/esm2020/tree/tree.mjs +3 -3
  217. package/esm2020/tree/tree.module.mjs +4 -4
  218. package/esm2020/tree-select/tree-select.component.mjs +14 -14
  219. package/esm2020/tree-select/tree-select.module.mjs +4 -4
  220. package/fesm2015/ptsecurity-mosaic-autocomplete.mjs +13 -13
  221. package/fesm2015/ptsecurity-mosaic-button-toggle.mjs +10 -10
  222. package/fesm2015/ptsecurity-mosaic-button.mjs +32 -24
  223. package/fesm2015/ptsecurity-mosaic-button.mjs.map +1 -1
  224. package/fesm2015/ptsecurity-mosaic-card.mjs +7 -7
  225. package/fesm2015/ptsecurity-mosaic-checkbox.mjs +10 -10
  226. package/fesm2015/ptsecurity-mosaic-core.mjs +89 -81
  227. package/fesm2015/ptsecurity-mosaic-core.mjs.map +1 -1
  228. package/fesm2015/ptsecurity-mosaic-datepicker.mjs +40 -40
  229. package/fesm2015/ptsecurity-mosaic-design-tokens.mjs +443 -146
  230. package/fesm2015/ptsecurity-mosaic-design-tokens.mjs.map +1 -1
  231. package/fesm2015/ptsecurity-mosaic-divider.mjs +7 -7
  232. package/fesm2015/ptsecurity-mosaic-dl.mjs +124 -0
  233. package/fesm2015/ptsecurity-mosaic-dl.mjs.map +1 -0
  234. package/fesm2015/ptsecurity-mosaic-dropdown.mjs +19 -19
  235. package/fesm2015/ptsecurity-mosaic-dropdown.mjs.map +1 -1
  236. package/fesm2015/ptsecurity-mosaic-form-field.mjs +214 -50
  237. package/fesm2015/ptsecurity-mosaic-form-field.mjs.map +1 -1
  238. package/fesm2015/ptsecurity-mosaic-icon.mjs +10 -10
  239. package/fesm2015/ptsecurity-mosaic-input.mjs +434 -31
  240. package/fesm2015/ptsecurity-mosaic-input.mjs.map +1 -1
  241. package/fesm2015/ptsecurity-mosaic-link.mjs +7 -7
  242. package/fesm2015/ptsecurity-mosaic-list.mjs +21 -21
  243. package/fesm2015/ptsecurity-mosaic-list.mjs.map +1 -1
  244. package/fesm2015/ptsecurity-mosaic-modal.mjs +29 -29
  245. package/fesm2015/ptsecurity-mosaic-modal.mjs.map +1 -1
  246. package/fesm2015/ptsecurity-mosaic-navbar.mjs +97 -96
  247. package/fesm2015/ptsecurity-mosaic-navbar.mjs.map +1 -1
  248. package/fesm2015/ptsecurity-mosaic-popover.mjs +18 -18
  249. package/fesm2015/ptsecurity-mosaic-popover.mjs.map +1 -1
  250. package/fesm2015/ptsecurity-mosaic-progress-bar.mjs +7 -7
  251. package/fesm2015/ptsecurity-mosaic-progress-spinner.mjs +7 -7
  252. package/fesm2015/ptsecurity-mosaic-radio.mjs +10 -10
  253. package/fesm2015/ptsecurity-mosaic-select.mjs +99 -33
  254. package/fesm2015/ptsecurity-mosaic-select.mjs.map +1 -1
  255. package/fesm2015/ptsecurity-mosaic-sidebar.mjs +13 -13
  256. package/fesm2015/ptsecurity-mosaic-sidepanel.mjs +28 -28
  257. package/fesm2015/ptsecurity-mosaic-sidepanel.mjs.map +1 -1
  258. package/fesm2015/ptsecurity-mosaic-splitter.mjs +16 -16
  259. package/fesm2015/ptsecurity-mosaic-table.mjs +7 -7
  260. package/fesm2015/ptsecurity-mosaic-tabs.mjs +56 -56
  261. package/fesm2015/ptsecurity-mosaic-tabs.mjs.map +1 -1
  262. package/fesm2015/ptsecurity-mosaic-tags.mjs +74 -74
  263. package/fesm2015/ptsecurity-mosaic-tags.mjs.map +1 -1
  264. package/fesm2015/ptsecurity-mosaic-textarea.mjs +11 -10
  265. package/fesm2015/ptsecurity-mosaic-textarea.mjs.map +1 -1
  266. package/fesm2015/ptsecurity-mosaic-timepicker.mjs +7 -7
  267. package/fesm2015/ptsecurity-mosaic-toggle.mjs +7 -7
  268. package/fesm2015/ptsecurity-mosaic-tooltip.mjs +17 -16
  269. package/fesm2015/ptsecurity-mosaic-tooltip.mjs.map +1 -1
  270. package/fesm2015/ptsecurity-mosaic-tree-select.mjs +17 -17
  271. package/fesm2015/ptsecurity-mosaic-tree-select.mjs.map +1 -1
  272. package/fesm2015/ptsecurity-mosaic-tree.mjs +158 -155
  273. package/fesm2015/ptsecurity-mosaic-tree.mjs.map +1 -1
  274. package/fesm2020/ptsecurity-mosaic-autocomplete.mjs +13 -13
  275. package/fesm2020/ptsecurity-mosaic-button-toggle.mjs +10 -10
  276. package/fesm2020/ptsecurity-mosaic-button.mjs +32 -24
  277. package/fesm2020/ptsecurity-mosaic-button.mjs.map +1 -1
  278. package/fesm2020/ptsecurity-mosaic-card.mjs +7 -7
  279. package/fesm2020/ptsecurity-mosaic-checkbox.mjs +10 -10
  280. package/fesm2020/ptsecurity-mosaic-core.mjs +89 -81
  281. package/fesm2020/ptsecurity-mosaic-core.mjs.map +1 -1
  282. package/fesm2020/ptsecurity-mosaic-datepicker.mjs +40 -40
  283. package/fesm2020/ptsecurity-mosaic-design-tokens.mjs +443 -146
  284. package/fesm2020/ptsecurity-mosaic-design-tokens.mjs.map +1 -1
  285. package/fesm2020/ptsecurity-mosaic-divider.mjs +7 -7
  286. package/fesm2020/ptsecurity-mosaic-dl.mjs +124 -0
  287. package/fesm2020/ptsecurity-mosaic-dl.mjs.map +1 -0
  288. package/fesm2020/ptsecurity-mosaic-dropdown.mjs +19 -19
  289. package/fesm2020/ptsecurity-mosaic-dropdown.mjs.map +1 -1
  290. package/fesm2020/ptsecurity-mosaic-form-field.mjs +200 -50
  291. package/fesm2020/ptsecurity-mosaic-form-field.mjs.map +1 -1
  292. package/fesm2020/ptsecurity-mosaic-icon.mjs +10 -10
  293. package/fesm2020/ptsecurity-mosaic-input.mjs +427 -31
  294. package/fesm2020/ptsecurity-mosaic-input.mjs.map +1 -1
  295. package/fesm2020/ptsecurity-mosaic-link.mjs +7 -7
  296. package/fesm2020/ptsecurity-mosaic-list.mjs +21 -21
  297. package/fesm2020/ptsecurity-mosaic-list.mjs.map +1 -1
  298. package/fesm2020/ptsecurity-mosaic-modal.mjs +29 -29
  299. package/fesm2020/ptsecurity-mosaic-modal.mjs.map +1 -1
  300. package/fesm2020/ptsecurity-mosaic-navbar.mjs +97 -96
  301. package/fesm2020/ptsecurity-mosaic-navbar.mjs.map +1 -1
  302. package/fesm2020/ptsecurity-mosaic-popover.mjs +18 -18
  303. package/fesm2020/ptsecurity-mosaic-popover.mjs.map +1 -1
  304. package/fesm2020/ptsecurity-mosaic-progress-bar.mjs +7 -7
  305. package/fesm2020/ptsecurity-mosaic-progress-spinner.mjs +7 -7
  306. package/fesm2020/ptsecurity-mosaic-radio.mjs +10 -10
  307. package/fesm2020/ptsecurity-mosaic-select.mjs +96 -32
  308. package/fesm2020/ptsecurity-mosaic-select.mjs.map +1 -1
  309. package/fesm2020/ptsecurity-mosaic-sidebar.mjs +13 -13
  310. package/fesm2020/ptsecurity-mosaic-sidepanel.mjs +28 -28
  311. package/fesm2020/ptsecurity-mosaic-sidepanel.mjs.map +1 -1
  312. package/fesm2020/ptsecurity-mosaic-splitter.mjs +16 -16
  313. package/fesm2020/ptsecurity-mosaic-table.mjs +7 -7
  314. package/fesm2020/ptsecurity-mosaic-tabs.mjs +56 -56
  315. package/fesm2020/ptsecurity-mosaic-tabs.mjs.map +1 -1
  316. package/fesm2020/ptsecurity-mosaic-tags.mjs +72 -72
  317. package/fesm2020/ptsecurity-mosaic-tags.mjs.map +1 -1
  318. package/fesm2020/ptsecurity-mosaic-textarea.mjs +11 -10
  319. package/fesm2020/ptsecurity-mosaic-textarea.mjs.map +1 -1
  320. package/fesm2020/ptsecurity-mosaic-timepicker.mjs +7 -7
  321. package/fesm2020/ptsecurity-mosaic-toggle.mjs +7 -7
  322. package/fesm2020/ptsecurity-mosaic-tooltip.mjs +17 -16
  323. package/fesm2020/ptsecurity-mosaic-tooltip.mjs.map +1 -1
  324. package/fesm2020/ptsecurity-mosaic-tree-select.mjs +17 -17
  325. package/fesm2020/ptsecurity-mosaic-tree-select.mjs.map +1 -1
  326. package/fesm2020/ptsecurity-mosaic-tree.mjs +155 -152
  327. package/fesm2020/ptsecurity-mosaic-tree.mjs.map +1 -1
  328. package/form-field/form-field.d.ts +9 -2
  329. package/form-field/form-field.module.d.ts +8 -7
  330. package/form-field/password-hint.d.ts +40 -0
  331. package/form-field/public-api.d.ts +1 -0
  332. package/input/input-password.d.ts +121 -0
  333. package/input/input.d.ts +4 -3
  334. package/input/input.module.d.ts +7 -6
  335. package/input/public-api.d.ts +1 -0
  336. package/list/list-selection.component.d.ts +1 -1
  337. package/navbar/navbar-item.component.d.ts +18 -18
  338. package/package.json +12 -4
  339. package/prebuilt-themes/dark-theme.css +1 -1
  340. package/prebuilt-themes/default-theme.css +1 -1
  341. package/prebuilt-visual/default-visual.css +1 -1
  342. package/select/public-api.d.ts +1 -0
  343. package/select/select-option.directive.d.ts +20 -0
  344. package/select/select.module.d.ts +9 -7
  345. package/tags/tag.component.d.ts +20 -20
  346. package/textarea/textarea.component.d.ts +4 -3
  347. package/toggle/README.md +0 -0
  348. package/tree/padding.directive.d.ts +7 -5
  349. package/tree/tree-option.component.d.ts +2 -2
package/design-tokens/pt-2022/tokens/components/tabs.json5 CHANGED
@@ -1,14 +1,56 @@
1
1
  {
2
2
  tabs: {
3
3
  'light-color-scheme': {
4
- border: { value: '{light-color-scheme.foreground.divider.value}' },
5
- 'state-active': { value: '{light-color-scheme.primary.default.value}' },
6
- 'state-disabled-overlay': { value: '{light-color-scheme.background.overlay-disabled.value}' }
4
+ border: { value: '{light-color-scheme.second.palette.value.100}' },
5
+
6
+ state: {
7
+ normal: {
8
+ icon: { value: '{light-color-scheme.foreground.icon}' },
9
+ text: { value: '{light-color-scheme.foreground.text}' }
10
+ },
11
+ hover: {
12
+ icon: { value: '{light-color-scheme.foreground.text}' },
13
+ text: { value: '{light-color-scheme.foreground.text}' }
14
+ },
15
+ active: {
16
+ 'marker-color': { value: '{light-color-scheme.primary.default}' }
17
+ },
18
+ empty: {
19
+ icon: { value: '{light-color-scheme.foreground.text-disabled}' },
20
+ text: { value: '{light-color-scheme.foreground.text-disabled}' }
21
+ },
22
+ disabled: {
23
+ icon: { value: '{light-color-scheme.foreground.text-disabled}' },
24
+ text: { value: '{light-color-scheme.foreground.text-disabled}' },
25
+ 'marker-opacity': { value: '0.3' }
26
+ }
27
+ }
7
28
  },
8
29
  'dark-color-scheme': {
9
- border: { value: '{dark-color-scheme.foreground.divider.value}' },
10
- 'state-active': { value: '{dark-color-scheme.primary.default.value}' },
11
- 'state-disabled-overlay': { value: '{dark-color-scheme.background.overlay-disabled.value}' }
30
+ border: { value: '{dark-color-scheme.second.palette.value.700}' },
31
+
32
+ state: {
33
+ normal: {
34
+ icon: { value: '{dark-color-scheme.foreground.icon}' },
35
+ text: { value: '{dark-color-scheme.foreground.text}' }
36
+ },
37
+ hover: {
38
+ icon: { value: '{dark-color-scheme.foreground.text}' },
39
+ text: { value: '{dark-color-scheme.foreground.text}' }
40
+ },
41
+ active: {
42
+ 'marker-color': { value: '{dark-color-scheme.primary.default}' }
43
+ },
44
+ empty: {
45
+ icon: { value: '{dark-color-scheme.foreground.text-disabled}' },
46
+ text: { value: '{dark-color-scheme.foreground.text-disabled}' }
47
+ },
48
+ disabled: {
49
+ icon: { value: '{dark-color-scheme.foreground.text-disabled}' },
50
+ text: { value: '{dark-color-scheme.foreground.text-disabled}' },
51
+ 'marker-opacity': { value: '0.3' }
52
+ }
53
+ }
12
54
  },
13
55
  size: {
14
56
  height: { value: '40px' },
@@ -21,5 +63,39 @@
21
63
  font: {
22
64
  default: { value: 'body' }
23
65
  }
66
+ },
67
+ 'vertical-tabs': {
68
+ 'light-color-scheme': {
69
+ state: {
70
+ normal: {
71
+ background: { value: 'transparent' },
72
+ },
73
+ selected: {
74
+ background: { value: '{light-color-scheme.states.selected-color}' },
75
+ },
76
+ hover: {
77
+ background: { value: '{light-color-scheme.background.overlay-hover}' },
78
+ },
79
+ 'hover-selected': {
80
+ background: { value: 'adjust-color({light-color-scheme.states.selected-color}, $saturation:-22%, $lightness:-5%)' },
81
+ }
82
+ }
83
+ },
84
+ 'dark-color-scheme': {
85
+ state: {
86
+ normal: {
87
+ background: { value: 'transparent' },
88
+ },
89
+ selected: {
90
+ background: { value: '{dark-color-scheme.states.selected-color}' },
91
+ },
92
+ hover: {
93
+ background: { value: '{dark-color-scheme.background.overlay-hover}' },
94
+ },
95
+ 'hover-selected': {
96
+ background: { value: 'adjust-color({dark-color-scheme.states.selected-color}, $lightness:-1%)' },
97
+ }
98
+ }
99
+ }
24
100
  }
25
101
  }
package/design-tokens/pt-2022/tokens/components/tags.json5 CHANGED
@@ -2,100 +2,100 @@
2
2
  tags: {
3
3
  'light-color-scheme': {
4
4
  primary: {
5
- background: { value: '{light-color-scheme.primary.palette.value.60.value}' },
6
- border: { value: '{light-color-scheme.primary.palette.value.60.value}' },
7
- text: { value: '{light-color-scheme.primary.default.value}' },
8
- icon: { value: 'mix({light-color-scheme.primary.palette.value.300.value}, {light-color-scheme.background.overlay-hover.value})' },
5
+ background: { value: '{light-color-scheme.primary.palette.value.60}' },
6
+ border: { value: '{light-color-scheme.primary.palette.value.60}' },
7
+ text: { value: '{light-color-scheme.primary.default}' },
8
+ icon: { value: 'mix({light-color-scheme.primary.palette.value.300}, {light-color-scheme.background.overlay-hover})' },
9
9
  states: {
10
10
  hover: {
11
- icon: { value: '{light-color-scheme.primary.palette.value.560.value}' }
11
+ icon: { value: '{light-color-scheme.primary.palette.value.560}' }
12
12
  },
13
- focused:{ value: '{light-color-scheme.states.focused-color.value}' },
13
+ focused:{ value: '{light-color-scheme.states.focused-color}' },
14
14
  disabled: {
15
- text: { value: 'mix({light-color-scheme.primary.palette.value.500.value}, transparent, 50%)' },
16
- background: { value: 'mix({light-color-scheme.primary.palette.value.500.value}, transparent, 10%)' }
15
+ text: { value: 'mix({light-color-scheme.primary.palette.value.500}, transparent, 50%)' },
16
+ background: { value: 'mix({light-color-scheme.primary.palette.value.500}, transparent, 10%)' }
17
17
  }
18
18
  }
19
19
  },
20
20
  second: {
21
- background: { value: '{light-color-scheme.second.palette.value.100.value}' },
22
- border: { value: '{light-color-scheme.second.palette.value.100.value}' },
23
- text: { value: '{light-color-scheme.foreground.text.value}' },
24
- icon: { value: 'mix({light-color-scheme.second.palette.value.300.value}, {light-color-scheme.background.overlay-hover.value})' },
21
+ background: { value: '{light-color-scheme.second.palette.value.100}' },
22
+ border: { value: '{light-color-scheme.second.palette.value.100}' },
23
+ text: { value: '{light-color-scheme.foreground.text}' },
24
+ icon: { value: 'mix({light-color-scheme.second.palette.value.300}, {light-color-scheme.background.overlay-hover})' },
25
25
  states: {
26
26
  hover: {
27
- icon: { value: '{light-color-scheme.second.palette.value.560.value}' }
27
+ icon: { value: '{light-color-scheme.second.palette.value.560}' }
28
28
  },
29
- focused: { value: '{light-color-scheme.states.focused-color.value}' },
29
+ focused: { value: '{light-color-scheme.states.focused-color}' },
30
30
  disabled: {
31
- text: { value: 'mix({light-color-scheme.second.palette.value.300.value}, transparent, 50%)' },
32
- background: { value: 'mix({light-color-scheme.second.palette.value.300.value}, transparent, 10%)' }
31
+ text: { value: 'mix({light-color-scheme.second.palette.value.300}, transparent, 50%)' },
32
+ background: { value: 'mix({light-color-scheme.second.palette.value.300}, transparent, 10%)' }
33
33
  }
34
34
  }
35
35
  },
36
36
  error: {
37
- background: { value: '{light-color-scheme.error.palette.value.60.value}' },
38
- border: { value: '{light-color-scheme.error.palette.value.60.value}' },
39
- text: { value: '{light-color-scheme.error.default.value}' },
40
- icon: { value: 'mix({light-color-scheme.error.palette.value.300.value}, {light-color-scheme.background.overlay-hover.value})' },
37
+ background: { value: '{light-color-scheme.error.palette.value.60}' },
38
+ border: { value: '{light-color-scheme.error.palette.value.60}' },
39
+ text: { value: '{light-color-scheme.error.default}' },
40
+ icon: { value: 'mix({light-color-scheme.error.palette.value.300}, {light-color-scheme.background.overlay-hover})' },
41
41
  states: {
42
42
  hover: {
43
- icon: { value: '{light-color-scheme.error.palette.value.500.value}' }
43
+ icon: { value: '{light-color-scheme.error.palette.value.500}' }
44
44
  },
45
- focused: { value: '{light-color-scheme.states.focused-color-error.value}' },
45
+ focused: { value: '{light-color-scheme.states.focused-color-error}' },
46
46
  disabled: {
47
- text: { value: 'mix({light-color-scheme.error.palette.value.400.value}, transparent, 50%)' },
48
- background: { value: 'mix({light-color-scheme.error.palette.value.400.value}, transparent, 10%)' }
47
+ text: { value: 'mix({light-color-scheme.error.palette.value.400}, transparent, 50%)' },
48
+ background: { value: 'mix({light-color-scheme.error.palette.value.400}, transparent, 10%)' }
49
49
  }
50
50
  }
51
51
  }
52
52
  },
53
53
  'dark-color-scheme': {
54
54
  primary: {
55
- background: { value: '{dark-color-scheme.primary.palette.value.700.value}' },
56
- border: { value: '{dark-color-scheme.primary.palette.value.700.value}' },
57
- text: { value: '{dark-color-scheme.primary.palette.value.200.value}' },
58
- icon: { value: 'mix({dark-color-scheme.primary.palette.value.200.value}, {dark-color-scheme.background.overlay-hover.value})' },
55
+ background: { value: '{dark-color-scheme.primary.palette.value.700}' },
56
+ border: { value: '{dark-color-scheme.primary.palette.value.700}' },
57
+ text: { value: '{dark-color-scheme.primary.palette.value.200}' },
58
+ icon: { value: 'mix({dark-color-scheme.primary.palette.value.200}, {dark-color-scheme.background.overlay-hover})' },
59
59
  states: {
60
60
  hover: {
61
- icon: { value: '{dark-color-scheme.primary.palette.value.500.value}' }
61
+ icon: { value: '{dark-color-scheme.primary.palette.value.500}' }
62
62
  },
63
- focused:{ value: '{dark-color-scheme.states.focused-color.value}' },
63
+ focused:{ value: '{dark-color-scheme.states.focused-color}' },
64
64
  disabled: {
65
- text: { value: 'mix({dark-color-scheme.primary.palette.value.300.value}, transparent, 50%)' },
66
- background: { value: 'mix({dark-color-scheme.primary.palette.value.300.value}, transparent, 10%)' }
65
+ text: { value: 'mix({dark-color-scheme.primary.palette.value.300}, transparent, 50%)' },
66
+ background: { value: 'mix({dark-color-scheme.primary.palette.value.300}, transparent, 10%)' }
67
67
  }
68
68
  }
69
69
  },
70
70
  second: {
71
- background: { value: '{dark-color-scheme.second.palette.value.700.value}' },
72
- border: { value: '{dark-color-scheme.second.palette.value.700.value}' },
73
- text: { value: '{dark-color-scheme.second.palette.value.200.value}' },
74
- icon: { value: 'mix({dark-color-scheme.second.palette.value.300.value}, {dark-color-scheme.background.overlay-hover.value})' },
71
+ background: { value: '{dark-color-scheme.second.palette.value.700}' },
72
+ border: { value: '{dark-color-scheme.second.palette.value.700}' },
73
+ text: { value: '{dark-color-scheme.second.palette.value.200}' },
74
+ icon: { value: 'mix({dark-color-scheme.second.palette.value.300}, {dark-color-scheme.background.overlay-hover})' },
75
75
  states: {
76
76
  hover: {
77
- icon: { value: '{dark-color-scheme.second.palette.value.100.value}' }
77
+ icon: { value: '{dark-color-scheme.second.palette.value.100}' }
78
78
  },
79
- focused: { value: '{dark-color-scheme.states.focused-color.value}' },
79
+ focused: { value: '{dark-color-scheme.states.focused-color}' },
80
80
  disabled: {
81
- text: { value: 'mix({dark-color-scheme.second.palette.value.400.value}, transparent, 50%)' },
82
- background: { value: 'mix({dark-color-scheme.second.palette.value.400.value}, transparent, 10%)' }
81
+ text: { value: 'mix({dark-color-scheme.second.palette.value.400}, transparent, 50%)' },
82
+ background: { value: 'mix({dark-color-scheme.second.palette.value.400}, transparent, 10%)' }
83
83
  }
84
84
  }
85
85
  },
86
86
  error: {
87
- background: { value: '{dark-color-scheme.error.palette.value.700.value}' },
88
- border: { value: '{dark-color-scheme.error.palette.value.700.value}' },
89
- text: { value: '{dark-color-scheme.error.palette.value.200.value}' },
90
- icon: { value: 'mix({dark-color-scheme.error.palette.value.300.value}, {dark-color-scheme.background.overlay-hover.value})' },
87
+ background: { value: '{dark-color-scheme.error.palette.value.700}' },
88
+ border: { value: '{dark-color-scheme.error.palette.value.700}' },
89
+ text: { value: '{dark-color-scheme.error.palette.value.200}' },
90
+ icon: { value: 'mix({dark-color-scheme.error.palette.value.300}, {dark-color-scheme.background.overlay-hover})' },
91
91
  states: {
92
92
  hover: {
93
- icon: { value: '{dark-color-scheme.error.palette.value.300.value}' }
93
+ icon: { value: '{dark-color-scheme.error.palette.value.300}' }
94
94
  },
95
- focused: { value: '{dark-color-scheme.states.focused-color-error.value}' },
95
+ focused: { value: '{dark-color-scheme.states.focused-color-error}' },
96
96
  disabled: {
97
- text: { value: 'mix({dark-color-scheme.error.palette.value.400.value}, transparent, 50%)' },
98
- background: { value: 'mix({dark-color-scheme.error.palette.value.400.value}, transparent, 10%)' }
97
+ text: { value: 'mix({dark-color-scheme.error.palette.value.400}, transparent, 50%)' },
98
+ background: { value: 'mix({dark-color-scheme.error.palette.value.400}, transparent, 10%)' }
99
99
  }
100
100
  }
101
101
  }
@@ -105,7 +105,7 @@
105
105
  height: { value: '{size.badge_tag-height}' },
106
106
  'border-width': { value: '1px' },
107
107
  'border-radius': { value: '4px' },
108
- 'icon-padding': { value: '3px' },
108
+ 'icon-padding': { value: '{size.xxs}' },
109
109
  'text-margin': { value: '{padding.badge_tag-horizontal}' }
110
110
  },
111
111
  font: {
@@ -117,7 +117,6 @@
117
117
  'tag-list': {
118
118
  size: {
119
119
  padding: { value: '1px 6px' },
120
- 'min-height': { value: '30px' }
121
120
  }
122
121
  },
123
122
  'tag-input': {
package/design-tokens/pt-2022/tokens/components/toggle.json5 CHANGED
@@ -1,58 +1,58 @@
1
1
  {
2
2
  toggle: {
3
3
  'light-color-scheme': {
4
- border: { value: '{light-color-scheme.foreground.border.value}' },
4
+ border: { value: '{light-color-scheme.foreground.border}' },
5
5
  background: {
6
- value: '{light-color-scheme.background.background.value}'
6
+ value: '{light-color-scheme.background.background}'
7
7
  },
8
- 'circle-border': { value: '{light-color-scheme.foreground.border.value}' },
9
- 'circle-background': { value: '{light-color-scheme.second.palette.value.100.value}'
8
+ 'circle-border': { value: '{light-color-scheme.foreground.border}' },
9
+ 'circle-background': { value: '{light-color-scheme.second.palette.value.100}'
10
10
  },
11
11
  states: {
12
12
  focused: {
13
13
  shadow: {
14
- value: 'inset 0 0 0 1px {light-color-scheme.background.background.value}, 0 0 0 2px {light-color-scheme.primary.palette.value.500.value}'
14
+ value: 'inset 0 0 0 1px {light-color-scheme.background.background}, 0 0 0 2px {light-color-scheme.primary.palette.value.500}'
15
15
  }
16
16
  }
17
17
  },
18
18
  primary: {
19
19
  checked: {
20
- 'border-color': { value: '{light-color-scheme.primary.default.value}'},
21
- background: { value: '{light-color-scheme.primary.default.value}'}
20
+ 'border-color': { value: '{light-color-scheme.primary.default}'},
21
+ background: { value: '{light-color-scheme.primary.default}'}
22
22
  }
23
23
  },
24
24
  error: {
25
25
  checked: {
26
- 'border-color': { value: '{light-color-scheme.error.default.value}'},
27
- background: { value: '{light-color-scheme.error.default.value}'}
26
+ 'border-color': { value: '{light-color-scheme.error.default}'},
27
+ background: { value: '{light-color-scheme.error.default}'}
28
28
  }
29
29
  }
30
30
  },
31
31
  'dark-color-scheme': {
32
- border: { value: '{dark-color-scheme.foreground.border.value}' },
32
+ border: { value: '{dark-color-scheme.foreground.border}' },
33
33
  background: {
34
- value: '{dark-color-scheme.background.background.value}'
34
+ value: '{dark-color-scheme.background.background}'
35
35
  },
36
- 'circle-border': { value: '{dark-color-scheme.foreground.border.value}' },
37
- 'circle-background': { value: '{light-color-scheme.second.palette.value.500.value}' },
36
+ 'circle-border': { value: '{dark-color-scheme.foreground.border}' },
37
+ 'circle-background': { value: '{light-color-scheme.second.palette.value.500}' },
38
38
 
39
39
  states: {
40
40
  focused: {
41
41
  shadow: {
42
- value: 'inset 0 0 0 1px {dark-color-scheme.background.background.value}, 0 0 0 2px {dark-color-scheme.primary.palette.value.400.value}'
42
+ value: 'inset 0 0 0 1px {dark-color-scheme.background.background}, 0 0 0 2px {dark-color-scheme.primary.palette.value.400}'
43
43
  }
44
44
  }
45
45
  },
46
46
  primary: {
47
47
  checked: {
48
- 'border-color': { value: '{dark-color-scheme.primary.default.value}'},
49
- background: { value: '{dark-color-scheme.primary.default.value}'}
48
+ 'border-color': { value: '{dark-color-scheme.primary.default}'},
49
+ background: { value: '{dark-color-scheme.primary.default}'}
50
50
  }
51
51
  },
52
52
  error: {
53
53
  checked: {
54
- 'border-color': { value: '{dark-color-scheme.error.default.value}'},
55
- background: { value: '{dark-color-scheme.error.default.value}'}
54
+ 'border-color': { value: '{dark-color-scheme.error.default}'},
55
+ background: { value: '{dark-color-scheme.error.default}'}
56
56
  }
57
57
  }
58
58
  },
package/design-tokens/pt-2022/tokens/components/tooltip.json5 CHANGED
@@ -1,27 +1,27 @@
1
1
  {
2
2
  tooltip: {
3
3
  'light-color-scheme': {
4
- background: { value: '{popup.dark-color-scheme.background.value}' },
5
- text: { value: '{dark-color-scheme.foreground.text.value}' },
4
+ background: { value: '{popup.dark-color-scheme.background}' },
5
+ text: { value: '{dark-color-scheme.foreground.text}' },
6
6
  border: { value: 'transparent' },
7
7
  shadow: { value: '0 2px 4px 0 rgba(39, 51, 62, 0.2)' },
8
8
 
9
9
  'warning': {
10
- background: { value: '{light-color-scheme.warning.palette.value.40.value}' },
11
- text: { value: '{light-color-scheme.foreground.text.value}' },
12
- border: { value: '{light-color-scheme.warning.palette.value.100.value}' }
10
+ background: { value: '{light-color-scheme.warning.palette.value.40}' },
11
+ text: { value: '{light-color-scheme.foreground.text}' },
12
+ border: { value: '{light-color-scheme.warning.palette.value.100}' }
13
13
  }
14
14
  },
15
15
  'dark-color-scheme': {
16
- background: { value: '{popup.light-color-scheme.background.value}' },
17
- text: { value: '{light-color-scheme.foreground.text.value}' },
16
+ background: { value: '{popup.light-color-scheme.background}' },
17
+ text: { value: '{light-color-scheme.foreground.text}' },
18
18
  border: { value: 'transparent' },
19
19
  shadow: { value: '0 2px 4px 0 rgba(39, 51, 62, 0.2)' },
20
20
 
21
21
  'warning': {
22
- background: { value: '{dark-color-scheme.warning.palette.value.560.value}' },
23
- text: { value: '{dark-color-scheme.foreground.text.value}' },
24
- border: { value: '{dark-color-scheme.warning.palette.value.560.value}' }
22
+ background: { value: '{dark-color-scheme.warning.palette.value.560}' },
23
+ text: { value: '{dark-color-scheme.foreground.text}' },
24
+ border: { value: '{dark-color-scheme.warning.palette.value.560}' }
25
25
  }
26
26
  },
27
27
  size: {
@@ -38,15 +38,15 @@
38
38
  },
39
39
  'extended-tooltip': {
40
40
  'light-color-scheme': {
41
- background: { value: '{popup.light-color-scheme.background.value}' },
42
- text: { value: '{light-color-scheme.foreground.text.value}' },
43
- border: { value: '{popup.light-color-scheme.border.value}' },
41
+ background: { value: '{popup.light-color-scheme.background}' },
42
+ text: { value: '{light-color-scheme.foreground.text}' },
43
+ border: { value: '{popup.light-color-scheme.border}' },
44
44
  shadow: { value: '0 2px 4px 0 rgba(39, 51, 62, 0.2)' },
45
45
  },
46
46
  'dark-color-scheme': {
47
- background: { value: '{dark-color-scheme.second.palette.value.700.value}' },
48
- text: { value: '{dark-color-scheme.foreground.text.value}' },
49
- border: { value: '{dark-color-scheme.second.palette.value.700.value}' },
47
+ background: { value: '{dark-color-scheme.second.palette.value.700}' },
48
+ text: { value: '{dark-color-scheme.foreground.text}' },
49
+ border: { value: '{dark-color-scheme.second.palette.value.700}' },
50
50
  shadow: { value: '0 2px 4px 0 rgba(39, 51, 62, 0.2)' },
51
51
  },
52
52
  size: {
@@ -62,14 +62,14 @@
62
62
  },
63
63
  'extended-tooltip-header': {
64
64
  'light-color-scheme': {
65
- border: { value: '{popup.light-color-scheme.border.value}' },
66
- text: { value: '{light-color-scheme.foreground.text.value}' },
67
- background: { value: '{popup.light-color-scheme.background.value}' }
65
+ border: { value: '{popup.light-color-scheme.border}' },
66
+ text: { value: '{light-color-scheme.foreground.text}' },
67
+ background: { value: '{popup.light-color-scheme.background}' }
68
68
  },
69
69
  'dark-color-scheme': {
70
- border: { value: '{dark-color-scheme.second.palette.value.600.value}' },
71
- text: { value: '{dark-color-scheme.foreground.text.value}' },
72
- background: { value: '{dark-color-scheme.second.palette.value.700.value}' }
70
+ border: { value: '{dark-color-scheme.second.palette.value.600}' },
71
+ text: { value: '{dark-color-scheme.foreground.text}' },
72
+ background: { value: '{dark-color-scheme.second.palette.value.700}' }
73
73
  },
74
74
  size: {
75
75
  height: { value: '40px' },
@@ -80,4 +80,4 @@
80
80
  }
81
81
  }
82
82
 
83
- }
83
+ }
package/design-tokens/pt-2022/tokens/components/tree.json5 CHANGED
@@ -2,8 +2,11 @@
2
2
  tree: {
3
3
  size: {
4
4
  'node-height': { value: '32px' },
5
- 'padding-left': { value: '8px' },
6
- 'padding-right': { value: '16px' },
5
+
6
+ 'padding-left': { value: '{size.m}' },
7
+ 'toggle-padding': { value: '{size.xxs}' },
8
+ 'icon-padding': { value: '{size.s}' },
9
+ 'padding-right': { value: '{size.l}' },
7
10
  },
8
11
  font: {
9
12
  node: { value: 'body' }
package/design-tokens/pt-2022/tokens/properties/colors.json5 CHANGED
@@ -1,110 +1,114 @@
1
1
  {
2
2
  'light-color-scheme': {
3
3
  primary: {
4
- default: { value: '{palette.blue.500.value}' },
4
+ default: { value: '{palette.blue.500}' },
5
5
 
6
6
  palette: { value: '{palette.blue}' }
7
7
  },
8
8
  second: {
9
- default: { value: '{palette.grey.500.value}' },
9
+ default: { value: '{palette.grey.500}' },
10
10
 
11
11
  palette: { value: '{palette.grey}' }
12
12
  },
13
13
  error: {
14
- default: { value: '{palette.red.500.value}' },
14
+ default: { value: '{palette.red.500}' },
15
15
 
16
16
  palette: { value: '{palette.red}' }
17
17
  },
18
18
  info: {
19
- default: { value: '{palette.blue.500.value}' },
19
+ default: { value: '{palette.blue.500}' },
20
20
 
21
21
  palette: { value: '{palette.teal}' }
22
22
  },
23
23
  success: {
24
- default: { value: '{palette.green.500.value}' },
24
+ default: { value: '{palette.green.500}' },
25
25
 
26
26
  palette: { value: '{palette.green}' }
27
27
  },
28
28
  warning: {
29
- default: { value: '{palette.yellow.500.value}' },
29
+ default: { value: '{palette.yellow.500}' },
30
30
 
31
31
  palette: { value: '{palette.yellow}' }
32
32
  },
33
33
  foreground: {
34
- text: { value: '{palette.grey.900.value}' },
35
- 'text-less-contrast': { value: '{palette.grey.500.value}'},
36
- 'text-disabled': { value: '{palette.grey.300.value}' },
37
- divider: { value: '{palette.grey.100.value}' },
38
- border: { value: '{palette.grey.200.value}' },
39
- icon: { value: '{palette.grey.300.value}' }
34
+ text: { value: '{palette.grey.900}' },
35
+ 'text-less-contrast': { value: '{palette.grey.500}'},
36
+ 'text-disabled': { value: '{palette.grey.300}' },
37
+ 'text-error': { value: '{light-color-scheme.error.palette.value.500}' },
38
+ 'text-success': { value: '{light-color-scheme.success.palette.value.560}' },
39
+ divider: { value: '{palette.grey.100}' },
40
+ border: { value: '{palette.grey.200}' },
41
+ icon: { value: '{palette.grey.300}' }
40
42
  },
41
43
  background: {
42
44
  background: { value: 'white' },
43
- 'background-disabled': { value: '{palette.grey.40.value}' },
45
+ 'background-disabled': { value: '{palette.grey.40}' },
44
46
 
45
47
  'overlay-hover': { value: 'rgba(black, 0.05)' },
46
48
  'overlay-active': { value: 'rgba(black, 0.1)' },
47
49
  'overlay-disabled': { value: 'rgba(white, 0.3)' }
48
50
  },
49
51
  states: {
50
- 'focused-color': { value: '{light-color-scheme.primary.palette.value.500.value}' },
51
- 'focused-color-error': { value: '{light-color-scheme.error.palette.value.500.value}' },
52
- 'selected-color': { value: '{light-color-scheme.primary.palette.value.60.value}' },
52
+ 'focused-color': { value: '{light-color-scheme.primary.palette.value.500}' },
53
+ 'focused-color-error': { value: '{light-color-scheme.error.palette.value.500}' },
54
+ 'selected-color': { value: '{light-color-scheme.primary.palette.value.60}' },
53
55
  'pressed-shadow': { value: 'inset 0 1px 2px 0 rgba(black, 0.2)' },
54
56
  'disabled-opacity': { value: 0.3 }
55
57
  }
56
58
  },
57
59
  'dark-color-scheme': {
58
60
  primary: {
59
- default: { value: '{palette.blue.560.value}' },
61
+ default: { value: '{palette.blue.560}' },
60
62
 
61
63
  palette: { value: '{palette.blue}' }
62
64
  },
63
65
  second: {
64
- default: { value: '{palette.grey.560.value}' },
66
+ default: { value: '{palette.grey.560}' },
65
67
 
66
68
  palette: { value: '{palette.grey}' }
67
69
  },
68
70
  error: {
69
- default: { value: '{palette.red.560.value}' },
71
+ default: { value: '{palette.red.560}' },
70
72
 
71
73
  palette: { value: '{palette.red}' }
72
74
  },
73
75
  info: {
74
- default: { value: '{palette.teal.560.value}' },
76
+ default: { value: '{palette.teal.560}' },
75
77
 
76
78
  palette: { value: '{palette.teal}' }
77
79
  },
78
80
  success: {
79
- default: { value: '{palette.green.560.value}' },
81
+ default: { value: '{palette.green.560}' },
80
82
 
81
83
  palette: { value: '{palette.green}' }
82
84
  },
83
85
  warning: {
84
- default: { value: '{palette.yellow.560.value}' },
86
+ default: { value: '{palette.yellow.560}' },
85
87
 
86
88
  palette: { value: '{palette.yellow}' }
87
89
  },
88
90
  foreground: {
89
- text: { value: '{palette.grey.40.value}' },
90
- 'text-less-contrast': { value: '{palette.grey.300.value}'},
91
- 'text-disabled': { value: '{palette.grey.500.value}' },
92
- divider: { value: '{palette.grey.700.value}' },
93
- border: { value: '{palette.grey.560.value}' },
94
- icon: { value: '{palette.grey.300.value}' }
91
+ text: { value: '{palette.grey.40}' },
92
+ 'text-less-contrast': { value: '{palette.grey.300}'},
93
+ 'text-disabled': { value: '{palette.grey.500}' },
94
+ 'text-error': { value: '{dark-color-scheme.error.palette.value.400}' },
95
+ 'text-success': { value: '{dark-color-scheme.success.palette.value.400}' },
96
+ divider: { value: '{palette.grey.700}' },
97
+ border: { value: '{palette.grey.560}' },
98
+ icon: { value: '{palette.grey.300}' }
95
99
  },
96
100
  background: {
97
- background: { value: '{palette.grey.900.value}' },
98
- 'background-disabled': { value: '{palette.grey.700.value}' },
101
+ background: { value: '{palette.grey.900}' },
102
+ 'background-disabled': { value: '{palette.grey.700}' },
99
103
 
100
104
  'overlay-hover': { value: 'rgba(black, 0.05)' },
101
105
  'overlay-active': { value: 'rgba(black, 0.1)' },
102
106
  'overlay-disabled': { value: 'rgba(black, 0.2)' }
103
107
  },
104
108
  states: {
105
- 'focused-color': { value: '{dark-color-scheme.primary.palette.value.400.value}' },
106
- 'focused-color-error': { value: '{light-color-scheme.error.palette.value.560.value}' },
107
- 'selected-color': { value: '{dark-color-scheme.primary.palette.value.600.value}' },
109
+ 'focused-color': { value: '{dark-color-scheme.primary.palette.value.400}' },
110
+ 'focused-color-error': { value: '{light-color-scheme.error.palette.value.560}' },
111
+ 'selected-color': { value: '{dark-color-scheme.primary.palette.value.600}' },
108
112
  'pressed-shadow': { value: 'inset 1px 2px 2px 0 rgba(black, 0.2)' },
109
113
  'disabled-opacity': { value: 0.3 }
110
114
  }
package/design-tokens/pt-2022/tokens/properties/globals.json5 CHANGED
@@ -1,5 +1,23 @@
1
1
  {
2
2
  size: {
3
+ '3xs': { value: '2px' },
4
+ 'xxs': { value: '4px' },
5
+ 'xs': { value: '6px' },
6
+ 's': { value: '8px' },
7
+ 'm': { value: '12px' },
8
+ 'l': { value: '16px' },
9
+ 'xl': { value: '20px' },
10
+ 'xxl': { value: '24px' },
11
+ '3xl': { value: '32px' },
12
+ '4xl': { value: '40px' },
13
+ '5xl': { value: '48px' },
14
+ '6xl': { value: '56px' },
15
+ '7xl': { value: '64px' },
16
+
17
+ 'border-width': '1px',
18
+ 'border-radius': '3px',
19
+
20
+ // this will be deleted
3
21
  'option-height': '32px',
4
22
  'panel-height': '48px',
5
23
  // у radio и checkbox в макетах 20px, у тоггла есть две модификации на 16px и 14px
@@ -12,7 +30,8 @@
12
30
  'badge_tag-height': '24px',
13
31
  // modal; sidepanel - сейчас в этих компонентах paddings
14
32
  'header-height': '56px',
15
- 'footer-height': '64px'
33
+ 'footer-height': '64px',
34
+ // this will be deleted
16
35
  },
17
36
  padding: {
18
37
  'control-horizontal': '16px',