@zohodesk/components 1.0.0-temp-135 → 1.0.0-temp-136

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 (329) hide show
  1. package/README.md +1164 -1168
  2. package/assets/Appearance/dark/mode/darkMode.module.css +184 -185
  3. package/assets/Appearance/dark/themes/blue/blueDarkCTATheme.module.css +30 -30
  4. package/assets/Appearance/dark/themes/green/greenDarkCTATheme.module.css +30 -30
  5. package/assets/Appearance/dark/themes/orange/orangeDarkCTATheme.module.css +30 -30
  6. package/assets/Appearance/dark/themes/red/redDarkCTATheme.module.css +30 -30
  7. package/assets/Appearance/dark/themes/yellow/yellowDarkCTATheme.module.css +30 -30
  8. package/assets/Appearance/default/mode/defaultMode.module.css +180 -181
  9. package/assets/Appearance/default/themes/blue/blueDefaultCTATheme.module.css +30 -30
  10. package/assets/Appearance/default/themes/green/greenDefaultCTATheme.module.css +30 -30
  11. package/assets/Appearance/default/themes/orange/orangeDefaultCTATheme.module.css +30 -30
  12. package/assets/Appearance/default/themes/red/redDefaultCTATheme.module.css +30 -30
  13. package/assets/Appearance/default/themes/yellow/yellowDefaultCTATheme.module.css +30 -30
  14. package/assets/Appearance/pureDark/mode/pureDarkMode.module.css +185 -186
  15. package/assets/Appearance/pureDark/themes/blue/bluePureDarkCTATheme.module.css +30 -30
  16. package/assets/Appearance/pureDark/themes/green/greenPureDarkCTATheme.module.css +30 -30
  17. package/assets/Appearance/pureDark/themes/orange/orangePureDarkCTATheme.module.css +30 -30
  18. package/assets/Appearance/pureDark/themes/red/redPureDarkCTATheme.module.css +30 -30
  19. package/assets/Appearance/pureDark/themes/yellow/yellowPureDarkCTATheme.module.css +30 -30
  20. package/docs/external/active-line.js +72 -72
  21. package/docs/external/autorefresh.js +47 -47
  22. package/docs/external/codemirror.js +9681 -9681
  23. package/docs/external/css/hopscotch.css +576 -576
  24. package/docs/external/css/styleGuide.css +1100 -1100
  25. package/docs/external/css.js +466 -466
  26. package/docs/external/designTokens.js +1 -1
  27. package/docs/external/foldcode.js +151 -151
  28. package/docs/external/format.js +129 -129
  29. package/docs/external/htmlmixed.js +84 -84
  30. package/docs/external/index.html +127 -127
  31. package/docs/external/javascript.js +422 -422
  32. package/docs/external/jsx.js +147 -147
  33. package/docs/external/matchbrackets.js +145 -145
  34. package/docs/external/xml.js +322 -322
  35. package/docs/package.json +41 -41
  36. package/docs/src/index.js +1311 -1311
  37. package/es/AppContainer/AppContainer.js +0 -1
  38. package/es/AppContainer/AppContainer.module.css +18 -18
  39. package/es/Avatar/Avatar.js +9 -9
  40. package/es/Avatar/Avatar.module.css +141 -176
  41. package/es/Avatar/__tests__/__snapshots__/Avatar.spec.js.snap +288 -288
  42. package/es/AvatarTeam/AvatarTeam.js +7 -7
  43. package/es/AvatarTeam/AvatarTeam.module.css +188 -188
  44. package/es/AvatarTeam/__tests__/__snapshots__/AvatarTeam.spec.js.snap +226 -226
  45. package/es/Button/Button.js +4 -4
  46. package/es/Button/Button.module.css +525 -543
  47. package/es/Button/__tests__/__snapshots__/Button.spec.js.snap +191 -191
  48. package/es/Buttongroup/Buttongroup.js +1 -1
  49. package/es/Buttongroup/Buttongroup.module.css +89 -107
  50. package/es/Buttongroup/__test__/__snapshots__/Buttongroup.spec.js.snap +146 -146
  51. package/es/Card/Card.js +4 -4
  52. package/es/Card/Card.module.css +20 -20
  53. package/es/CheckBox/CheckBox.js +0 -0
  54. package/es/CheckBox/CheckBox.module.css +157 -157
  55. package/es/DateTime/CalendarView.js +0 -0
  56. package/es/DateTime/DateTime.js +0 -0
  57. package/es/DateTime/DateTime.module.css +235 -235
  58. package/es/DateTime/DateWidget.js +0 -0
  59. package/es/DateTime/DateWidget.module.css +38 -38
  60. package/es/DateTime/YearView.js +0 -0
  61. package/es/DateTime/YearView.module.css +98 -98
  62. package/es/DateTime/common.js +0 -0
  63. package/es/DateTime/index.js +0 -0
  64. package/es/DateTime/objectUtils.js +0 -0
  65. package/es/DateTime/typeChecker.js +0 -0
  66. package/es/DateTime/validator.js +0 -0
  67. package/es/DropBox/DropBox.js +0 -0
  68. package/es/DropBox/DropBox.module.css +405 -489
  69. package/es/DropBox/DropBoxPositionMapping.json +144 -144
  70. package/es/DropDown/DropDown.js +0 -0
  71. package/es/DropDown/DropDown.module.css +5 -5
  72. package/es/DropDown/DropDownHeading.js +0 -0
  73. package/es/DropDown/DropDownHeading.module.css +53 -53
  74. package/es/DropDown/DropDownItem.js +0 -0
  75. package/es/DropDown/DropDownItem.module.css +94 -94
  76. package/es/DropDown/DropDownSearch.js +0 -0
  77. package/es/DropDown/DropDownSearch.module.css +14 -14
  78. package/es/DropDown/DropDownSeparator.js +0 -0
  79. package/es/DropDown/DropDownSeparator.module.css +7 -7
  80. package/es/Heading/Heading.module.css +4 -4
  81. package/es/Label/Label.js +2 -2
  82. package/es/Label/Label.module.css +52 -52
  83. package/es/Label/LabelColors.module.css +20 -20
  84. package/es/Label/__tests__/__snapshots__/Label.spec.js.snap +101 -101
  85. package/es/Layout/Box.js +0 -0
  86. package/es/Layout/Container.js +0 -0
  87. package/es/Layout/Layout.module.css +335 -335
  88. package/es/Layout/utils.js +0 -0
  89. package/es/ListItem/ListItem.js +3 -2
  90. package/es/ListItem/ListItem.module.css +213 -209
  91. package/es/ListItem/ListItemWithAvatar.js +3 -2
  92. package/es/ListItem/ListItemWithCheckBox.js +3 -2
  93. package/es/ListItem/ListItemWithIcon.js +3 -2
  94. package/es/ListItem/ListItemWithRadio.js +3 -2
  95. package/es/ListItem/props/defaultProps.js +12 -6
  96. package/es/MultiSelect/AdvancedGroupMultiSelect.js +5 -5
  97. package/es/MultiSelect/MultiSelect.js +5 -5
  98. package/es/MultiSelect/MultiSelect.module.css +205 -205
  99. package/es/MultiSelect/MultiSelectWithAvatar.js +0 -0
  100. package/es/MultiSelect/SelectedOptions.module.css +15 -15
  101. package/es/MultiSelect/__tests__/MultiSelect.spec.js +0 -0
  102. package/es/PopOver/PopOver.module.css +8 -8
  103. package/es/Popup/Popup.js +0 -0
  104. package/es/Popup/PositionMapping.json +73 -73
  105. package/es/Radio/Radio.js +0 -0
  106. package/es/Radio/Radio.module.css +112 -112
  107. package/es/Responsive/CustomResponsive.js +0 -0
  108. package/es/ResponsiveDropBox/ResponsiveDropBox.module.css +6 -6
  109. package/es/Ribbon/Ribbon.js +0 -0
  110. package/es/Ribbon/Ribbon.module.css +376 -454
  111. package/es/Ribbon/__tests__/__snapshots__/Ribbon.spec.js.snap +163 -163
  112. package/es/RippleEffect/RippleEffect.module.css +92 -92
  113. package/es/Select/GroupSelect.js +0 -0
  114. package/es/Select/Select.js +0 -0
  115. package/es/Select/Select.module.css +108 -108
  116. package/es/Select/SelectWithAvatar.js +0 -0
  117. package/es/Select/SelectWithIcon.js +0 -0
  118. package/es/Select/__tests__/Select.spec.js +0 -0
  119. package/es/Stencils/Stencils.js +0 -0
  120. package/es/Stencils/Stencils.module.css +96 -96
  121. package/es/Stencils/__tests__/__snapshots__/Stencils.spec.js.snap +49 -49
  122. package/es/Switch/Switch.js +0 -0
  123. package/es/Switch/Switch.module.css +110 -127
  124. package/es/Tab/Tab.module.css +100 -100
  125. package/es/Tab/TabContent.module.css +4 -4
  126. package/es/Tab/Tabs.js +17 -17
  127. package/es/Tab/Tabs.module.css +139 -143
  128. package/es/Tag/Tag.js +8 -8
  129. package/es/Tag/Tag.module.css +254 -254
  130. package/es/TextBox/TextBox.js +0 -0
  131. package/es/TextBox/TextBox.module.css +157 -157
  132. package/es/TextBox/__tests__/__snapshots__/TextBox.spec.js.snap +127 -127
  133. package/es/TextBoxIcon/TextBoxIcon.js +0 -0
  134. package/es/TextBoxIcon/TextBoxIcon.module.css +78 -78
  135. package/es/TextBoxIcon/__tests__/__snapshots__/TextBoxIcon.spec.js.snap +334 -334
  136. package/es/Textarea/Textarea.js +0 -0
  137. package/es/Textarea/Textarea.module.css +139 -139
  138. package/es/Textarea/__tests__/__snapshots__/Textarea.spec.js.snap +97 -97
  139. package/es/Tooltip/Tooltip.module.css +109 -134
  140. package/es/common/a11y.module.css +3 -3
  141. package/es/common/animation.module.css +624 -624
  142. package/es/common/avatarsizes.module.css +48 -48
  143. package/es/common/basic.module.css +33 -33
  144. package/es/common/basicReset.module.css +40 -40
  145. package/es/common/common.module.css +524 -524
  146. package/es/common/customscroll.module.css +89 -89
  147. package/es/common/reset.module.css +12 -12
  148. package/es/common/transition.module.css +146 -146
  149. package/es/deprecated/AdvancedMultiSelect.module.css +126 -126
  150. package/es/semantic/Button/semanticButton.module.css +9 -9
  151. package/es/utils/Common.js +0 -0
  152. package/es/utils/dropDownUtils.js +0 -0
  153. package/install.md +10 -10
  154. package/lib/Accordion/Accordion.js +3 -1
  155. package/lib/Accordion/AccordionItem.js +3 -1
  156. package/lib/Animation/Animation.js +3 -1
  157. package/lib/AppContainer/AppContainer.js +3 -2
  158. package/lib/AppContainer/AppContainer.module.css +18 -18
  159. package/lib/Avatar/Avatar.js +13 -11
  160. package/lib/Avatar/Avatar.module.css +141 -176
  161. package/lib/Avatar/__tests__/__snapshots__/Avatar.spec.js.snap +288 -288
  162. package/lib/AvatarTeam/AvatarTeam.js +10 -8
  163. package/lib/AvatarTeam/AvatarTeam.module.css +188 -188
  164. package/lib/AvatarTeam/__tests__/__snapshots__/AvatarTeam.spec.js.snap +226 -226
  165. package/lib/Button/Button.js +7 -5
  166. package/lib/Button/Button.module.css +525 -543
  167. package/lib/Button/__tests__/__snapshots__/Button.spec.js.snap +191 -191
  168. package/lib/Buttongroup/Buttongroup.js +6 -3
  169. package/lib/Buttongroup/Buttongroup.module.css +89 -107
  170. package/lib/Buttongroup/__test__/__snapshots__/Buttongroup.spec.js.snap +146 -146
  171. package/lib/Card/Card.js +7 -5
  172. package/lib/Card/Card.module.css +20 -20
  173. package/lib/CheckBox/CheckBox.js +3 -1
  174. package/lib/CheckBox/CheckBox.module.css +157 -157
  175. package/lib/DateTime/CalendarView.js +5 -2
  176. package/lib/DateTime/DateTime.js +5 -3
  177. package/lib/DateTime/DateTime.module.css +235 -235
  178. package/lib/DateTime/DateTimePopupFooter.js +3 -1
  179. package/lib/DateTime/DateTimePopupHeader.js +3 -1
  180. package/lib/DateTime/DateWidget.js +3 -1
  181. package/lib/DateTime/DateWidget.module.css +38 -38
  182. package/lib/DateTime/DaysRow.js +3 -1
  183. package/lib/DateTime/Time.js +3 -1
  184. package/lib/DateTime/YearView.js +3 -1
  185. package/lib/DateTime/YearView.module.css +98 -98
  186. package/lib/DateTime/common.js +0 -0
  187. package/lib/DateTime/dateFormatUtils/timeChange.js +2 -2
  188. package/lib/DateTime/index.js +0 -0
  189. package/lib/DateTime/objectUtils.js +0 -0
  190. package/lib/DateTime/typeChecker.js +0 -0
  191. package/lib/DateTime/validator.js +4 -4
  192. package/lib/DropBox/DropBox.js +3 -1
  193. package/lib/DropBox/DropBox.module.css +405 -489
  194. package/lib/DropBox/DropBoxPositionMapping.json +144 -144
  195. package/lib/DropDown/DropDown.js +5 -2
  196. package/lib/DropDown/DropDown.module.css +5 -5
  197. package/lib/DropDown/DropDownHeading.js +3 -1
  198. package/lib/DropDown/DropDownHeading.module.css +53 -53
  199. package/lib/DropDown/DropDownItem.js +3 -1
  200. package/lib/DropDown/DropDownItem.module.css +94 -94
  201. package/lib/DropDown/DropDownSearch.js +5 -2
  202. package/lib/DropDown/DropDownSearch.module.css +14 -14
  203. package/lib/DropDown/DropDownSeparator.js +3 -1
  204. package/lib/DropDown/DropDownSeparator.module.css +7 -7
  205. package/lib/DropDown/props/propTypes.js +4 -1
  206. package/lib/Heading/Heading.js +4 -2
  207. package/lib/Heading/Heading.module.css +4 -4
  208. package/lib/Label/Label.js +3 -1
  209. package/lib/Label/Label.module.css +52 -52
  210. package/lib/Label/LabelColors.module.css +20 -20
  211. package/lib/Label/__tests__/__snapshots__/Label.spec.js.snap +101 -101
  212. package/lib/Layout/Box.js +0 -0
  213. package/lib/Layout/Container.js +0 -0
  214. package/lib/Layout/Layout.module.css +335 -335
  215. package/lib/Layout/utils.js +0 -0
  216. package/lib/ListItem/ListItem.js +6 -3
  217. package/lib/ListItem/ListItem.module.css +213 -209
  218. package/lib/ListItem/ListItemWithAvatar.js +6 -3
  219. package/lib/ListItem/ListItemWithCheckBox.js +6 -3
  220. package/lib/ListItem/ListItemWithIcon.js +6 -3
  221. package/lib/ListItem/ListItemWithRadio.js +6 -3
  222. package/lib/ListItem/props/defaultProps.js +12 -6
  223. package/lib/ListItem/props/propTypes.js +4 -1
  224. package/lib/Modal/Modal.js +3 -1
  225. package/lib/MultiSelect/AdvancedGroupMultiSelect.js +11 -9
  226. package/lib/MultiSelect/AdvancedMultiSelect.js +4 -2
  227. package/lib/MultiSelect/EmptyState.js +3 -1
  228. package/lib/MultiSelect/MultiSelect.js +10 -8
  229. package/lib/MultiSelect/MultiSelect.module.css +205 -205
  230. package/lib/MultiSelect/MultiSelectHeader.js +3 -1
  231. package/lib/MultiSelect/MultiSelectWithAvatar.js +3 -1
  232. package/lib/MultiSelect/SelectedOptions.js +5 -2
  233. package/lib/MultiSelect/SelectedOptions.module.css +15 -15
  234. package/lib/MultiSelect/Suggestions.js +4 -2
  235. package/lib/MultiSelect/__tests__/MultiSelect.spec.js +0 -0
  236. package/lib/PopOver/PopOver.js +3 -1
  237. package/lib/PopOver/PopOver.module.css +8 -8
  238. package/lib/Popup/Popup.js +4 -2
  239. package/lib/Popup/PositionMapping.json +73 -73
  240. package/lib/Popup/__tests__/Popup.spec.js +3 -1
  241. package/lib/Provider/LibraryContext.js +5 -3
  242. package/lib/Provider/NumberGenerator/NumberGenerator.js +1 -1
  243. package/lib/Radio/Radio.js +3 -1
  244. package/lib/Radio/Radio.module.css +112 -112
  245. package/lib/Responsive/CustomResponsive.js +6 -4
  246. package/lib/Responsive/RefWrapper.js +4 -2
  247. package/lib/Responsive/ResizeComponent.js +9 -4
  248. package/lib/Responsive/ResizeObserver.js +4 -1
  249. package/lib/Responsive/Responsive.js +6 -4
  250. package/lib/Responsive/sizeObservers.js +4 -2
  251. package/lib/ResponsiveDropBox/ResponsiveDropBox.js +3 -1
  252. package/lib/ResponsiveDropBox/ResponsiveDropBox.module.css +6 -6
  253. package/lib/Ribbon/Ribbon.js +3 -1
  254. package/lib/Ribbon/Ribbon.module.css +376 -454
  255. package/lib/Ribbon/__tests__/__snapshots__/Ribbon.spec.js.snap +163 -163
  256. package/lib/RippleEffect/RippleEffect.module.css +92 -92
  257. package/lib/Select/GroupSelect.js +5 -3
  258. package/lib/Select/Select.js +3 -1
  259. package/lib/Select/Select.module.css +108 -108
  260. package/lib/Select/SelectWithAvatar.js +3 -1
  261. package/lib/Select/SelectWithIcon.js +3 -1
  262. package/lib/Select/__tests__/Select.spec.js +2 -2
  263. package/lib/Select/props/defaultProps.js +4 -1
  264. package/lib/Stencils/Stencils.js +3 -1
  265. package/lib/Stencils/Stencils.module.css +96 -96
  266. package/lib/Stencils/__tests__/__snapshots__/Stencils.spec.js.snap +49 -49
  267. package/lib/Switch/Switch.js +3 -1
  268. package/lib/Switch/Switch.module.css +110 -127
  269. package/lib/Tab/Tab.module.css +100 -100
  270. package/lib/Tab/TabContent.module.css +4 -4
  271. package/lib/Tab/TabWrapper.js +2 -2
  272. package/lib/Tab/Tabs.js +15 -13
  273. package/lib/Tab/Tabs.module.css +139 -143
  274. package/lib/Tag/Tag.js +11 -9
  275. package/lib/Tag/Tag.module.css +254 -254
  276. package/lib/TextBox/TextBox.js +3 -1
  277. package/lib/TextBox/TextBox.module.css +157 -157
  278. package/lib/TextBox/__tests__/__snapshots__/TextBox.spec.js.snap +127 -127
  279. package/lib/TextBox/props/propTypes.js +4 -1
  280. package/lib/TextBoxIcon/TextBoxIcon.js +5 -2
  281. package/lib/TextBoxIcon/TextBoxIcon.module.css +78 -78
  282. package/lib/TextBoxIcon/__tests__/__snapshots__/TextBoxIcon.spec.js.snap +334 -334
  283. package/lib/Textarea/Textarea.js +3 -1
  284. package/lib/Textarea/Textarea.module.css +139 -139
  285. package/lib/Textarea/__tests__/__snapshots__/Textarea.spec.js.snap +97 -97
  286. package/lib/Tooltip/Tooltip.js +3 -1
  287. package/lib/Tooltip/Tooltip.module.css +109 -134
  288. package/lib/Tooltip/__tests__/Tooltip.spec.js +3 -1
  289. package/lib/VelocityAnimation/VelocityAnimation/VelocityAnimation.js +3 -1
  290. package/lib/VelocityAnimation/VelocityAnimationGroup/VelocityAnimationGroup.js +4 -2
  291. package/lib/common/a11y.module.css +3 -3
  292. package/lib/common/animation.module.css +624 -624
  293. package/lib/common/avatarsizes.module.css +48 -48
  294. package/lib/common/basic.module.css +33 -33
  295. package/lib/common/basicReset.module.css +40 -40
  296. package/lib/common/common.module.css +524 -524
  297. package/lib/common/customscroll.module.css +89 -89
  298. package/lib/common/reset.module.css +12 -12
  299. package/lib/common/transition.module.css +146 -146
  300. package/lib/deprecated/AdvancedMultiSelect.module.css +126 -126
  301. package/lib/deprecated/PortalLayer/PortalLayer.js +3 -1
  302. package/lib/semantic/Button/Button.js +3 -1
  303. package/lib/semantic/Button/semanticButton.module.css +9 -9
  304. package/lib/utils/Common.js +0 -0
  305. package/lib/utils/constructFullName.js +2 -2
  306. package/lib/utils/css/mergeStyle.js +4 -1
  307. package/lib/utils/dropDownUtils.js +5 -3
  308. package/package.json +102 -102
  309. package/assets/Appearance/dark/themes/blue/blueDarkCTAModifyCategory.module.css +0 -102
  310. package/assets/Appearance/dark/themes/green/greenDarkCTAModifyCategory.module.css +0 -102
  311. package/assets/Appearance/dark/themes/orange/orangeDarkCTAModifyCategory.module.css +0 -102
  312. package/assets/Appearance/dark/themes/red/redDarkCTAModifyCategory.module.css +0 -102
  313. package/assets/Appearance/dark/themes/yellow/yellowDarkCTAModifyCategory.module.css +0 -102
  314. package/assets/Appearance/default/themes/blue/blueDefaultCTAModifyCategory.module.css +0 -102
  315. package/assets/Appearance/default/themes/green/greenDefaultCTAModifyCategory.module.css +0 -102
  316. package/assets/Appearance/default/themes/orange/orangeDefaultCTAModifyCategory.module.css +0 -102
  317. package/assets/Appearance/default/themes/red/redDefaultCTAModifyCategory.module.css +0 -102
  318. package/assets/Appearance/default/themes/yellow/yellowDefaultCTAModifyCategory.module.css +0 -102
  319. package/assets/Appearance/pureDark/themes/blue/bluePureDarkCTAModifyCategory.module.css +0 -102
  320. package/assets/Appearance/pureDark/themes/green/greenPureDarkCTAModifyCategory.module.css +0 -102
  321. package/assets/Appearance/pureDark/themes/orange/orangePureDarkCTAModifyCategory.module.css +0 -102
  322. package/assets/Appearance/pureDark/themes/red/redPureDarkCTAModifyCategory.module.css +0 -102
  323. package/assets/Appearance/pureDark/themes/yellow/yellowPureDarkCTAModifyCategory.module.css +0 -102
  324. package/assets/Contrast/darkContrastLightness.module.css +0 -33
  325. package/assets/Contrast/defaultContrastLightness.module.css +0 -33
  326. package/assets/Contrast/pureDarkContrastLightness.module.css +0 -33
  327. package/css_error.log +0 -1
  328. package/es/common/boxShadow.module.css +0 -71
  329. package/lib/common/boxShadow.module.css +0 -71
@@ -1,139 +1,139 @@
1
- .varClass {
2
- /* textarea default variables */
3
- --textarea_border_width: 0;
4
- --textarea_border_color: none;
5
- --textarea_cursor: auto;
6
- --textarea_text_color: var(--zdt_textarea_default_text);
7
- --textarea_font_size: var(--zd_font_size14);
8
- --textarea_line_height: var(--zd_size22);
9
- --textarea_padding: var(--zd_size2) 0;
10
- --textarea_height: var(--zd_size30);
11
-
12
- /* textarea placeholder default variable */
13
- --textarea_placeholder_text_color: var(--zdt_textarea_placeholder_text);
14
- }
15
- .basic {
16
- composes: varClass;
17
- -webkit-appearance: none;
18
- -moz-appearance: none;
19
- appearance: none;
20
- outline: 0;
21
- letter-spacing: 0.1px;
22
- color: var(--textarea_text_color);
23
- cursor: var(--textarea_cursor);
24
- }
25
- .basic, .noBorder {
26
- border-width: var(--textarea_border_width);
27
- }
28
- .basic::placeholder {
29
- color: var(--textarea_placeholder_text_color);
30
- }
31
- .basic::-webkit-placeholder {
32
- color: var(--textarea_placeholder_text_color);
33
- }
34
- .basic::-moz-placeholder {
35
- color: var(--textarea_placeholder_text_color);
36
- }
37
- .basic::-ms-placeholder {
38
- color: var(--textarea_placeholder_text_color);
39
- }
40
- .basic:disabled {
41
- --textarea_cursor: not-allowed;
42
- --textarea_text_color: var(--zdt_textarea_default_text);
43
- }
44
- .readonly {
45
- --textarea_cursor: not-allowed;
46
- }
47
- .resizeX {
48
- composes: resizeX from '../common/common.module.css';
49
- }
50
- .resizeY {
51
- composes: resizeY from '../common/common.module.css';
52
- }
53
- .noresize {
54
- composes: resizenone from '../common/common.module.css';
55
- }
56
- .resizeboth {
57
- composes: resizeboth from '../common/common.module.css';
58
- }
59
- .container {
60
- composes: basic;
61
- transition: border var(--zd_transition2) linear 0s,
62
- height var(--zd_transition2) linear 0s;
63
- -moz-transition: border var(--zd_transition2) linear 0s,
64
- height var(--zd_transition2) linear 0s;
65
- width: 100%;
66
- max-width: 100%;
67
- min-width: 100px;
68
- font-size: var(--textarea_font_size);
69
- line-height: var(--textarea_line_height);
70
- height: var(--textarea_height);
71
- -webkit-transition: border var(--zd_transition2) linear 0s,
72
- height var(--zd_transition2) linear 0s;
73
- border-style: solid;
74
- background-color: var(--zdt_textarea_default_bg);
75
- border-color: var(--textarea_border_color);
76
- padding: var(--textarea_padding);
77
- }
78
- .needBorder {
79
- --textarea_border_width: 0 0 1px 0;
80
- }
81
- .borderColor_transparent {
82
- --textarea_border_color: var(--zdt_textarea_transparent_border);
83
- }
84
- .borderColor_default {
85
- --textarea_border_color: var(--zdt_textarea_default_border);
86
- }
87
- .effect:hover {
88
- --textarea_border_color: var(--zdt_textarea_hover_border);
89
- }
90
- .effect:focus {
91
- --textarea_border_color: var(--zdt_textarea_focus_border);
92
- }
93
- .xsmall,
94
- .xmedium {
95
- vertical-align: middle;
96
- }
97
- .xsmall {
98
- --textarea_font_size: var(--zd_font_size14);
99
- --textarea_padding: var(--zd_size4) 0 var(--zd_size2);
100
- --textarea_height: var(--zd_size28);
101
- --textarea_line_height: var(--zd_size19);
102
- }
103
- .xmedium {
104
- --textarea_font_size: var(--zd_font_size13);
105
- --textarea_padding: var(--zd_size4) 0 var(--zd_size2);
106
- --textarea_height: var(--zd_size25);
107
- --textarea_line_height: var(--zd_size17);
108
- }
109
- .small {
110
- --textarea_height: var(--zd_size30);
111
- --textarea_padding: var(--zd_size2) 0;
112
- }
113
- .smallanimated:focus,
114
- .xsmallanimated:focus,
115
- .xmediumanimated:focus {
116
- --textarea_height: var(--zd_size70);
117
- }
118
- .medium {
119
- --textarea_height: var(--zd_size88);
120
- --textarea_padding: var(--zd_size2);
121
- }
122
- .large {
123
- --textarea_height: var(--zd_size45);
124
- --textarea_padding: var(--zd_size2);
125
- }
126
- .largeanimated:focus {
127
- --textarea_height: var(--zd_size220);
128
- }
129
- .xlarge {
130
- --textarea_height: var(--zd_size184);
131
- }
132
- .default {
133
- font-family: var(--zd_regular);
134
- --textarea_text_color: var(--zdt_textarea_black_text);
135
- }
136
- .primary {
137
- composes: semibold from '../common/common.module.css';
138
- --textarea_text_color: var(--zdt_textarea_black_text);
139
- }
1
+ .varClass {
2
+ /* textarea default variables */
3
+ --textarea_border_width: 0;
4
+ --textarea_border_color: none;
5
+ --textarea_cursor: auto;
6
+ --textarea_text_color: var(--zdt_textarea_default_text);
7
+ --textarea_font_size: var(--zd_font_size14);
8
+ --textarea_line_height: var(--zd_size22);
9
+ --textarea_padding: var(--zd_size2) 0;
10
+ --textarea_height: var(--zd_size30);
11
+
12
+ /* textarea placeholder default variable */
13
+ --textarea_placeholder_text_color: var(--zdt_textarea_placeholder_text);
14
+ }
15
+ .basic {
16
+ composes: varClass;
17
+ -webkit-appearance: none;
18
+ -moz-appearance: none;
19
+ appearance: none;
20
+ outline: 0;
21
+ letter-spacing: 0.1px;
22
+ color: var(--textarea_text_color);
23
+ cursor: var(--textarea_cursor);
24
+ }
25
+ .basic, .noBorder {
26
+ border-width: var(--textarea_border_width);
27
+ }
28
+ .basic::placeholder {
29
+ color: var(--textarea_placeholder_text_color);
30
+ }
31
+ .basic::-webkit-placeholder {
32
+ color: var(--textarea_placeholder_text_color);
33
+ }
34
+ .basic::-moz-placeholder {
35
+ color: var(--textarea_placeholder_text_color);
36
+ }
37
+ .basic::-ms-placeholder {
38
+ color: var(--textarea_placeholder_text_color);
39
+ }
40
+ .basic:disabled {
41
+ --textarea_cursor: not-allowed;
42
+ --textarea_text_color: var(--zdt_textarea_default_text);
43
+ }
44
+ .readonly {
45
+ --textarea_cursor: not-allowed;
46
+ }
47
+ .resizeX {
48
+ composes: resizeX from '../common/common.module.css';
49
+ }
50
+ .resizeY {
51
+ composes: resizeY from '../common/common.module.css';
52
+ }
53
+ .noresize {
54
+ composes: resizenone from '../common/common.module.css';
55
+ }
56
+ .resizeboth {
57
+ composes: resizeboth from '../common/common.module.css';
58
+ }
59
+ .container {
60
+ composes: basic;
61
+ transition: border var(--zd_transition2) linear 0s,
62
+ height var(--zd_transition2) linear 0s;
63
+ -moz-transition: border var(--zd_transition2) linear 0s,
64
+ height var(--zd_transition2) linear 0s;
65
+ width: 100%;
66
+ max-width: 100%;
67
+ min-width: 100px;
68
+ font-size: var(--textarea_font_size);
69
+ line-height: var(--textarea_line_height);
70
+ height: var(--textarea_height);
71
+ -webkit-transition: border var(--zd_transition2) linear 0s,
72
+ height var(--zd_transition2) linear 0s;
73
+ border-style: solid;
74
+ background-color: var(--zdt_textarea_default_bg);
75
+ border-color: var(--textarea_border_color);
76
+ padding: var(--textarea_padding);
77
+ }
78
+ .needBorder {
79
+ --textarea_border_width: 0 0 1px 0;
80
+ }
81
+ .borderColor_transparent {
82
+ --textarea_border_color: var(--zdt_textarea_transparent_border);
83
+ }
84
+ .borderColor_default {
85
+ --textarea_border_color: var(--zdt_textarea_default_border);
86
+ }
87
+ .effect:hover {
88
+ --textarea_border_color: var(--zdt_textarea_hover_border);
89
+ }
90
+ .effect:focus {
91
+ --textarea_border_color: var(--zdt_textarea_focus_border);
92
+ }
93
+ .xsmall,
94
+ .xmedium {
95
+ vertical-align: middle;
96
+ }
97
+ .xsmall {
98
+ --textarea_font_size: var(--zd_font_size14);
99
+ --textarea_padding: var(--zd_size4) 0 var(--zd_size2);
100
+ --textarea_height: var(--zd_size28);
101
+ --textarea_line_height: var(--zd_size19);
102
+ }
103
+ .xmedium {
104
+ --textarea_font_size: var(--zd_font_size13);
105
+ --textarea_padding: var(--zd_size4) 0 var(--zd_size2);
106
+ --textarea_height: var(--zd_size25);
107
+ --textarea_line_height: var(--zd_size17);
108
+ }
109
+ .small {
110
+ --textarea_height: var(--zd_size30);
111
+ --textarea_padding: var(--zd_size2) 0;
112
+ }
113
+ .smallanimated:focus,
114
+ .xsmallanimated:focus,
115
+ .xmediumanimated:focus {
116
+ --textarea_height: var(--zd_size70);
117
+ }
118
+ .medium {
119
+ --textarea_height: var(--zd_size88);
120
+ --textarea_padding: var(--zd_size2);
121
+ }
122
+ .large {
123
+ --textarea_height: var(--zd_size45);
124
+ --textarea_padding: var(--zd_size2);
125
+ }
126
+ .largeanimated:focus {
127
+ --textarea_height: var(--zd_size220);
128
+ }
129
+ .xlarge {
130
+ --textarea_height: var(--zd_size184);
131
+ }
132
+ .default {
133
+ font-family: var(--zd_regular);
134
+ --textarea_text_color: var(--zdt_textarea_black_text);
135
+ }
136
+ .primary {
137
+ composes: semibold from '../common/common.module.css';
138
+ --textarea_text_color: var(--zdt_textarea_black_text);
139
+ }
@@ -1,97 +1,97 @@
1
- // Jest Snapshot v1, https://goo.gl/fbAQLP
2
-
3
- exports[`Textarea component should display size large - primary 1`] = `
4
- <textarea
5
- className=" container large primary needBorder resizeY effect borderColor_default"
6
- data-id="TextareaComp"
7
- maxLength="100"
8
- onBlur={[Function]}
9
- onChange={[Function]}
10
- onKeyDown={[Function]}
11
- placeholder="Text Area"
12
- />
13
- `;
14
-
15
- exports[`Textarea component should display size large 1`] = `
16
- <textarea
17
- className=" container large default needBorder resizeY effect borderColor_default"
18
- data-id="TextareaComp"
19
- maxLength="100"
20
- onBlur={[Function]}
21
- onChange={[Function]}
22
- onKeyDown={[Function]}
23
- placeholder="Text Area"
24
- />
25
- `;
26
-
27
- exports[`Textarea component should display size medium - primary 1`] = `
28
- <textarea
29
- className=" container medium primary needBorder resizeY effect borderColor_default"
30
- data-id="TextareaComp"
31
- maxLength="100"
32
- onBlur={[Function]}
33
- onChange={[Function]}
34
- onKeyDown={[Function]}
35
- placeholder="Text Area"
36
- />
37
- `;
38
-
39
- exports[`Textarea component should display size medium 1`] = `
40
- <textarea
41
- className=" container medium default needBorder resizeY effect borderColor_default"
42
- data-id="TextareaComp"
43
- maxLength="100"
44
- onBlur={[Function]}
45
- onChange={[Function]}
46
- onKeyDown={[Function]}
47
- placeholder="Text Area"
48
- />
49
- `;
50
-
51
- exports[`Textarea component should display size small - primary 1`] = `
52
- <textarea
53
- className=" container small primary needBorder resizeY effect borderColor_default"
54
- data-id="TextareaComp"
55
- maxLength="100"
56
- onBlur={[Function]}
57
- onChange={[Function]}
58
- onKeyDown={[Function]}
59
- placeholder="Text Area"
60
- />
61
- `;
62
-
63
- exports[`Textarea component should display size small 1`] = `
64
- <textarea
65
- className=" container small default needBorder resizeY effect borderColor_default"
66
- data-id="TextareaComp"
67
- maxLength="100"
68
- onBlur={[Function]}
69
- onChange={[Function]}
70
- onKeyDown={[Function]}
71
- placeholder="Text Area"
72
- />
73
- `;
74
-
75
- exports[`Textarea component should display size xsmall - primary 1`] = `
76
- <textarea
77
- className=" container xsmall primary needBorder resizeY effect borderColor_default"
78
- data-id="TextareaComp"
79
- maxLength="100"
80
- onBlur={[Function]}
81
- onChange={[Function]}
82
- onKeyDown={[Function]}
83
- placeholder="Text Area"
84
- />
85
- `;
86
-
87
- exports[`Textarea component should display size xsmall 1`] = `
88
- <textarea
89
- className=" container xsmall default needBorder resizeY effect borderColor_default"
90
- data-id="TextareaComp"
91
- maxLength="100"
92
- onBlur={[Function]}
93
- onChange={[Function]}
94
- onKeyDown={[Function]}
95
- placeholder="Text Area"
96
- />
97
- `;
1
+ // Jest Snapshot v1, https://goo.gl/fbAQLP
2
+
3
+ exports[`Textarea component should display size large - primary 1`] = `
4
+ <textarea
5
+ className=" container large primary needBorder resizeY effect borderColor_default"
6
+ data-id="TextareaComp"
7
+ maxLength="100"
8
+ onBlur={[Function]}
9
+ onChange={[Function]}
10
+ onKeyDown={[Function]}
11
+ placeholder="Text Area"
12
+ />
13
+ `;
14
+
15
+ exports[`Textarea component should display size large 1`] = `
16
+ <textarea
17
+ className=" container large default needBorder resizeY effect borderColor_default"
18
+ data-id="TextareaComp"
19
+ maxLength="100"
20
+ onBlur={[Function]}
21
+ onChange={[Function]}
22
+ onKeyDown={[Function]}
23
+ placeholder="Text Area"
24
+ />
25
+ `;
26
+
27
+ exports[`Textarea component should display size medium - primary 1`] = `
28
+ <textarea
29
+ className=" container medium primary needBorder resizeY effect borderColor_default"
30
+ data-id="TextareaComp"
31
+ maxLength="100"
32
+ onBlur={[Function]}
33
+ onChange={[Function]}
34
+ onKeyDown={[Function]}
35
+ placeholder="Text Area"
36
+ />
37
+ `;
38
+
39
+ exports[`Textarea component should display size medium 1`] = `
40
+ <textarea
41
+ className=" container medium default needBorder resizeY effect borderColor_default"
42
+ data-id="TextareaComp"
43
+ maxLength="100"
44
+ onBlur={[Function]}
45
+ onChange={[Function]}
46
+ onKeyDown={[Function]}
47
+ placeholder="Text Area"
48
+ />
49
+ `;
50
+
51
+ exports[`Textarea component should display size small - primary 1`] = `
52
+ <textarea
53
+ className=" container small primary needBorder resizeY effect borderColor_default"
54
+ data-id="TextareaComp"
55
+ maxLength="100"
56
+ onBlur={[Function]}
57
+ onChange={[Function]}
58
+ onKeyDown={[Function]}
59
+ placeholder="Text Area"
60
+ />
61
+ `;
62
+
63
+ exports[`Textarea component should display size small 1`] = `
64
+ <textarea
65
+ className=" container small default needBorder resizeY effect borderColor_default"
66
+ data-id="TextareaComp"
67
+ maxLength="100"
68
+ onBlur={[Function]}
69
+ onChange={[Function]}
70
+ onKeyDown={[Function]}
71
+ placeholder="Text Area"
72
+ />
73
+ `;
74
+
75
+ exports[`Textarea component should display size xsmall - primary 1`] = `
76
+ <textarea
77
+ className=" container xsmall primary needBorder resizeY effect borderColor_default"
78
+ data-id="TextareaComp"
79
+ maxLength="100"
80
+ onBlur={[Function]}
81
+ onChange={[Function]}
82
+ onKeyDown={[Function]}
83
+ placeholder="Text Area"
84
+ />
85
+ `;
86
+
87
+ exports[`Textarea component should display size xsmall 1`] = `
88
+ <textarea
89
+ className=" container xsmall default needBorder resizeY effect borderColor_default"
90
+ data-id="TextareaComp"
91
+ maxLength="100"
92
+ onBlur={[Function]}
93
+ onChange={[Function]}
94
+ onKeyDown={[Function]}
95
+ placeholder="Text Area"
96
+ />
97
+ `;
@@ -14,8 +14,10 @@ var _ResizeObserver = _interopRequireDefault(require("../Responsive/ResizeObserv
14
14
  var _selectn = _interopRequireDefault(require("selectn"));
15
15
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
16
16
  function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
17
- function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
17
+ function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
18
18
  function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
19
+ function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
20
+ function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
19
21
  function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
20
22
  function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
21
23
  function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }