@volverjs/style 0.1.2-beta.9 → 0.1.2

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 (180) hide show
  1. package/LICENSE +1 -1
  2. package/README.md +53 -46
  3. package/dist/components/vv-accordion.css +1 -1
  4. package/dist/components/vv-alert.css +1 -0
  5. package/dist/components/vv-avatar.css +1 -0
  6. package/dist/components/vv-badge.css +1 -1
  7. package/dist/components/vv-breadcrumb.css +1 -1
  8. package/dist/components/vv-button-group.css +1 -1
  9. package/dist/components/vv-button.css +1 -1
  10. package/dist/components/vv-card.css +1 -1
  11. package/dist/components/vv-checkbox-group.css +1 -0
  12. package/dist/components/vv-checkbox.css +1 -0
  13. package/dist/components/vv-dialog.css +1 -1
  14. package/dist/components/vv-dropdown.css +1 -1
  15. package/dist/components/vv-input-text.css +1 -1
  16. package/dist/components/vv-nav.css +1 -1
  17. package/dist/components/vv-progress.css +1 -1
  18. package/dist/components/vv-radio-group.css +1 -0
  19. package/dist/components/vv-radio.css +1 -0
  20. package/dist/components/vv-select.css +1 -1
  21. package/dist/components/vv-skeleton.css +1 -0
  22. package/dist/components/vv-tab.css +1 -0
  23. package/dist/components/vv-table.css +1 -1
  24. package/dist/components/vv-text.css +1 -1
  25. package/dist/components/vv-textarea.css +1 -1
  26. package/dist/components/vv-toast.css +1 -0
  27. package/dist/components/vv-tooltip.css +1 -0
  28. package/dist/components.css +1 -1
  29. package/dist/export.css +1 -1
  30. package/dist/props/background.css +1 -1
  31. package/dist/props/breakpoints.css +1 -0
  32. package/dist/props/colors.css +1 -1
  33. package/dist/props/filters.css +1 -1
  34. package/dist/props/input.css +1 -1
  35. package/dist/props/layout.css +1 -1
  36. package/dist/props/spacing.css +1 -1
  37. package/dist/props/transitions.css +1 -0
  38. package/dist/props.css +1 -1
  39. package/dist/themes/dark/components.css +1 -1
  40. package/dist/themes/dark/props.css +1 -1
  41. package/dist/themes/dark/volver.css +1 -1
  42. package/dist/utilities/backgrounds.css +1 -1
  43. package/dist/utilities/borders.css +1 -1
  44. package/dist/utilities/colors.css +1 -1
  45. package/dist/utilities/effects.css +1 -1
  46. package/dist/utilities/filters.css +1 -1
  47. package/dist/utilities/flexbox.css +1 -1
  48. package/dist/utilities/interactivity.css +1 -0
  49. package/dist/utilities/layout.css +1 -1
  50. package/dist/utilities/sizing.css +1 -1
  51. package/dist/utilities/spacing.css +1 -1
  52. package/dist/utilities/transitions.css +1 -0
  53. package/dist/utilities/typography.css +1 -1
  54. package/dist/utilities.css +1 -1
  55. package/dist/volver.css +1 -1
  56. package/package.json +56 -36
  57. package/src/_config.scss +17 -11
  58. package/src/_context.scss +3 -3
  59. package/src/_preflight.scss +308 -247
  60. package/src/components/index.scss +25 -19
  61. package/src/components/vv-accordion.scss +3 -2
  62. package/src/components/vv-alert.scss +13 -0
  63. package/src/components/vv-avatar.scss +13 -0
  64. package/src/components/vv-badge.scss +3 -2
  65. package/src/components/vv-breadcrumb.scss +3 -2
  66. package/src/components/vv-button-group.scss +11 -10
  67. package/src/components/vv-button.scss +5 -8
  68. package/src/components/vv-card.scss +3 -2
  69. package/src/components/vv-checkbox-group.scss +13 -0
  70. package/src/components/{vv-input-checkbox.scss → vv-checkbox.scss} +7 -6
  71. package/src/components/vv-dialog.scss +3 -2
  72. package/src/components/vv-dropdown.scss +3 -2
  73. package/src/components/vv-input-text.scss +6 -5
  74. package/src/components/vv-nav.scss +3 -2
  75. package/src/components/vv-progress.scss +3 -2
  76. package/src/components/vv-radio-group.scss +13 -0
  77. package/src/components/{vv-input-radio.scss → vv-radio.scss} +6 -5
  78. package/src/components/vv-select.scss +6 -5
  79. package/src/components/vv-skeleton.scss +14 -0
  80. package/src/components/vv-tab.scss +13 -0
  81. package/src/components/vv-table.scss +3 -2
  82. package/src/components/vv-text.scss +3 -2
  83. package/src/components/vv-textarea.scss +6 -5
  84. package/src/components/vv-toast.scss +13 -0
  85. package/src/components/vv-tooltip.scss +33 -0
  86. package/src/export.scss +89 -27
  87. package/src/props/background.scss +1 -1
  88. package/src/props/borders.scss +1 -1
  89. package/src/props/breakpoints.scss +15 -0
  90. package/src/props/colors.scss +1 -1
  91. package/src/props/effects.scss +1 -1
  92. package/src/props/filters.scss +2 -1
  93. package/src/props/index.scss +13 -12
  94. package/src/props/input.scss +1 -1
  95. package/src/props/layout.scss +1 -1
  96. package/src/props/media.scss +1 -1
  97. package/src/props/sizing.scss +1 -1
  98. package/src/props/spacing.scss +2 -2
  99. package/src/props/{animation.scss → transitions.scss} +53 -2
  100. package/src/props/typography.scss +2 -2
  101. package/src/settings/_background.scss +6 -1
  102. package/src/settings/_breakpoints.scss +2 -0
  103. package/src/settings/_colors.scss +23 -4
  104. package/src/settings/_effects.scss +47 -2
  105. package/src/settings/_filters.scss +9 -0
  106. package/src/settings/_index.scss +40 -33
  107. package/src/settings/_input.scss +8 -6
  108. package/src/settings/_interactivity.scss +39 -0
  109. package/src/settings/_layout.scss +18 -10
  110. package/src/settings/_spacing.scss +1 -0
  111. package/src/settings/_transitions.scss +44 -0
  112. package/src/settings/components/_vv-accordion.scss +40 -34
  113. package/src/settings/components/_vv-alert.scss +161 -0
  114. package/src/settings/components/_vv-avatar.scss +55 -0
  115. package/src/settings/components/_vv-badge.scss +43 -11
  116. package/src/settings/components/_vv-breadcrumb.scss +23 -15
  117. package/src/settings/components/_vv-button-group.scss +4 -0
  118. package/src/settings/components/_vv-button.scss +30 -25
  119. package/src/settings/components/_vv-card.scss +2 -2
  120. package/src/settings/components/{_vv-input-checkbox-group.scss → _vv-checkbox-group.scss} +2 -1
  121. package/src/settings/components/{_vv-input-checkbox.scss → _vv-checkbox.scss} +46 -11
  122. package/src/settings/components/_vv-dialog.scss +71 -89
  123. package/src/settings/components/_vv-input-text.scss +83 -37
  124. package/src/settings/components/_vv-nav.scss +98 -13
  125. package/src/settings/components/_vv-progress.scss +1 -1
  126. package/src/settings/components/_vv-radio-group.scss +3 -0
  127. package/src/settings/components/{_vv-input-radio.scss → _vv-radio.scss} +33 -4
  128. package/src/settings/components/_vv-select.scss +34 -43
  129. package/src/settings/components/_vv-skeleton.scss +22 -0
  130. package/src/settings/components/_vv-tab.scss +16 -0
  131. package/src/settings/components/_vv-table.scss +8 -1
  132. package/src/settings/components/_vv-text.scss +20 -0
  133. package/src/settings/components/_vv-textarea.scss +49 -24
  134. package/src/settings/components/_vv-toast.scss +259 -0
  135. package/src/settings/components/_vv-tooltip.scss +74 -0
  136. package/src/themes/dark/_context.scss +7 -4
  137. package/src/themes/dark/components/_vv-button.scss +2 -4
  138. package/src/themes/dark/components/index.scss +1 -2
  139. package/src/themes/dark/props/_background.scss +1 -1
  140. package/src/themes/dark/props/_colors.scss +1 -1
  141. package/src/themes/dark/props/_input.scss +15 -0
  142. package/src/themes/dark/props/index.scss +3 -2
  143. package/src/themes/dark/settings/_background.scss +5 -0
  144. package/src/themes/dark/settings/_colors.scss +22 -2
  145. package/src/themes/dark/settings/_index.scss +4 -4
  146. package/src/themes/dark/settings/_input.scss +8 -0
  147. package/src/themes/dark/settings/components/_vv-button.scss +9 -9
  148. package/src/themes/dark/volver.scss +2 -2
  149. package/src/tools/_breakpoints.scss +7 -7
  150. package/src/tools/_functions.scss +95 -37
  151. package/src/tools/_index.scss +3 -3
  152. package/src/tools/_mixins.scss +166 -35
  153. package/src/utilities/backgrounds.scss +15 -8
  154. package/src/utilities/borders.scss +22 -9
  155. package/src/utilities/colors.scss +9 -5
  156. package/src/utilities/effects.scss +23 -5
  157. package/src/utilities/filters.scss +15 -4
  158. package/src/utilities/flexbox.scss +15 -8
  159. package/src/utilities/grid.scss +17 -9
  160. package/src/utilities/index.scss +13 -12
  161. package/src/utilities/interactivity.scss +10 -0
  162. package/src/utilities/layout.scss +35 -23
  163. package/src/utilities/sizing.scss +23 -26
  164. package/src/utilities/spacing.scss +1 -1
  165. package/src/utilities/transitions.scss +47 -0
  166. package/src/utilities/typography.scss +34 -17
  167. package/src/volver.scss +4 -4
  168. package/dist/components/vv-input-checkbox-group.css +0 -1
  169. package/dist/components/vv-input-checkbox.css +0 -1
  170. package/dist/components/vv-input-radio-group.css +0 -1
  171. package/dist/components/vv-input-radio.css +0 -1
  172. package/dist/props/animation.css +0 -1
  173. package/dist/utilities/animation.css +0 -1
  174. package/src/components/vv-input-checkbox-group.scss +0 -12
  175. package/src/components/vv-input-radio-group.scss +0 -12
  176. package/src/settings/_animation.scss +0 -9
  177. package/src/settings/components/_vv-input-radio-group.scss +0 -1
  178. package/src/themes/dark/components/_vv-input-checkbox.scss +0 -24
  179. package/src/themes/dark/settings/components/_vv-input-checkbox.scss +0 -26
  180. package/src/utilities/animation.scss +0 -8
@@ -1,12 +0,0 @@
1
- @use 'sass:map';
2
- @import '../context';
3
-
4
- $component-name: map.get($components-names, vv-input-checkbox-group);
5
- $component-map: $vv-input-checkbox-group;
6
-
7
- @include spread-map-into-bem(
8
- $map: $component-map,
9
- $block: $component-name,
10
- $props: $use-custom-props-for-components,
11
- $zero-specificity: $zero-specificity-for-compoenents
12
- );
@@ -1,12 +0,0 @@
1
- @use 'sass:map';
2
- @import '../context';
3
-
4
- $component-name: map.get($components-names, vv-input-radio-group);
5
- $component-map: $vv-input-radio-group;
6
-
7
- @include spread-map-into-bem(
8
- $map: $component-map,
9
- $block: $component-name,
10
- $props: $use-custom-props-for-components,
11
- $zero-specificity: $zero-specificity-for-compoenents
12
- );
@@ -1,9 +0,0 @@
1
- $animate: (
2
- none: none,
3
- indeterminate: indeterminate 2s infinite,
4
- progress-indeterminate: progress-indeterminate 1.5s linear infinite,
5
- spin: spin 1s infinite,
6
- ping: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite,
7
- pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite,
8
- bounce: bounce 1s infinite,
9
- ) !default;
@@ -1 +0,0 @@
1
- $vv-input-radio-group: $vv-input-checkbox-group !default;
@@ -1,24 +0,0 @@
1
- @use 'sass:map';
2
- @import '../context';
3
-
4
- $component-name: map.get($components-names, vv-input-checkbox);
5
- $component-map: $dark-vv-input-checkbox;
6
- $props: true;
7
-
8
- @mixin theme-dark-vv-input-checkbox {
9
- @include spread-map-into-props(
10
- $map: $component-map,
11
- $prefix: $component-name,
12
- $deep: $props
13
- );
14
- }
15
-
16
- :where(:host, :root, .theme):not(.theme--light) {
17
- @media (prefers-color-scheme: dark) {
18
- @include theme-dark-vv-input-checkbox;
19
- }
20
- }
21
-
22
- :where(.theme.theme--dark) {
23
- @include theme-dark-vv-input-checkbox;
24
- }
@@ -1,26 +0,0 @@
1
- $dark-vv-input-checkbox: (
2
- element: (
3
- input: (
4
- state: (
5
- checked: (
6
- background-image:
7
- url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(#{hex-to-rgb($dark-color-word)})' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E"),
8
- ),
9
- ),
10
- ),
11
- ),
12
- modifier: (
13
- partial: (
14
- element: (
15
- input: (
16
- state: (
17
- checked: (
18
- background-image:
19
- url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(#{hex-to-rgb($dark-color-word)})' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E"),
20
- ),
21
- ),
22
- ),
23
- ),
24
- ),
25
- ),
26
- ) !default;
@@ -1,8 +0,0 @@
1
- @import '../context';
2
-
3
- // animate
4
- @include spread-map-into-utilities(
5
- $map: $animate,
6
- $class: 'animate',
7
- $attribute: 'animation'
8
- );