@zohodesk/components 1.0.0-temp-51 → 1.0.0-temp-52

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 (297) hide show
  1. package/{assets → es}/Appearance/dark/mode/darkMode.module.css +2 -4
  2. package/es/Appearance/dark/themes/blue/blueDarkCTATheme.module.css +34 -0
  3. package/es/Appearance/dark/themes/blue/blueDarkComponentTheme.module.css +42 -0
  4. package/{assets → es}/Appearance/dark/themes/green/greenDarkCTATheme.module.css +10 -10
  5. package/es/Appearance/dark/themes/green/greenDarkComponentTheme.module.css +42 -0
  6. package/{assets → es}/Appearance/dark/themes/orange/orangeDarkCTATheme.module.css +10 -10
  7. package/es/Appearance/dark/themes/orange/orangeDarkComponentTheme.module.css +42 -0
  8. package/{assets → es}/Appearance/dark/themes/red/redDarkCTATheme.module.css +10 -10
  9. package/es/Appearance/dark/themes/red/redDarkComponentTheme.module.css +42 -0
  10. package/{assets → es}/Appearance/dark/themes/yellow/yellowDarkCTATheme.module.css +10 -10
  11. package/es/Appearance/dark/themes/yellow/yellowDarkComponentTheme.module.css +42 -0
  12. package/{assets → es}/Appearance/default/mode/defaultMode.module.css +2 -4
  13. package/{assets → es}/Appearance/default/themes/blue/blueDefaultCTATheme.module.css +0 -0
  14. package/{assets → es}/Appearance/default/themes/blue/blueDefaultComponentTheme.module.css +7 -7
  15. package/{assets → es}/Appearance/default/themes/green/greenDefaultCTATheme.module.css +2 -2
  16. package/{assets → es}/Appearance/default/themes/green/greenDefaultComponentTheme.module.css +4 -4
  17. package/{assets → es}/Appearance/default/themes/orange/orangeDefaultCTATheme.module.css +0 -0
  18. package/{assets → es}/Appearance/default/themes/orange/orangeDefaultComponentTheme.module.css +3 -3
  19. package/{assets → es}/Appearance/default/themes/red/redDefaultCTATheme.module.css +7 -7
  20. package/{assets → es}/Appearance/default/themes/red/redDefaultComponentTheme.module.css +3 -3
  21. package/{assets → es}/Appearance/default/themes/yellow/yellowDefaultCTATheme.module.css +0 -0
  22. package/{assets → es}/Appearance/default/themes/yellow/yellowDefaultComponentTheme.module.css +3 -3
  23. package/es/Avatar/Avatar.module.css +9 -11
  24. package/es/AvatarTeam/AvatarTeam.module.css +7 -21
  25. package/es/Button/Button.module.css +24 -97
  26. package/es/Buttongroup/Buttongroup.module.css +8 -37
  27. package/es/CheckBox/CheckBox.module.css +11 -17
  28. package/es/DateTime/DateTime.module.css +12 -39
  29. package/es/DateTime/DateWidget.module.css +5 -9
  30. package/es/DateTime/YearView.module.css +6 -16
  31. package/es/DropBox/DropBox.module.css +11 -47
  32. package/es/DropDown/DropDownHeading.module.css +3 -7
  33. package/es/DropDown/DropDownItem.module.css +6 -32
  34. package/es/ListItem/ListItem.module.css +25 -56
  35. package/es/MultiSelect/AdvancedMultiSelect.module.css +8 -22
  36. package/es/MultiSelect/MultiSelect.js +3 -4
  37. package/es/MultiSelect/MultiSelect.module.css +10 -27
  38. package/es/MultiSelect/SelectedOptions.module.css +2 -8
  39. package/es/PopOver/PopOver.module.css +1 -1
  40. package/es/Radio/Radio.module.css +4 -10
  41. package/es/Responsive/sizeObservers.js +1 -8
  42. package/es/Ribbon/Ribbon.module.css +28 -93
  43. package/es/RippleEffect/RippleEffect.module.css +44 -15
  44. package/es/Select/Select.js +3 -4
  45. package/es/Select/Select.module.css +2 -12
  46. package/es/Stencils/Stencils.module.css +3 -21
  47. package/es/Switch/Switch.module.css +7 -6
  48. package/es/Tab/Tab.module.css +7 -16
  49. package/es/Tab/Tabs.module.css +8 -41
  50. package/es/Tag/Tag.module.css +14 -36
  51. package/es/TextBox/TextBox.module.css +11 -7
  52. package/es/TextBoxIcon/TextBoxIcon.module.css +5 -12
  53. package/es/Textarea/Textarea.module.css +7 -6
  54. package/es/Tooltip/Tooltip.module.css +8 -9
  55. package/es/beta/FocusRing/FocusRing.module.css +26 -51
  56. package/es/common/animation.module.css +21 -219
  57. package/es/common/basicReset.module.css +12 -2
  58. package/es/common/common.module.css +18 -62
  59. package/es/common/customscroll.module.css +21 -17
  60. package/es/common/docStyle.module.css +31 -78
  61. package/es/common/transition.module.css +10 -50
  62. package/es/deprecated/Theme/darkTheme.module.css +393 -0
  63. package/es/deprecated/Theme/defaultTheme.module.css +393 -0
  64. package/es/deprecated/Theme/palette/darkCTAPalette.module.css +116 -0
  65. package/es/deprecated/Theme/palette/darkPalette.module.css +155 -0
  66. package/es/deprecated/Theme/palette/defaultCTAPalette.module.css +116 -0
  67. package/es/deprecated/Theme/palette/defaultPalette.module.css +155 -0
  68. package/es/deprecated/customscroll_Old.module.css +46 -0
  69. package/es/semantic/Button/semanticButton.module.css +3 -3
  70. package/package.json +1 -1
  71. package/assets/Appearance/dark/themes/blue/blueDarkCTATheme.module.css +0 -34
  72. package/assets/Appearance/dark/themes/blue/blueDarkComponentTheme.module.css +0 -42
  73. package/assets/Appearance/dark/themes/green/greenDarkComponentTheme.module.css +0 -42
  74. package/assets/Appearance/dark/themes/orange/orangeDarkComponentTheme.module.css +0 -42
  75. package/assets/Appearance/dark/themes/red/redDarkComponentTheme.module.css +0 -42
  76. package/assets/Appearance/dark/themes/yellow/yellowDarkComponentTheme.module.css +0 -42
  77. package/lib/Accordion/Accordion.js +0 -146
  78. package/lib/Accordion/AccordionItem.js +0 -124
  79. package/lib/Accordion/__tests__/Accordion.spec.js +0 -85
  80. package/lib/Accordion/index.js +0 -23
  81. package/lib/Animation/Animation.js +0 -206
  82. package/lib/Animation/__tests__/Animation.spec.js +0 -23
  83. package/lib/AppContainer/AppContainer.js +0 -205
  84. package/lib/AppContainer/AppContainer.module.css +0 -18
  85. package/lib/Avatar/Avatar.js +0 -280
  86. package/lib/Avatar/Avatar.module.css +0 -117
  87. package/lib/Avatar/__tests__/Avatar.spec.js +0 -208
  88. package/lib/Avatar/__tests__/__snapshots__/Avatar.spec.js.snap +0 -288
  89. package/lib/AvatarTeam/AvatarTeam.js +0 -157
  90. package/lib/AvatarTeam/AvatarTeam.module.css +0 -161
  91. package/lib/AvatarTeam/__tests__/AvatarTeam.spec.js +0 -92
  92. package/lib/AvatarTeam/__tests__/__snapshots__/AvatarTeam.spec.js.snap +0 -226
  93. package/lib/Button/Button.js +0 -158
  94. package/lib/Button/Button.module.css +0 -522
  95. package/lib/Button/__tests__/Button.spec.js +0 -233
  96. package/lib/Button/__tests__/__snapshots__/Button.spec.js.snap +0 -191
  97. package/lib/Buttongroup/Buttongroup.js +0 -101
  98. package/lib/Buttongroup/Buttongroup.module.css +0 -89
  99. package/lib/Buttongroup/__test__/Buttongroup.spec.js +0 -86
  100. package/lib/Buttongroup/__test__/__snapshots__/Buttongroup.spec.js.snap +0 -146
  101. package/lib/Card/Card.js +0 -409
  102. package/lib/Card/Card.module.css +0 -20
  103. package/lib/Card/__tests__/Card.spec.js +0 -56
  104. package/lib/Card/index.js +0 -37
  105. package/lib/CheckBox/CheckBox.js +0 -265
  106. package/lib/CheckBox/CheckBox.module.css +0 -153
  107. package/lib/CheckBox/__tests__/CheckBox.spec.js +0 -18
  108. package/lib/DateTime/CalendarView.js +0 -285
  109. package/lib/DateTime/DateTime.js +0 -889
  110. package/lib/DateTime/DateTime.module.css +0 -188
  111. package/lib/DateTime/DateTimePopupFooter.js +0 -90
  112. package/lib/DateTime/DateTimePopupHeader.js +0 -149
  113. package/lib/DateTime/DateWidget.js +0 -1189
  114. package/lib/DateTime/DateWidget.module.css +0 -42
  115. package/lib/DateTime/DaysRow.js +0 -76
  116. package/lib/DateTime/Time.js +0 -248
  117. package/lib/DateTime/YearView.js +0 -324
  118. package/lib/DateTime/YearView.module.css +0 -80
  119. package/lib/DateTime/__tests__/CalendarView.spec.js +0 -45
  120. package/lib/DateTime/__tests__/DateTime.spec.js +0 -127
  121. package/lib/DateTime/__tests__/DateWidget.spec.js +0 -81
  122. package/lib/DateTime/common.js +0 -36
  123. package/lib/DateTime/constants.js +0 -77
  124. package/lib/DateTime/dateFormatUtils/dateFormat.js +0 -613
  125. package/lib/DateTime/dateFormatUtils/dayChange.js +0 -81
  126. package/lib/DateTime/dateFormatUtils/index.js +0 -274
  127. package/lib/DateTime/dateFormatUtils/monthChange.js +0 -94
  128. package/lib/DateTime/dateFormatUtils/timeChange.js +0 -240
  129. package/lib/DateTime/dateFormatUtils/yearChange.js +0 -119
  130. package/lib/DateTime/index.js +0 -15
  131. package/lib/DateTime/objectUtils.js +0 -76
  132. package/lib/DateTime/typeChecker.js +0 -26
  133. package/lib/DateTime/validator.js +0 -353
  134. package/lib/DropBox/DropBox.js +0 -393
  135. package/lib/DropBox/DropBox.module.css +0 -406
  136. package/lib/DropBox/DropBoxPositionMapping.json +0 -145
  137. package/lib/DropBox/__tests__/DropBox.spec.js +0 -87
  138. package/lib/DropDown/DropDown.js +0 -203
  139. package/lib/DropDown/DropDown.module.css +0 -5
  140. package/lib/DropDown/DropDownHeading.js +0 -102
  141. package/lib/DropDown/DropDownHeading.module.css +0 -53
  142. package/lib/DropDown/DropDownItem.js +0 -139
  143. package/lib/DropDown/DropDownItem.module.css +0 -94
  144. package/lib/DropDown/DropDownSearch.js +0 -132
  145. package/lib/DropDown/DropDownSearch.module.css +0 -14
  146. package/lib/DropDown/DropDownSeparator.js +0 -66
  147. package/lib/DropDown/DropDownSeparator.module.css +0 -7
  148. package/lib/DropDown/__tests__/DropDown.spec.js +0 -50
  149. package/lib/DropDown/__tests__/DropDownItem.spec.js +0 -51
  150. package/lib/DropDown/__tests__/DropDownSearch.spec.js +0 -17
  151. package/lib/Label/Label.js +0 -109
  152. package/lib/Label/Label.module.css +0 -52
  153. package/lib/Label/LabelColors.module.css +0 -21
  154. package/lib/Label/__tests__/Label.spec.js +0 -137
  155. package/lib/Label/__tests__/__snapshots__/Label.spec.js.snap +0 -101
  156. package/lib/Layout/Box.js +0 -138
  157. package/lib/Layout/Container.js +0 -152
  158. package/lib/Layout/Layout.module.css +0 -324
  159. package/lib/Layout/__tests__/Box.spec.js +0 -121
  160. package/lib/Layout/__tests__/Container.spec.js +0 -127
  161. package/lib/Layout/index.js +0 -34
  162. package/lib/Layout/utils.js +0 -55
  163. package/lib/LightNightMode/Colors.json +0 -398
  164. package/lib/ListItem/ListContainer.js +0 -127
  165. package/lib/ListItem/ListItem.js +0 -227
  166. package/lib/ListItem/ListItem.module.css +0 -199
  167. package/lib/ListItem/ListItemWithAvatar.js +0 -237
  168. package/lib/ListItem/ListItemWithCheckBox.js +0 -205
  169. package/lib/ListItem/ListItemWithIcon.js +0 -229
  170. package/lib/ListItem/ListItemWithRadio.js +0 -208
  171. package/lib/Modal/Modal.js +0 -218
  172. package/lib/Modal/__docs__/Modal__default.docs.js +0 -88
  173. package/lib/MultiSelect/AdvancedGroupMultiSelect.js +0 -1218
  174. package/lib/MultiSelect/AdvancedMultiSelect.js +0 -696
  175. package/lib/MultiSelect/AdvancedMultiSelect.module.css +0 -127
  176. package/lib/MultiSelect/EmptyState.js +0 -132
  177. package/lib/MultiSelect/MultiSelect.js +0 -1235
  178. package/lib/MultiSelect/MultiSelect.module.css +0 -193
  179. package/lib/MultiSelect/MultiSelectHeader.js +0 -86
  180. package/lib/MultiSelect/MultiSelectWithAvatar.js +0 -410
  181. package/lib/MultiSelect/SelectedOptions.js +0 -140
  182. package/lib/MultiSelect/SelectedOptions.module.css +0 -15
  183. package/lib/MultiSelect/Suggestions.js +0 -219
  184. package/lib/MultiSelect/__tests__/MultiSelect.spec.js +0 -170
  185. package/lib/PopOver/PopOver.js +0 -365
  186. package/lib/PopOver/PopOver.module.css +0 -8
  187. package/lib/PopOver/__tests__/PopOver.spec.js +0 -20
  188. package/lib/Popup/Popup.js +0 -719
  189. package/lib/Popup/PositionMapping.json +0 -74
  190. package/lib/Popup/__tests__/Popup.spec.js +0 -192
  191. package/lib/Popup/viewPort.js +0 -368
  192. package/lib/Provider/AvatarSize.js +0 -23
  193. package/lib/Provider/Config.js +0 -25
  194. package/lib/Provider/CssProvider.js +0 -27
  195. package/lib/Provider/IdProvider.js +0 -82
  196. package/lib/Provider/LibraryContext.js +0 -76
  197. package/lib/Provider/LibraryContextInit.js +0 -15
  198. package/lib/Provider/NumberGenerator/NumberGenerator.js +0 -174
  199. package/lib/Provider/ZindexProvider.js +0 -69
  200. package/lib/Provider.js +0 -241
  201. package/lib/Radio/Radio.js +0 -214
  202. package/lib/Radio/Radio.module.css +0 -110
  203. package/lib/Radio/__tests__/Radiospec.js +0 -29
  204. package/lib/Responsive/CustomResponsive.js +0 -246
  205. package/lib/Responsive/RefWrapper.js +0 -55
  206. package/lib/Responsive/ResizeComponent.js +0 -268
  207. package/lib/Responsive/ResizeObserver.js +0 -168
  208. package/lib/Responsive/Responsive.js +0 -281
  209. package/lib/Responsive/index.js +0 -30
  210. package/lib/Responsive/sizeObservers.js +0 -214
  211. package/lib/Responsive/utils/index.js +0 -70
  212. package/lib/Responsive/utils/shallowCompare.js +0 -38
  213. package/lib/Responsive/windowResizeObserver.js +0 -63
  214. package/lib/Ribbon/Ribbon.js +0 -115
  215. package/lib/Ribbon/Ribbon.module.css +0 -377
  216. package/lib/Ribbon/__tests__/Ribbon.spec.js +0 -193
  217. package/lib/Ribbon/__tests__/__snapshots__/Ribbon.spec.js.snap +0 -163
  218. package/lib/RippleEffect/RippleEffect.js +0 -61
  219. package/lib/RippleEffect/RippleEffect.module.css +0 -70
  220. package/lib/Select/GroupSelect.js +0 -944
  221. package/lib/Select/Select.js +0 -1078
  222. package/lib/Select/Select.module.css +0 -100
  223. package/lib/Select/SelectWithAvatar.js +0 -433
  224. package/lib/Select/SelectWithIcon.js +0 -556
  225. package/lib/Select/__tests__/Select.spec.js +0 -383
  226. package/lib/Stencils/Stencils.js +0 -93
  227. package/lib/Stencils/Stencils.module.css +0 -96
  228. package/lib/Stencils/__tests__/Stencils.spec.js +0 -84
  229. package/lib/Stencils/__tests__/__snapshots__/Stencils.spec.js.snap +0 -49
  230. package/lib/Switch/Switch.js +0 -183
  231. package/lib/Switch/Switch.module.css +0 -110
  232. package/lib/Tab/Tab.js +0 -158
  233. package/lib/Tab/Tab.module.css +0 -101
  234. package/lib/Tab/TabContent.js +0 -45
  235. package/lib/Tab/TabContent.module.css +0 -4
  236. package/lib/Tab/TabContentWrapper.js +0 -47
  237. package/lib/Tab/TabWrapper.js +0 -109
  238. package/lib/Tab/Tabs.js +0 -696
  239. package/lib/Tab/Tabs.module.css +0 -140
  240. package/lib/Tab/__tests__/Tab.spec.js +0 -130
  241. package/lib/Tab/__tests__/TabContent.spec.js +0 -22
  242. package/lib/Tab/__tests__/TabContentWrapper.spec.js +0 -59
  243. package/lib/Tab/__tests__/TabWrapper.spec.js +0 -100
  244. package/lib/Tab/__tests__/Tabs.spec.js +0 -123
  245. package/lib/Tab/index.js +0 -47
  246. package/lib/Tag/Tag.js +0 -252
  247. package/lib/Tag/Tag.module.css +0 -251
  248. package/lib/Tag/__tests__/Tag.spec.js +0 -35
  249. package/lib/TextBox/TextBox.js +0 -289
  250. package/lib/TextBox/TextBox.module.css +0 -157
  251. package/lib/TextBox/__tests__/TextBox.spec.js +0 -205
  252. package/lib/TextBox/__tests__/__snapshots__/TextBox.spec.js.snap +0 -127
  253. package/lib/TextBoxIcon/TextBoxIcon.js +0 -284
  254. package/lib/TextBoxIcon/TextBoxIcon.module.css +0 -78
  255. package/lib/TextBoxIcon/__tests__/TextBoxIcon.spec.js +0 -228
  256. package/lib/TextBoxIcon/__tests__/__snapshots__/TextBoxIcon.spec.js.snap +0 -334
  257. package/lib/Textarea/Textarea.js +0 -202
  258. package/lib/Textarea/Textarea.module.css +0 -139
  259. package/lib/Textarea/__tests__/Textarea.spec.js +0 -186
  260. package/lib/Textarea/__tests__/__snapshots__/Textarea.spec.js.snap +0 -97
  261. package/lib/Tooltip/Tooltip.js +0 -538
  262. package/lib/Tooltip/Tooltip.module.css +0 -104
  263. package/lib/Tooltip/__tests__/Tooltip.spec.js +0 -98
  264. package/lib/VelocityAnimation/VelocityAnimation/VelocityAnimation.js +0 -146
  265. package/lib/VelocityAnimation/VelocityAnimationGroup/VelocityAnimationGroup.js +0 -190
  266. package/lib/a11y/FocusScope/FocusScope.js +0 -443
  267. package/lib/beta/FocusRing/FocusRing.js +0 -338
  268. package/lib/beta/FocusRing/FocusRing.module.css +0 -152
  269. package/lib/common/animation.module.css +0 -624
  270. package/lib/common/avatarsizes.module.css +0 -45
  271. package/lib/common/basic.module.css +0 -33
  272. package/lib/common/basicReset.module.css +0 -40
  273. package/lib/common/common.module.css +0 -502
  274. package/lib/common/customscroll.module.css +0 -89
  275. package/lib/common/docStyle.module.css +0 -762
  276. package/lib/common/reset.module.css +0 -12
  277. package/lib/common/transition.module.css +0 -146
  278. package/lib/css.js +0 -83
  279. package/lib/deprecated/PortalLayer/PortalLayer.js +0 -165
  280. package/lib/index.js +0 -1412
  281. package/lib/semantic/Button/Button.js +0 -138
  282. package/lib/semantic/Button/semanticButton.module.css +0 -9
  283. package/lib/utils/Common.js +0 -457
  284. package/lib/utils/ContextOptimizer.js +0 -49
  285. package/lib/utils/__tests__/constructFullName.spec.js +0 -12
  286. package/lib/utils/__tests__/debounce.spec.js +0 -40
  287. package/lib/utils/__tests__/getInitial.spec.js +0 -26
  288. package/lib/utils/constant.js +0 -10
  289. package/lib/utils/constructFullName.js +0 -34
  290. package/lib/utils/datetime/common.js +0 -233
  291. package/lib/utils/debounce.js +0 -30
  292. package/lib/utils/dropDownUtils.js +0 -608
  293. package/lib/utils/dummyFunction.js +0 -10
  294. package/lib/utils/getHTMLFontSize.js +0 -11
  295. package/lib/utils/getInitial.js +0 -33
  296. package/lib/utils/scrollTo.js +0 -22
  297. package/lib/utils/shallowEqual.js +0 -41
package/lib/Tag/Tag.js DELETED
@@ -1,252 +0,0 @@
1
- "use strict";
2
-
3
- function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports["default"] = void 0;
9
-
10
- var _react = _interopRequireWildcard(require("react"));
11
-
12
- var _propTypes = require("prop-types");
13
-
14
- var _Icon = _interopRequireDefault(require("@zohodesk/icons/lib/Icon"));
15
-
16
- var _Avatar = _interopRequireDefault(require("../Avatar/Avatar"));
17
-
18
- var _Layout = require("../Layout");
19
-
20
- var _Button = _interopRequireDefault(require("../semantic/Button/Button"));
21
-
22
- var _IdProvider = require("../Provider/IdProvider");
23
-
24
- var _TagModule = _interopRequireDefault(require("./Tag.module.css"));
25
-
26
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
27
-
28
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
29
-
30
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
31
-
32
- function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
33
-
34
- 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); } }
35
-
36
- function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
37
-
38
- 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); }
39
-
40
- function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
41
-
42
- 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); }; }
43
-
44
- function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
45
-
46
- function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
47
-
48
- function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
49
-
50
- function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
51
-
52
- /*
53
- * eslint css-modules/no-unused-class: [2, { markAsUsed: ['small', 'medium',
54
- * 'closedanger', 'closeprimary', 'default', 'danger', 'secondary',
55
- * 'pureDotted', 'primaryDotted'] }]
56
- */
57
-
58
- /*
59
- * eslint css-modules/no-unused-class: [2, { markAsUsed: ['small', 'medium',
60
- * 'closedanger', 'closeprimary', 'default', 'danger', 'secondary',
61
- * 'pureDotted', 'primaryDotted'] }]
62
- */
63
- var Tag = /*#__PURE__*/function (_PureComponent) {
64
- _inherits(Tag, _PureComponent);
65
-
66
- var _super = _createSuper(Tag);
67
-
68
- function Tag(props) {
69
- var _this;
70
-
71
- _classCallCheck(this, Tag);
72
-
73
- _this = _super.call(this, props);
74
- _this.handleSelect = _this.handleSelect.bind(_assertThisInitialized(_this));
75
- _this.handleRemove = _this.handleRemove.bind(_assertThisInitialized(_this));
76
- _this.getRef = _this.getRef.bind(_assertThisInitialized(_this));
77
- _this.getNextAriaId = (0, _IdProvider.getUniqueId)(_assertThisInitialized(_this));
78
- return _this;
79
- }
80
-
81
- _createClass(Tag, [{
82
- key: "handleSelect",
83
- value: function handleSelect(e) {
84
- var _this$props = this.props,
85
- id = _this$props.id,
86
- _this$props$onSelectT = _this$props.onSelectTag,
87
- onSelectTag = _this$props$onSelectT === void 0 ? null : _this$props$onSelectT;
88
- e && e.preventDefault();
89
- e.stopPropagation && e.stopPropagation();
90
- e.nativeEvent.stopImmediatePropagation && e.nativeEvent.stopImmediatePropagation();
91
- onSelectTag && onSelectTag(id, e);
92
- }
93
- }, {
94
- key: "handleRemove",
95
- value: function handleRemove(e) {
96
- var _this$props2 = this.props,
97
- onRemove = _this$props2.onRemove,
98
- id = _this$props2.id;
99
- e && e.preventDefault();
100
- e.stopPropagation && e.stopPropagation();
101
- e.nativeEvent.stopImmediatePropagation && e.nativeEvent.stopImmediatePropagation();
102
- onRemove && onRemove(id);
103
- }
104
- }, {
105
- key: "getRef",
106
- value: function getRef(el) {
107
- var _this$props3 = this.props,
108
- getRef = _this$props3.getRef,
109
- id = _this$props3.id;
110
- getRef && getRef(el, id);
111
- }
112
- }, {
113
- key: "render",
114
- value: function render() {
115
- var _this$props4 = this.props,
116
- imageURL = _this$props4.imageURL,
117
- hasAvatar = _this$props4.hasAvatar,
118
- text = _this$props4.text,
119
- onRemove = _this$props4.onRemove,
120
- initial = _this$props4.initial,
121
- active = _this$props4.active,
122
- size = _this$props4.size,
123
- rounded = _this$props4.rounded,
124
- palette = _this$props4.palette,
125
- disabled = _this$props4.disabled,
126
- closePalette = _this$props4.closePalette,
127
- onSelectTag = _this$props4.onSelectTag,
128
- closeTitle = _this$props4.closeTitle,
129
- dataId = _this$props4.dataId,
130
- iconName = _this$props4.iconName,
131
- iconSize = _this$props4.iconSize,
132
- tooltip = _this$props4.tooltip,
133
- avatarPalette = _this$props4.avatarPalette,
134
- customClass = _this$props4.customClass,
135
- a11y = _this$props4.a11y,
136
- needEffect = _this$props4.needEffect,
137
- isReadOnly = _this$props4.isReadOnly;
138
- var _customClass$customTa = customClass.customTag,
139
- customTag = _customClass$customTa === void 0 ? '' : _customClass$customTa,
140
- _customClass$customTa2 = customClass.customTagClose,
141
- customTagClose = _customClass$customTa2 === void 0 ? '' : _customClass$customTa2,
142
- _customClass$customTa3 = customClass.customTagIcon,
143
- customTagIcon = _customClass$customTa3 === void 0 ? '' : _customClass$customTa3,
144
- _customClass$customAv = customClass.customAvatar,
145
- customAvatar = _customClass$customAv === void 0 ? '' : _customClass$customAv;
146
- var textSizes = size === 'small' ? _TagModule["default"].smalltext : _TagModule["default"].mediumtext;
147
- var getAriaId = this.getNextAriaId();
148
- var _a11y$clearLabel = a11y.clearLabel,
149
- clearLabel = _a11y$clearLabel === void 0 ? 'Delete' : _a11y$clearLabel;
150
- var isDarkPalette = palette === 'dark';
151
- return /*#__PURE__*/_react["default"].createElement("div", {
152
- className: "".concat(_TagModule["default"].container, " ").concat(needEffect && !isReadOnly ? _TagModule["default"].effect : _TagModule["default"].readonly, " ").concat(active ? "".concat(_TagModule["default"].selected, " ").concat(_TagModule["default"]["active".concat(palette)]) : '', " ").concat(onRemove ? active ? "".concat(_TagModule["default"]["active".concat(size, "Effect")]) : '' : '', " ").concat(_TagModule["default"][size], " ").concat(rounded ? _TagModule["default"].lgRadius : _TagModule["default"].smRadius, " ").concat(_TagModule["default"][palette], " ").concat(disabled ? _TagModule["default"].disabled : '', " ").concat(onSelectTag ? _TagModule["default"].pointer : '', " ").concat(customTag),
153
- "data-id": active ? "".concat(dataId, "_TagSelected") : "".concat(dataId, "_Tag"),
154
- onClick: this.handleSelect,
155
- ref: this.getRef,
156
- "data-title": tooltip ? tooltip : text,
157
- tabIndex: disabled ? '-1' : '0',
158
- "aria-labelledby": getAriaId
159
- }, hasAvatar ? /*#__PURE__*/_react["default"].createElement("div", {
160
- className: _TagModule["default"].avatar
161
- }, /*#__PURE__*/_react["default"].createElement(_Avatar["default"], {
162
- palette: isDarkPalette ? 'info' : avatarPalette,
163
- name: initial,
164
- size: "small",
165
- src: imageURL,
166
- textPalette: isDarkPalette ? 'white' : '',
167
- customClass: customAvatar
168
- })) : null, iconName ? /*#__PURE__*/_react["default"].createElement("div", {
169
- className: "".concat(_TagModule["default"].icon, " ").concat(customTagIcon),
170
- "aria-hidden": true
171
- }, /*#__PURE__*/_react["default"].createElement(_Icon["default"], {
172
- name: iconName,
173
- size: iconSize
174
- })) : null, /*#__PURE__*/_react["default"].createElement("div", {
175
- className: "".concat(_TagModule["default"].text, " ").concat(textSizes),
176
- "aria-hidden": true,
177
- id: getAriaId
178
- }, text), onRemove && /*#__PURE__*/_react["default"].createElement(_Button["default"], {
179
- customClass: "".concat(_TagModule["default"].close, " ").concat(active ? _TagModule["default"]["active".concat(closePalette, "Close")] : '', "\n ").concat(rounded ? _TagModule["default"].lgRadiusClose : _TagModule["default"].smRadiusClose, " ").concat(isDarkPalette ? _TagModule["default"].darkTagClose : '', "\n ").concat(customTagClose, " ").concat(_TagModule["default"]["close".concat(closePalette)]),
180
- dataId: "".concat(dataId, "_RemoveTag"),
181
- "data-title": closeTitle,
182
- onClick: this.handleRemove,
183
- a11y: {
184
- ariaLabel: clearLabel
185
- }
186
- }, /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
187
- align: "both"
188
- }, /*#__PURE__*/_react["default"].createElement(_Icon["default"], {
189
- isBold: true,
190
- name: "ZD-close2",
191
- size: "8"
192
- }))));
193
- }
194
- }]);
195
-
196
- return Tag;
197
- }(_react.PureComponent);
198
-
199
- exports["default"] = Tag;
200
- Tag.defaultProps = {
201
- active: false,
202
- closePalette: 'danger',
203
- hasAvatar: false,
204
- palette: 'default',
205
- rounded: true,
206
- size: 'medium',
207
- dataId: 'tag',
208
- customClass: {},
209
- a11y: {},
210
- needEffect: true,
211
- isReadOnly: false
212
- };
213
- Tag.propTypes = {
214
- active: _propTypes.PropTypes.bool,
215
- avatarPalette: _propTypes.PropTypes.string,
216
- closePalette: _propTypes.PropTypes.oneOf(['danger', 'primary']),
217
- closeTitle: _propTypes.PropTypes.string,
218
- dataId: _propTypes.PropTypes.string,
219
- disabled: _propTypes.PropTypes.bool,
220
- getRef: _propTypes.PropTypes.func,
221
- hasAvatar: _propTypes.PropTypes.bool,
222
- iconName: _propTypes.PropTypes.string,
223
- iconSize: _propTypes.PropTypes.string,
224
- id: _propTypes.PropTypes.oneOfType([_propTypes.PropTypes.string, _propTypes.PropTypes.number]),
225
- imageURL: _propTypes.PropTypes.string,
226
- initial: _propTypes.PropTypes.string,
227
- onRemove: _propTypes.PropTypes.func,
228
- onSelectTag: _propTypes.PropTypes.func,
229
- palette: _propTypes.PropTypes.oneOf(['default', 'danger', 'secondary', 'pureDotted', 'primaryDotted', 'dark', 'pureDarkDotted', 'darkPrimaryDotted']),
230
- rounded: _propTypes.PropTypes.bool,
231
- size: _propTypes.PropTypes.oneOf(['small', 'medium']),
232
- text: _propTypes.PropTypes.oneOfType([_propTypes.PropTypes.string, _propTypes.PropTypes.number]),
233
- tooltip: _propTypes.PropTypes.string,
234
- customClass: _propTypes.PropTypes.shape({
235
- customTag: _propTypes.PropTypes.string,
236
- customTagClose: _propTypes.PropTypes.string,
237
- customTagIcon: _propTypes.PropTypes.string,
238
- customAvatar: _propTypes.PropTypes.string
239
- }),
240
- a11y: _propTypes.PropTypes.shape({
241
- clearLabel: _propTypes.PropTypes.string
242
- }),
243
- needEffect: _propTypes.PropTypes.bool,
244
- isReadOnly: _propTypes.PropTypes.bool
245
- };
246
-
247
- if (false) {
248
- Tag.docs = {
249
- componentGroup: 'Molecule',
250
- folderName: 'Style Guide'
251
- };
252
- }
@@ -1,251 +0,0 @@
1
- .varClass {
2
- /* tag default variables */
3
- --tag_text_color: var(--zdt_tag_default_text);
4
- --tag_font_size: var(--zd_font_size13);
5
- --tag_letter_spacing: normal;
6
- --tag_bg_color: var(--zdt_tag_default_bg);
7
- --tag_border_radius: 25px;
8
- --tag_height: auto;
9
- --tag_border_width: 0;
10
- --tag_border_style: dashed;
11
- --tag_border_color: var(--zdt_tag_default_border);
12
- --tag_padding: var(--zd_size2);
13
- --tag_inner_text_padding: 0 var(--zd_size6);
14
- --tag_cursor: auto;
15
-
16
- /* tag close icon default variables */
17
- --tag_closeicon_color: var(--zdt_tag_secondary_text);
18
- --tag_closeicon_cursor: pointer;
19
- --tag_closeicon_bg_color: var(--zdt_tag_closedanger_bg);
20
-
21
- /* tag normal icon default variables */
22
- --tag_icon_bg_color: var(--zdt_tag_icon_bg);
23
- }[dir=ltr] .varClass {
24
- --tag_closeicon_border_radius: 0 12px 12px 0 /*rtl: 12px 0 0 12px*/;
25
- --tag_closeicon_padding: 0 var(--zd_size7) 0 var(--zd_size6)
26
- /*rtl: 0 var(--zd_size6) 0 var(--zd_size7)*/;
27
- --tag_icon_margin: 0 0 0 var(--zd_size5) /*rtl: 0 var(--zd_size5) 0 0*/;
28
- }[dir=rtl] .varClass {
29
- --tag_closeicon_border_radius: 12px 0 0 12px;
30
- --tag_closeicon_padding: 0 var(--zd_size6) 0 var(--zd_size7);
31
- --tag_icon_margin: 0 var(--zd_size5) 0 0;
32
- }
33
- .container {
34
- composes: varClass;
35
- composes: dInflex alignVertical flexrow from '../common/common.module.css';
36
- position: relative;
37
- vertical-align: middle;
38
- color: var(--tag_text_color);
39
- font-size: var(--tag_font_size);
40
- letter-spacing: var(--tag_letter_spacing);
41
- height: var(--tag_height);
42
- max-width: 100%;
43
- background-color: var(--tag_bg_color);
44
- border-radius: var(--tag_border_radius);
45
- border-width: var(--tag_border_width);
46
- border-style: var(--tag_border_style);
47
- border-color: var(--tag_border_color);
48
- padding: var(--tag_padding);
49
- cursor: var(--tag_cursor);
50
- }
51
- .disabled {
52
- pointer-events: none;
53
- --tag_text_color: var(--zdt_tag_disabled_text);
54
- }
55
- .readonly,
56
- .disabled {
57
- --tag_cursor: not-allowed;
58
- }
59
- .pointer {
60
- --tag_cursor: pointer;
61
- }
62
- .lgRadius {
63
- --tag_border_radius: 25px;
64
- }
65
- .smRadius {
66
- --tag_border_radius: 3px;
67
- }
68
- .text {
69
- composes: dotted flexgrow from '../common/common.module.css';
70
- }
71
- .smalltext,
72
- .mediumtext {
73
- font-size: var(--tag_font_size);
74
- }
75
- .smalltext, .mediumtext {
76
- padding: var(--tag_inner_text_padding);
77
- }
78
- .small {
79
- --tag_height: var(--zd_size20);
80
- --tag_padding: var(--zd_size1);
81
- --tag_inner_text_padding: 0 var(--zd_size7);
82
- }
83
- [dir=ltr] .small .avatar {
84
- transform: scale(0.8) translateX(-2px);
85
- margin-right: calc(var(--zd_size8) * -1);
86
- }
87
- [dir=rtl] .small .avatar {
88
- transform: scale(0.8) translateX(2px);
89
- margin-left: calc(var(--zd_size8) * -1);
90
- }
91
- .smalltext {
92
- --tag_font_size: var(--zd_font_size12);
93
- }
94
- .activesmallEffect {
95
- --tag_inner_text_padding: 0 var(--zd_size25) 0 var(--zd_size7);
96
- }
97
-
98
- .medium {
99
- --tag_height: var(--zd_size26);
100
- --tag_padding: var(--zd_size2);
101
- --tag_inner_text_padding: 0 var(--zd_size6);
102
- }
103
- .mediumtext {
104
- --tag_font_size: var(--zd_font_size13);
105
- }
106
- .activemediumEffect {
107
- --tag_inner_text_padding: 0 var(--zd_size25) 0 var(--zd_size6);
108
- }
109
-
110
- .selected .close {
111
- display: block;
112
- }
113
- .activedanger,
114
- .closedanger:hover {
115
- --tag_closeicon_bg_color: var(--zdt_tag_danger_bg);
116
- }
117
- .activeprimary,
118
- .closeprimary:hover {
119
- --tag_closeicon_bg_color: var(--zdt_tag_primary_hover_bg);
120
- }
121
-
122
- .container:hover .close {
123
- display: block;
124
- }
125
- .close {
126
- color: var(--tag_closeicon_color);
127
- display: none;
128
- position: absolute;
129
- top: 0;
130
- bottom: 0;
131
- padding: var(--tag_closeicon_padding);
132
- cursor: var(--tag_closeicon_cursor);
133
- border-radius: var(--tag_closeicon_border_radius);
134
- background: var(--tag_closeicon_bg_color);
135
- }
136
- [dir=ltr] .close {
137
- right: 0;
138
- }
139
- [dir=rtl] .close {
140
- left: 0;
141
- }
142
- [dir=ltr] .lgRadiusClose {
143
- --tag_closeicon_border_radius: 0 12px 12px 0 /*rtl: 12px 0 0 12px*/;
144
- }
145
- [dir=rtl] .lgRadiusClose {
146
- --tag_closeicon_border_radius: 12px 0 0 12px;
147
- }
148
- [dir=ltr] .smRadiusClose {
149
- --tag_closeicon_border_radius: 0 3px 3px 0 /*rtl: 3px 0 0 3px*/;
150
- }
151
- [dir=rtl] .smRadiusClose {
152
- --tag_closeicon_border_radius: 3px 0 0 3px;
153
- }
154
- .closedanger {
155
- --tag_closeicon_bg_color: var(--zdt_tag_closedanger_bg);
156
- }
157
- .closeprimary {
158
- --tag_closeicon_bg_color: var(--zdt_tag_closeprimary_bg);
159
- }
160
- .default,
161
- .danger {
162
- --tag_bg_color: var(--zdt_tag_default_danger_bg);
163
- }
164
- .effect.default:hover {
165
- --tag_bg_color: var(--zdt_tag_default_hover_bg);
166
- }
167
- .activedefault,
168
- .effect.activedefault:hover {
169
- --tag_bg_color: var(--zdt_tag_active_default_bg);
170
- }
171
- .activeprimaryClose,
172
- .activeprimaryClose:hover {
173
- --tag_closeicon_bg_color: var(--zdt_tag_primary_bg);
174
- }
175
-
176
- .effect.danger:hover {
177
- --tag_bg_color: var(--zdt_tag_danger_hover_bg);
178
- }
179
- .activedanger,
180
- .effect.activedanger:hover {
181
- --tag_bg_color: var(--zdt_tag_danger_hover_bg);
182
- }
183
- .activedangerClose,
184
- .activedangerClose:hover {
185
- --tag_closeicon_bg_color: var(--zdt_tag_danger_bg);
186
- }
187
-
188
- .secondary {
189
- --tag_bg_color: var(--zdt_tag_secondary_bg);
190
- --tag_text_color: var(--zdt_tag_secondary_text);
191
- }
192
- .activesecondary,
193
- .effect.secondary:hover {
194
- --tag_bg_color: var(--zdt_tag_secondary_hover_bg);
195
- }
196
-
197
- .pureDotted {
198
- --tag_bg_color: var(--zdt_tag_pure_bg);
199
- --tag_border_width: 1px;
200
- --tag_border_color: var(--zdt_tag_pure_border);
201
- }
202
- .effect.pureDotted:hover {
203
- --tag_bg_color: var(--zdt_tag_pure_hover_bg);
204
- --tag_border_color: var(--zdt_tag_pure_hover_border);
205
- }
206
- .activepureDotted,
207
- .effect.activepureDotted:hover {
208
- --tag_bg_color: var(--zdt_tag_pure_bg);
209
- }
210
-
211
- .primaryDotted {
212
- --tag_bg_color: var(--zdt_tag_active_default_bg);
213
- --tag_border_width: 1px;
214
- --tag_border_color: var(--zdt_tag_primary_border);
215
- }
216
- .effect.primaryDotted:hover,
217
- .activeprimaryDotted,
218
- .primary,
219
- .effect.primary:hover {
220
- --tag_bg_color: var(--zdt_tag_active_default_bg);
221
- }
222
-
223
- .icon {
224
- margin: var(--tag_icon_margin);
225
- background-color: var(--tag_icon_bg_color);
226
- }
227
- .icon > i {
228
- display: block;
229
- }
230
- .dark {
231
- --tag_bg_color: var(--zdt_tag_dark_bg);
232
- --tag_text_color: var(--zdt_tag_dark_text);
233
- }
234
- .effect.dark:hover {
235
- --tag_bg_color: var(--zdt_tag_dark_hover_bg);
236
- --tag_text_color: var(--zdt_tag_dark_hover_text);
237
- }
238
- .darkTagClose {
239
- --tag_closeicon_bg_color: var(--zdt_tag_dark_close_bg);
240
- --tag_closeicon_color: var(--zdt_tag_dark_close_text);
241
- }
242
- .darkTagClose:hover {
243
- --tag_closeicon_bg_color: var(--zdt_tag_dark_close_hover_bg);
244
- --tag_closeicon_color: var(--zdt_tag_secondary_text);
245
- }
246
- .pureDarkDotted {
247
- composes: dark pureDotted;
248
- }
249
- .darkPrimaryDotted {
250
- composes: dark primaryDotted;
251
- }
@@ -1,35 +0,0 @@
1
- "use strict";
2
-
3
- var _react = _interopRequireDefault(require("react"));
4
-
5
- var _reactTestRenderer = _interopRequireDefault(require("react-test-renderer"));
6
-
7
- var _Tag = _interopRequireDefault(require("../Tag"));
8
-
9
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
10
-
11
- var defaultProps = {};
12
- describe('Tag component conditions', function () {
13
- it('Select Tag', function () {
14
- var _setup = setup(_Tag["default"], Object.assign({}, defaultProps, {
15
- onSelectTag: jest.fn()
16
- })),
17
- props = _setup.props,
18
- renderedDOM = _setup.renderedDOM;
19
-
20
- var component = TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'tag_Tag');
21
- TestUtils.Simulate.click(component);
22
- expect(props.onSelectTag).toHaveBeenCalled();
23
- });
24
- it('Remove Tag', function () {
25
- var _setup2 = setup(_Tag["default"], Object.assign({}, defaultProps, {
26
- onRemove: jest.fn()
27
- })),
28
- props = _setup2.props,
29
- renderedDOM = _setup2.renderedDOM;
30
-
31
- var component = TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'tag_RemoveTag');
32
- TestUtils.Simulate.click(component);
33
- expect(props.onRemove).toHaveBeenCalled();
34
- });
35
- });