@mrshmllw/smores-react 2.19.3 → 3.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 (276) hide show
  1. package/dist/Accordion/Accordion.d.ts +1 -0
  2. package/dist/Accordion/Accordion.js +16 -12
  3. package/dist/Accordion/Accordion.js.map +1 -1
  4. package/dist/Accordion/Accordion.stories.d.ts +1 -2
  5. package/dist/Accordion/Accordion.stories.js +2 -8
  6. package/dist/Accordion/Accordion.stories.js.map +1 -1
  7. package/dist/Accordion/Collection.d.ts +2 -0
  8. package/dist/Accordion/Collection.js +52 -0
  9. package/dist/Accordion/Collection.js.map +1 -0
  10. package/dist/Accordion/__tests__/Accordion.js +9 -0
  11. package/dist/Accordion/__tests__/Accordion.js.map +1 -0
  12. package/dist/ActionDropdown/ActionDropdown.js +7 -7
  13. package/dist/ActionDropdown/ActionDropdown.js.map +1 -1
  14. package/dist/ActionDropdown/ActionDropdown.stories.js +1 -1
  15. package/dist/ActionDropdown/Container.js +16 -10
  16. package/dist/ActionDropdown/Container.js.map +1 -1
  17. package/dist/ActionDropdown/List.js +3 -3
  18. package/dist/ActionDropdown/List.js.map +1 -1
  19. package/dist/ActionDropdown/__tests__/ActionDropdown.js +3 -3
  20. package/dist/ActionDropdown/__tests__/ActionDropdown.js.map +1 -1
  21. package/dist/Banner/Banner.stories.d.ts +9 -0
  22. package/dist/Banner/Banner.stories.js +86 -0
  23. package/dist/Banner/Banner.stories.js.map +1 -0
  24. package/dist/Banner/BannerContainer.d.ts +7 -0
  25. package/dist/Banner/BannerContainer.js +40 -0
  26. package/dist/Banner/BannerContainer.js.map +1 -0
  27. package/dist/Banner/BannerItem.d.ts +7 -0
  28. package/dist/Banner/BannerItem.js +64 -0
  29. package/dist/Banner/BannerItem.js.map +1 -0
  30. package/dist/Banner/hooks.d.ts +3 -0
  31. package/dist/Banner/hooks.js +6 -0
  32. package/dist/Banner/hooks.js.map +1 -0
  33. package/dist/Banner/index.d.ts +2 -0
  34. package/dist/Banner/index.js +3 -0
  35. package/dist/Banner/index.js.map +1 -0
  36. package/dist/Banner/types.d.ts +18 -0
  37. package/dist/Banner/types.js +2 -0
  38. package/dist/Banner/types.js.map +1 -0
  39. package/dist/Box/Box.stories.js +2 -2
  40. package/dist/Box/Box.stories.js.map +1 -1
  41. package/dist/BrandCard/BrandCard.d.ts +27 -0
  42. package/dist/BrandCard/BrandCard.js +60 -0
  43. package/dist/BrandCard/BrandCard.js.map +1 -0
  44. package/dist/BrandCard/BrandCard.stories.d.ts +11 -0
  45. package/dist/BrandCard/BrandCard.stories.js +54 -0
  46. package/dist/BrandCard/BrandCard.stories.js.map +1 -0
  47. package/dist/BrandCard/__tests__/BrandCard.js +9 -0
  48. package/dist/BrandCard/__tests__/BrandCard.js.map +1 -0
  49. package/dist/BrandCard/index.d.ts +1 -0
  50. package/dist/BrandCard/index.js +2 -0
  51. package/dist/BrandCard/index.js.map +1 -0
  52. package/dist/Button/Button.d.ts +4 -6
  53. package/dist/Button/Button.js +52 -54
  54. package/dist/Button/Button.js.map +1 -1
  55. package/dist/Button/Button.stories.js +1 -1
  56. package/dist/Button/Collection.d.ts +2 -0
  57. package/dist/Button/Collection.js +4 -2
  58. package/dist/Button/Collection.js.map +1 -1
  59. package/dist/Button/LegacyButton.js +6 -6
  60. package/dist/Button/LegacyButton.js.map +1 -1
  61. package/dist/Button/__tests__/Button.js.map +1 -1
  62. package/dist/Card/Card.d.ts +19 -1
  63. package/dist/Card/Card.js +42 -10
  64. package/dist/Card/Card.js.map +1 -1
  65. package/dist/Card/Card.stories.d.ts +8 -4
  66. package/dist/Card/Card.stories.js +74 -18
  67. package/dist/Card/Card.stories.js.map +1 -1
  68. package/dist/CheckBox/CheckBox.js +39 -16
  69. package/dist/CheckBox/CheckBox.js.map +1 -1
  70. package/dist/Chip/Chip.js +15 -9
  71. package/dist/Chip/Chip.js.map +1 -1
  72. package/dist/Datepicker/Datepicker.js +23 -15
  73. package/dist/Datepicker/Datepicker.js.map +1 -1
  74. package/dist/Datepicker/DatesList.js +18 -10
  75. package/dist/Datepicker/DatesList.js.map +1 -1
  76. package/dist/Divider/Divider.js +1 -1
  77. package/dist/Divider/Divider.js.map +1 -1
  78. package/dist/Dropdown/Collection.d.ts +2 -0
  79. package/dist/Dropdown/Collection.js +91 -0
  80. package/dist/Dropdown/Collection.js.map +1 -0
  81. package/dist/Dropdown/Dropdown.d.ts +2 -1
  82. package/dist/Dropdown/Dropdown.js +24 -30
  83. package/dist/Dropdown/Dropdown.js.map +1 -1
  84. package/dist/Dropdown/Dropdown.stories.d.ts +2 -16
  85. package/dist/Dropdown/Dropdown.stories.js +7 -156
  86. package/dist/Dropdown/Dropdown.stories.js.map +1 -1
  87. package/dist/Icon/Icon.js +1 -1
  88. package/dist/Icon/Icon.stories.js +2 -2
  89. package/dist/IconStrict/IconStrict.d.ts +20 -0
  90. package/dist/IconStrict/IconStrict.js +50 -0
  91. package/dist/IconStrict/IconStrict.js.map +1 -0
  92. package/dist/IconStrict/IconStrict.stories.d.ts +11 -0
  93. package/dist/IconStrict/IconStrict.stories.js +33 -0
  94. package/dist/IconStrict/IconStrict.stories.js.map +1 -0
  95. package/dist/IconStrict/__tests__/IconStrict.js +9 -0
  96. package/dist/IconStrict/__tests__/IconStrict.js.map +1 -0
  97. package/dist/IconStrict/index.d.ts +1 -0
  98. package/dist/IconStrict/index.js +2 -0
  99. package/dist/IconStrict/index.js.map +1 -0
  100. package/dist/IconWrapper/IconWrapper.js +2 -2
  101. package/dist/IconWrapper/IconWrapper.js.map +1 -1
  102. package/dist/LabelledText/LabelledText.js +1 -1
  103. package/dist/LabelledText/LabelledText.js.map +1 -1
  104. package/dist/Link/Link.d.ts +3 -0
  105. package/dist/Link/Link.js +10 -13
  106. package/dist/Link/Link.js.map +1 -1
  107. package/dist/Link/Link.stories.d.ts +2 -0
  108. package/dist/Link/Link.stories.js +5 -1
  109. package/dist/Link/Link.stories.js.map +1 -1
  110. package/dist/Loader/Loader.js +1 -1
  111. package/dist/Loader/Loader.js.map +1 -1
  112. package/dist/Loader/Loader.stories.d.ts +1 -1
  113. package/dist/Loader/Loader.stories.js +3 -3
  114. package/dist/Loader/Loader.stories.js.map +1 -1
  115. package/dist/Loader/__tests__/Loader.js +1 -1
  116. package/dist/Loader/__tests__/Loader.js.map +1 -1
  117. package/dist/Modal/Modal.js +6 -23
  118. package/dist/Modal/Modal.js.map +1 -1
  119. package/dist/NumberInput/Collection.d.ts +2 -0
  120. package/dist/NumberInput/Collection.js +97 -0
  121. package/dist/NumberInput/Collection.js.map +1 -0
  122. package/dist/NumberInput/NumberInput.d.ts +1 -6
  123. package/dist/NumberInput/NumberInput.js +13 -89
  124. package/dist/NumberInput/NumberInput.js.map +1 -1
  125. package/dist/NumberInput/NumberInput.stories.d.ts +2 -7
  126. package/dist/NumberInput/NumberInput.stories.js +5 -73
  127. package/dist/NumberInput/NumberInput.stories.js.map +1 -1
  128. package/dist/Pagination/Pagination.js +43 -12
  129. package/dist/Pagination/Pagination.js.map +1 -1
  130. package/dist/Pagination/Pagination.stories.js +8 -1
  131. package/dist/Pagination/Pagination.stories.js.map +1 -1
  132. package/dist/RadioGroup/RadioElement.js +4 -4
  133. package/dist/RadioGroup/RadioElement.js.map +1 -1
  134. package/dist/RadioGroup/RadioGroup.d.ts +4 -0
  135. package/dist/RadioGroup/RadioGroup.js +2 -2
  136. package/dist/RadioGroup/RadioGroup.js.map +1 -1
  137. package/dist/RadioGroup/RadioGroup.stories.d.ts +3 -0
  138. package/dist/RadioGroup/RadioGroup.stories.js +2 -0
  139. package/dist/RadioGroup/RadioGroup.stories.js.map +1 -1
  140. package/dist/RadioGroup/RadioItem.d.ts +2 -0
  141. package/dist/RadioGroup/RadioItem.js +25 -9
  142. package/dist/RadioGroup/RadioItem.js.map +1 -1
  143. package/dist/Row/Row.js +14 -8
  144. package/dist/Row/Row.js.map +1 -1
  145. package/dist/Row/Row.stories.js +1 -1
  146. package/dist/SearchInput/Container.js +2 -2
  147. package/dist/SearchInput/Container.js.map +1 -1
  148. package/dist/SearchInput/SearchInput.d.ts +0 -2
  149. package/dist/SearchInput/SearchInput.js +8 -55
  150. package/dist/SearchInput/SearchInput.js.map +1 -1
  151. package/dist/SearchInput/SearchInput.stories.d.ts +0 -1
  152. package/dist/SearchInput/SearchInput.stories.js +0 -5
  153. package/dist/SearchInput/SearchInput.stories.js.map +1 -1
  154. package/dist/SearchInput/SearchOptions.d.ts +0 -2
  155. package/dist/SearchInput/SearchOptions.js +12 -16
  156. package/dist/SearchInput/SearchOptions.js.map +1 -1
  157. package/dist/Snackbar/SnackbarItem.js +5 -5
  158. package/dist/Snackbar/SnackbarItem.js.map +1 -1
  159. package/dist/SupportMessage/Collection.js +6 -1
  160. package/dist/SupportMessage/Collection.js.map +1 -1
  161. package/dist/SupportMessage/SupportMessage.d.ts +1 -1
  162. package/dist/SupportMessage/SupportMessage.js +27 -26
  163. package/dist/SupportMessage/SupportMessage.js.map +1 -1
  164. package/dist/Tag/Collection.d.ts +2 -0
  165. package/dist/Tag/Collection.js +77 -0
  166. package/dist/Tag/Collection.js.map +1 -0
  167. package/dist/Tag/Tag.d.ts +3 -13
  168. package/dist/Tag/Tag.js +7 -8
  169. package/dist/Tag/Tag.js.map +1 -1
  170. package/dist/Tag/Tag.stories.d.ts +1 -1
  171. package/dist/Tag/Tag.stories.js +5 -9
  172. package/dist/Tag/Tag.stories.js.map +1 -1
  173. package/dist/Tag/__tests__/Tag.js +1 -1
  174. package/dist/Tag/__tests__/Tag.js.map +1 -1
  175. package/dist/Text/Text.js +1 -1
  176. package/dist/Text/Text.stories.js +4 -4
  177. package/dist/Text/Text.stories.js.map +1 -1
  178. package/dist/Text/fontMapping.js +1 -1
  179. package/dist/TextInput/Collection.d.ts +2 -0
  180. package/dist/TextInput/Collection.js +69 -0
  181. package/dist/TextInput/Collection.js.map +1 -0
  182. package/dist/TextInput/TextInput.d.ts +0 -3
  183. package/dist/TextInput/TextInput.js +7 -60
  184. package/dist/TextInput/TextInput.js.map +1 -1
  185. package/dist/TextInput/TextInput.stories.d.ts +2 -10
  186. package/dist/TextInput/TextInput.stories.js +5 -111
  187. package/dist/TextInput/TextInput.stories.js.map +1 -1
  188. package/dist/Textarea/Container.js +1 -1
  189. package/dist/Textarea/Container.js.map +1 -1
  190. package/dist/Textarea/Textarea.d.ts +1 -0
  191. package/dist/Textarea/Textarea.js +10 -16
  192. package/dist/Textarea/Textarea.js.map +1 -1
  193. package/dist/Textarea/Textarea.stories.js +2 -0
  194. package/dist/Textarea/Textarea.stories.js.map +1 -1
  195. package/dist/Toggle/Toggle.js +19 -13
  196. package/dist/Toggle/Toggle.js.map +1 -1
  197. package/dist/Tooltip/Tooltip.d.ts +3 -3
  198. package/dist/Tooltip/Tooltip.js +16 -13
  199. package/dist/Tooltip/Tooltip.js.map +1 -1
  200. package/dist/Tooltip/Tooltip.stories.d.ts +1 -0
  201. package/dist/Tooltip/Tooltip.stories.js +15 -4
  202. package/dist/Tooltip/Tooltip.stories.js.map +1 -1
  203. package/dist/colors.stories.js +37 -11
  204. package/dist/colors.stories.js.map +1 -1
  205. package/dist/fields/Field/Field.d.ts +0 -1
  206. package/dist/fields/Field/Field.js.map +1 -1
  207. package/dist/fields/Fieldset/Fieldset.js +1 -1
  208. package/dist/fields/Fieldset/Fieldset.js.map +1 -1
  209. package/dist/fields/commonFieldTypes.d.ts +4 -3
  210. package/dist/fields/components/CommonInput.d.ts +18 -0
  211. package/dist/fields/components/CommonInput.js +64 -0
  212. package/dist/fields/components/CommonInput.js.map +1 -0
  213. package/dist/fields/components/InternalField.d.ts +3 -3
  214. package/dist/fields/components/InternalField.js +7 -7
  215. package/dist/fields/components/InternalField.js.map +1 -1
  216. package/dist/fields/components/Placeholder.js +3 -3
  217. package/dist/fields/components/Placeholder.js.map +1 -1
  218. package/dist/fontStyle.js +2 -2
  219. package/dist/index.d.ts +0 -3
  220. package/dist/index.js +0 -3
  221. package/dist/index.js.map +1 -1
  222. package/dist/theme.d.ts +58 -28
  223. package/dist/theme.js +34 -18
  224. package/dist/theme.js.map +1 -1
  225. package/dist/utils/focusOutline.d.ts +1 -0
  226. package/dist/utils/focusOutline.js +7 -1
  227. package/dist/utils/focusOutline.js.map +1 -1
  228. package/package.json +2 -1
  229. package/dist/ConfirmationRadioButtons/Confirmation.d.ts +0 -17
  230. package/dist/ConfirmationRadioButtons/Confirmation.js +0 -100
  231. package/dist/ConfirmationRadioButtons/Confirmation.js.map +0 -1
  232. package/dist/ConfirmationRadioButtons/Confirmation.stories.d.ts +0 -21
  233. package/dist/ConfirmationRadioButtons/Confirmation.stories.js +0 -76
  234. package/dist/ConfirmationRadioButtons/Confirmation.stories.js.map +0 -1
  235. package/dist/ConfirmationRadioButtons/Container.d.ts +0 -2
  236. package/dist/ConfirmationRadioButtons/Container.js +0 -8
  237. package/dist/ConfirmationRadioButtons/Container.js.map +0 -1
  238. package/dist/ConfirmationRadioButtons/RadioButtonStyled.d.ts +0 -17
  239. package/dist/ConfirmationRadioButtons/RadioButtonStyled.js +0 -41
  240. package/dist/ConfirmationRadioButtons/RadioButtonStyled.js.map +0 -1
  241. package/dist/ConfirmationRadioButtons/__tests__/Confirmation.js +0 -8
  242. package/dist/ConfirmationRadioButtons/__tests__/Confirmation.js.map +0 -1
  243. package/dist/ConfirmationRadioButtons/index.d.ts +0 -1
  244. package/dist/ConfirmationRadioButtons/index.js +0 -2
  245. package/dist/ConfirmationRadioButtons/index.js.map +0 -1
  246. package/dist/Dropdown/__tests__/Dropdown.js +0 -80
  247. package/dist/Dropdown/__tests__/Dropdown.js.map +0 -1
  248. package/dist/Message/Message.d.ts +0 -21
  249. package/dist/Message/Message.js +0 -45
  250. package/dist/Message/Message.js.map +0 -1
  251. package/dist/Message/Message.stories.d.ts +0 -13
  252. package/dist/Message/Message.stories.js +0 -38
  253. package/dist/Message/Message.stories.js.map +0 -1
  254. package/dist/Message/__tests__/Message.js +0 -26
  255. package/dist/Message/__tests__/Message.js.map +0 -1
  256. package/dist/Message/index.d.ts +0 -1
  257. package/dist/Message/index.js +0 -2
  258. package/dist/Message/index.js.map +0 -1
  259. package/dist/RadioButton/Container.d.ts +0 -2
  260. package/dist/RadioButton/Container.js +0 -9
  261. package/dist/RadioButton/Container.js.map +0 -1
  262. package/dist/RadioButton/RadioButton.d.ts +0 -10
  263. package/dist/RadioButton/RadioButton.js +0 -68
  264. package/dist/RadioButton/RadioButton.js.map +0 -1
  265. package/dist/RadioButton/RadioButton.stories.d.ts +0 -15
  266. package/dist/RadioButton/RadioButton.stories.js +0 -29
  267. package/dist/RadioButton/RadioButton.stories.js.map +0 -1
  268. package/dist/RadioButton/__tests__/RadioButton.d.ts +0 -1
  269. package/dist/RadioButton/__tests__/RadioButton.js +0 -13
  270. package/dist/RadioButton/__tests__/RadioButton.js.map +0 -1
  271. package/dist/RadioButton/index.d.ts +0 -1
  272. package/dist/RadioButton/index.js +0 -2
  273. package/dist/RadioButton/index.js.map +0 -1
  274. /package/dist/{ConfirmationRadioButtons/__tests__/Confirmation.d.ts → Accordion/__tests__/Accordion.d.ts} +0 -0
  275. /package/dist/{Dropdown/__tests__/Dropdown.d.ts → BrandCard/__tests__/BrandCard.d.ts} +0 -0
  276. /package/dist/{Message/__tests__/Message.d.ts → IconStrict/__tests__/IconStrict.d.ts} +0 -0
package/dist/theme.d.ts CHANGED
@@ -1,18 +1,33 @@
1
1
  declare const colors: {
2
- primary: string;
3
- secondary: string;
4
- white: string;
5
- black: string;
6
- bgPrimary: string;
7
- bgSecondary: string;
8
- bgCarbon: string;
9
- subtext: string;
10
- outline: string;
11
- background: string;
12
- error: string;
13
- agentWarning: string;
14
- warning: string;
15
- success: string;
2
+ lollipop: string;
3
+ marshmallowPink: string;
4
+ bubblegum: string;
5
+ fairyFloss: string;
6
+ boba: string;
7
+ liquorice: string;
8
+ sesame: string;
9
+ chia: string;
10
+ custard: string;
11
+ mascarpone: string;
12
+ coconut: string;
13
+ cream: string;
14
+ spearmint: string;
15
+ feijoa: string;
16
+ blueberry: string;
17
+ macaroon: string;
18
+ pistachio: string;
19
+ matcha: string;
20
+ caramel: string;
21
+ peanut: string;
22
+ marzipan: string;
23
+ oatmeal: string;
24
+ strawberry: string;
25
+ watermelon: string;
26
+ apple: string;
27
+ mint: string;
28
+ lemon: string;
29
+ sherbert: string;
30
+ tangerine: string;
16
31
  compareTheMarket: string;
17
32
  confused: string;
18
33
  onfido: string;
@@ -29,20 +44,35 @@ declare const colors: {
29
44
  export type Color = keyof typeof colors;
30
45
  export declare const theme: {
31
46
  colors: {
32
- primary: string;
33
- secondary: string;
34
- white: string;
35
- black: string;
36
- bgPrimary: string;
37
- bgSecondary: string;
38
- bgCarbon: string;
39
- subtext: string;
40
- outline: string;
41
- background: string;
42
- error: string;
43
- agentWarning: string;
44
- warning: string;
45
- success: string;
47
+ lollipop: string;
48
+ marshmallowPink: string;
49
+ bubblegum: string;
50
+ fairyFloss: string;
51
+ boba: string;
52
+ liquorice: string;
53
+ sesame: string;
54
+ chia: string;
55
+ custard: string;
56
+ mascarpone: string;
57
+ coconut: string;
58
+ cream: string;
59
+ spearmint: string;
60
+ feijoa: string;
61
+ blueberry: string;
62
+ macaroon: string;
63
+ pistachio: string;
64
+ matcha: string;
65
+ caramel: string;
66
+ peanut: string;
67
+ marzipan: string;
68
+ oatmeal: string;
69
+ strawberry: string;
70
+ watermelon: string;
71
+ apple: string;
72
+ mint: string;
73
+ lemon: string;
74
+ sherbert: string;
75
+ tangerine: string;
46
76
  compareTheMarket: string;
47
77
  confused: string;
48
78
  onfido: string;
package/dist/theme.js CHANGED
@@ -1,22 +1,38 @@
1
1
  const colors = {
2
- // Core brand
3
- primary: '#FF4E75',
4
- secondary: '#112035',
5
- white: '#FFFFFF',
6
- black: '#000000',
7
- // Brand background
8
- bgPrimary: '#ECD2D0',
9
- bgSecondary: '#FAF3EE',
10
- bgCarbon: '#09454F',
11
- // Neutrals
12
- subtext: '#636768',
13
- outline: '#D2D2D2',
14
- background: '#F4F4F4',
2
+ // Core Primary
3
+ lollipop: '#FF69B5',
4
+ marshmallowPink: '#FF88C8',
5
+ bubblegum: '#FFB3DA',
6
+ fairyFloss: '#FFCCE7',
7
+ // Core Secondary
8
+ boba: '#0E0E0C',
9
+ liquorice: '#292924',
10
+ sesame: '#636768',
11
+ chia: '#D2D2D2',
12
+ // Core Tertiary
13
+ custard: '#F1E9DC',
14
+ mascarpone: '#F8F2EA',
15
+ coconut: '#FBF8F5',
16
+ cream: '#FFFFFF',
17
+ // Brand Secondary
18
+ spearmint: '#294636',
19
+ feijoa: '#3B5848',
20
+ blueberry: '#89A2B6',
21
+ macaroon: '#BBCFDF',
22
+ pistachio: '#838E49',
23
+ matcha: '#DBE1B0',
24
+ caramel: '#C26B2A',
25
+ peanut: '#F8C699',
26
+ marzipan: '#A1957C',
27
+ oatmeal: '#DAD2C4',
15
28
  // Traffic light
16
- error: '#D82C2C',
17
- agentWarning: '#FF8B00',
18
- warning: '#FFC400',
19
- success: '#00875A',
29
+ strawberry: '#DF2929',
30
+ watermelon: '#F5CFCC',
31
+ apple: '#008933',
32
+ mint: '#C9E2CE',
33
+ lemon: '#FFD23A',
34
+ sherbert: '#FCF0D0',
35
+ tangerine: '#FF9F2C',
20
36
  // Third-party brand colours
21
37
  compareTheMarket: '#004A8E',
22
38
  confused: '#000A8C',
@@ -26,7 +42,7 @@ const colors = {
26
42
  checkout: '#56AC88',
27
43
  facebook: '#3B5998',
28
44
  stripe: '#6772E5',
29
- intercom: '##286EFA',
45
+ intercom: '#286EFA',
30
46
  ravelin: '#2A4AFC',
31
47
  rac: '#EA7D24',
32
48
  hometree: '#17171C',
package/dist/theme.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"theme.js","sourceRoot":"","sources":["../src/theme.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,GAAG;IACb,aAAa;IACb,OAAO,EAAE,SAAS;IAClB,SAAS,EAAE,SAAS;IACpB,KAAK,EAAE,SAAS;IAChB,KAAK,EAAE,SAAS;IAEhB,mBAAmB;IACnB,SAAS,EAAE,SAAS;IACpB,WAAW,EAAE,SAAS;IACtB,QAAQ,EAAE,SAAS;IAEnB,WAAW;IACX,OAAO,EAAE,SAAS;IAClB,OAAO,EAAE,SAAS;IAClB,UAAU,EAAE,SAAS;IAErB,gBAAgB;IAChB,KAAK,EAAE,SAAS;IAChB,YAAY,EAAE,SAAS;IACvB,OAAO,EAAE,SAAS;IAClB,OAAO,EAAE,SAAS;IAElB,4BAA4B;IAC5B,gBAAgB,EAAE,SAAS;IAC3B,QAAQ,EAAE,SAAS;IACnB,MAAM,EAAE,SAAS;IACjB,OAAO,EAAE,SAAS;IAClB,QAAQ,EAAE,SAAS;IACnB,QAAQ,EAAE,SAAS;IACnB,QAAQ,EAAE,SAAS;IACnB,MAAM,EAAE,SAAS;IACjB,QAAQ,EAAE,UAAU;IACpB,OAAO,EAAE,SAAS;IAClB,GAAG,EAAE,SAAS;IACd,QAAQ,EAAE,SAAS;CACpB,CAAA;AAID,MAAM,IAAI,GAAG;IACX,MAAM,EAAE;QACN,MAAM,EAAE,GAAG;QACX,MAAM,EAAE,GAAG;QACX,IAAI,EAAE,GAAG;KACV;IACD,MAAM,EACJ,+IAA+I;CAClJ,CAAA;AAED,MAAM,CAAC,MAAM,KAAK,GAAG;IACnB,MAAM;IACN,IAAI;CACL,CAAA"}
1
+ {"version":3,"file":"theme.js","sourceRoot":"","sources":["../src/theme.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,GAAG;IACb,eAAe;IACf,QAAQ,EAAE,SAAS;IACnB,eAAe,EAAE,SAAS;IAC1B,SAAS,EAAE,SAAS;IACpB,UAAU,EAAE,SAAS;IAErB,iBAAiB;IACjB,IAAI,EAAE,SAAS;IACf,SAAS,EAAE,SAAS;IACpB,MAAM,EAAE,SAAS;IACjB,IAAI,EAAE,SAAS;IAEf,gBAAgB;IAChB,OAAO,EAAE,SAAS;IAClB,UAAU,EAAE,SAAS;IACrB,OAAO,EAAE,SAAS;IAClB,KAAK,EAAE,SAAS;IAEhB,kBAAkB;IAClB,SAAS,EAAE,SAAS;IACpB,MAAM,EAAE,SAAS;IACjB,SAAS,EAAE,SAAS;IACpB,QAAQ,EAAE,SAAS;IACnB,SAAS,EAAE,SAAS;IACpB,MAAM,EAAE,SAAS;IACjB,OAAO,EAAE,SAAS;IAClB,MAAM,EAAE,SAAS;IACjB,QAAQ,EAAE,SAAS;IACnB,OAAO,EAAE,SAAS;IAElB,gBAAgB;IAChB,UAAU,EAAE,SAAS;IACrB,UAAU,EAAE,SAAS;IACrB,KAAK,EAAE,SAAS;IAChB,IAAI,EAAE,SAAS;IACf,KAAK,EAAE,SAAS;IAChB,QAAQ,EAAE,SAAS;IACnB,SAAS,EAAE,SAAS;IAEpB,4BAA4B;IAC5B,gBAAgB,EAAE,SAAS;IAC3B,QAAQ,EAAE,SAAS;IACnB,MAAM,EAAE,SAAS;IACjB,OAAO,EAAE,SAAS;IAClB,QAAQ,EAAE,SAAS;IACnB,QAAQ,EAAE,SAAS;IACnB,QAAQ,EAAE,SAAS;IACnB,MAAM,EAAE,SAAS;IACjB,QAAQ,EAAE,SAAS;IACnB,OAAO,EAAE,SAAS;IAClB,GAAG,EAAE,SAAS;IACd,QAAQ,EAAE,SAAS;CACpB,CAAA;AAID,MAAM,IAAI,GAAG;IACX,MAAM,EAAE;QACN,MAAM,EAAE,GAAG;QACX,MAAM,EAAE,GAAG;QACX,IAAI,EAAE,GAAG;KACV;IACD,MAAM,EACJ,+IAA+I;CAClJ,CAAA;AAED,MAAM,CAAC,MAAM,KAAK,GAAG;IACnB,MAAM;IACN,IAAI;CACL,CAAA"}
@@ -1,3 +1,4 @@
1
1
  export declare const focusOutline: ({ selector, }?: {
2
2
  selector?: string | undefined;
3
3
  }) => import("styled-components").FlattenSimpleInterpolation;
4
+ export declare const focusOutlineStyle: import("styled-components").FlattenSimpleInterpolation;
@@ -4,7 +4,13 @@ export const focusOutline = ({ selector = '&:focus-visible', } = {}) => css `
4
4
  outline: 0;
5
5
 
6
6
  ${selector} {
7
- outline: 2px solid ${theme.colors.secondary};
7
+ outline: 2px solid ${theme.colors.liquorice};
8
+ outline-offset: 2px;
9
+ }
10
+ `;
11
+ export const focusOutlineStyle = css `
12
+ &:focus-visible {
13
+ outline: 2px solid ${theme.colors.liquorice};
8
14
  outline-offset: 2px;
9
15
  }
10
16
  `;
@@ -1 +1 @@
1
- {"version":3,"file":"focusOutline.js","sourceRoot":"","sources":["../../src/utils/focusOutline.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AACvC,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAEhC,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,EAC3B,QAAQ,GAAG,iBAAiB,MACH,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;;;IAGjC,QAAQ;yBACa,KAAK,CAAC,MAAM,CAAC,SAAS;;;CAG9C,CAAA"}
1
+ {"version":3,"file":"focusOutline.js","sourceRoot":"","sources":["../../src/utils/focusOutline.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AACvC,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAEhC,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,EAC3B,QAAQ,GAAG,iBAAiB,MACH,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;;;IAGjC,QAAQ;yBACa,KAAK,CAAC,MAAM,CAAC,SAAS;;;CAG9C,CAAA;AAED,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,CAAA;;yBAEX,KAAK,CAAC,MAAM,CAAC,SAAS;;;CAG9C,CAAA"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mrshmllw/smores-react",
3
- "version": "2.19.3",
3
+ "version": "3.0.0",
4
4
  "main": "./dist/index.js",
5
5
  "description": "Collection of React components used by Marshmallow Technology",
6
6
  "keywords": [
@@ -23,6 +23,7 @@
23
23
  "test:coverage": "jest --coverage --silent",
24
24
  "test:watch": "jest --watch --silent",
25
25
  "test": "jest --silent",
26
+ "updateSnaps": "jest --updateSnapshot",
26
27
  "snyk-protect": "snyk-protect",
27
28
  "prepare": "npm run snyk-protect && husky install",
28
29
  "pre-commit-lint": "npm run check-types && lint-staged",
@@ -1,17 +0,0 @@
1
- import { FC, FocusEvent, ReactElement } from 'react';
2
- import { MarginProps } from '../utils/space';
3
- export type ConfirmationProps = {
4
- onChange(value?: boolean): void;
5
- checked?: boolean;
6
- id?: string;
7
- error?: boolean;
8
- errorMsg?: string;
9
- label?: string;
10
- onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
11
- sublabel?: string | ReactElement;
12
- yesLabel?: string | ReactElement;
13
- noLabel?: string | ReactElement;
14
- required?: boolean;
15
- disabled?: boolean;
16
- } & MarginProps;
17
- export declare const Confirmation: FC<ConfirmationProps>;
@@ -1,100 +0,0 @@
1
- var __rest = (this && this.__rest) || function (s, e) {
2
- var t = {};
3
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
4
- t[p] = s[p];
5
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
6
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
7
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
8
- t[p[i]] = s[p[i]];
9
- }
10
- return t;
11
- };
12
- import React from 'react';
13
- import styled, { css } from 'styled-components';
14
- import { theme } from '../theme';
15
- import { Box } from '../Box';
16
- import { Text } from '../Text';
17
- import { RadioButton } from './RadioButtonStyled';
18
- import { useUniqueId } from '../utils/id';
19
- import { useDeprecatedWarning } from '../utils/deprecated';
20
- export const Confirmation = (props) => {
21
- const { checked, onChange, id: idProp, error = false, errorMsg = '', label, onBlur, sublabel, yesLabel = 'Yes', noLabel = 'No', required = false, disabled = false } = props, marginProps = __rest(props, ["checked", "onChange", "id", "error", "errorMsg", "label", "onBlur", "sublabel", "yesLabel", "noLabel", "required", "disabled"]);
22
- useDeprecatedWarning({
23
- title: 'Confirmation',
24
- message: 'The Confirmation component has been deprecated. Please use the new RadioGroup component instead.',
25
- componentProps: props,
26
- });
27
- const id = useUniqueId(idProp);
28
- return (React.createElement(ConfirmationWrapper, Object.assign({}, marginProps),
29
- (label || sublabel) && (React.createElement(TextWrapper, null,
30
- label && (React.createElement(SectionHeadingText, { tag: "h3" },
31
- label,
32
- required && React.createElement(Asterisk, null, "*"))),
33
- sublabel && (React.createElement(Text, { tag: "p", typo: "base-small", color: "subtext" }, sublabel)))),
34
- React.createElement(RadioButtonGroupWrapper, null,
35
- React.createElement(RadioButtonGroup, null,
36
- React.createElement(RadioButtonWrapper, { checked: checked === true, error: error, disabled: disabled },
37
- React.createElement(RadioButton, { id: id, label: yesLabel, checked: checked === true, onChange: () => onChange(true), value: id, onBlur: onBlur, disabled: disabled })),
38
- React.createElement(RadioButtonWrapper, { checked: checked === false, error: error, disabled: disabled },
39
- React.createElement(RadioButton, { id: `${id}-1`, label: noLabel, checked: checked === false, onChange: () => onChange(false), value: `${id}-1`, onBlur: onBlur, disabled: disabled }))),
40
- error && React.createElement(ErrorBox, null, errorMsg))));
41
- };
42
- const RadioButtonGroupWrapper = styled.div `
43
- display: flex;
44
- flex-direction: column;
45
- `;
46
- const RadioButtonGroup = styled.div `
47
- display: flex;
48
- flex-direction: row;
49
- `;
50
- const getColor = (checked, error) => {
51
- if (error) {
52
- return `2px solid ${theme.colors.error}`;
53
- }
54
- else if (checked) {
55
- return `2px solid ${theme.colors.secondary}`;
56
- }
57
- else {
58
- return 'none';
59
- }
60
- };
61
- const RadioButtonWrapper = styled.div `
62
- background-color: ${({ checked }) => !checked && `${theme.colors.background}`};
63
- border: ${({ checked, error }) => getColor(checked, error)};
64
- margin-right: 10px;
65
- width: 139px;
66
- display: flex;
67
- align-items: center;
68
- height: 56px;
69
- padding-left: 12px;
70
- border-radius: 5px;
71
- font-weight: bold;
72
- ${({ disabled }) => disabled &&
73
- css `
74
- border-color: ${theme.colors.secondary};
75
- opacity: 0.5;
76
- `}
77
- `;
78
- const ErrorBox = styled.span `
79
- margin-top: 7px;
80
- margin-left: 12px;
81
- font-size: 12px;
82
- color: ${theme.colors.error};
83
- `;
84
- const ConfirmationWrapper = styled(Box) `
85
- display: flex;
86
- flex-direction: column;
87
- `;
88
- const SectionHeadingText = styled(Text) `
89
- font-weight: bold;
90
- `;
91
- const TextWrapper = styled.div `
92
- display: flex;
93
- flex-direction: column;
94
- margin-bottom: 8px;
95
- `;
96
- const Asterisk = styled.span `
97
- font-size: 14px;
98
- color: ${theme.colors.error};
99
- `;
100
- //# sourceMappingURL=Confirmation.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Confirmation.js","sourceRoot":"","sources":["../../src/ConfirmationRadioButtons/Confirmation.tsx"],"names":[],"mappings":"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"}
@@ -1,21 +0,0 @@
1
- import React from 'react';
2
- import { ConfirmationProps } from './Confirmation';
3
- declare const _default: {
4
- title: string;
5
- component: React.FC<ConfirmationProps>;
6
- argTypes: {
7
- onChange: {
8
- action: string;
9
- };
10
- };
11
- };
12
- export default _default;
13
- export declare const Default: any;
14
- export declare const WithError: any;
15
- export declare const WithSublabel: any;
16
- export declare const WorkingExample: any;
17
- export declare const WithCustomLabel: any;
18
- export declare const WithNoLabel: any;
19
- export declare const Required: any;
20
- export declare const RequiredWithLongLabel: any;
21
- export declare const Disabled: any;
@@ -1,76 +0,0 @@
1
- import React from 'react';
2
- import { noop } from '../utils/noop';
3
- import { Confirmation } from './Confirmation';
4
- import { Container } from './Container';
5
- export default {
6
- title: 'Confirmation Radio Button',
7
- component: Confirmation,
8
- argTypes: { onChange: { action: 'clicked' } },
9
- };
10
- const Template = (props) => React.createElement(Confirmation, Object.assign({}, props));
11
- export const Default = Template.bind({});
12
- Default.args = {
13
- id: 'radioButton',
14
- onChange: noop,
15
- checked: false,
16
- label: 'Do you like marshmallows?',
17
- };
18
- export const WithError = Template.bind({});
19
- WithError.args = {
20
- id: 'radioButton',
21
- onChange: noop,
22
- checked: undefined,
23
- label: 'Do you like marshmallows?',
24
- error: true,
25
- errorMsg: 'This field is required.',
26
- };
27
- export const WithSublabel = Template.bind({});
28
- WithSublabel.args = {
29
- id: 'radioButton',
30
- onChange: noop,
31
- checked: undefined,
32
- label: 'Do you like marshmallows?',
33
- sublabel: 'This includes smores and hot chocolate topped with marshmallows.',
34
- };
35
- const ContainerTemplate = () => React.createElement(Container, null);
36
- export const WorkingExample = ContainerTemplate.bind({});
37
- export const WithCustomLabel = Template.bind({});
38
- WithCustomLabel.args = {
39
- id: 'radioButton',
40
- onChange: noop,
41
- checked: undefined,
42
- label: 'Do you like marshmallows?',
43
- yesLabel: 'Correct',
44
- };
45
- export const WithNoLabel = Template.bind({});
46
- WithNoLabel.args = {
47
- id: 'radioButton',
48
- onChange: noop,
49
- checked: undefined,
50
- yesLabel: 'Yes',
51
- };
52
- export const Required = Template.bind({});
53
- Required.args = {
54
- id: 'radioButton',
55
- label: 'Do you like ice cream?',
56
- onChange: noop,
57
- checked: undefined,
58
- required: true,
59
- };
60
- export const RequiredWithLongLabel = Template.bind({});
61
- RequiredWithLongLabel.args = {
62
- id: 'radioButton',
63
- label: 'This is a really long label to test the placement of the required asterisk. Do you like ice cream, pie, marshmallows, smores, cupcakes, cookies, and muffins?',
64
- onChange: noop,
65
- checked: undefined,
66
- required: true,
67
- };
68
- export const Disabled = Template.bind({});
69
- Disabled.args = {
70
- id: 'radioButton',
71
- label: 'Do you like marshmallows?',
72
- onChange: noop,
73
- checked: true,
74
- disabled: true,
75
- };
76
- //# sourceMappingURL=Confirmation.stories.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Confirmation.stories.js","sourceRoot":"","sources":["../../src/ConfirmationRadioButtons/Confirmation.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAA;AACpC,OAAO,EAAE,YAAY,EAAqB,MAAM,gBAAgB,CAAA;AAChE,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AAEvC,eAAe;IACb,KAAK,EAAE,2BAA2B;IAClC,SAAS,EAAE,YAAY;IACvB,QAAQ,EAAE,EAAE,QAAQ,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE;CAC9C,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,KAAwB,EAAE,EAAE,CAAC,oBAAC,YAAY,oBAAK,KAAK,EAAI,CAAA;AAE1E,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAExC,OAAO,CAAC,IAAI,GAAG;IACb,EAAE,EAAE,aAAa;IACjB,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,KAAK;IACd,KAAK,EAAE,2BAA2B;CACnC,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAE1C,SAAS,CAAC,IAAI,GAAG;IACf,EAAE,EAAE,aAAa;IACjB,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,SAAS;IAClB,KAAK,EAAE,2BAA2B;IAClC,KAAK,EAAE,IAAI;IACX,QAAQ,EAAE,yBAAyB;CACpC,CAAA;AAED,MAAM,CAAC,MAAM,YAAY,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAE7C,YAAY,CAAC,IAAI,GAAG;IAClB,EAAE,EAAE,aAAa;IACjB,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,SAAS;IAClB,KAAK,EAAE,2BAA2B;IAClC,QAAQ,EAAE,kEAAkE;CAC7E,CAAA;AAED,MAAM,iBAAiB,GAAG,GAAG,EAAE,CAAC,oBAAC,SAAS,OAAG,CAAA;AAE7C,MAAM,CAAC,MAAM,cAAc,GAAG,iBAAiB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAExD,MAAM,CAAC,MAAM,eAAe,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAEhD,eAAe,CAAC,IAAI,GAAG;IACrB,EAAE,EAAE,aAAa;IACjB,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,SAAS;IAClB,KAAK,EAAE,2BAA2B;IAClC,QAAQ,EAAE,SAAS;CACpB,CAAA;AAED,MAAM,CAAC,MAAM,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAE5C,WAAW,CAAC,IAAI,GAAG;IACjB,EAAE,EAAE,aAAa;IACjB,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,SAAS;IAClB,QAAQ,EAAE,KAAK;CAChB,CAAA;AAED,MAAM,CAAC,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAEzC,QAAQ,CAAC,IAAI,GAAG;IACd,EAAE,EAAE,aAAa;IACjB,KAAK,EAAE,wBAAwB;IAC/B,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,SAAS;IAClB,QAAQ,EAAE,IAAI;CACf,CAAA;AAED,MAAM,CAAC,MAAM,qBAAqB,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAEtD,qBAAqB,CAAC,IAAI,GAAG;IAC3B,EAAE,EAAE,aAAa;IACjB,KAAK,EACH,+JAA+J;IACjK,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,SAAS;IAClB,QAAQ,EAAE,IAAI;CACf,CAAA;AAED,MAAM,CAAC,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAEzC,QAAQ,CAAC,IAAI,GAAG;IACd,EAAE,EAAE,aAAa;IACjB,KAAK,EAAE,2BAA2B;IAClC,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,IAAI;IACb,QAAQ,EAAE,IAAI;CACf,CAAA"}
@@ -1,2 +0,0 @@
1
- /// <reference types="react" />
2
- export declare const Container: () => JSX.Element;
@@ -1,8 +0,0 @@
1
- import React, { useState } from 'react';
2
- import { Confirmation } from './Confirmation';
3
- export const Container = () => {
4
- const [checked, setChecked] = useState(undefined);
5
- return (React.createElement("form", null,
6
- React.createElement(Confirmation, { id: "radioButton", onChange: (selection) => setChecked(selection), checked: checked, label: 'Do you like marshmallows?', error: checked === undefined, errorMsg: "This field is required." })));
7
- };
8
- //# sourceMappingURL=Container.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Container.js","sourceRoot":"","sources":["../../src/ConfirmationRadioButtons/Container.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAE7C,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,EAAE;IAC5B,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAsB,SAAS,CAAC,CAAA;IAEtE,OAAO,CACL;QACE,oBAAC,YAAY,IACX,EAAE,EAAC,aAAa,EAChB,QAAQ,EAAE,CAAC,SAAS,EAAE,EAAE,CAAC,UAAU,CAAC,SAAS,CAAC,EAC9C,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,2BAA2B,EAClC,KAAK,EAAE,OAAO,KAAK,SAAS,EAC5B,QAAQ,EAAC,yBAAyB,GAClC,CACG,CACR,CAAA;AACH,CAAC,CAAA"}
@@ -1,17 +0,0 @@
1
- import { FC, ChangeEvent, FocusEvent, ReactElement } from 'react';
2
- export interface FakeInput {
3
- checked?: boolean;
4
- error?: boolean;
5
- disabled?: boolean;
6
- }
7
- type RadioButtonProps = {
8
- id: string;
9
- label: string | ReactElement;
10
- checked?: boolean;
11
- value: string;
12
- onChange: (event: ChangeEvent<HTMLInputElement>) => void;
13
- onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
14
- disabled?: boolean;
15
- };
16
- export declare const RadioButton: FC<RadioButtonProps>;
17
- export {};
@@ -1,41 +0,0 @@
1
- import React from 'react';
2
- import styled from 'styled-components';
3
- import { theme } from '../theme';
4
- import { Box } from '../Box';
5
- export const RadioButton = ({ id, label, checked, value, onChange, onBlur, disabled = false, }) => (React.createElement(Box, { flex: true, alignItems: "center" },
6
- React.createElement(RadioInput, { id: id, type: "radio", checked: checked, value: value, onChange: onChange, onBlur: onBlur, disabled: disabled }),
7
- React.createElement(RadioLabel, { htmlFor: id },
8
- React.createElement(FakeInput, { checked: checked }),
9
- React.createElement(Text, null, label))));
10
- const FakeInput = styled.div `
11
- width: 24px;
12
- height: 24px;
13
- border-radius: 50%;
14
- background-color: ${theme.colors.white};
15
- margin-right: 10px;
16
- border: ${({ checked }) => checked
17
- ? `8px solid ${theme.colors.secondary}`
18
- : `1px solid ${theme.colors.secondary}`};
19
- `;
20
- const RadioInput = styled.input `
21
- position: absolute;
22
- opacity: 0;
23
- height: 0;
24
- width: 0;
25
- `;
26
- const RadioLabel = styled.label `
27
- font-family: 'Gordita', sans-serif;
28
- text-transform: none;
29
- font-size: 16px;
30
- line-height: 17px;
31
- color: ${theme.colors.secondary};
32
- margin-bottom: 0;
33
- display: flex;
34
- cursor: pointer;
35
- `;
36
- // needed because the text is top aligned in its viewbox
37
- const Text = styled.span `
38
- position: relative;
39
- bottom: -5px;
40
- `;
41
- //# sourceMappingURL=RadioButtonStyled.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"RadioButtonStyled.js","sourceRoot":"","sources":["../../src/ConfirmationRadioButtons/RadioButtonStyled.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoD,MAAM,OAAO,CAAA;AACxE,OAAO,MAAM,MAAM,mBAAmB,CAAA;AACtC,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAChC,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAkB5B,MAAM,CAAC,MAAM,WAAW,GAAyB,CAAC,EAChD,EAAE,EACF,KAAK,EACL,OAAO,EACP,KAAK,EACL,QAAQ,EACR,MAAM,EACN,QAAQ,GAAG,KAAK,GACC,EAAE,EAAE,CAAC,CACtB,oBAAC,GAAG,IAAC,IAAI,QAAC,UAAU,EAAC,QAAQ;IAC3B,oBAAC,UAAU,IACT,EAAE,EAAE,EAAE,EACN,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,GAClB;IACF,oBAAC,UAAU,IAAC,OAAO,EAAE,EAAE;QACrB,oBAAC,SAAS,IAAC,OAAO,EAAE,OAAO,GAAI;QAC/B,oBAAC,IAAI,QAAE,KAAK,CAAQ,CACT,CACT,CACP,CAAA;AAED,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAW;;;;sBAIjB,KAAK,CAAC,MAAM,CAAC,KAAK;;YAE5B,CAAC,EAAE,OAAO,EAAa,EAAE,EAAE,CACnC,OAAO;IACL,CAAC,CAAC,aAAa,KAAK,CAAC,MAAM,CAAC,SAAS,EAAE;IACvC,CAAC,CAAC,aAAa,KAAK,CAAC,MAAM,CAAC,SAAS,EAAE;CAC5C,CAAA;AAED,MAAM,UAAU,GAAG,MAAM,CAAC,KAAK,CAAA;;;;;CAK9B,CAAA;AAED,MAAM,UAAU,GAAG,MAAM,CAAC,KAAK,CAAA;;;;;WAKpB,KAAK,CAAC,MAAM,CAAC,SAAS;;;;CAIhC,CAAA;AAED,wDAAwD;AACxD,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,CAAA;;;CAGvB,CAAA"}
@@ -1,8 +0,0 @@
1
- import React from 'react';
2
- import { render } from '@testing-library/react';
3
- import { Confirmation } from '../Confirmation';
4
- test('renders', () => {
5
- const { container } = render(React.createElement(Confirmation, null));
6
- expect(container.firstChild).toMatchSnapshot();
7
- });
8
- //# sourceMappingURL=Confirmation.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Confirmation.js","sourceRoot":"","sources":["../../../src/ConfirmationRadioButtons/__tests__/Confirmation.js"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAA;AAE/C,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAE9C,IAAI,CAAC,SAAS,EAAE,GAAG,EAAE;IACnB,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,oBAAC,YAAY,OAAG,CAAC,CAAA;IAC9C,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,eAAe,EAAE,CAAA;AAChD,CAAC,CAAC,CAAA"}
@@ -1 +0,0 @@
1
- export { Confirmation } from './Confirmation';
@@ -1,2 +0,0 @@
1
- export { Confirmation } from './Confirmation';
2
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/ConfirmationRadioButtons/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA"}
@@ -1,80 +0,0 @@
1
- import React from 'react';
2
- import { render } from '@testing-library/react';
3
- import 'jest-styled-components';
4
- import { Dropdown } from '../Dropdown';
5
- const days = [
6
- {
7
- label: 'Monday',
8
- value: 'MONDAY',
9
- },
10
- {
11
- label: 'Tuesday',
12
- value: 'TUESDAY',
13
- },
14
- {
15
- label: 'Wednesday',
16
- value: 'WEDNESDAY',
17
- },
18
- {
19
- label: 'Thursday',
20
- value: 'THURSDAY',
21
- },
22
- {
23
- label: 'Friday',
24
- value: 'FRIDAY',
25
- },
26
- {
27
- label: 'Saturday',
28
- value: 'SATURDAY',
29
- },
30
- {
31
- label: 'Sunday',
32
- value: 'SUNDAY',
33
- },
34
- ];
35
- const daysWithGroups = [
36
- {
37
- label: 'Monday',
38
- value: 'MONDAY',
39
- optionGroupLabel: 'Weekday',
40
- },
41
- {
42
- label: 'Tuesday',
43
- value: 'TUESDAY',
44
- optionGroupLabel: 'Weekday',
45
- },
46
- {
47
- label: 'Wednesday',
48
- value: 'WEDNESDAY',
49
- optionGroupLabel: 'Weekday',
50
- },
51
- {
52
- label: 'Thursday',
53
- value: 'THURSDAY',
54
- optionGroupLabel: 'Weekday',
55
- },
56
- {
57
- label: 'Friday',
58
- value: 'FRIDAY',
59
- optionGroupLabel: 'Weekday',
60
- },
61
- {
62
- label: 'Saturday',
63
- value: 'SATURDAY',
64
- optionGroupLabel: 'Weekend',
65
- },
66
- {
67
- label: 'Sunday',
68
- value: 'SUNDAY',
69
- optionGroupLabel: 'Weekend',
70
- },
71
- ];
72
- test('rendersDropdown', () => {
73
- const { container } = render(React.createElement(Dropdown, { list: days }));
74
- expect(container.firstChild).toMatchSnapshot();
75
- });
76
- test('rendersDropdownWithGroups', () => {
77
- const { container } = render(React.createElement(Dropdown, { list: daysWithGroups }));
78
- expect(container.firstChild).toMatchSnapshot();
79
- });
80
- //# sourceMappingURL=Dropdown.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Dropdown.js","sourceRoot":"","sources":["../../../src/Dropdown/__tests__/Dropdown.js"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAA;AAC/C,OAAO,wBAAwB,CAAA;AAE/B,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AAEtC,MAAM,IAAI,GAAG;IACX;QACE,KAAK,EAAE,QAAQ;QACf,KAAK,EAAE,QAAQ;KAChB;IACD;QACE,KAAK,EAAE,SAAS;QAChB,KAAK,EAAE,SAAS;KACjB;IACD;QACE,KAAK,EAAE,WAAW;QAClB,KAAK,EAAE,WAAW;KACnB;IACD;QACE,KAAK,EAAE,UAAU;QACjB,KAAK,EAAE,UAAU;KAClB;IACD;QACE,KAAK,EAAE,QAAQ;QACf,KAAK,EAAE,QAAQ;KAChB;IACD;QACE,KAAK,EAAE,UAAU;QACjB,KAAK,EAAE,UAAU;KAClB;IACD;QACE,KAAK,EAAE,QAAQ;QACf,KAAK,EAAE,QAAQ;KAChB;CACF,CAAA;AAED,MAAM,cAAc,GAAG;IACrB;QACE,KAAK,EAAE,QAAQ;QACf,KAAK,EAAE,QAAQ;QACf,gBAAgB,EAAE,SAAS;KAC5B;IACD;QACE,KAAK,EAAE,SAAS;QAChB,KAAK,EAAE,SAAS;QAChB,gBAAgB,EAAE,SAAS;KAC5B;IACD;QACE,KAAK,EAAE,WAAW;QAClB,KAAK,EAAE,WAAW;QAClB,gBAAgB,EAAE,SAAS;KAC5B;IACD;QACE,KAAK,EAAE,UAAU;QACjB,KAAK,EAAE,UAAU;QACjB,gBAAgB,EAAE,SAAS;KAC5B;IACD;QACE,KAAK,EAAE,QAAQ;QACf,KAAK,EAAE,QAAQ;QACf,gBAAgB,EAAE,SAAS;KAC5B;IACD;QACE,KAAK,EAAE,UAAU;QACjB,KAAK,EAAE,UAAU;QACjB,gBAAgB,EAAE,SAAS;KAC5B;IACD;QACE,KAAK,EAAE,QAAQ;QACf,KAAK,EAAE,QAAQ;QACf,gBAAgB,EAAE,SAAS;KAC5B;CACF,CAAA;AAED,IAAI,CAAC,iBAAiB,EAAE,GAAG,EAAE;IAC3B,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,oBAAC,QAAQ,IAAC,IAAI,EAAE,IAAI,GAAI,CAAC,CAAA;IAEtD,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,eAAe,EAAE,CAAA;AAChD,CAAC,CAAC,CAAA;AAEF,IAAI,CAAC,2BAA2B,EAAE,GAAG,EAAE;IACrC,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,oBAAC,QAAQ,IAAC,IAAI,EAAE,cAAc,GAAI,CAAC,CAAA;IAEhE,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,eAAe,EAAE,CAAA;AAChD,CAAC,CAAC,CAAA"}