@lucca-front/scss 19.1.6 → 19.2.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 (217) hide show
  1. package/dist/lucca-front.min.css +1 -1
  2. package/package.json +2 -2
  3. package/src/commons/base.scss +15 -3
  4. package/src/commons/config.scss +6 -2
  5. package/src/commons/core.scss +9 -8
  6. package/src/commons/utils/a11y.scss +2 -2
  7. package/src/commons/utils/form.scss +1 -1
  8. package/src/commons/utils/index.scss +39 -28
  9. package/src/commons/utils/loading.scss +14 -15
  10. package/src/commons/utils/media.scss +15 -10
  11. package/src/commons/utils/overflow.scss +18 -0
  12. package/src/commons/utils/reset.scss +2 -2
  13. package/src/commons/vars.scss +1 -2
  14. package/src/components/avatar/component.scss +5 -5
  15. package/src/components/box/component.scss +2 -2
  16. package/src/components/box/mods.scss +13 -12
  17. package/src/components/breadcrumbs/component.scss +2 -1
  18. package/src/components/breadcrumbs/mods.scss +1 -1
  19. package/src/components/button/component.scss +2 -2
  20. package/src/components/button/mods.scss +1 -1
  21. package/src/components/button/states.scss +3 -3
  22. package/src/components/buttonGroup/component.scss +8 -7
  23. package/src/components/calendar/component.scss +24 -22
  24. package/src/components/calendar/index.scss +1 -1
  25. package/src/components/calendar/states.scss +5 -4
  26. package/src/components/callout/component.scss +5 -4
  27. package/src/components/calloutAccordion/component.scss +8 -5
  28. package/src/components/calloutAccordion/mods.scss +3 -2
  29. package/src/components/calloutDisclosure/component.scss +7 -4
  30. package/src/components/calloutDisclosure/mods.scss +2 -2
  31. package/src/components/calloutPopover/component.scss +9 -5
  32. package/src/components/calloutPopover/index.scss +1 -1
  33. package/src/components/calloutPopover/mods.scss +2 -1
  34. package/src/components/card/component.scss +10 -10
  35. package/src/components/checkbox/component.scss +4 -4
  36. package/src/components/checkbox/mods.scss +1 -1
  37. package/src/components/checkboxField/component.scss +6 -6
  38. package/src/components/chip/component.scss +6 -5
  39. package/src/components/clear/component.scss +2 -2
  40. package/src/components/clear/index.scss +8 -0
  41. package/src/components/clear/mods.scss +30 -4
  42. package/src/components/code/component.scss +2 -1
  43. package/src/components/code/mods.scss +2 -1
  44. package/src/components/collapse/component.scss +2 -2
  45. package/src/components/comment/component.scss +8 -6
  46. package/src/components/comment/mods.scss +2 -1
  47. package/src/components/container/component.scss +1 -1
  48. package/src/components/contentSection/component.scss +1 -1
  49. package/src/components/dataTable/component.scss +7 -7
  50. package/src/components/dataTable/mods.scss +13 -6
  51. package/src/components/dataTableSticked/mods.scss +19 -21
  52. package/src/components/dateField/component.scss +1 -1
  53. package/src/components/dateField/index.scss +5 -1
  54. package/src/components/dateField/mods.scss +21 -0
  55. package/src/components/dateRangeField/component.scss +5 -5
  56. package/src/components/dateRangeField/index.scss +10 -1
  57. package/src/components/dateRangeField/mods.scss +38 -0
  58. package/src/components/dialog/component.scss +16 -14
  59. package/src/components/dialog/mods.scss +4 -4
  60. package/src/components/divider/component.scss +5 -5
  61. package/src/components/divider/mods.scss +3 -3
  62. package/src/components/dropdown/component.scss +77 -0
  63. package/src/components/dropdown/exports.scss +4 -0
  64. package/src/components/dropdown/index.scss +19 -0
  65. package/src/components/dropdown/mods.scss +8 -0
  66. package/src/components/dropdown/states.scss +9 -0
  67. package/src/components/dropdown/vars.scss +8 -0
  68. package/src/components/emptyState/component.scss +12 -8
  69. package/src/components/errorPage/component.scss +21 -18
  70. package/src/components/fancyBox/component.scss +17 -15
  71. package/src/components/field/component.scss +5 -5
  72. package/src/components/field/mods.scss +33 -34
  73. package/src/components/field/states.scss +9 -9
  74. package/src/components/field/vars.scss +1 -1
  75. package/src/components/fieldset/component.scss +6 -6
  76. package/src/components/file/component.scss +14 -12
  77. package/src/components/file/mods.scss +11 -8
  78. package/src/components/filterBar/component.scss +35 -63
  79. package/src/components/filterBar/index.scss +15 -2
  80. package/src/components/filterBar/mods.scss +52 -2
  81. package/src/components/filterBar/vars.scss +1 -1
  82. package/src/components/filterBarDeprecated/component.scss +85 -0
  83. package/src/components/filterBarDeprecated/exports.scss +4 -0
  84. package/src/components/filterBarDeprecated/index.scss +10 -0
  85. package/src/components/filterBarDeprecated/mods.scss +3 -0
  86. package/src/components/filterBarDeprecated/states.scss +0 -0
  87. package/src/components/filterBarDeprecated/vars.scss +3 -0
  88. package/src/components/filterPill/component.scss +203 -0
  89. package/src/components/filterPill/exports.scss +4 -0
  90. package/src/components/filterPill/index.scss +83 -0
  91. package/src/components/filterPill/mods.scss +71 -0
  92. package/src/components/filterPill/states.scss +112 -0
  93. package/src/components/filterPill/vars.scss +25 -0
  94. package/src/components/filters/component.scss +8 -8
  95. package/src/components/filters/mods.scss +5 -6
  96. package/src/components/footer/component.scss +5 -4
  97. package/src/components/form/component.scss +12 -8
  98. package/src/components/form/index.scss +10 -4
  99. package/src/components/form/mods.scss +80 -22
  100. package/src/components/form/vars.scss +1 -0
  101. package/src/components/formLabel/component.scss +7 -7
  102. package/src/components/formLabel/mods.scss +6 -1
  103. package/src/components/gauge/component.scss +5 -5
  104. package/src/components/gauge/mods.scss +5 -5
  105. package/src/components/grid/component.scss +4 -4
  106. package/src/components/header/component.scss +11 -11
  107. package/src/components/header/mods.scss +8 -10
  108. package/src/components/header/states.scss +3 -3
  109. package/src/components/index.scss +5 -1
  110. package/src/components/indexTable/component.scss +21 -17
  111. package/src/components/indexTable/mods.scss +30 -29
  112. package/src/components/inlineMessage/component.scss +1 -1
  113. package/src/components/label/component.scss +2 -1
  114. package/src/components/label/mods.scss +6 -6
  115. package/src/components/layout/component.scss +15 -15
  116. package/src/components/layout/mods.scss +1 -1
  117. package/src/components/layout/states.scss +5 -14
  118. package/src/components/link/mods.scss +1 -1
  119. package/src/components/list/component.scss +7 -7
  120. package/src/components/list/mods.scss +3 -3
  121. package/src/components/loading/component.scss +5 -5
  122. package/src/components/main/component.scss +1 -1
  123. package/src/components/main/mods.scss +4 -4
  124. package/src/components/main/states.scss +1 -1
  125. package/src/components/menu/component.scss +15 -11
  126. package/src/components/menu/mods.scss +3 -3
  127. package/src/components/mobileHeader/component.scss +3 -2
  128. package/src/components/mobileHeader/mods.scss +1 -1
  129. package/src/components/mobileNavigation/component.scss +7 -5
  130. package/src/components/multiSelect/component.scss +15 -6
  131. package/src/components/multiSelect/index.scss +18 -3
  132. package/src/components/multiSelect/mods.scss +44 -1
  133. package/src/components/multiSelect/states.scss +20 -0
  134. package/src/components/navside/component.scss +31 -30
  135. package/src/components/navside/mods.scss +22 -22
  136. package/src/components/navside/states.scss +5 -12
  137. package/src/components/newBadge/component.scss +2 -1
  138. package/src/components/notchBox/component.scss +20 -36
  139. package/src/components/notchBox/mods.scss +24 -41
  140. package/src/components/numericBadge/component.scss +11 -3
  141. package/src/components/numericBadge/index.scss +4 -0
  142. package/src/components/numericBadge/mods.scss +1 -1
  143. package/src/components/numericBadge/states.scss +7 -3
  144. package/src/components/pageHeader/component.scss +4 -4
  145. package/src/components/pageHeader/mods.scss +7 -8
  146. package/src/components/pagination/component.scss +8 -7
  147. package/src/components/plgPush/component.scss +2 -2
  148. package/src/components/popover/component.scss +7 -7
  149. package/src/components/popover/vars.scss +1 -0
  150. package/src/components/progress/component.scss +10 -10
  151. package/src/components/progress/mods.scss +5 -5
  152. package/src/components/progress/states.scss +1 -1
  153. package/src/components/radio/component.scss +5 -5
  154. package/src/components/radio/mods.scss +6 -7
  155. package/src/components/radioButtons/component.scss +3 -3
  156. package/src/components/radioField/component.scss +6 -6
  157. package/src/components/scrollBox/component.scss +23 -57
  158. package/src/components/scrollBox/index.scss +12 -0
  159. package/src/components/scrollBox/mods.scss +0 -2
  160. package/src/components/scrollBox/states.scss +11 -1
  161. package/src/components/scrollBox/vars.scss +11 -1
  162. package/src/components/section/component.scss +1 -1
  163. package/src/components/section/mods.scss +2 -4
  164. package/src/components/segmentedControl/component.scss +24 -29
  165. package/src/components/segmentedControl/states.scss +1 -1
  166. package/src/components/segmentedControl/vars.scss +3 -2
  167. package/src/components/simpleSelect/component.scss +33 -23
  168. package/src/components/simpleSelect/index.scss +25 -14
  169. package/src/components/simpleSelect/mods.scss +33 -6
  170. package/src/components/simpleSelect/states.scss +26 -10
  171. package/src/components/skeleton/mods.scss +4 -4
  172. package/src/components/skeleton/states.scss +5 -5
  173. package/src/components/skipLinks/component.scss +3 -2
  174. package/src/components/sortableList/component.scss +7 -7
  175. package/src/components/statusBadge/component.scss +5 -4
  176. package/src/components/switch/component.scss +10 -10
  177. package/src/components/switch/mods.scss +3 -3
  178. package/src/components/switch/states.scss +4 -2
  179. package/src/components/switchField/component.scss +10 -10
  180. package/src/components/switchField/states.scss +1 -1
  181. package/src/components/table/component.scss +13 -13
  182. package/src/components/table/mods.scss +33 -34
  183. package/src/components/tableFixed/mods.scss +2 -2
  184. package/src/components/tableFixedDeprecated/mods.scss +3 -3
  185. package/src/components/tableOfContent/component.scss +1 -1
  186. package/src/components/tableSortable/component.scss +6 -5
  187. package/src/components/tableSortable/mods.scss +9 -9
  188. package/src/components/tableSortable/states.scss +1 -1
  189. package/src/components/tableSticked/mods.scss +33 -30
  190. package/src/components/tableStickedDeprecated/mods.scss +39 -41
  191. package/src/components/tag/component.scss +2 -1
  192. package/src/components/textField/component.scss +26 -25
  193. package/src/components/textField/index.scss +4 -0
  194. package/src/components/textField/mods.scss +13 -4
  195. package/src/components/textField/vars.scss +3 -0
  196. package/src/components/textFlow/component.scss +33 -0
  197. package/src/components/textFlow/exports.scss +4 -0
  198. package/src/components/textFlow/index.scss +6 -0
  199. package/src/components/textFlow/mods.scss +0 -0
  200. package/src/components/textFlow/states.scss +0 -0
  201. package/src/components/textFlow/vars.scss +2 -0
  202. package/src/components/textfields/component.scss +15 -11
  203. package/src/components/textfields/mods.scss +100 -97
  204. package/src/components/textfields/states.scss +7 -7
  205. package/src/components/timeline/component.scss +10 -9
  206. package/src/components/timeline/mods.scss +55 -54
  207. package/src/components/timepicker/component.scss +21 -19
  208. package/src/components/timepickerDeprecated/component.scss +11 -10
  209. package/src/components/title/component.scss +17 -4
  210. package/src/components/titleSection/component.scss +3 -3
  211. package/src/components/titleSection/mods.scss +3 -1
  212. package/src/components/toast/component.scss +10 -8
  213. package/src/components/tooltip/component.scss +6 -5
  214. package/src/components/userPopover/component.scss +6 -5
  215. package/src/components/userTile/component.scss +2 -2
  216. package/src/components/verticalNavigation/component.scss +8 -6
  217. package/src/components/verticalNavigation/mods.scss +2 -2
package/src/components/userPopover/component.scss CHANGED
@@ -2,8 +2,8 @@
2
2
  @use '@lucca-front/scss/src/commons/utils/namespace';
3
3
 
4
4
  @mixin component($atRoot: namespace.$defaultAtRoot) {
5
- width: 23.5rem;
6
- max-width: calc(100vw - var(--pr-t-spacings-200) * 2);
5
+ inline-size: 23.5rem;
6
+ max-inline-size: calc(100vw - var(--pr-t-spacings-200) * 2);
7
7
  padding: var(--pr-t-spacings-200);
8
8
 
9
9
  @at-root ($atRoot) {
@@ -14,7 +14,7 @@
14
14
  }
15
15
 
16
16
  .userPopover-details-info {
17
- min-width: 0;
17
+ min-inline-size: 0;
18
18
  }
19
19
 
20
20
  .userPopover-details-info-name {
@@ -39,7 +39,7 @@
39
39
  }
40
40
 
41
41
  .userPopover-details-info-detail {
42
- margin-bottom: 0;
42
+ margin-block-end: 0;
43
43
  font-size: var(--sizes-S-fontSize);
44
44
  line-height: var(--sizes-S-lineHeight);
45
45
  }
@@ -71,7 +71,8 @@
71
71
  &:not(.avatar) {
72
72
  @include avatar.XXXL;
73
73
 
74
- margin: var(--pr-t-spacings-50) 0;
74
+ margin-block: var(--pr-t-spacings-50);
75
+ margin-inline: 0;
75
76
  }
76
77
  }
77
78
  }
package/src/components/userTile/component.scss CHANGED
@@ -10,14 +10,14 @@
10
10
  display: flex;
11
11
  align-self: start;
12
12
  align-items: center;
13
- min-height: var(--components-avatar-size);
13
+ min-block-size: var(--components-avatar-size);
14
14
  }
15
15
 
16
16
  // .user-tile-label is deprecated
17
17
  &:has(.userTile-content-info, .user-tile-label) {
18
18
  // Apply height to avatar (calculed on title & info height) to avoid img overflow
19
19
  .avatar {
20
- height: calc(var(--components-userTile-title-lineHeight) + var(--components-userTile-info-lineHeight));
20
+ block-size: calc(var(--components-userTile-title-lineHeight) + var(--components-userTile-info-lineHeight));
21
21
  }
22
22
  }
23
23
 
package/src/components/verticalNavigation/component.scss CHANGED
@@ -8,25 +8,27 @@
8
8
  .verticalNavigation-sectionTitle {
9
9
  @include title.h5;
10
10
  color: var(--palettes-neutral-600);
11
- padding: 0 var(--components-verticalNavigation-horizontalPadding);
12
- margin-bottom: var(--pr-t-spacings-100);
11
+ padding-block: 0;
12
+ padding-inline: var(--components-verticalNavigation-horizontalPadding);
13
+ margin-block-end: var(--pr-t-spacings-100);
13
14
  }
14
15
 
15
16
  .verticalNavigation-list {
16
17
  @include reset.list;
17
18
  background-color: var(--pr-t-elevation-surface-raised);
18
- margin-bottom: var(--pr-t-spacings-200);
19
+ margin-block-end: var(--pr-t-spacings-200);
19
20
  }
20
21
 
21
22
  .verticalNavigation-list-item-link-icon {
22
23
  font-size: var(--sizes-M-lineHeight);
23
- margin-right: var(--pr-t-spacings-100);
24
+ margin-inline-end: var(--pr-t-spacings-100);
24
25
  }
25
26
 
26
27
  .verticalNavigation-list-item-link {
27
28
  @include reset.button;
28
29
  display: flex;
29
- padding: var(--pr-t-spacings-100) var(--components-verticalNavigation-horizontalPadding);
30
+ padding-block: var(--pr-t-spacings-100);
31
+ padding-inline: var(--components-verticalNavigation-horizontalPadding);
30
32
  border-radius: var(--commons-borderRadius-M);
31
33
  color: var(--components-verticalNavigation-link-color);
32
34
  text-decoration: none;
@@ -50,7 +52,7 @@
50
52
 
51
53
  .verticalNavigation-list-item-link-arrow {
52
54
  font-size: var(--sizes-M-lineHeight);
53
- margin-left: auto;
55
+ margin-inline-start: auto;
54
56
  transition: transform var(--commons-animations-durations-standard) ease;
55
57
  }
56
58
  }
package/src/components/verticalNavigation/mods.scss CHANGED
@@ -4,14 +4,14 @@
4
4
 
5
5
  .verticalNavigation-list-item-link {
6
6
  font-weight: 400;
7
- padding-left: calc(2rem + var(--components-verticalNavigation-horizontalPadding));
7
+ padding-inline-start: calc(2rem + var(--components-verticalNavigation-horizontalPadding));
8
8
  }
9
9
  }
10
10
 
11
11
  @mixin iconless {
12
12
  .verticalNavigation-list.mod-child {
13
13
  .verticalNavigation-list-item-link {
14
- padding-left: var(--components-verticalNavigation-horizontalPadding);
14
+ padding-inline-start: var(--components-verticalNavigation-horizontalPadding);
15
15
  }
16
16
  }
17
17