bromcom-ui 2.12.3-rc.3-test.0 → 3.0.0-alpha.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 (436) hide show
  1. package/dist/bromcom-ui/bromcom-ui.css +1 -1
  2. package/dist/bromcom-ui/bromcom-ui.esm.js +1 -1
  3. package/dist/bromcom-ui/{p-7c5763cc.entry.js → p-03337609.entry.js} +1 -1
  4. package/dist/bromcom-ui/{p-540fbc32.entry.js → p-10687c62.entry.js} +1 -1
  5. package/dist/bromcom-ui/{p-c49b6287.entry.js → p-19ed830b.entry.js} +1 -1
  6. package/dist/bromcom-ui/{p-32c55505.entry.js → p-1a7e1a74.entry.js} +1 -1
  7. package/dist/bromcom-ui/{p-d59d9687.entry.js → p-1fbec9e4.entry.js} +1 -1
  8. package/dist/bromcom-ui/{p-dd24646a.entry.js → p-2afde14e.entry.js} +1 -1
  9. package/dist/bromcom-ui/{p-beaec5b8.js → p-2d0ff35e.js} +1 -1
  10. package/dist/bromcom-ui/{p-7e0e02b3.js → p-31a60231.js} +1 -1
  11. package/dist/bromcom-ui/{p-67343ad8.entry.js → p-3b079331.entry.js} +1 -1
  12. package/dist/bromcom-ui/{p-cbcf6d9c.js → p-3be27626.js} +1 -1
  13. package/dist/bromcom-ui/{p-6bea284a.js → p-499d8454.js} +1 -1
  14. package/dist/bromcom-ui/{p-a6aa173f.entry.js → p-4a71c61a.entry.js} +1 -1
  15. package/dist/bromcom-ui/{p-80edaf47.entry.js → p-4cc12992.entry.js} +1 -1
  16. package/dist/bromcom-ui/{p-c77541f4.js → p-4d2bf0e7.js} +2 -2
  17. package/dist/bromcom-ui/p-556010cb.js +5 -0
  18. package/dist/bromcom-ui/{p-a00b053e.entry.js → p-56b9cdf7.entry.js} +1 -1
  19. package/dist/bromcom-ui/{p-1b558b0f.entry.js → p-583982a6.entry.js} +1 -1
  20. package/dist/bromcom-ui/p-59dc2542.js +5 -0
  21. package/dist/bromcom-ui/{p-fec89309.entry.js → p-5adcfd9b.entry.js} +1 -1
  22. package/dist/bromcom-ui/p-5ea9881d.entry.js +5 -0
  23. package/dist/bromcom-ui/{p-9f5ee998.entry.js → p-5f47e061.entry.js} +1 -1
  24. package/dist/bromcom-ui/p-64fad38b.js +11 -0
  25. package/dist/bromcom-ui/{p-507db92e.entry.js → p-6d42e250.entry.js} +1 -1
  26. package/dist/bromcom-ui/p-6f11eb8e.entry.js +5 -0
  27. package/dist/bromcom-ui/{p-8c018ae0.js → p-6f2e4c9b.js} +1 -1
  28. package/dist/bromcom-ui/{p-7e44e6b5.js → p-6f861fed.js} +1 -1
  29. package/dist/bromcom-ui/{p-d1298c40.js → p-7b21fcb9.js} +1 -1
  30. package/dist/bromcom-ui/p-815f884d.entry.js +5 -0
  31. package/dist/bromcom-ui/{p-6657830f.js → p-85eedabc.js} +1 -1
  32. package/dist/bromcom-ui/{p-974a427c.entry.js → p-8c009880.entry.js} +1 -1
  33. package/dist/bromcom-ui/p-8d0d0c5b.entry.js +5 -0
  34. package/dist/bromcom-ui/{p-9850cbce.js → p-8e5e362a.js} +1 -1
  35. package/dist/bromcom-ui/{p-cf11cdde.entry.js → p-8f062608.entry.js} +1 -1
  36. package/dist/bromcom-ui/p-9cbf3f1d.entry.js +16 -0
  37. package/dist/bromcom-ui/{p-aeb4be41.js → p-a2df6c19.js} +1 -1
  38. package/dist/bromcom-ui/{p-8b8dd8fe.entry.js → p-a2e0a182.entry.js} +1 -1
  39. package/dist/bromcom-ui/{p-2b42d77e.entry.js → p-a6b4a46d.entry.js} +1 -1
  40. package/dist/bromcom-ui/p-a6b696de.js +5 -0
  41. package/dist/bromcom-ui/p-a947136c.entry.js +5 -0
  42. package/dist/bromcom-ui/{p-fafa70ac.entry.js → p-ac720743.entry.js} +1 -1
  43. package/dist/bromcom-ui/{p-10f511ff.entry.js → p-b3af25ef.entry.js} +1 -1
  44. package/dist/bromcom-ui/{p-77ef609e.entry.js → p-b46e368e.entry.js} +1 -1
  45. package/dist/bromcom-ui/{p-25bbe3e6.entry.js → p-bae91cbf.entry.js} +1 -1
  46. package/dist/bromcom-ui/{p-15402dac.entry.js → p-c10b25e2.entry.js} +1 -1
  47. package/dist/bromcom-ui/{p-59f7fa84.entry.js → p-c4bf7f7e.entry.js} +1 -1
  48. package/dist/bromcom-ui/p-c4d524b5.entry.js +5 -0
  49. package/dist/bromcom-ui/{p-9b59c689.entry.js → p-c5bb29d0.entry.js} +1 -1
  50. package/dist/bromcom-ui/{p-052005c9.js → p-c7ae8fa9.js} +1 -1
  51. package/dist/bromcom-ui/{p-5d670fd7.entry.js → p-cc70861b.entry.js} +1 -1
  52. package/dist/bromcom-ui/{p-e8eaa3bb.entry.js → p-d0e56f5f.entry.js} +1 -1
  53. package/dist/bromcom-ui/{p-a31644e3.entry.js → p-d49d3d72.entry.js} +1 -1
  54. package/dist/bromcom-ui/{p-a0d6d680.js → p-d65bc842.js} +1 -1
  55. package/dist/bromcom-ui/{p-d19d45ed.entry.js → p-dc2d5b2f.entry.js} +1 -1
  56. package/dist/bromcom-ui/p-dc73abe2.js +5 -0
  57. package/dist/bromcom-ui/{p-170cf07d.js → p-e037ee2b.js} +1 -1
  58. package/dist/bromcom-ui/p-e46fde49.js +5 -0
  59. package/dist/bromcom-ui/{p-87192588.entry.js → p-e499306b.entry.js} +1 -1
  60. package/dist/bromcom-ui/p-ebd9132c.entry.js +5 -0
  61. package/dist/bromcom-ui/{p-01e63843.entry.js → p-f5a8e601.entry.js} +1 -1
  62. package/dist/bromcom-ui/{p-9253d439.entry.js → p-f66c4afa.entry.js} +1 -1
  63. package/dist/bromcom-ui/{p-a486613b.entry.js → p-fdd4cabe.entry.js} +1 -1
  64. package/dist/cjs/bcm-accordion_68.cjs.entry.js +47182 -0
  65. package/dist/cjs/bcm-attendance-actions-comment.cjs.entry.js +4 -4
  66. package/dist/cjs/bcm-attendance-actions-dropdown.cjs.entry.js +4 -4
  67. package/dist/cjs/bcm-breadcrumb.cjs.entry.js +2 -2
  68. package/dist/cjs/bcm-caption.cjs.entry.js +5 -5
  69. package/dist/cjs/bcm-card.cjs.entry.js +2 -2
  70. package/dist/cjs/bcm-date-picker.cjs.entry.js +2 -2
  71. package/dist/cjs/bcm-datetime-picker.cjs.entry.js +3 -3
  72. package/dist/cjs/bcm-default.cjs.entry.js +2 -2
  73. package/dist/cjs/bcm-form-2.cjs.entry.js +2 -2
  74. package/dist/cjs/bcm-input-2.cjs.entry.js +5 -5
  75. package/dist/cjs/bcm-input-custom.cjs.entry.js +2 -2
  76. package/dist/cjs/bcm-input-dropdown.cjs.entry.js +5 -5
  77. package/dist/cjs/bcm-modal-2-footer.cjs.entry.js +4 -4
  78. package/dist/cjs/bcm-modal-2-header.cjs.entry.js +4 -4
  79. package/dist/cjs/bcm-modal-2.cjs.entry.js +4 -4
  80. package/dist/cjs/bcm-number-input.cjs.entry.js +6 -6
  81. package/dist/cjs/bcm-skeleton.cjs.entry.js +4 -4
  82. package/dist/cjs/bcm-table.cjs.entry.js +4 -4
  83. package/dist/cjs/bcm-tag.cjs.entry.js +3 -3
  84. package/dist/cjs/bcm-time-picker.cjs.entry.js +2 -2
  85. package/dist/cjs/bcm-toast.cjs.entry.js +18 -18
  86. package/dist/cjs/bromcom-ui.cjs.js +3 -3
  87. package/dist/cjs/{caption-template-85a18b6d.js → caption-template-f8a78504.js} +9 -9
  88. package/dist/cjs/{generate-bff3fa38.js → generate-e3956756.js} +14 -14
  89. package/dist/cjs/{global-825d9cd4.js → global-642cd031.js} +1 -1
  90. package/dist/cjs/{input.style-b5676e6a.js → input.style-bee84fb0.js} +1 -1
  91. package/dist/cjs/{label-template-e83447b5.js → label-template-fc301e0c.js} +4 -4
  92. package/dist/cjs/loader.cjs.js +3 -3
  93. package/dist/cjs/{number-helper-9bc46d37.js → number-helper-43361f4e.js} +1 -1
  94. package/dist/cjs/old-bcm-popover-box.cjs.entry.js +3 -3
  95. package/dist/cjs/old-bcm-popover.cjs.entry.js +2 -2
  96. package/dist/cjs/{package-dda6f822.js → package-033055fc.js} +1 -1
  97. package/dist/cjs/{validators-c0eef77a.js → validators-9a6ae72d.js} +1 -1
  98. package/dist/collection/collection-manifest.json +1 -1
  99. package/dist/collection/components/atoms/avatar/avatar.js +1 -1
  100. package/dist/collection/components/atoms/avatar/avatar.style.js +4 -4
  101. package/dist/collection/components/atoms/badge/badge.style.js +8 -8
  102. package/dist/collection/components/atoms/button/button.css +90 -92
  103. package/dist/collection/components/atoms/button/button.js +45 -46
  104. package/dist/collection/components/atoms/chip/chip.css +27 -29
  105. package/dist/collection/components/atoms/chip/chip.js +10 -11
  106. package/dist/collection/components/atoms/divider/divider.css +4 -4
  107. package/dist/collection/components/atoms/link/link.css +10 -11
  108. package/dist/collection/components/molecules/accordion/accordion.css +23 -0
  109. package/dist/collection/components/molecules/accordion/accordion.js +1 -1
  110. package/dist/collection/components/molecules/alert/alert.css +28 -24
  111. package/dist/collection/components/molecules/alert/alert.js +26 -36
  112. package/dist/collection/components/molecules/button-group/button-group.css +15 -23
  113. package/dist/collection/components/molecules/checkbox/checkbox.css +15 -15
  114. package/dist/collection/components/molecules/checkbox/checkbox.js +8 -9
  115. package/dist/collection/components/molecules/color-input/color-input.js +1 -1
  116. package/dist/collection/components/molecules/empty/empty.js +1 -1
  117. package/dist/collection/components/molecules/error-layout/error-layout.css +13 -15
  118. package/dist/collection/components/molecules/error-layout/error-layout.js +1 -1
  119. package/dist/collection/components/molecules/expansion-panel/expansion-panel.css +25 -22
  120. package/dist/collection/components/molecules/expansion-panel/expansion-panel.js +1 -1
  121. package/dist/collection/components/molecules/input/input.css +21 -13
  122. package/dist/collection/components/molecules/input/input.style.js +1 -1
  123. package/dist/collection/components/molecules/menu/menu.css +29 -23
  124. package/dist/collection/components/molecules/modal/modal.css +21 -27
  125. package/dist/collection/components/molecules/radio/radio.js +10 -10
  126. package/dist/collection/components/molecules/range/range.css +5 -8
  127. package/dist/collection/components/molecules/search/search.css +21 -13
  128. package/dist/collection/components/molecules/stepper/stepper.css +6 -5
  129. package/dist/collection/components/molecules/switch/switch.css +22 -21
  130. package/dist/collection/components/molecules/tab-group/tab-item-header.js +6 -6
  131. package/dist/collection/components/molecules/textarea/textarea.css +21 -13
  132. package/dist/collection/components/organism/list/list.css +44 -44
  133. package/dist/collection/components/other/shortcut/shortcut.js +4 -4
  134. package/dist/collection/components/other/toast/toast.js +16 -16
  135. package/dist/collection/components/third-parts/colorful/colorful.css +21 -13
  136. package/dist/collection/components/third-parts/rc-picker/rc-picker.css +13 -9
  137. package/dist/collection/global/components/_checkbox.css +15 -15
  138. package/dist/collection/helper/popover-helper.js +5 -5
  139. package/dist/collection/helper/tooltip-helper.js +6 -6
  140. package/dist/collection/templates/caption-template.js +9 -9
  141. package/dist/collection/templates/input-template.js +1 -1
  142. package/dist/collection/templates/label-template.js +4 -4
  143. package/dist/collection/templates/step-template.js +4 -4
  144. package/dist/components/Overflow.js +141 -83
  145. package/dist/components/avatar.js +6 -6
  146. package/dist/components/badge.js +9 -9
  147. package/dist/components/bcm-accordion.js +2 -2
  148. package/dist/components/bcm-alert.js +28 -41
  149. package/dist/components/bcm-attendance-actions-comment.js +1 -1
  150. package/dist/components/bcm-attendance-actions-dropdown.js +1 -1
  151. package/dist/components/bcm-attendance-actions.js +1 -1
  152. package/dist/components/bcm-button-group.js +1 -1
  153. package/dist/components/bcm-checkbox-group.js +1 -1
  154. package/dist/components/bcm-color-input.js +1 -1
  155. package/dist/components/bcm-error-layout.js +2 -2
  156. package/dist/components/bcm-expansion-panel.js +2 -2
  157. package/dist/components/bcm-input-2.js +1 -1
  158. package/dist/components/bcm-input-dropdown.js +1 -1
  159. package/dist/components/bcm-modal.js +1 -1
  160. package/dist/components/bcm-popover.js +5 -5
  161. package/dist/components/bcm-range.js +1 -1
  162. package/dist/components/bcm-shortcut.js +4 -4
  163. package/dist/components/bcm-stepper.js +6 -6
  164. package/dist/components/bcm-switch.js +1 -1
  165. package/dist/components/bcm-tab-item-header.js +6 -6
  166. package/dist/components/bcm-toast.js +16 -16
  167. package/dist/components/button.js +47 -48
  168. package/dist/components/caption-template.js +9 -9
  169. package/dist/components/checkbox-lite.js +1 -1
  170. package/dist/components/checkbox.js +9 -10
  171. package/dist/components/chip.js +11 -12
  172. package/dist/components/colorful.js +1 -1
  173. package/dist/components/divider.js +1 -1
  174. package/dist/components/empty.js +1 -1
  175. package/dist/components/generate.js +1 -1
  176. package/dist/components/index4.js +2549 -171
  177. package/dist/components/index5.js +171 -2549
  178. package/dist/components/input-template.js +1 -1
  179. package/dist/components/input.js +1 -1
  180. package/dist/components/input.style.js +2 -2
  181. package/dist/components/label.js +4 -4
  182. package/dist/components/link.js +1 -1
  183. package/dist/components/list.js +2 -2
  184. package/dist/components/menu.js +1 -1
  185. package/dist/components/radio.js +10 -10
  186. package/dist/components/rc-picker.js +2651 -2404
  187. package/dist/components/search.js +2 -2
  188. package/dist/components/skeleton.js +1 -1
  189. package/dist/components/step.js +1 -1
  190. package/dist/components/textarea.js +1 -1
  191. package/dist/components/tooltip-helper.js +6 -6
  192. package/dist/esm/{_commonjsHelpers-82aa9212.js → _commonjsHelpers-7002e5de.js} +1 -1
  193. package/dist/esm/bcm-accordion_68.entry.js +47111 -0
  194. package/dist/esm/bcm-attendance-actions-comment.entry.js +11 -11
  195. package/dist/esm/bcm-attendance-actions-dropdown.entry.js +12 -12
  196. package/dist/esm/bcm-autocomplete.entry.js +3 -3
  197. package/dist/esm/bcm-box.entry.js +1 -1
  198. package/dist/esm/bcm-breadcrumb.entry.js +6 -6
  199. package/dist/esm/bcm-caption.entry.js +13 -13
  200. package/dist/esm/bcm-card.entry.js +10 -10
  201. package/dist/esm/bcm-colorpicker.entry.js +5 -5
  202. package/dist/esm/bcm-content.entry.js +1 -1
  203. package/dist/esm/bcm-date-picker.entry.js +8 -8
  204. package/dist/esm/bcm-datetime-picker.entry.js +12 -12
  205. package/dist/esm/bcm-default.entry.js +5 -5
  206. package/dist/esm/bcm-form-2.entry.js +7 -7
  207. package/dist/esm/bcm-form-group.entry.js +1 -1
  208. package/dist/esm/bcm-input-2.entry.js +10 -10
  209. package/dist/esm/bcm-input-custom.entry.js +6 -6
  210. package/dist/esm/bcm-input-dropdown.entry.js +13 -13
  211. package/dist/esm/bcm-message.entry.js +3 -3
  212. package/dist/esm/bcm-modal-2-footer.entry.js +12 -12
  213. package/dist/esm/bcm-modal-2-header.entry.js +11 -11
  214. package/dist/esm/bcm-modal-2.entry.js +12 -12
  215. package/dist/esm/bcm-notification.entry.js +3 -3
  216. package/dist/esm/bcm-number-input.entry.js +14 -14
  217. package/dist/esm/bcm-overlay_2.entry.js +4 -4
  218. package/dist/esm/bcm-react-number.entry.js +3 -3
  219. package/dist/esm/bcm-result.entry.js +3 -3
  220. package/dist/esm/bcm-select-group.entry.js +3 -3
  221. package/dist/esm/bcm-select-option.entry.js +3 -3
  222. package/dist/esm/bcm-skeleton.entry.js +11 -11
  223. package/dist/esm/bcm-tab-pane.entry.js +3 -3
  224. package/dist/esm/bcm-table.entry.js +12 -12
  225. package/dist/esm/bcm-tabs-content.entry.js +4 -4
  226. package/dist/esm/bcm-tag.entry.js +8 -8
  227. package/dist/esm/bcm-time-picker.entry.js +8 -8
  228. package/dist/esm/bcm-timeline-item.entry.js +3 -3
  229. package/dist/esm/bcm-timeline.entry.js +3 -3
  230. package/dist/esm/bcm-toast.entry.js +24 -24
  231. package/dist/esm/bcm-treeview-group.entry.js +1 -1
  232. package/dist/esm/bromcom-ui.js +5 -5
  233. package/dist/esm/{caption-template-d7953d13.js → caption-template-16dd9444.js} +11 -11
  234. package/dist/esm/{color-helper-74614f24.js → color-helper-ba15b0d8.js} +2 -2
  235. package/dist/esm/{colors-dd598eea.js → colors-ed4e7579.js} +1 -1
  236. package/dist/esm/{element-dragger-89bb52fd.js → element-dragger-b75266e6.js} +1 -1
  237. package/dist/esm/{generate-1281254a.js → generate-d2495751.js} +15 -15
  238. package/dist/esm/{global-c031697c.js → global-88abdcdc.js} +2 -2
  239. package/dist/esm/{index-f549811f.js → index-00c8a8f7.js} +1 -1
  240. package/dist/esm/{index-036974d7.js → index-0d3a56ec.js} +1 -1
  241. package/dist/esm/{index-0615c2b8.js → index-4614b7f0.js} +1 -1
  242. package/dist/esm/{input.style-e855c0f3.js → input.style-0ddc0073.js} +1 -1
  243. package/dist/esm/{is-load-decorator-8277e3b8.js → is-load-decorator-b8ca22f2.js} +1 -1
  244. package/dist/esm/{label-template-a26f76c0.js → label-template-4c3797f4.js} +6 -6
  245. package/dist/esm/loader.js +5 -5
  246. package/dist/esm/{number-helper-778c8f87.js → number-helper-a1e5c9e5.js} +1 -1
  247. package/dist/esm/old-bcm-popover-box.entry.js +11 -11
  248. package/dist/esm/old-bcm-popover.entry.js +6 -6
  249. package/dist/esm/{package-08ddc3fa.js → package-7549581c.js} +1 -1
  250. package/dist/esm/{popover-placement-d12fec40.js → popover-placement-2bf3a181.js} +1 -1
  251. package/dist/esm/{slot-template-2a19b2db.js → slot-template-e0202c5a.js} +2 -2
  252. package/dist/esm/{string-helper-3592bdc2.js → string-helper-69203215.js} +1 -1
  253. package/dist/esm/{utils-57652744.js → utils-7727d09e.js} +1 -1
  254. package/dist/esm/{validators-0c6e8dea.js → validators-57df25a7.js} +1 -1
  255. package/dist/types/components/atoms/avatar/avatar.style.d.ts +21 -21
  256. package/dist/types/components/molecules/alert/alert.d.ts +1 -3
  257. package/dist/types/components.d.ts +0 -2
  258. package/package.json +1 -1
  259. package/dist/bromcom-ui/p-04594f76.entry.js +0 -5
  260. package/dist/bromcom-ui/p-0e110a9f.entry.js +0 -5
  261. package/dist/bromcom-ui/p-0e5f1168.entry.js +0 -5
  262. package/dist/bromcom-ui/p-1345d51b.entry.js +0 -5
  263. package/dist/bromcom-ui/p-1baed29d.entry.js +0 -5
  264. package/dist/bromcom-ui/p-1e61a44c.entry.js +0 -5
  265. package/dist/bromcom-ui/p-1f93fd33.entry.js +0 -5
  266. package/dist/bromcom-ui/p-228c74e9.entry.js +0 -5
  267. package/dist/bromcom-ui/p-23759244.entry.js +0 -5
  268. package/dist/bromcom-ui/p-270e1b24.entry.js +0 -5
  269. package/dist/bromcom-ui/p-27596881.entry.js +0 -5
  270. package/dist/bromcom-ui/p-29791e4a.entry.js +0 -5
  271. package/dist/bromcom-ui/p-2bd0545e.js +0 -5
  272. package/dist/bromcom-ui/p-2cd6cdee.js +0 -5
  273. package/dist/bromcom-ui/p-3179ce74.entry.js +0 -7
  274. package/dist/bromcom-ui/p-33166492.entry.js +0 -5
  275. package/dist/bromcom-ui/p-376a20ed.js +0 -5
  276. package/dist/bromcom-ui/p-3da7b6c0.entry.js +0 -5
  277. package/dist/bromcom-ui/p-41276d76.entry.js +0 -5
  278. package/dist/bromcom-ui/p-412abc6d.entry.js +0 -5
  279. package/dist/bromcom-ui/p-4393b33e.entry.js +0 -5
  280. package/dist/bromcom-ui/p-46db5206.js +0 -5
  281. package/dist/bromcom-ui/p-4834bc26.js +0 -5
  282. package/dist/bromcom-ui/p-4856568f.entry.js +0 -5
  283. package/dist/bromcom-ui/p-534f958a.entry.js +0 -5
  284. package/dist/bromcom-ui/p-65da044b.js +0 -5
  285. package/dist/bromcom-ui/p-6687afd7.entry.js +0 -5
  286. package/dist/bromcom-ui/p-6ceb315f.entry.js +0 -5
  287. package/dist/bromcom-ui/p-74e6d2b6.js +0 -5
  288. package/dist/bromcom-ui/p-7c45705d.entry.js +0 -5
  289. package/dist/bromcom-ui/p-7dbfff1b.entry.js +0 -5
  290. package/dist/bromcom-ui/p-822dda00.js +0 -5
  291. package/dist/bromcom-ui/p-881853bd.entry.js +0 -5
  292. package/dist/bromcom-ui/p-8b6d3a37.js +0 -5
  293. package/dist/bromcom-ui/p-8cd80ac4.entry.js +0 -5
  294. package/dist/bromcom-ui/p-8f32198d.js +0 -14
  295. package/dist/bromcom-ui/p-904b0c28.entry.js +0 -5
  296. package/dist/bromcom-ui/p-926b314d.entry.js +0 -5
  297. package/dist/bromcom-ui/p-95a797b3.entry.js +0 -5
  298. package/dist/bromcom-ui/p-9ebe6ef9.entry.js +0 -5
  299. package/dist/bromcom-ui/p-a0f44b56.entry.js +0 -5
  300. package/dist/bromcom-ui/p-a2065e9e.entry.js +0 -5
  301. package/dist/bromcom-ui/p-a2e5bb35.entry.js +0 -5
  302. package/dist/bromcom-ui/p-a352f45e.entry.js +0 -5
  303. package/dist/bromcom-ui/p-ae57f046.entry.js +0 -5
  304. package/dist/bromcom-ui/p-b1084320.entry.js +0 -5
  305. package/dist/bromcom-ui/p-b301fa40.entry.js +0 -5
  306. package/dist/bromcom-ui/p-b43e975b.entry.js +0 -5
  307. package/dist/bromcom-ui/p-b9a88f16.entry.js +0 -5
  308. package/dist/bromcom-ui/p-bbcb683f.entry.js +0 -5
  309. package/dist/bromcom-ui/p-bd50c28f.entry.js +0 -5
  310. package/dist/bromcom-ui/p-c1a992e7.entry.js +0 -5
  311. package/dist/bromcom-ui/p-c39e73dc.entry.js +0 -5
  312. package/dist/bromcom-ui/p-c503526a.entry.js +0 -5
  313. package/dist/bromcom-ui/p-c63f5261.entry.js +0 -5
  314. package/dist/bromcom-ui/p-d2bd0293.entry.js +0 -5
  315. package/dist/bromcom-ui/p-e0ab7b38.js +0 -11
  316. package/dist/bromcom-ui/p-e1b6f98e.entry.js +0 -5
  317. package/dist/bromcom-ui/p-e36c7523.entry.js +0 -5
  318. package/dist/bromcom-ui/p-e5532875.entry.js +0 -5
  319. package/dist/bromcom-ui/p-e94d2f48.js +0 -5
  320. package/dist/bromcom-ui/p-ead59725.entry.js +0 -5
  321. package/dist/bromcom-ui/p-eca0acda.js +0 -5
  322. package/dist/bromcom-ui/p-ede7ca76.entry.js +0 -5
  323. package/dist/bromcom-ui/p-eef8f7c7.entry.js +0 -5
  324. package/dist/bromcom-ui/p-effc088c.entry.js +0 -5
  325. package/dist/bromcom-ui/p-fc787048.entry.js +0 -5
  326. package/dist/bromcom-ui/p-ff2b4565.entry.js +0 -5
  327. package/dist/cjs/Overflow-5a73947b.js +0 -2233
  328. package/dist/cjs/bcm-accordion.cjs.entry.js +0 -74
  329. package/dist/cjs/bcm-alert.cjs.entry.js +0 -99
  330. package/dist/cjs/bcm-attendance-actions.cjs.entry.js +0 -330
  331. package/dist/cjs/bcm-attendance.cjs.entry.js +0 -35
  332. package/dist/cjs/bcm-avatar_2.cjs.entry.js +0 -210
  333. package/dist/cjs/bcm-button-group.cjs.entry.js +0 -92
  334. package/dist/cjs/bcm-button.cjs.entry.js +0 -372
  335. package/dist/cjs/bcm-checkbox-group.cjs.entry.js +0 -415
  336. package/dist/cjs/bcm-checkbox-lite_9.cjs.entry.js +0 -2529
  337. package/dist/cjs/bcm-checkbox_2.cjs.entry.js +0 -194
  338. package/dist/cjs/bcm-chip-group.cjs.entry.js +0 -128
  339. package/dist/cjs/bcm-chip.cjs.entry.js +0 -91
  340. package/dist/cjs/bcm-collapse-group.cjs.entry.js +0 -43
  341. package/dist/cjs/bcm-collapse.cjs.entry.js +0 -62
  342. package/dist/cjs/bcm-color-input.cjs.entry.js +0 -77
  343. package/dist/cjs/bcm-colorful_2.cjs.entry.js +0 -251
  344. package/dist/cjs/bcm-date_6.cjs.entry.js +0 -15363
  345. package/dist/cjs/bcm-drawer.cjs.entry.js +0 -96
  346. package/dist/cjs/bcm-dropdown.cjs.entry.js +0 -119
  347. package/dist/cjs/bcm-error-layout.cjs.entry.js +0 -64
  348. package/dist/cjs/bcm-expansion-panel.cjs.entry.js +0 -116
  349. package/dist/cjs/bcm-input_2.cjs.entry.js +0 -550
  350. package/dist/cjs/bcm-item.cjs.entry.js +0 -72
  351. package/dist/cjs/bcm-items.cjs.entry.js +0 -49
  352. package/dist/cjs/bcm-link.cjs.entry.js +0 -51
  353. package/dist/cjs/bcm-list_3.cjs.entry.js +0 -1977
  354. package/dist/cjs/bcm-menu.cjs.entry.js +0 -151
  355. package/dist/cjs/bcm-modal.cjs.entry.js +0 -157
  356. package/dist/cjs/bcm-old-input.cjs.entry.js +0 -397
  357. package/dist/cjs/bcm-old-tag_2.cjs.entry.js +0 -145
  358. package/dist/cjs/bcm-popconfirm-box.cjs.entry.js +0 -115
  359. package/dist/cjs/bcm-popconfirm.cjs.entry.js +0 -101
  360. package/dist/cjs/bcm-popover.cjs.entry.js +0 -230
  361. package/dist/cjs/bcm-progress.cjs.entry.js +0 -162
  362. package/dist/cjs/bcm-radio-group.cjs.entry.js +0 -161
  363. package/dist/cjs/bcm-radio.cjs.entry.js +0 -65
  364. package/dist/cjs/bcm-range.cjs.entry.js +0 -183
  365. package/dist/cjs/bcm-select.cjs.entry.js +0 -1195
  366. package/dist/cjs/bcm-shortcut.cjs.entry.js +0 -65
  367. package/dist/cjs/bcm-step.cjs.entry.js +0 -89
  368. package/dist/cjs/bcm-stepper.cjs.entry.js +0 -240
  369. package/dist/cjs/bcm-switch.cjs.entry.js +0 -151
  370. package/dist/cjs/bcm-tab-group.cjs.entry.js +0 -210
  371. package/dist/cjs/bcm-tab-item-header.cjs.entry.js +0 -60
  372. package/dist/cjs/bcm-tab-item.cjs.entry.js +0 -91
  373. package/dist/cjs/bcm-tab.cjs.entry.js +0 -72
  374. package/dist/cjs/bcm-tabs.cjs.entry.js +0 -370
  375. package/dist/cjs/bcm-text.cjs.entry.js +0 -49
  376. package/dist/cjs/index-d321de96.js +0 -193
  377. package/dist/cjs/input-template-d05a507f.js +0 -92
  378. package/dist/cjs/json-parse-decarator-b9186302.js +0 -40
  379. package/dist/cjs/lodash-917168d7.js +0 -17199
  380. package/dist/cjs/stepper-states-a565a45f.js +0 -85
  381. package/dist/cjs/tooltip-helper-2e1f4fda.js +0 -158
  382. package/dist/esm/Overflow-40c63001.js +0 -2217
  383. package/dist/esm/bcm-accordion.entry.js +0 -70
  384. package/dist/esm/bcm-alert.entry.js +0 -95
  385. package/dist/esm/bcm-attendance-actions.entry.js +0 -326
  386. package/dist/esm/bcm-attendance.entry.js +0 -31
  387. package/dist/esm/bcm-avatar_2.entry.js +0 -205
  388. package/dist/esm/bcm-button-group.entry.js +0 -88
  389. package/dist/esm/bcm-button.entry.js +0 -368
  390. package/dist/esm/bcm-checkbox-group.entry.js +0 -411
  391. package/dist/esm/bcm-checkbox-lite_9.entry.js +0 -2517
  392. package/dist/esm/bcm-checkbox_2.entry.js +0 -189
  393. package/dist/esm/bcm-chip-group.entry.js +0 -124
  394. package/dist/esm/bcm-chip.entry.js +0 -87
  395. package/dist/esm/bcm-collapse-group.entry.js +0 -39
  396. package/dist/esm/bcm-collapse.entry.js +0 -58
  397. package/dist/esm/bcm-color-input.entry.js +0 -73
  398. package/dist/esm/bcm-colorful_2.entry.js +0 -246
  399. package/dist/esm/bcm-date_6.entry.js +0 -15354
  400. package/dist/esm/bcm-drawer.entry.js +0 -92
  401. package/dist/esm/bcm-dropdown.entry.js +0 -115
  402. package/dist/esm/bcm-error-layout.entry.js +0 -60
  403. package/dist/esm/bcm-expansion-panel.entry.js +0 -112
  404. package/dist/esm/bcm-input_2.entry.js +0 -545
  405. package/dist/esm/bcm-item.entry.js +0 -68
  406. package/dist/esm/bcm-items.entry.js +0 -45
  407. package/dist/esm/bcm-link.entry.js +0 -47
  408. package/dist/esm/bcm-list_3.entry.js +0 -1971
  409. package/dist/esm/bcm-menu.entry.js +0 -147
  410. package/dist/esm/bcm-modal.entry.js +0 -153
  411. package/dist/esm/bcm-old-input.entry.js +0 -393
  412. package/dist/esm/bcm-old-tag_2.entry.js +0 -140
  413. package/dist/esm/bcm-popconfirm-box.entry.js +0 -111
  414. package/dist/esm/bcm-popconfirm.entry.js +0 -97
  415. package/dist/esm/bcm-popover.entry.js +0 -226
  416. package/dist/esm/bcm-progress.entry.js +0 -158
  417. package/dist/esm/bcm-radio-group.entry.js +0 -157
  418. package/dist/esm/bcm-radio.entry.js +0 -61
  419. package/dist/esm/bcm-range.entry.js +0 -179
  420. package/dist/esm/bcm-select.entry.js +0 -1191
  421. package/dist/esm/bcm-shortcut.entry.js +0 -61
  422. package/dist/esm/bcm-step.entry.js +0 -85
  423. package/dist/esm/bcm-stepper.entry.js +0 -236
  424. package/dist/esm/bcm-switch.entry.js +0 -147
  425. package/dist/esm/bcm-tab-group.entry.js +0 -206
  426. package/dist/esm/bcm-tab-item-header.entry.js +0 -56
  427. package/dist/esm/bcm-tab-item.entry.js +0 -87
  428. package/dist/esm/bcm-tab.entry.js +0 -68
  429. package/dist/esm/bcm-tabs.entry.js +0 -366
  430. package/dist/esm/bcm-text.entry.js +0 -45
  431. package/dist/esm/index-7e71bbc8.js +0 -191
  432. package/dist/esm/input-template-b4045b25.js +0 -90
  433. package/dist/esm/json-parse-decarator-7d436ec7.js +0 -38
  434. package/dist/esm/lodash-4197be99.js +0 -17197
  435. package/dist/esm/stepper-states-325c754b.js +0 -83
  436. package/dist/esm/tooltip-helper-9c64ad15.js +0 -156
@@ -1,5 +1,4 @@
1
1
  @import url("https://fonts.googleapis.com/css?family=Roboto:400,500");
2
- @import url("https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap");
3
2
  .size-1 {
4
3
  font-size: 12px;
5
4
  line-height: 20px;
@@ -123,74 +122,72 @@
123
122
  margin-right: 8px;
124
123
  }
125
124
 
126
- * {
127
- box-sizing: border-box;
128
- }
129
-
130
125
  .bcm-button {
131
126
  display: inline-flex;
132
127
  width: fit-content;
133
128
  height: fit-content;
134
- --bcm-button-solid-color-default: var(--bcm-new-ds-color-white);
135
- --bcm-button-solid-background-color-default: var(--bcm-new-ds-color-blue-700);
136
- --bcm-button-solid-border-default: var(--bcm-new-ds-color-blue-700);
137
- --bcm-button-solid-color-hover: var(--bcm-new-ds-color-white);
138
- --bcm-button-solid-background-color-hover: var(--bcm-new-ds-color-blue-800);
139
- --bcm-button-solid-border-hover: var(--bcm-new-ds-color-blue-800);
140
- --bcm-button-solid-color-focus-visible: var(--bcm-new-ds-color-white);
141
- --bcm-button-solid-background-color-focus-visible: var(--bcm-new-ds-color-blue-900);
142
- --bcm-button-solid-border-focus-visible: var(--bcm-new-ds-color-blue-900);
143
- --bcm-button-solid-color-active: var(--bcm-new-ds-color-white);
144
- --bcm-button-solid-background-color-active: var(--bcm-new-ds-color-blue-900);
145
- --bcm-button-solid-border-active: var(--bcm-new-ds-color-blue-900);
146
- --bcm-button-solid-color-disabled: var(--bcm-new-ds-color-white);
147
- --bcm-button-solid-background-color-disabled: var(--bcm-new-ds-color-slate-400);
148
- --bcm-button-solid-border-disabled: var(--bcm-new-ds-color-slate-400);
149
- --bcm-button-ghost-color-default: var(--bcm-new-ds-color-slate-700);
150
- --bcm-button-ghost-background-color-default: var(--bcm-new-ds-color-slate-100);
151
- --bcm-button-ghost-border-default: var(--bcm-new-ds-color-slate-300);
152
- --bcm-button-ghost-color-hover: var(--bcm-new-ds-color-slate-700);
153
- --bcm-button-ghost-background-color-hover: var(--bcm-new-ds-color-slate-200);
154
- --bcm-button-ghost-border-hover: var(--bcm-new-ds-color-slate-400);
155
- --bcm-button-ghost-color-focus-visible: var(--bcm-new-ds-color-slate-700);
156
- --bcm-button-ghost-background-color-focus-visible: var(--bcm-new-ds-color-slate-400);
157
- --bcm-button-ghost-border-focus-visible: var(--bcm-new-ds-color-slate-600);
158
- --bcm-button-ghost-color-active: var(--bcm-new-ds-color-slate-700);
159
- --bcm-button-ghost-background-color-active: var(--bcm-new-ds-color-slate-300);
160
- --bcm-button-ghost-border-active: var(--bcm-new-ds-color-slate-500);
161
- --bcm-button-ghost-color-disabled: var(--bcm-new-ds-color-slate-300);
162
- --bcm-button-ghost-background-color-disabled: var(--bcm-new-ds-color-slate-50);
163
- --bcm-button-ghost-border-disabled: var(--bcm-new-ds-color-slate-200);
164
- --bcm-button-link-color-default: var(--bcm-new-ds-color-blue-700);
165
- --bcm-button-link-background-color-default: var(--bcm-new-ds-color-transparent);
166
- --bcm-button-link-border-default: var(--bcm-new-ds-color-transparent);
167
- --bcm-button-link-color-hover: var(--bcm-new-ds-color-blue-600);
168
- --bcm-button-link-background-color-hover: var(--bcm-new-ds-color-transparent);
169
- --bcm-button-link-border-hover: var(--bcm-new-ds-color-transparent);
170
- --bcm-button-link-color-focus-visible: var(--bcm-new-ds-color-blue-800);
171
- --bcm-button-link-background-color-focus-visible: var(--bcm-new-ds-color-slate-50);
172
- --bcm-button-link-border-focus-visible: var(--bcm-new-ds-color-slate-50);
173
- --bcm-button-link-color-active: var(--bcm-new-ds-color-blue-700);
174
- --bcm-button-link-background-color-active: var(--bcm-new-ds-color-slate-50);
175
- --bcm-button-link-border-active: var(--bcm-new-ds-color-slate-50);
176
- --bcm-button-link-color-disabled: var(--bcm-new-ds-color-slate-400);
177
- --bcm-button-link-background-color-disabled: var(--bcm-new-ds-color-transparent);
178
- --bcm-button-link-border-disabled: var(--bcm-new-ds-color-transparent);
179
- --bcm-button-ghost-link-color-default: var(--bcm-new-ds-color-slate-700);
180
- --bcm-button-ghost-link-background-color-default: var(--bcm-new-ds-color-transparent);
181
- --bcm-button-ghost-link-border-default: var(--bcm-new-ds-color-transparent);
182
- --bcm-button-ghost-link-color-hover: var(--bcm-new-ds-color-slate-700);
183
- --bcm-button-ghost-link-background-color-hover: var(--bcm-new-ds-color-slate-200);
184
- --bcm-button-ghost-link-border-hover: var(--bcm-new-ds-color-transparent);
185
- --bcm-button-ghost-link-color-focus-visible: var(--bcm-new-ds-color-slate-700);
186
- --bcm-button-ghost-link-background-color-focus-visible: var(--bcm-new-ds-color-slate-300);
187
- --bcm-button-ghost-link-border-focus-visible: var(--bcm-new-ds-color-transparent);
188
- --bcm-button-ghost-link-color-active: var(--bcm-new-ds-color-slate-700);
189
- --bcm-button-ghost-link-background-color-active: var(--bcm-new-ds-color-slate-300);
190
- --bcm-button-ghost-link-border-active: var(--bcm-new-ds-color-transparent);
191
- --bcm-button-ghost-link-color-disabled: var(--bcm-new-ds-color-slate-500);
192
- --bcm-button-ghost-link-background-color-disabled: var(--bcm-new-ds-color-transparent);
193
- --bcm-button-ghost-link-border-disabled: var(--bcm-new-ds-color-transparent);
129
+ -webkit-font-smoothing: antialiased;
130
+ -moz-osx-font-smoothing: grayscale;
131
+ --bcm-button-solid-color-default: var(--bcm-ui-color-text-base);
132
+ --bcm-button-solid-background-color-default: var(--bcm-ui-color-background-primary-default);
133
+ --bcm-button-solid-border-default: transparent;
134
+ --bcm-button-solid-color-hover: var(--bcm-ui-color-text-base);
135
+ --bcm-button-solid-background-color-hover: var(--bcm-ui-color-background-primary-hover);
136
+ --bcm-button-solid-border-hover: transparent;
137
+ --bcm-button-solid-color-focus-visible: var(--bcm-ui-color-text-base);
138
+ --bcm-button-solid-background-color-focus-visible: var(--bcm-ui-color-background-primary-hover);
139
+ --bcm-button-solid-border-focus-visible: transparent;
140
+ --bcm-button-solid-color-active: var(--bcm-ui-color-text-base);
141
+ --bcm-button-solid-background-color-active: var(--bcm-ui-color-background-primary-active);
142
+ --bcm-button-solid-border-active: transparent;
143
+ --bcm-button-solid-color-disabled: var(--bcm-ui-color-text-disabled);
144
+ --bcm-button-solid-background-color-disabled: var(--bcm-ui-color-background-disabled-default);
145
+ --bcm-button-solid-border-disabled: var(--bcm-ui-color-border-disabled);
146
+ --bcm-button-ghost-color-default: var(--bcm-ui-color-text-default);
147
+ --bcm-button-ghost-background-color-default: var(--bcm-ui-color-background-default-default);
148
+ --bcm-button-ghost-border-default: var(--bcm-ui-color-border-default);
149
+ --bcm-button-ghost-color-hover: var(--bcm-ui-color-text-default);
150
+ --bcm-button-ghost-background-color-hover: var(--bcm-ui-color-background-default-hover);
151
+ --bcm-button-ghost-border-hover: var(--bcm-ui-color-border-default);
152
+ --bcm-button-ghost-color-focus-visible: var(--bcm-ui-color-text-default);
153
+ --bcm-button-ghost-background-color-focus-visible: var(--bcm-ui-color-background-default-hover);
154
+ --bcm-button-ghost-border-focus-visible: var(--bcm-ui-color-border-default);
155
+ --bcm-button-ghost-color-active: var(--bcm-ui-color-text-default);
156
+ --bcm-button-ghost-background-color-active: var(--bcm-ui-color-background-default-active);
157
+ --bcm-button-ghost-border-active: var(--bcm-ui-color-border-default);
158
+ --bcm-button-ghost-color-disabled: var(--bcm-ui-color-text-disabled);
159
+ --bcm-button-ghost-background-color-disabled: var(--bcm-ui-color-background-disabled-default);
160
+ --bcm-button-ghost-border-disabled: var(--bcm-ui-color-border-disabled);
161
+ --bcm-button-link-color-default: var(--bcm-ui-color-text-primary);
162
+ --bcm-button-link-background-color-default: transparent;
163
+ --bcm-button-link-border-default: transparent;
164
+ --bcm-button-link-color-hover: var(--bcm-ui-color-text-primary);
165
+ --bcm-button-link-background-color-hover: var(--bcm-ui-color-background-default-hover);
166
+ --bcm-button-link-border-hover: var(--bcm-ui-color-border-default);
167
+ --bcm-button-link-color-focus-visible: var(--bcm-ui-color-text-primary);
168
+ --bcm-button-link-background-color-focus-visible: var(--bcm-ui-color-background-default-hover);
169
+ --bcm-button-link-border-focus-visible: var(--bcm-ui-color-border-default);
170
+ --bcm-button-link-color-active: var(--bcm-ui-color-text-primary);
171
+ --bcm-button-link-background-color-active: var(--bcm-ui-color-background-default-active);
172
+ --bcm-button-link-border-active: var(--bcm-ui-color-border-default);
173
+ --bcm-button-link-color-disabled: var(--bcm-ui-color-text-disabled);
174
+ --bcm-button-link-background-color-disabled: transparent;
175
+ --bcm-button-link-border-disabled: transparent;
176
+ --bcm-button-ghost-link-color-default: var(--bcm-ui-color-text-default);
177
+ --bcm-button-ghost-link-background-color-default: transparent;
178
+ --bcm-button-ghost-link-border-default: transparent;
179
+ --bcm-button-ghost-link-color-hover: var(--bcm-ui-color-text-default);
180
+ --bcm-button-ghost-link-background-color-hover: var(--bcm-ui-color-background-default-hover);
181
+ --bcm-button-ghost-link-border-hover: var(--bcm-ui-color-border-default);
182
+ --bcm-button-ghost-link-color-focus-visible: var(--bcm-ui-color-text-default);
183
+ --bcm-button-ghost-link-background-color-focus-visible: var(--bcm-ui-color-background-default-hover);
184
+ --bcm-button-ghost-link-border-focus-visible: var(--bcm-ui-color-border-default);
185
+ --bcm-button-ghost-link-color-active: var(--bcm-ui-color-text-default);
186
+ --bcm-button-ghost-link-background-color-active: var(--bcm-ui-color-background-default-active);
187
+ --bcm-button-ghost-link-border-active: var(--bcm-ui-color-border-default);
188
+ --bcm-button-ghost-link-color-disabled: var(--bcm-ui-color-text-disabled);
189
+ --bcm-button-ghost-link-background-color-disabled: transparent;
190
+ --bcm-button-ghost-link-border-disabled: transparent;
194
191
  }
195
192
  .bcm-button.full-width {
196
193
  width: 100%;
@@ -212,19 +209,20 @@
212
209
  cursor: pointer;
213
210
  outline: none;
214
211
  text-decoration: none;
215
- font-family: "Inter", sans-serif;
216
- font-size: 14px;
217
- line-height: calc(14px + 8px);
218
- font-weight: 400;
212
+ font-family: Inter, sans-serif;
213
+ font-size: var(--bcm-ui-font-size-5);
214
+ line-height: var(--bcm-ui-line-height-5);
219
215
  font-weight: 500;
220
216
  display: inline-flex;
221
217
  align-items: center;
222
218
  justify-content: center;
223
- gap: 8px;
224
- padding: 4px 12px;
219
+ gap: var(--bcm-ui-spacing-2);
220
+ padding: var(--bcm-ui-spacing-1) var(--bcm-ui-spacing-3);
225
221
  outline: none;
226
- border-radius: 4px;
227
- transition: background-color 0.1s ease-in-out;
222
+ border-radius: var(--bcm-ui-border-radius-default);
223
+ transition-property: color, background-color, border-color;
224
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
225
+ transition-duration: 150ms;
228
226
  position: relative;
229
227
  min-width: 40px;
230
228
  border-width: 1px;
@@ -241,7 +239,7 @@
241
239
  left: 0;
242
240
  width: 100%;
243
241
  height: 100%;
244
- border-radius: 4px;
242
+ border-radius: var(--bcm-ui-border-radius-default);
245
243
  display: flex;
246
244
  align-items: center;
247
245
  justify-content: center;
@@ -292,7 +290,7 @@
292
290
  border-color: var(--bcm-button-ghost-border-default);
293
291
  }
294
292
  .bcm-button__container-kind-ghost:not([disabled]) .bcm-icon {
295
- color: var(--bcm-new-ds-color-slate-500);
293
+ color: var(--bcm-ui-color-text-disabled);
296
294
  }
297
295
  .bcm-button__container-kind-ghost:hover {
298
296
  color: var(--bcm-button-ghost-color-hover);
@@ -416,11 +414,11 @@
416
414
  order: 3;
417
415
  display: flex;
418
416
  align-items: center;
419
- gap: 8px;
417
+ gap: var(--bcm-ui-spacing-2);
420
418
  white-space: nowrap;
421
419
  }
422
420
  .bcm-button__container-icon {
423
- min-height: calc(12px + 8px);
421
+ min-height: var(--bcm-ui-line-height-4);
424
422
  }
425
423
  .bcm-button__container-icon.prefix {
426
424
  order: 2;
@@ -429,29 +427,29 @@
429
427
  order: 4;
430
428
  }
431
429
  .bcm-button__container-size-small {
432
- font-size: 12px;
433
- line-height: calc(12px + 8px);
434
- padding: calc(4px - 3px) 12px;
435
- min-height: calc(calc(12px + 8px) + calc(calc(4px - 2px)) * 2);
430
+ font-size: var(--bcm-ui-font-size-4);
431
+ line-height: var(--bcm-ui-line-height-4);
432
+ padding: var(--bcm-ui-spacing-px) var(--bcm-ui-spacing-3);
433
+ min-height: var(--bcm-ui-spacing-6);
436
434
  }
437
435
  .bcm-button__container-size-small .bcm-button__container-icon {
438
- min-height: calc(12px + 8px);
436
+ min-height: var(--bcm-ui-line-height-4);
439
437
  }
440
438
  .bcm-button__container-size-medium {
441
- font-size: calc(12px + 1px);
442
- line-height: calc(12px + 8px);
443
- padding: calc(4px + 1px) 12px;
444
- min-height: calc(calc(12px + 8px) + calc(calc(4px + 2px)) * 2);
439
+ font-size: var(--bcm-ui-font-size-5);
440
+ line-height: var(--bcm-ui-line-height-5);
441
+ padding: var(--bcm-ui-spacing-0-5) var(--bcm-ui-spacing-3);
442
+ min-height: var(--bcm-ui-spacing-8);
445
443
  }
446
444
  .bcm-button__container-size-medium .bcm-button__container-icon {
447
- min-height: calc(12px + 8px);
445
+ min-height: var(--bcm-ui-line-height-5);
448
446
  }
449
447
  .bcm-button__container-size-large {
450
- font-size: 16px;
451
- line-height: calc(16px + 8px);
452
- padding: calc(8px - 1px) 12px;
453
- min-height: calc(calc(16px + 8px) + (calc(8px) * 2));
448
+ font-size: var(--bcm-ui-font-size-6);
449
+ line-height: var(--bcm-ui-line-height-6);
450
+ padding: var(--bcm-ui-spacing-1) var(--bcm-ui-spacing-3);
451
+ min-height: var(--bcm-ui-spacing-10);
454
452
  }
455
453
  .bcm-button__container-size-large .bcm-button__container-icon {
456
- min-height: calc(16px + 8px);
454
+ min-height: var(--bcm-ui-line-height-6);
457
455
  }
@@ -8,7 +8,6 @@ import Bcm from '../../../models/bcm';
8
8
  import cs from 'classnames';
9
9
  import buttonState from "../states/button.states";
10
10
  import { ButtonTemplate } from '../../../templates/button-template';
11
- import { ColorHelper } from '../../../helper/color-helper';
12
11
  export class BcmButton {
13
12
  constructor() {
14
13
  this._id = Generate.UID();
@@ -72,59 +71,59 @@ export class BcmButton {
72
71
  const prefix = `--bcm-button-${kind}`;
73
72
  if (kind === 'solid') {
74
73
  return {
75
- [`${prefix}-color-default`]: ColorHelper.dsColor('white'),
76
- [`${prefix}-color-hover`]: ColorHelper.dsColor('white'),
77
- [`${prefix}-color-focus-visible`]: ColorHelper.dsColor('white'),
78
- [`${prefix}-color-active`]: ColorHelper.dsColor('white'),
79
- [`${prefix}-color-disabled`]: ColorHelper.dsColor('white'),
80
- [`${prefix}-background-color-default`]: ColorHelper.dsColor(color + '-700'),
81
- [`${prefix}-background-color-hover`]: ColorHelper.dsColor(color + '-800'),
82
- [`${prefix}-background-color-focus-visible`]: ColorHelper.dsColor(color + '-900'),
83
- [`${prefix}-background-color-active`]: ColorHelper.dsColor(color + '-900'),
84
- [`${prefix}-background-color-disabled`]: ColorHelper.dsColor('slate-400'),
85
- [`${prefix}-border-default`]: ColorHelper.dsColor(color + '-700'),
86
- [`${prefix}-border-hover`]: ColorHelper.dsColor(color + '-800'),
87
- [`${prefix}-border-focus-visible`]: ColorHelper.dsColor(color + '-900'),
88
- [`${prefix}-border-active`]: ColorHelper.dsColor(color + '-900'),
89
- [`${prefix}-border-disabled`]: ColorHelper.dsColor('slate-400')
74
+ [`${prefix}-color-default`]: `var(--bcm-ui-color-text-base)`,
75
+ [`${prefix}-color-hover`]: `var(--bcm-ui-color-text-base)`,
76
+ [`${prefix}-color-focus-visible`]: `var(--bcm-ui-color-text-base)`,
77
+ [`${prefix}-color-active`]: `var(--bcm-ui-color-text-base)`,
78
+ [`${prefix}-color-disabled`]: `var(--bcm-ui-color-text-disabled)`,
79
+ [`${prefix}-background-color-default`]: `var(--bcm-ui-color-background-vivid-${color}-default)`,
80
+ [`${prefix}-background-color-hover`]: `var(--bcm-ui-color-background-vivid-${color}-hover)`,
81
+ [`${prefix}-background-color-focus-visible`]: `var(--bcm-ui-color-background-vivid-${color}-active)`,
82
+ [`${prefix}-background-color-active`]: `var(--bcm-ui-color-background-vivid-${color}-active)`,
83
+ [`${prefix}-background-color-disabled`]: `var(--bcm-ui-color-background-disabled-default)`,
84
+ [`${prefix}-border-default`]: `transparent`,
85
+ [`${prefix}-border-hover`]: `transparent`,
86
+ [`${prefix}-border-focus-visible`]: `transparent`,
87
+ [`${prefix}-border-active`]: `transparent`,
88
+ [`${prefix}-border-disabled`]: `var(--bcm-ui-color-border-disabled)`,
90
89
  };
91
90
  }
92
91
  else if (kind == 'link') {
93
92
  return {
94
- [`${prefix}-color-default`]: ColorHelper.dsColor(color + '-700'),
95
- [`${prefix}-color-hover`]: ColorHelper.dsColor(color + '-800'),
96
- [`${prefix}-color-focus-visible`]: ColorHelper.dsColor(color + '-900'),
97
- [`${prefix}-color-active`]: ColorHelper.dsColor(color + '-900'),
98
- [`${prefix}-color-disabled`]: ColorHelper.dsColor('slate-400'),
99
- [`${prefix}-background-color-default`]: ColorHelper.dsColor('transparent'),
100
- [`${prefix}-background-color-hover`]: ColorHelper.dsColor('transparent'),
101
- [`${prefix}-background-color-focus-visible`]: ColorHelper.dsColor('slate-50'),
102
- [`${prefix}-background-color-active`]: ColorHelper.dsColor('slate-50'),
103
- [`${prefix}-background-color-disabled`]: ColorHelper.dsColor('transparent'),
104
- [`${prefix}-border-default`]: ColorHelper.dsColor('transparent'),
105
- [`${prefix}-border-hover`]: ColorHelper.dsColor('transparent'),
106
- [`${prefix}-border-focus-visible`]: ColorHelper.dsColor('slate-50'),
107
- [`${prefix}-border-active`]: ColorHelper.dsColor('slate-50'),
108
- [`${prefix}-border-disabled`]: ColorHelper.dsColor('transparent')
93
+ [`${prefix}-color-default`]: `var(--bcm-ui-color-text-palette-${color})`,
94
+ [`${prefix}-color-hover`]: `var(--bcm-ui-color-text-palette-${color})`,
95
+ [`${prefix}-color-focus-visible`]: `var(--bcm-ui-color-text-palette-${color})`,
96
+ [`${prefix}-color-active`]: `var(--bcm-ui-color-text-palette-${color})`,
97
+ [`${prefix}-color-disabled`]: `var(--bcm-ui-color-text-disabled)`,
98
+ [`${prefix}-background-color-default`]: `transparent`,
99
+ [`${prefix}-background-color-hover`]: `var(--bcm-ui-color-background-stated-${color}-default)`,
100
+ [`${prefix}-background-color-focus-visible`]: `var(--bcm-ui-color-background-stated-${color}-hover)`,
101
+ [`${prefix}-background-color-active`]: `var(--bcm-ui-color-background-stated-${color}-hover)`,
102
+ [`${prefix}-background-color-disabled`]: `var(--bcm-ui-color-background-disabled-default)`,
103
+ [`${prefix}-border-default`]: `transparent`,
104
+ [`${prefix}-border-hover`]: `transparent`,
105
+ [`${prefix}-border-focus-visible`]: `transparent`,
106
+ [`${prefix}-border-active`]: `transparent`,
107
+ [`${prefix}-border-disabled`]: `transparent`,
109
108
  };
110
109
  }
111
110
  else if (kind == 'ghost') {
112
111
  return {
113
- [`${prefix}-color-default`]: ColorHelper.dsColor(color + '-700'),
114
- [`${prefix}-color-hover`]: ColorHelper.dsColor(color + '-800'),
115
- [`${prefix}-color-focus-visible`]: ColorHelper.dsColor(color + '-600'),
116
- [`${prefix}-color-active`]: ColorHelper.dsColor(color + '-600'),
117
- [`${prefix}-color-disabled`]: ColorHelper.dsColor(color + '-300'),
118
- [`${prefix}-background-color-default`]: ColorHelper.dsColor(color + '-100'),
119
- [`${prefix}-background-color-hover`]: ColorHelper.dsColor(color + '-200'),
120
- [`${prefix}-background-color-focus-visible`]: ColorHelper.dsColor(color + '-400'),
121
- [`${prefix}-background-color-active`]: ColorHelper.dsColor(color + '-300'),
122
- [`${prefix}-background-color-disabled`]: ColorHelper.dsColor(color + '-50'),
123
- [`${prefix}-border-default`]: ColorHelper.dsColor(color + '-300'),
124
- [`${prefix}-border-hover`]: ColorHelper.dsColor(color + '-400'),
125
- [`${prefix}-border-focus-visible`]: ColorHelper.dsColor(color + '-600'),
126
- [`${prefix}-border-active`]: ColorHelper.dsColor(color + '-500'),
127
- [`${prefix}-border-disabled`]: ColorHelper.dsColor(color + '-200'),
112
+ [`${prefix}-color-default`]: `var(--bcm-ui-color-text-palette-${color})`,
113
+ [`${prefix}-color-hover`]: `var(--bcm-ui-color-text-palette-${color})`,
114
+ [`${prefix}-color-focus-visible`]: `var(--bcm-ui-color-text-palette-${color})`,
115
+ [`${prefix}-color-active`]: `var(--bcm-ui-color-text-palette-${color})`,
116
+ [`${prefix}-color-disabled`]: `var(--bcm-ui-color-text-disabled)`,
117
+ [`${prefix}-background-color-default`]: `var(--bcm-ui-color-background-stated-${color}-default)`,
118
+ [`${prefix}-background-color-hover`]: `var(--bcm-ui-color-background-stated-${color}-hover)`,
119
+ [`${prefix}-background-color-focus-visible`]: `var(--bcm-ui-color-background-stated-${color}-active)`,
120
+ [`${prefix}-background-color-active`]: `var(--bcm-ui-color-background-stated-${color}-active)`,
121
+ [`${prefix}-background-color-disabled`]: `var(--bcm-ui-color-background-disabled-default)`,
122
+ [`${prefix}-border-default`]: `var(--bcm-ui-color-border-soft-${color})`,
123
+ [`${prefix}-border-hover`]: `var(--bcm-ui-color-border-soft-${color})`,
124
+ [`${prefix}-border-focus-visible`]: `var(--bcm-ui-color-border-soft-${color})`,
125
+ [`${prefix}-border-active`]: `var(--bcm-ui-color-border-soft-${color})`,
126
+ [`${prefix}-border-disabled`]: `var(--bcm-ui-color-border-disabled)`,
128
127
  };
129
128
  }
130
129
  return;
@@ -1,5 +1,4 @@
1
1
  @import url("https://fonts.googleapis.com/css?family=Roboto:400,500");
2
- @import url("https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap");
3
2
  .size-1 {
4
3
  font-size: 12px;
5
4
  line-height: 20px;
@@ -123,42 +122,40 @@
123
122
  margin-right: 8px;
124
123
  }
125
124
 
126
- * {
127
- box-sizing: border-box;
128
- }
129
-
130
125
  .bcm-chip {
131
- --bcm-chip-color: var(--bcm-new-ds-color-slate-700);
132
- --bcm-chip-color-hover: var(--bcm-new-ds-color-slate-700);
133
- --bcm-chip-color-focus: var(--bcm-new-ds-color-slate-700);
134
- --bcm-chip-color-active: var(--bcm-new-ds-color-slate-700);
135
- --bcm-chip-color-disabled: var(--bcm-new-ds-color-slate-300);
136
- --bcm-chip-background-color: var(--bcm-new-ds-color-slate-100);
137
- --bcm-chip-background-color-hover: var(--bcm-new-ds-color-slate-200);
138
- --bcm-chip-background-color-focus: var(--bcm-new-ds-color-slate-300);
139
- --bcm-chip-background-color-active: var(--bcm-new-ds-color-slate-400);
140
- --bcm-chip-background-color-disabled: var(--bcm-new-ds-color-slate-100);
126
+ --bcm-chip-color: var(--bcm-ui-color-text-default);
127
+ --bcm-chip-color-hover: var(--bcm-ui-color-text-default);
128
+ --bcm-chip-color-focus: var(--bcm-ui-color-text-default);
129
+ --bcm-chip-color-active: var(--bcm-ui-color-text-default);
130
+ --bcm-chip-color-disabled: var(--bcm-ui-color-text-disabled);
131
+ --bcm-chip-background-color: var(--bcm-ui-color-background-default-default);
132
+ --bcm-chip-background-color-hover: var(--bcm-ui-color-background-default-hover);
133
+ --bcm-chip-background-color-focus: var(--bcm-ui-color-background-default-active);
134
+ --bcm-chip-background-color-active: var(--bcm-ui-color-background-default-active);
135
+ --bcm-chip-background-color-disabled: var(--bcm-ui-color-background-disabled-default);
141
136
  display: inline-flex;
142
137
  justify-content: center;
143
138
  align-items: center;
144
139
  width: fit-content;
145
140
  height: fit-content;
146
- font-family: "Inter", sans-serif;
147
- font-size: 14px;
148
- line-height: calc(14px + 8px);
141
+ font-family: Inter, sans-serif;
142
+ font-size: var(--bcm-ui-font-size-5);
143
+ line-height: var(--bcm-ui-line-height-5);
149
144
  font-weight: 400;
150
- padding: 0 8px;
151
- gap: 4px;
145
+ padding: 0 var(--bcm-ui-spacing-2);
146
+ gap: var(--bcm-ui-spacing-1);
152
147
  color: var(--bcm-chip-color);
153
148
  background-color: var(--bcm-chip-background-color);
154
- border-radius: 100px;
155
- transition: background-color 0.1s ease-in-out;
149
+ border-radius: var(--bcm-ui-border-radius-full);
150
+ transition-property: color, background-color, border-color;
151
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
152
+ transition-duration: 150ms;
156
153
  outline: none;
157
154
  }
158
155
  .bcm-chip:not(.bcm-chip--disabled):hover {
159
156
  background-color: var(--bcm-chip-background-color-hover);
160
157
  }
161
- .bcm-chip:not(.bcm-chip--disabled):focus {
158
+ .bcm-chip:not(.bcm-chip--disabled):focus-visible {
162
159
  background-color: var(--bcm-chip-background-color-focus);
163
160
  color: var(--bcm-chip-color-focus);
164
161
  }
@@ -178,8 +175,9 @@
178
175
  color: var(--bcm-chip-color-active);
179
176
  }
180
177
  .bcm-chip__size-small {
181
- font-size: 10px;
182
- line-height: calc(10px + 8px);
178
+ font-size: var(--bcm-ui-font-size-3);
179
+ line-height: var(--bcm-ui-line-height-3);
180
+ padding: var(--bcm-ui-spacing-px) var(--bcm-ui-spacing-2);
183
181
  }
184
182
  .bcm-chip__size-small .bcm-avatar {
185
183
  width: 14px;
@@ -189,8 +187,8 @@
189
187
  width: 8px;
190
188
  }
191
189
  .bcm-chip__size-medium {
192
- font-size: 12px;
193
- line-height: calc(12px + 8px);
190
+ font-size: var(--bcm-ui-font-size-4);
191
+ line-height: var(--bcm-ui-line-height-4);
194
192
  }
195
193
  .bcm-chip__size-medium .bcm-avatar {
196
194
  width: 16px;
@@ -200,8 +198,8 @@
200
198
  width: 10px;
201
199
  }
202
200
  .bcm-chip__size-large {
203
- font-size: 14px;
204
- line-height: calc(14px + 8px);
201
+ font-size: var(--bcm-ui-font-size-5);
202
+ line-height: var(--bcm-ui-line-height-5);
205
203
  }
206
204
  .bcm-chip__size-large .bcm-avatar {
207
205
  width: 18px;
@@ -4,7 +4,6 @@
4
4
  */
5
5
  import { h, Host } from "@stencil/core";
6
6
  import cs from "classnames";
7
- import { ColorHelper } from "../../../helper/color-helper";
8
7
  import { Generate } from "../../../helper/generate";
9
8
  export class BcmChip {
10
9
  constructor() {
@@ -25,16 +24,16 @@ export class BcmChip {
25
24
  return;
26
25
  const color = this.selected ? "indigo" : this.color; // Important: Find a solution for this in V3! ( selected ? this.color : "indigo" )
27
26
  return {
28
- "--bcm-chip-color": ColorHelper.dsColor(color + "-700"),
29
- "--bcm-chip-color-hover": ColorHelper.dsColor(color + "-700"),
30
- "--bcm-chip-color-focus": ColorHelper.dsColor(color + "-700"),
31
- "--bcm-chip-color-active": ColorHelper.dsColor(color + "-700"),
32
- "--bcm-chip-color-disabled": ColorHelper.dsColor("slate" + "-300"),
33
- "--bcm-chip-background-color": ColorHelper.dsColor(color + "-100"),
34
- "--bcm-chip-background-color-hover": ColorHelper.dsColor(color + "-200"),
35
- "--bcm-chip-background-color-focus": ColorHelper.dsColor(color + "-300"),
36
- "--bcm-chip-background-color-active": ColorHelper.dsColor(color + "-200"),
37
- "--bcm-chip-background-color-disabled": ColorHelper.dsColor("slate" + "-100"),
27
+ "--bcm-chip-color": `var(--bcm-ui-color-text-palette-${color})`,
28
+ "--bcm-chip-color-hover": `var(--bcm-ui-color-text-palette-${color})`,
29
+ "--bcm-chip-color-focus": `var(--bcm-ui-color-text-palette-${color})`,
30
+ "--bcm-chip-color-active": `var(--bcm-ui-color-text-palette-${color})`,
31
+ "--bcm-chip-color-disabled": `var(--bcm-ui-color-text-disabled)`,
32
+ "--bcm-chip-background-color": `var(--bcm-ui-color-background-stated-${color}-default)`,
33
+ "--bcm-chip-background-color-hover": `var(--bcm-ui-color-background-stated-${color}-hover)`,
34
+ "--bcm-chip-background-color-focus": `var(--bcm-ui-color-background-stated-${color}-active)`,
35
+ "--bcm-chip-background-color-active": `var(--bcm-ui-color-background-stated-${color}-active)`,
36
+ "--bcm-chip-background-color-disabled": `var(--bcm-ui-color-background-disabled-default)`,
38
37
  };
39
38
  }
40
39
  handleDismiss(e) {
@@ -131,12 +131,12 @@
131
131
  .bcm-divider__direction-horizontal {
132
132
  width: 100%;
133
133
  height: 1px;
134
- margin: 4px auto;
135
- border-top: 1px solid var(--bcm-color-grey-5);
134
+ margin: var(--bcm-ui-spacing-1) auto;
135
+ border-top: 1px solid var(--bcm-ui-color-border-default);
136
136
  }
137
137
  .bcm-divider__direction-vertical {
138
138
  height: auto;
139
139
  width: 1px;
140
- margin: 0 4px;
141
- border-left: 1px solid var(--bcm-color-grey-5);
140
+ margin: 0 var(--bcm-ui-spacing-1);
141
+ border-left: 1px solid var(--bcm-ui-color-border-default);
142
142
  }
@@ -128,12 +128,9 @@
128
128
  }
129
129
 
130
130
  .bcm-link {
131
- font-family: "Inter", sans-serif;
132
- font-size: 14px;
133
- line-height: calc(14px + 8px);
134
- font-weight: 400;
131
+ font-family: Inter, sans-serif;
135
132
  display: inline;
136
- color: #1D4ED8;
133
+ color: var(--bcm-ui-color-text-primary);
137
134
  }
138
135
  .bcm-link.hidden {
139
136
  display: none;
@@ -143,20 +140,22 @@
143
140
  cursor: not-allowed;
144
141
  }
145
142
  .bcm-link.disabled .bcm-link__anchor {
146
- color: #6B7280;
143
+ color: var(--bcm-ui-color-text-disabled);
147
144
  }
148
145
  .bcm-link__anchor {
149
146
  display: inline-flex;
150
147
  align-items: baseline;
151
148
  font-size: inherit;
149
+ line-height: inherit;
150
+ font-weight: inherit;
152
151
  color: inherit;
153
152
  text-decoration: none;
154
153
  }
155
154
  .bcm-link__anchor.prefix .prefix-icon {
156
- margin-right: 4px;
155
+ margin-right: var(--bcm-ui-spacing-1);
157
156
  }
158
157
  .bcm-link__anchor.suffix .suffix-icon {
159
- margin-left: 4px;
158
+ margin-left: var(--bcm-ui-spacing-1);
160
159
  }
161
160
  .bcm-link__anchor:hover, .bcm-link__anchor:focus, .bcm-link__anchor:active, .bcm-link__anchor:focus-visible {
162
161
  outline: none;
@@ -165,11 +164,11 @@
165
164
  text-decoration: underline;
166
165
  }
167
166
  .bcm-link__anchor:active {
168
- color: var(--bcm-new-ds-color-blue-700);
167
+ color: var(--bcm-ui-color-text-primary);
169
168
  }
170
169
  .bcm-link__anchor:focus-visible {
171
- color: var(--bcm-new-ds-color-blue-800);
170
+ color: var(--bcm-ui-color-text-primary);
172
171
  }
173
172
  .bcm-link__anchor:visited {
174
- color: #7E22CE;
173
+ color: var(--bcm-ui-color-text-visited);
175
174
  }
@@ -124,4 +124,27 @@
124
124
 
125
125
  :host {
126
126
  display: block;
127
+ }
128
+
129
+ .bcm-accordion .bcm-expansion-panel {
130
+ border-radius: 0;
131
+ }
132
+ .bcm-accordion .bcm-expansion-panel .bcm-expansion-panel__header {
133
+ border-radius: 0;
134
+ }
135
+ .bcm-accordion .bcm-expansion-panel:first-child {
136
+ border-top-left-radius: var(--bcm-ui-border-radius-default);
137
+ border-top-right-radius: var(--bcm-ui-border-radius-default);
138
+ }
139
+ .bcm-accordion .bcm-expansion-panel:first-child .bcm-expansion-panel__header {
140
+ border-top-left-radius: var(--bcm-ui-border-radius-default);
141
+ border-top-right-radius: var(--bcm-ui-border-radius-default);
142
+ }
143
+ .bcm-accordion .bcm-expansion-panel:last-child {
144
+ border-bottom-left-radius: var(--bcm-ui-border-radius-default);
145
+ border-bottom-right-radius: var(--bcm-ui-border-radius-default);
146
+ }
147
+ .bcm-accordion .bcm-expansion-panel:last-child .bcm-expansion-panel__header {
148
+ border-bottom-left-radius: var(--bcm-ui-border-radius-default);
149
+ border-bottom-right-radius: var(--bcm-ui-border-radius-default);
127
150
  }
@@ -54,7 +54,7 @@ export class BcmAccordion {
54
54
  }
55
55
  }
56
56
  render() {
57
- return (h(Host, { id: this._id }, h("slot", null)));
57
+ return (h(Host, { id: this._id, class: "bcm-accordion" }, h("slot", null)));
58
58
  }
59
59
  static get is() { return "bcm-accordion"; }
60
60
  static get originalStyleUrls() {