@hopper-ui/components 0.1.0 → 1.0.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 (211) hide show
  1. package/CHANGELOG.md +117 -0
  2. package/dist/HopperProvider/src/HopperProvider.d.ts +33 -1
  3. package/dist/HopperProvider/src/HopperProvider.js +2 -1
  4. package/dist/HopperProvider/src/index.d.ts +1 -0
  5. package/dist/HopperProvider/src/index.js +2 -1
  6. package/dist/IconList/src/IconList.css +6 -6
  7. package/dist/IconList/src/IconList.js +2 -1
  8. package/dist/IconList/src/IconListContext.js +1 -0
  9. package/dist/IconList/src/index.css +6 -6
  10. package/dist/IconList/src/index.js +2 -1
  11. package/dist/Label/src/Label.css +70 -70
  12. package/dist/Label/src/Label.js +3 -2
  13. package/dist/Label/src/LabelContext.js +1 -0
  14. package/dist/Label/src/index.css +70 -70
  15. package/dist/Label/src/index.js +3 -2
  16. package/dist/Link/src/Link.css +165 -0
  17. package/dist/Link/src/Link.d.ts +33 -0
  18. package/dist/Link/src/Link.js +11 -0
  19. package/dist/Link/src/LinkContext.d.ts +8 -0
  20. package/dist/Link/src/LinkContext.js +2 -0
  21. package/dist/Link/src/index.css +165 -0
  22. package/dist/Link/src/index.d.ts +5 -0
  23. package/dist/Link/src/index.js +11 -0
  24. package/dist/Spinner/src/Spinner.css +124 -124
  25. package/dist/Spinner/src/Spinner.d.ts +1 -0
  26. package/dist/Spinner/src/Spinner.js +5 -4
  27. package/dist/Spinner/src/SpinnerContext.js +1 -0
  28. package/dist/Spinner/src/index.css +124 -124
  29. package/dist/Spinner/src/index.js +5 -4
  30. package/dist/Text/src/Text.css +67 -67
  31. package/dist/Text/src/Text.d.ts +2 -3
  32. package/dist/Text/src/Text.js +5 -2
  33. package/dist/Text/src/TextContext.js +1 -0
  34. package/dist/Text/src/index.css +67 -67
  35. package/dist/Text/src/index.d.ts +1 -1
  36. package/dist/Text/src/index.js +5 -2
  37. package/dist/buttons/src/Button.css +634 -435
  38. package/dist/buttons/src/Button.d.ts +15 -10
  39. package/dist/buttons/src/Button.js +13 -9
  40. package/dist/buttons/src/ButtonContext.d.ts +6 -2
  41. package/dist/buttons/src/ButtonContext.js +1 -0
  42. package/dist/buttons/src/ButtonGroup.css +38 -0
  43. package/dist/buttons/src/ButtonGroup.d.ts +40 -0
  44. package/dist/buttons/src/ButtonGroup.js +83 -0
  45. package/dist/buttons/src/ButtonGroupContext.d.ts +9 -0
  46. package/dist/buttons/src/ButtonGroupContext.js +2 -0
  47. package/dist/buttons/src/index.css +634 -435
  48. package/dist/buttons/src/index.d.ts +2 -1
  49. package/dist/buttons/src/index.js +13 -9
  50. package/dist/checkbox/src/Checkbox.css +292 -0
  51. package/dist/checkbox/src/Checkbox.d.ts +20 -0
  52. package/dist/checkbox/src/Checkbox.js +11 -0
  53. package/dist/checkbox/src/CheckboxContext.d.ts +8 -0
  54. package/dist/checkbox/src/CheckboxContext.js +2 -0
  55. package/dist/checkbox/src/CheckboxField.css +119 -0
  56. package/dist/checkbox/src/CheckboxField.d.ts +26 -0
  57. package/dist/checkbox/src/CheckboxField.js +7 -0
  58. package/dist/checkbox/src/CheckboxFieldContext.d.ts +10 -0
  59. package/dist/checkbox/src/CheckboxFieldContext.js +2 -0
  60. package/dist/checkbox/src/CheckboxGroup.css +568 -0
  61. package/dist/checkbox/src/CheckboxGroup.d.ts +30 -0
  62. package/dist/checkbox/src/CheckboxGroup.js +12 -0
  63. package/dist/checkbox/src/CheckboxGroupContext.d.ts +8 -0
  64. package/dist/checkbox/src/CheckboxGroupContext.js +2 -0
  65. package/dist/checkbox/src/CheckboxList.d.ts +17 -0
  66. package/dist/checkbox/src/CheckboxList.js +3 -0
  67. package/dist/checkbox/src/CheckboxListContext.d.ts +10 -0
  68. package/dist/checkbox/src/CheckboxListContext.js +2 -0
  69. package/dist/checkbox/src/index.css +568 -0
  70. package/dist/checkbox/src/index.d.ts +13 -0
  71. package/dist/checkbox/src/index.js +20 -0
  72. package/dist/chip/src/Chip.css +261 -0
  73. package/dist/chip/src/Chip.d.ts +27 -0
  74. package/dist/chip/src/Chip.js +10 -0
  75. package/dist/chip/src/ChipContext.d.ts +10 -0
  76. package/dist/chip/src/ChipContext.js +2 -0
  77. package/dist/chip/src/index.css +261 -0
  78. package/dist/chip/src/index.d.ts +7 -0
  79. package/dist/chip/src/index.js +10 -0
  80. package/dist/chunk-2EAZPH3M.js +7 -0
  81. package/dist/chunk-3LRBUQC2.js +43 -0
  82. package/dist/chunk-4AARNXWE.js +101 -0
  83. package/dist/chunk-4VVNSXIB.js +7 -0
  84. package/dist/chunk-5KJ5IKUE.js +69 -0
  85. package/dist/chunk-5MBJWRZD.js +7 -0
  86. package/dist/{chunk-SEU4CGZD.js → chunk-65JPI4FL.js} +1 -1
  87. package/dist/chunk-7ELZ57E5.js +93 -0
  88. package/dist/chunk-A7TZHALP.js +7 -0
  89. package/dist/chunk-ACVMW6YD.js +7 -0
  90. package/dist/{chunk-YLDA2M2E.js → chunk-ANVMQBBG.js} +2 -1
  91. package/dist/chunk-B7WS4DBA.js +83 -0
  92. package/dist/chunk-BPM4ETTB.js +35 -0
  93. package/dist/{chunk-QIOYM2XJ.js → chunk-DFUQTSEV.js} +13 -13
  94. package/dist/chunk-DGLAGYBD.js +7 -0
  95. package/dist/chunk-ESVVLTEN.js +7 -0
  96. package/dist/chunk-FU5CCPLP.js +7 -0
  97. package/dist/chunk-GXKSX5N5.js +104 -0
  98. package/dist/chunk-H5YTU3U7.js +20 -0
  99. package/dist/chunk-H7VJS4MX.js +7 -0
  100. package/dist/chunk-HVRSS5RT.js +186 -0
  101. package/dist/chunk-HXI3MEEK.js +27 -0
  102. package/dist/chunk-I7AMDVGG.js +124 -0
  103. package/dist/{chunk-XCKF6EU7.js → chunk-IYITZANI.js} +9 -9
  104. package/dist/chunk-JHY3TXL4.js +101 -0
  105. package/dist/{chunk-6BEVZRUL.js → chunk-KVDXQMWI.js} +1 -1
  106. package/dist/chunk-M6UHXS6K.js +58 -0
  107. package/dist/chunk-MD6IFXLG.js +57 -0
  108. package/dist/chunk-ME3RBGOT.js +91 -0
  109. package/dist/chunk-N7YDPVZL.js +7 -0
  110. package/dist/chunk-NH3IVMXB.js +43 -0
  111. package/dist/chunk-NKHMUPAP.js +43 -0
  112. package/dist/chunk-OHPGEHL3.js +83 -0
  113. package/dist/chunk-VIHBOZVN.js +92 -0
  114. package/dist/chunk-VJQ7M2BK.js +7 -0
  115. package/dist/chunk-WDUQUPTE.js +7 -0
  116. package/dist/chunk-WTKIUAHI.js +7 -0
  117. package/dist/chunk-YHBJAXUY.js +7 -0
  118. package/dist/chunk-YSQDPG26.js +27 -0
  119. package/dist/chunk-YWUIJ6ZQ.js +83 -0
  120. package/dist/chunk-ZGNK4GWA.js +7 -0
  121. package/dist/{chunk-XQ3GUEBN.js → chunk-ZQEB3Y3X.js} +8 -9
  122. package/dist/{chunk-7QUHQYCR.js → chunk-ZWU6DRRZ.js} +1 -1
  123. package/dist/errorMessage/src/ErrorMessage.css +102 -0
  124. package/dist/errorMessage/src/ErrorMessage.d.ts +20 -0
  125. package/dist/errorMessage/src/ErrorMessage.js +9 -0
  126. package/dist/errorMessage/src/ErrorMessageContext.d.ts +9 -0
  127. package/dist/errorMessage/src/ErrorMessageContext.js +2 -0
  128. package/dist/errorMessage/src/index.css +102 -0
  129. package/dist/errorMessage/src/index.d.ts +6 -0
  130. package/dist/errorMessage/src/index.js +9 -0
  131. package/dist/helperMessage/src/HelperMessage.css +94 -0
  132. package/dist/helperMessage/src/HelperMessage.d.ts +20 -0
  133. package/dist/helperMessage/src/HelperMessage.js +8 -0
  134. package/dist/helperMessage/src/HelperMessageContext.d.ts +9 -0
  135. package/dist/helperMessage/src/HelperMessageContext.js +2 -0
  136. package/dist/helperMessage/src/index.css +94 -0
  137. package/dist/helperMessage/src/index.d.ts +6 -0
  138. package/dist/helperMessage/src/index.js +8 -0
  139. package/dist/{intl → i18n}/src/index.d.ts +1 -0
  140. package/dist/i18n/src/index.js +2 -0
  141. package/dist/i18n/src/useLocalizedString.d.ts +9 -0
  142. package/dist/i18n/src/useLocalizedString.js +2 -0
  143. package/dist/layout/src/Flex.js +1 -0
  144. package/dist/layout/src/Grid.js +1 -1
  145. package/dist/layout/src/Inline.js +1 -0
  146. package/dist/layout/src/Stack.js +1 -0
  147. package/dist/radio/src/Radio.css +293 -0
  148. package/dist/radio/src/Radio.d.ts +20 -0
  149. package/dist/radio/src/Radio.js +11 -0
  150. package/dist/radio/src/RadioContext.d.ts +8 -0
  151. package/dist/radio/src/RadioContext.js +2 -0
  152. package/dist/radio/src/RadioField.css +119 -0
  153. package/dist/radio/src/RadioField.d.ts +26 -0
  154. package/dist/radio/src/RadioField.js +7 -0
  155. package/dist/radio/src/RadioFieldContext.d.ts +10 -0
  156. package/dist/radio/src/RadioFieldContext.js +2 -0
  157. package/dist/radio/src/RadioGroup.css +570 -0
  158. package/dist/radio/src/RadioGroup.d.ts +30 -0
  159. package/dist/radio/src/RadioGroup.js +12 -0
  160. package/dist/radio/src/RadioGroupContext.d.ts +8 -0
  161. package/dist/radio/src/RadioGroupContext.js +2 -0
  162. package/dist/radio/src/RadioList.d.ts +17 -0
  163. package/dist/radio/src/RadioList.js +3 -0
  164. package/dist/radio/src/RadioListContext.d.ts +10 -0
  165. package/dist/radio/src/RadioListContext.js +2 -0
  166. package/dist/radio/src/index.css +570 -0
  167. package/dist/radio/src/index.d.ts +13 -0
  168. package/dist/radio/src/index.js +20 -0
  169. package/dist/switch/src/Switch.css +236 -0
  170. package/dist/switch/src/Switch.d.ts +20 -0
  171. package/dist/switch/src/Switch.js +11 -0
  172. package/dist/switch/src/SwitchContext.d.ts +8 -0
  173. package/dist/switch/src/SwitchContext.js +2 -0
  174. package/dist/switch/src/SwitchField.css +119 -0
  175. package/dist/switch/src/SwitchField.d.ts +26 -0
  176. package/dist/switch/src/SwitchField.js +7 -0
  177. package/dist/switch/src/SwitchFieldContext.d.ts +10 -0
  178. package/dist/switch/src/SwitchFieldContext.js +2 -0
  179. package/dist/switch/src/index.css +276 -0
  180. package/dist/switch/src/index.d.ts +9 -0
  181. package/dist/switch/src/index.js +13 -0
  182. package/dist/utils/src/ClearSlots.d.ts +28 -0
  183. package/dist/utils/src/ClearSlots.js +2 -0
  184. package/dist/utils/src/SlotProvider.js +1 -0
  185. package/dist/utils/src/composeClassnameRenderProps.js +2 -0
  186. package/dist/utils/src/cssModule.js +2 -0
  187. package/dist/utils/src/index.d.ts +11 -6
  188. package/dist/utils/src/index.js +8 -4
  189. package/dist/utils/src/isTextOnlyChildren.js +2 -0
  190. package/dist/utils/src/{size-adapter.d.ts → sizeAdapter.d.ts} +1 -1
  191. package/dist/utils/src/sizeAdapter.js +1 -0
  192. package/dist/utils/src/types.d.ts +17 -5
  193. package/dist/utils/src/useRenderProps.d.ts +843 -0
  194. package/dist/utils/src/useRenderProps.js +2 -0
  195. package/dist/utils/src/useSlot.d.ts +8 -0
  196. package/dist/utils/src/useSlot.js +2 -0
  197. package/package.json +32 -27
  198. package/dist/chunk-GXUPEV64.js +0 -24
  199. package/dist/chunk-WROQHGG5.js +0 -141
  200. package/dist/chunk-WRWNRVTG.js +0 -47
  201. package/dist/intl/src/index.js +0 -1
  202. package/dist/intl/src/useLocalizedString.d.ts +0 -26
  203. package/dist/intl/src/useLocalizedString.js +0 -1
  204. package/dist/utils/src/compose-classname-render-props.js +0 -1
  205. package/dist/utils/src/css-module.js +0 -1
  206. package/dist/utils/src/is-text-only-children.js +0 -1
  207. package/dist/utils/src/size-adapter.js +0 -1
  208. /package/dist/{chunk-D57ZIX5W.js → chunk-LQICWONC.js} +0 -0
  209. /package/dist/utils/src/{compose-classname-render-props.d.ts → composeClassnameRenderProps.d.ts} +0 -0
  210. /package/dist/utils/src/{css-module.d.ts → cssModule.d.ts} +0 -0
  211. /package/dist/utils/src/{is-text-only-children.d.ts → isTextOnlyChildren.d.ts} +0 -0
@@ -0,0 +1,236 @@
1
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/IconList/src/IconList.module.css/#css-module-data */
2
+ .IconList-module__hop-IconList___eJ4Sl {
3
+ --hop-IconList-gap: var(--hop-space-inline-xs);
4
+ display: flex;
5
+ flex-wrap: wrap;
6
+ gap: var(--hop-IconList-gap);
7
+ box-sizing: border-box;
8
+ }
9
+
10
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/Text/src/Text.module.css/#css-module-data */
11
+ .Text-module__hop-Text___-u1e- {
12
+ --hop-Text-xs-font-size: var(--hop-body-xs-font-size);
13
+ --hop-Text-xs-font-family: var(--hop-body-xs-font-family);
14
+ --hop-Text-xs-font-weight: var(--hop-body-xs-font-weight);
15
+ --hop-Text-xs-line-height: var(--hop-body-xs-line-height);
16
+ --hop-Text-sm-font-size: var(--hop-body-sm-font-size);
17
+ --hop-Text-sm-font-family: var(--hop-body-sm-font-family);
18
+ --hop-Text-sm-font-weight: var(--hop-body-sm-font-weight);
19
+ --hop-Text-sm-line-height: var(--hop-body-sm-line-height);
20
+ --hop-Text-md-font-size: var(--hop-body-md-font-size);
21
+ --hop-Text-md-font-family: var(--hop-body-md-font-family);
22
+ --hop-Text-md-font-weight: var(--hop-body-md-font-weight);
23
+ --hop-Text-md-line-height: var(--hop-body-md-line-height);
24
+ --hop-Text-lg-font-size: var(--hop-body-lg-font-size);
25
+ --hop-Text-lg-font-family: var(--hop-body-lg-font-family);
26
+ --hop-Text-lg-font-weight: var(--hop-body-lg-font-weight);
27
+ --hop-Text-lg-line-height: var(--hop-body-lg-line-height);
28
+ --hop-Text-xl-font-size: var(--hop-body-xl-font-size);
29
+ --hop-Text-xl-font-family: var(--hop-body-xl-font-family);
30
+ --hop-Text-xl-font-weight: var(--hop-body-xl-font-weight);
31
+ --hop-Text-xl-line-height: var(--hop-body-xl-line-height);
32
+ --hop-Text-2xl-font-size: var(--hop-body-2xl-font-size);
33
+ --hop-Text-2xl-font-family: var(--hop-body-2xl-font-family);
34
+ --hop-Text-2xl-font-weight: var(--hop-body-2xl-font-weight);
35
+ --hop-Text-2xl-line-height: var(--hop-body-2xl-line-height);
36
+ --hop-Text-inherit-size-font-size: inherit;
37
+ --hop-Text-inherit-size-font-family: inherit;
38
+ --hop-Text-inherit-size-font-weight: inherit;
39
+ --hop-Text-inherit-size-line-height: inherit;
40
+ }
41
+ :where(.Text-module__hop-Text___-u1e-) {
42
+ font-family: var(--font-family);
43
+ font-size: var(--font-size);
44
+ font-weight: var(--font-weight);
45
+ line-height: var(--line-height);
46
+ }
47
+ :where(.Text-module__hop-Text--xs___P2Mlk) {
48
+ --font-size: var(--hop-Text-xs-font-size);
49
+ --font-family: var(--hop-Text-xs-font-family);
50
+ --font-weight: var(--hop-Text-xs-font-weight);
51
+ --line-height: var(--hop-Text-xs-line-height);
52
+ }
53
+ :where(.Text-module__hop-Text--sm___DIgJn) {
54
+ --font-size: var(--hop-Text-sm-font-size);
55
+ --font-family: var(--hop-Text-sm-font-family);
56
+ --font-weight: var(--hop-Text-sm-font-weight);
57
+ --line-height: var(--hop-Text-sm-line-height);
58
+ }
59
+ :where(.Text-module__hop-Text--md___EBUtj) {
60
+ --font-size: var(--hop-Text-md-font-size);
61
+ --font-family: var(--hop-Text-md-font-family);
62
+ --font-weight: var(--hop-Text-md-font-weight);
63
+ --line-height: var(--hop-Text-md-line-height);
64
+ }
65
+ :where(.Text-module__hop-Text--lg___Au1wj) {
66
+ --font-size: var(--hop-Text-lg-font-size);
67
+ --font-family: var(--hop-Text-lg-font-family);
68
+ --font-weight: var(--hop-Text-lg-font-weight);
69
+ --line-height: var(--hop-Text-lg-line-height);
70
+ }
71
+ :where(.Text-module__hop-Text--xl___UoQSa) {
72
+ --font-size: var(--hop-Text-xl-font-size);
73
+ --font-family: var(--hop-Text-xl-font-family);
74
+ --font-weight: var(--hop-Text-xl-font-weight);
75
+ --line-height: var(--hop-Text-xl-line-height);
76
+ }
77
+ :where(.Text-module__hop-Text--2xl___Nxjf-) {
78
+ --font-size: var(--hop-Text-2xl-font-size);
79
+ --font-family: var(--hop-Text-2xl-font-family);
80
+ --font-weight: var(--hop-Text-2xl-font-weight);
81
+ --line-height: var(--hop-Text-2xl-line-height);
82
+ }
83
+ :where(.Text-module__hop-Text--inherit___WPX1D) {
84
+ --font-size: var(--hop-Text-inherit-size-font-size);
85
+ --font-family: var(--hop-Text-inherit-size-font-family);
86
+ --font-weight: var(--hop-Text-inherit-size-font-weight);
87
+ --line-height: var(--hop-Text-inherit-size-line-height);
88
+ }
89
+
90
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/switch/src/Switch.module.css/#css-module-data */
91
+ .Switch-module__hop-Switch___A9t3N {
92
+ --hop-Switch-border-size: 0.0625rem;
93
+ --hop-Switch-border-color: var(--hop-neutral-border);
94
+ --hop-Switch-border-radius: var(--hop-shape-rounded-lg);
95
+ --hop-Switch-background-color: var(--hop-neutral-surface);
96
+ --hop-Switch-thumb-color: var(--hop-neutral-icon);
97
+ --hop-Switch-text-color: var(--hop-neutral-text);
98
+ --hop-Switch-border-color-hover: var(--hop-neutral-border-hover);
99
+ --hop-Switch-background-color-hover: var(--hop-neutral-surface-hover);
100
+ --hop-Switch-thumb-color-hover: var(--hop-neutral-icon-hover);
101
+ --hop-Switch-text-color-hover: var(--hop-neutral-text-hover);
102
+ --hop-Switch-border-color-pressed: var(--hop-neutral-border-press);
103
+ --hop-Switch-background-color-pressed: var(--hop-neutral-surface-press);
104
+ --hop-Switch-thumb-color-pressed: var(--hop-neutral-icon-press);
105
+ --hop-Switch-text-color-pressed: var(--hop-neutral-text-press);
106
+ --hop-Switch-border-color-focus: var(--hop-neutral-border-hover);
107
+ --hop-Switch-background-color-focus: var(--hop-neutral-surface-hover);
108
+ --hop-Switch-thumb-color-focus: var(--hop-neutral-icon-hover);
109
+ --hop-Switch-focus-ring-color: var(--hop-primary-border-focus);
110
+ --hop-Switch-text-color-focus: var(--hop-neutral-text);
111
+ --hop-Switch-border-color-selected: var(--hop-neutral-border-selected);
112
+ --hop-Switch-background-color-selected: var(--hop-neutral-surface-selected);
113
+ --hop-Switch-thumb-color-selected: var(--hop-neutral-icon-selected);
114
+ --hop-Switch-text-color-selected: var(--hop-neutral-text);
115
+ --hop-Switch-border-color-disabled: var(--hop-neutral-border-disabled);
116
+ --hop-Switch-background-color-disabled: var(--hop-neutral-surface-disabled);
117
+ --hop-Switch-thumb-color-disabled: var(--hop-neutral-icon-disabled);
118
+ --hop-Switch-text-color-disabled: var(--hop-neutral-text-disabled);
119
+ --hop-Switch-inline-size-md: 3rem;
120
+ --hop-Switch-block-size-md: 1.5rem;
121
+ --hop-Switch-thumb-size-md: 1rem;
122
+ --hop-Switch-inset-inline-start-md: var(--hop-space-inset-xs);
123
+ --hop-Switch-text-top-offset-md: calc((var(--block-size) - (var(--hop-body-md-line-height) * var(--hop-body-md-font-size))) / 2);
124
+ --hop-Switch-inline-size-sm: 2rem;
125
+ --hop-Switch-block-size-sm: 1rem;
126
+ --hop-Switch-thumb-size-sm: 0.75rem;
127
+ --hop-Switch-inset-inline-start-sm: calc(var(--hop-space-inset-xs) / 2);
128
+ --hop-Switch-text-top-offset-sm: calc((var(--block-size) - (var(--hop-body-sm-line-height) * var(--hop-body-sm-font-size))) / 2);
129
+ --border-size: var(--hop-Switch-border-size);
130
+ --border-color: var(--hop-Switch-border-color);
131
+ --border-radius: var(--hop-Switch-border-radius);
132
+ --background-color: var(--hop-Switch-background-color);
133
+ --column-gap: var(--hop-space-inline-sm);
134
+ --thumb-color: var(--hop-Switch-thumb-color);
135
+ --thumb-transform: translate(0, -50%);
136
+ --outline: none;
137
+ --cursor: pointer;
138
+ --text-color: var(--hop-Switch-text-color);
139
+ cursor: var(--cursor);
140
+ display: inline-flex;
141
+ column-gap: var(--column-gap);
142
+ align-items: center;
143
+ align-items: start;
144
+ justify-content: start;
145
+ box-sizing: border-box;
146
+ inline-size: max-content;
147
+ max-inline-size: 100%;
148
+ }
149
+ .Switch-module__hop-Switch--sm___zmqQy {
150
+ --inline-size: var(--hop-Switch-inline-size-sm);
151
+ --block-size: var(--hop-Switch-block-size-sm);
152
+ --thumb-size: var(--hop-Switch-thumb-size-sm);
153
+ --inset-inline-start: var(--hop-Switch-inset-inline-start-sm);
154
+ --text-top-offset: var(--hop-Switch-text-top-offset-sm);
155
+ }
156
+ .Switch-module__hop-Switch--md___wJ5dn {
157
+ --inline-size: var(--hop-Switch-inline-size-md);
158
+ --block-size: var(--hop-Switch-block-size-md);
159
+ --thumb-size: var(--hop-Switch-thumb-size-md);
160
+ --inset-inline-start: var(--hop-Switch-inset-inline-start-md);
161
+ --text-top-offset: var(--hop-Switch-text-top-offset-md);
162
+ }
163
+ .Switch-module__hop-Switch___A9t3N[data-hovered] {
164
+ --border-color: var(--hop-Switch-border-color-hover);
165
+ --background-color: var(--hop-Switch-background-color-hover);
166
+ --thumb-color: var(--hop-Switch-thumb-color-hover);
167
+ --text-color: var(--hop-Switch-text-color-hover);
168
+ }
169
+ .Switch-module__hop-Switch___A9t3N[data-pressed],
170
+ .Switch-module__hop-Switch___A9t3N[data-pressed][data-focus-visible] {
171
+ --border-color: var(--hop-Switch-border-color-pressed);
172
+ --background-color: var(--hop-Switch-background-color-pressed);
173
+ --thumb-color: var(--hop-Switch-thumb-color-pressed);
174
+ --text-color: var(--hop-Switch-text-color-pressed);
175
+ }
176
+ .Switch-module__hop-Switch___A9t3N[data-focus-visible] {
177
+ --border-color: var(--hop-Switch-border-color-focus);
178
+ --background-color: var(--hop-Switch-background-color-focus);
179
+ --thumb-color: var(--hop-Switch-thumb-color-focus);
180
+ --outline: 0.125rem solid var(--hop-Switch-focus-ring-color);
181
+ --text-color: var(--hop-Switch-text-color-focus);
182
+ }
183
+ .Switch-module__hop-Switch___A9t3N[data-selected],
184
+ .Switch-module__hop-Switch___A9t3N[data-selected][data-pressed] {
185
+ --border-color: var(--hop-Switch-border-color-selected);
186
+ --background-color: var(--hop-Switch-background-color-selected);
187
+ --thumb-color: var(--hop-Switch-thumb-color-selected);
188
+ --thumb-transform: translate(calc(var(--inline-size) - var(--thumb-size, var(--hop-Switch-thumb-size-md)) - (2 * var(--inset-inline-start, var(--hop-Switch-inset-inline-start-md))) - (2 * var(--border-size))), -50%);
189
+ --text-color: var(--hop-Switch-text-color-selected);
190
+ }
191
+ .Switch-module__hop-Switch___A9t3N[data-disabled] {
192
+ --border-color: var(--hop-Switch-border-color-disabled);
193
+ --background-color: var(--hop-Switch-background-color-disabled);
194
+ --thumb-color: var(--hop-Switch-thumb-color-disabled);
195
+ --text-color: var(--hop-Switch-text-color-disabled);
196
+ --cursor: not-allowed;
197
+ }
198
+ .Switch-module__hop-Switch__indicator___TkQTl {
199
+ position: relative;
200
+ flex: 0 0 auto;
201
+ box-sizing: border-box;
202
+ inline-size: var(--inline-size, var(--hop-Switch-inline-size-md));
203
+ block-size: var(--block-size, var(--hop-Switch-block-size-md));
204
+ background-color: var(--background-color);
205
+ border: var(--border-size) solid var(--border-color);
206
+ border-radius: var(--border-radius);
207
+ outline: var(--outline);
208
+ outline-offset: 0.125rem;
209
+ transition: background var(--hop-easing-duration-2), border-color var(--hop-easing-duration-2);
210
+ }
211
+ .Switch-module__hop-Switch__indicator___TkQTl::before {
212
+ content: "";
213
+ position: absolute;
214
+ inset-block-start: 50%;
215
+ inset-inline-start: var(--inset-inline-start);
216
+ transform: var(--thumb-transform);
217
+ flex: 0 0 auto;
218
+ order: 1;
219
+ box-sizing: border-box;
220
+ inline-size: var(--thumb-size);
221
+ block-size: var(--thumb-size);
222
+ background-color: var(--thumb-color);
223
+ border-radius: var(--hop-shape-circle);
224
+ transition: transform var(--hop-easing-duration-2), background var(--hop-easing-duration-2);
225
+ }
226
+ .Switch-module__hop-Switch__text___PidAG {
227
+ flex: 0 1 auto;
228
+ order: 2;
229
+ min-inline-size: 0;
230
+ margin-block-start: var(--text-top-offset, var(--hop-Switch-text-top-offset-md));
231
+ color: var(--text-color);
232
+ }
233
+ .Switch-module__hop-Switch__icon-list___tkie7,
234
+ .Switch-module__hop-Switch__icon___kOrAo {
235
+ order: 3;
236
+ }
@@ -0,0 +1,20 @@
1
+ import * as react from 'react';
2
+ import { StyledComponentProps, ResponsiveProp } from '@hopper-ui/styled-system';
3
+ import { SwitchProps as SwitchProps$1 } from 'react-aria-components';
4
+
5
+ declare const GlobalSwitchCssSelector = "hop-Switch";
6
+ interface SwitchProps extends StyledComponentProps<SwitchProps$1> {
7
+ /**
8
+ * A Switch can vary in size.
9
+ * @default "md"
10
+ */
11
+ size?: ResponsiveProp<"sm" | "md">;
12
+ }
13
+ /**
14
+ * A switch is used to quickly switch between two possible states. They are commonly used for “on/off” switches.
15
+ *
16
+ * [View Documentation](TODO)
17
+ */
18
+ declare const _Switch: react.ForwardRefExoticComponent<SwitchProps & react.RefAttributes<HTMLLabelElement>>;
19
+
20
+ export { GlobalSwitchCssSelector, _Switch as Switch, type SwitchProps };
@@ -0,0 +1,11 @@
1
+ export { GlobalSwitchCssSelector, _Switch as Switch } from '../../chunk-ME3RBGOT.js';
2
+ import '../../chunk-YHBJAXUY.js';
3
+ import '../../chunk-ZWU6DRRZ.js';
4
+ import '../../chunk-65JPI4FL.js';
5
+ import '../../chunk-M6UHXS6K.js';
6
+ import '../../chunk-HXI3MEEK.js';
7
+ import '../../chunk-OE5BLFZI.js';
8
+ import '../../chunk-M36KANKC.js';
9
+ import '../../chunk-DHVVYSLB.js';
10
+ import '../../chunk-KVDXQMWI.js';
11
+ import '../../chunk-YSQDPG26.js';
@@ -0,0 +1,8 @@
1
+ import * as react from 'react';
2
+ import { ContextValue } from 'react-aria-components';
3
+ import { SwitchProps } from './Switch.js';
4
+ import '@hopper-ui/styled-system';
5
+
6
+ declare const SwitchContext: react.Context<ContextValue<SwitchProps, HTMLLabelElement>>;
7
+
8
+ export { SwitchContext };
@@ -0,0 +1,2 @@
1
+ export { SwitchContext } from '../../chunk-YHBJAXUY.js';
2
+ import '../../chunk-YSQDPG26.js';
@@ -0,0 +1,119 @@
1
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/Text/src/Text.module.css/#css-module-data */
2
+ .Text-module__hop-Text___-u1e- {
3
+ --hop-Text-xs-font-size: var(--hop-body-xs-font-size);
4
+ --hop-Text-xs-font-family: var(--hop-body-xs-font-family);
5
+ --hop-Text-xs-font-weight: var(--hop-body-xs-font-weight);
6
+ --hop-Text-xs-line-height: var(--hop-body-xs-line-height);
7
+ --hop-Text-sm-font-size: var(--hop-body-sm-font-size);
8
+ --hop-Text-sm-font-family: var(--hop-body-sm-font-family);
9
+ --hop-Text-sm-font-weight: var(--hop-body-sm-font-weight);
10
+ --hop-Text-sm-line-height: var(--hop-body-sm-line-height);
11
+ --hop-Text-md-font-size: var(--hop-body-md-font-size);
12
+ --hop-Text-md-font-family: var(--hop-body-md-font-family);
13
+ --hop-Text-md-font-weight: var(--hop-body-md-font-weight);
14
+ --hop-Text-md-line-height: var(--hop-body-md-line-height);
15
+ --hop-Text-lg-font-size: var(--hop-body-lg-font-size);
16
+ --hop-Text-lg-font-family: var(--hop-body-lg-font-family);
17
+ --hop-Text-lg-font-weight: var(--hop-body-lg-font-weight);
18
+ --hop-Text-lg-line-height: var(--hop-body-lg-line-height);
19
+ --hop-Text-xl-font-size: var(--hop-body-xl-font-size);
20
+ --hop-Text-xl-font-family: var(--hop-body-xl-font-family);
21
+ --hop-Text-xl-font-weight: var(--hop-body-xl-font-weight);
22
+ --hop-Text-xl-line-height: var(--hop-body-xl-line-height);
23
+ --hop-Text-2xl-font-size: var(--hop-body-2xl-font-size);
24
+ --hop-Text-2xl-font-family: var(--hop-body-2xl-font-family);
25
+ --hop-Text-2xl-font-weight: var(--hop-body-2xl-font-weight);
26
+ --hop-Text-2xl-line-height: var(--hop-body-2xl-line-height);
27
+ --hop-Text-inherit-size-font-size: inherit;
28
+ --hop-Text-inherit-size-font-family: inherit;
29
+ --hop-Text-inherit-size-font-weight: inherit;
30
+ --hop-Text-inherit-size-line-height: inherit;
31
+ }
32
+ :where(.Text-module__hop-Text___-u1e-) {
33
+ font-family: var(--font-family);
34
+ font-size: var(--font-size);
35
+ font-weight: var(--font-weight);
36
+ line-height: var(--line-height);
37
+ }
38
+ :where(.Text-module__hop-Text--xs___P2Mlk) {
39
+ --font-size: var(--hop-Text-xs-font-size);
40
+ --font-family: var(--hop-Text-xs-font-family);
41
+ --font-weight: var(--hop-Text-xs-font-weight);
42
+ --line-height: var(--hop-Text-xs-line-height);
43
+ }
44
+ :where(.Text-module__hop-Text--sm___DIgJn) {
45
+ --font-size: var(--hop-Text-sm-font-size);
46
+ --font-family: var(--hop-Text-sm-font-family);
47
+ --font-weight: var(--hop-Text-sm-font-weight);
48
+ --line-height: var(--hop-Text-sm-line-height);
49
+ }
50
+ :where(.Text-module__hop-Text--md___EBUtj) {
51
+ --font-size: var(--hop-Text-md-font-size);
52
+ --font-family: var(--hop-Text-md-font-family);
53
+ --font-weight: var(--hop-Text-md-font-weight);
54
+ --line-height: var(--hop-Text-md-line-height);
55
+ }
56
+ :where(.Text-module__hop-Text--lg___Au1wj) {
57
+ --font-size: var(--hop-Text-lg-font-size);
58
+ --font-family: var(--hop-Text-lg-font-family);
59
+ --font-weight: var(--hop-Text-lg-font-weight);
60
+ --line-height: var(--hop-Text-lg-line-height);
61
+ }
62
+ :where(.Text-module__hop-Text--xl___UoQSa) {
63
+ --font-size: var(--hop-Text-xl-font-size);
64
+ --font-family: var(--hop-Text-xl-font-family);
65
+ --font-weight: var(--hop-Text-xl-font-weight);
66
+ --line-height: var(--hop-Text-xl-line-height);
67
+ }
68
+ :where(.Text-module__hop-Text--2xl___Nxjf-) {
69
+ --font-size: var(--hop-Text-2xl-font-size);
70
+ --font-family: var(--hop-Text-2xl-font-family);
71
+ --font-weight: var(--hop-Text-2xl-font-weight);
72
+ --line-height: var(--hop-Text-2xl-line-height);
73
+ }
74
+ :where(.Text-module__hop-Text--inherit___WPX1D) {
75
+ --font-size: var(--hop-Text-inherit-size-font-size);
76
+ --font-family: var(--hop-Text-inherit-size-font-family);
77
+ --font-weight: var(--hop-Text-inherit-size-font-weight);
78
+ --line-height: var(--hop-Text-inherit-size-line-height);
79
+ }
80
+
81
+ /* css-module:/home/runner/work/wl-hopper/wl-hopper/packages/components/src/switch/src/SwitchField.module.css/#css-module-data */
82
+ .SwitchField-module__hop-SwitchField___REZnn {
83
+ --hop-SwitchField-description-color: var(--hop-neutral-text-weak);
84
+ --hop-SwitchField-description-color-disabled: var(--hop-neutral-text-disabled);
85
+ --hop-SwitchField-sm-row-gap: var(--hop-space-stack-xs);
86
+ --hop-SwitchField-switch-sm-inline-size: 2rem;
87
+ --hop-SwitchField-description-sm-margin-inline-start: calc(var(--hop-SwitchField-switch-sm-inline-size) + var(--hop-space-inline-sm));
88
+ --hop-SwitchField-md-row-gap: var(--hop-space-stack-xs);
89
+ --hop-SwitchField-switch-md-inline-size: 3rem;
90
+ --hop-SwitchField-description-md-margin-inline-start: calc(var(--hop-SwitchField-switch-md-inline-size) + var(--hop-space-inline-sm));
91
+ --description-color: var(--hop-SwitchField-description-color);
92
+ display: flex;
93
+ flex-direction: column;
94
+ row-gap: var(--row-gap, var(--hop-space-stack-sm));
95
+ align-items: flex-start;
96
+ justify-content: flex-start;
97
+ box-sizing: border-box;
98
+ inline-size: max-content;
99
+ max-inline-size: 100%;
100
+ }
101
+ .SwitchField-module__hop-SwitchField___REZnn[data-disabled] {
102
+ --description-color: var(--hop-SwitchField-description-color-disabled);
103
+ }
104
+ .SwitchField-module__hop-SwitchField--sm___zhYuQ {
105
+ --row-gap: var(--hop-SwitchField-sm-row-gap);
106
+ --description-margin-inline-start: var(--hop-SwitchField-description-sm-margin-inline-start);
107
+ }
108
+ .SwitchField-module__hop-SwitchField--md___rcmWy {
109
+ --row-gap: var(--hop-SwitchField-md-row-gap);
110
+ --description-margin-inline-start: var(--hop-SwitchField-description-md-margin-inline-start);
111
+ }
112
+ .SwitchField-module__hop-SwitchField__description___N9E47 {
113
+ order: 2;
114
+ margin-inline-start: var(--description-margin-inline-start, var(--hop-SwitchField-description-md-margin-inline-start));
115
+ color: var(--description-color);
116
+ }
117
+ .SwitchField-module__hop-SwitchField__switch___znvte {
118
+ order: 1;
119
+ }
@@ -0,0 +1,26 @@
1
+ import * as react from 'react';
2
+ import { StyledSystemProps, ResponsiveProp } from '@hopper-ui/styled-system';
3
+ import { BaseComponentProps } from '../../utils/src/types.js';
4
+ import '@react-types/shared';
5
+ import 'react-aria-components';
6
+
7
+ declare const GlobalSwitchFieldCssSelector = "hop-SwitchField";
8
+ interface SwitchFieldProps extends StyledSystemProps, BaseComponentProps {
9
+ /**
10
+ * Whether the switch field is disabled.
11
+ */
12
+ isDisabled?: boolean;
13
+ /**
14
+ * A switch field can vary in size.
15
+ * @default "md"
16
+ */
17
+ size?: ResponsiveProp<"sm" | "md">;
18
+ }
19
+ /**
20
+ * The Switch Field component is a container for a switch and a description.
21
+ *
22
+ * [View Documentation](TODO)
23
+ */
24
+ declare const _SwitchField: react.ForwardRefExoticComponent<SwitchFieldProps & react.RefAttributes<HTMLDivElement>>;
25
+
26
+ export { GlobalSwitchFieldCssSelector, _SwitchField as SwitchField, type SwitchFieldProps };
@@ -0,0 +1,7 @@
1
+ export { GlobalSwitchFieldCssSelector, _SwitchField as SwitchField } from '../../chunk-YWUIJ6ZQ.js';
2
+ import '../../chunk-H7VJS4MX.js';
3
+ import '../../chunk-YHBJAXUY.js';
4
+ import '../../chunk-OE5BLFZI.js';
5
+ import '../../chunk-M36KANKC.js';
6
+ import '../../chunk-KVDXQMWI.js';
7
+ import '../../chunk-YSQDPG26.js';
@@ -0,0 +1,10 @@
1
+ import * as react from 'react';
2
+ import { ContextValue } from 'react-aria-components';
3
+ import { SwitchFieldProps } from './SwitchField.js';
4
+ import '@hopper-ui/styled-system';
5
+ import '../../utils/src/types.js';
6
+ import '@react-types/shared';
7
+
8
+ declare const SwitchFieldContext: react.Context<ContextValue<SwitchFieldProps, HTMLDivElement>>;
9
+
10
+ export { SwitchFieldContext };
@@ -0,0 +1,2 @@
1
+ export { SwitchFieldContext } from '../../chunk-H7VJS4MX.js';
2
+ import '../../chunk-YSQDPG26.js';