@zohodesk/components 1.0.0-temp-201 → 1.0.0-temp-202

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 (122) hide show
  1. package/.cli/PropUnificationExcludeFilesArray.js +230 -230
  2. package/.cli/PropValidationExcludeFilesArray.js +1 -1
  3. package/.cli/propValidation_report.html +1 -1
  4. package/css_error.log +1 -1
  5. package/es/AppContainer/AppContainer.module.css +18 -18
  6. package/es/Avatar/__tests__/__snapshots__/Avatar.spec.js.snap +591 -591
  7. package/es/AvatarTeam/AvatarTeam.js +7 -7
  8. package/es/AvatarTeam/__tests__/__snapshots__/AvatarTeam.spec.js.snap +705 -705
  9. package/es/Button/Button.js +4 -4
  10. package/es/Buttongroup/Buttongroup.js +1 -1
  11. package/es/Buttongroup/__tests__/__snapshots__/Buttongroup.spec.js.snap +191 -191
  12. package/es/Card/Card.js +4 -4
  13. package/es/Card/Card.module.css +20 -20
  14. package/es/DateTime/DateWidget.module.css +38 -38
  15. package/es/DateTime/__tests__/__snapshots__/DateTime.spec.js.snap +1 -1
  16. package/es/DropBox/DropBoxPositionMapping.json +144 -144
  17. package/es/DropDown/DropDown.module.css +5 -5
  18. package/es/DropDown/DropDownSearch.module.css +14 -14
  19. package/es/DropDown/DropDownSeparator.module.css +7 -7
  20. package/es/Heading/Heading.js +1 -3
  21. package/es/Heading/Heading.module.css +4 -4
  22. package/es/Heading/props/defaultProps.js +1 -2
  23. package/es/Heading/props/propTypes.js +1 -2
  24. package/es/Label/Label.js +2 -2
  25. package/es/Label/__tests__/__snapshots__/Label.spec.js.snap +312 -312
  26. package/es/Layout/Layout.module.css +335 -335
  27. package/es/MultiSelect/SelectedOptions.module.css +15 -15
  28. package/es/Popup/PositionMapping.json +73 -73
  29. package/es/ResponsiveDropBox/ResponsiveDropBox.module.css +6 -6
  30. package/es/Ribbon/__tests__/__snapshots__/Ribbon.spec.js.snap +374 -374
  31. package/es/RippleEffect/RippleEffect.module.css +92 -92
  32. package/es/Select/Select.module.css +134 -134
  33. package/es/Stencils/Stencils.module.css +96 -96
  34. package/es/Stencils/__tests__/__snapshots__/Stencils.spec.js.snap +89 -89
  35. package/es/Switch/__tests__/__snapshots__/Switch.spec.js.snap +831 -831
  36. package/es/Tab/TabContent.module.css +4 -4
  37. package/es/Tab/Tabs.js +17 -17
  38. package/es/Tag/Tag.js +8 -8
  39. package/es/Tooltip/Tooltip.js +47 -2
  40. package/es/Tooltip/Tooltip.module.css +140 -140
  41. package/es/common/a11y.module.css +3 -3
  42. package/es/common/animation.module.css +624 -624
  43. package/es/common/avatarsizes.module.css +48 -48
  44. package/es/common/basic.module.css +33 -33
  45. package/es/common/basicReset.module.css +40 -40
  46. package/es/common/boxShadow.module.css +33 -33
  47. package/es/common/common.module.css +524 -524
  48. package/es/common/reset.module.css +13 -13
  49. package/es/common/transition.module.css +146 -146
  50. package/es/semantic/Button/semanticButton.module.css +9 -9
  51. package/es/v1/Avatar/Avatar.js +5 -5
  52. package/es/v1/AvatarTeam/AvatarTeam.js +4 -4
  53. package/es/v1/Button/Button.js +4 -4
  54. package/es/v1/Heading/Heading.js +1 -3
  55. package/es/v1/Heading/props/defaultProps.js +1 -2
  56. package/es/v1/Heading/props/propTypes.js +1 -2
  57. package/es/v1/MultiSelect/MultiSelect.js +5 -5
  58. package/es/v1/Tab/v1TabContent.module.css +4 -4
  59. package/es/v1/Tag/Tag.js +8 -8
  60. package/es/v1/Typography/css/Typography.module.css +380 -380
  61. package/install.md +10 -10
  62. package/lib/AppContainer/AppContainer.module.css +18 -18
  63. package/lib/Avatar/__tests__/__snapshots__/Avatar.spec.js.snap +591 -591
  64. package/lib/AvatarTeam/AvatarTeam.js +7 -7
  65. package/lib/AvatarTeam/__tests__/__snapshots__/AvatarTeam.spec.js.snap +705 -705
  66. package/lib/Button/Button.js +4 -4
  67. package/lib/Buttongroup/Buttongroup.js +1 -1
  68. package/lib/Buttongroup/__tests__/__snapshots__/Buttongroup.spec.js.snap +191 -191
  69. package/lib/Card/Card.js +4 -4
  70. package/lib/Card/Card.module.css +20 -20
  71. package/lib/DateTime/DateWidget.module.css +38 -38
  72. package/lib/DateTime/__tests__/__snapshots__/DateTime.spec.js.snap +1 -1
  73. package/lib/DropBox/DropBoxPositionMapping.json +144 -144
  74. package/lib/DropDown/DropDown.module.css +5 -5
  75. package/lib/DropDown/DropDownSearch.module.css +14 -14
  76. package/lib/DropDown/DropDownSeparator.module.css +7 -7
  77. package/lib/Heading/Heading.js +3 -4
  78. package/lib/Heading/Heading.module.css +4 -4
  79. package/lib/Heading/props/defaultProps.js +1 -2
  80. package/lib/Heading/props/propTypes.js +1 -2
  81. package/lib/Label/__tests__/__snapshots__/Label.spec.js.snap +312 -312
  82. package/lib/Layout/Layout.module.css +335 -335
  83. package/lib/MultiSelect/SelectedOptions.module.css +15 -15
  84. package/lib/Popup/PositionMapping.json +73 -73
  85. package/lib/ResponsiveDropBox/ResponsiveDropBox.module.css +6 -6
  86. package/lib/Ribbon/__tests__/__snapshots__/Ribbon.spec.js.snap +374 -374
  87. package/lib/RippleEffect/RippleEffect.module.css +92 -92
  88. package/lib/Select/Select.module.css +134 -134
  89. package/lib/Stencils/Stencils.module.css +96 -96
  90. package/lib/Stencils/__tests__/__snapshots__/Stencils.spec.js.snap +89 -89
  91. package/lib/Switch/__tests__/__snapshots__/Switch.spec.js.snap +831 -831
  92. package/lib/Tab/TabContent.module.css +4 -4
  93. package/lib/Tab/Tabs.js +11 -11
  94. package/lib/Tag/Tag.js +8 -8
  95. package/lib/Tooltip/Tooltip.js +61 -16
  96. package/lib/Tooltip/Tooltip.module.css +140 -140
  97. package/lib/common/a11y.module.css +3 -3
  98. package/lib/common/animation.module.css +624 -624
  99. package/lib/common/avatarsizes.module.css +48 -48
  100. package/lib/common/basic.module.css +33 -33
  101. package/lib/common/basicReset.module.css +40 -40
  102. package/lib/common/boxShadow.module.css +33 -33
  103. package/lib/common/common.module.css +524 -524
  104. package/lib/common/reset.module.css +13 -13
  105. package/lib/common/transition.module.css +146 -146
  106. package/lib/semantic/Button/semanticButton.module.css +9 -9
  107. package/lib/v1/Avatar/Avatar.js +5 -5
  108. package/lib/v1/AvatarTeam/AvatarTeam.js +4 -4
  109. package/lib/v1/Button/Button.js +4 -4
  110. package/lib/v1/Heading/Heading.js +3 -4
  111. package/lib/v1/Heading/props/defaultProps.js +1 -2
  112. package/lib/v1/Heading/props/propTypes.js +1 -2
  113. package/lib/v1/MultiSelect/MultiSelect.js +5 -5
  114. package/lib/v1/Tab/v1TabContent.module.css +4 -4
  115. package/lib/v1/Tag/Tag.js +8 -8
  116. package/lib/v1/Typography/css/Typography.module.css +380 -380
  117. package/package.json +1 -1
  118. package/postPublish.js +8 -8
  119. package/prePublish.js +70 -70
  120. package/propValidationArg.json +11 -11
  121. package/react-cli.config.js +23 -23
  122. package/result.json +1 -1
@@ -4,10 +4,10 @@ import { propTypes } from './props/propTypes';
4
4
  import cssJSLogic from './css/cssJSLogic';
5
5
  import { mergeStyle } from '@zohodesk/utils';
6
6
  import style from './css/Button.module.css';
7
- /*
8
- Button text and children props?
9
- use children for both cases
10
- toLowerCase check needed?
7
+ /*
8
+ Button text and children props?
9
+ use children for both cases
10
+ toLowerCase check needed?
11
11
  */
12
12
 
13
13
  /* eslint css-modules/no-unused-class: [2, { markAsUsed: ['small','medium','large','xlarge','button_medium','button_small','primary','primaryfilled','danger','dangerfilled','plainprimary', 'plainsecondary', 'secondary', 'secondaryfilled', 'successFilled','tertiaryFilled'] }] */
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import { defaultProps } from './props/defaultProps';
3
3
  import { propTypes } from './props/propTypes';
4
4
  import style from './Buttongroup.module.css';
5
- /* eslint css-modules/no-unused-class: [2, { markAsUsed: ['footer','header',
5
+ /* eslint css-modules/no-unused-class: [2, { markAsUsed: ['footer','header',
6
6
  'tab','alignleft','alignright','aligncenter' ] }] */
7
7
 
8
8
  export default class Buttongroup extends React.Component {
@@ -1,191 +1,191 @@
1
- // Jest Snapshot v1, https://goo.gl/fbAQLP
2
-
3
- exports[`Buttongrop - Checking the "customclass" 1`] = `
4
- <DocumentFragment>
5
- <div
6
- class="buttonGroup undefined customClassButtonGroup"
7
- data-id="ButtonGroup"
8
- data-selector-id="buttonGroup"
9
- data-test-id="ButtonGroup"
10
- >
11
- <div
12
- class="alignleft"
13
- >
14
- <span>
15
- Element 1
16
- </span>
17
- <span>
18
- Element 2
19
- </span>
20
- <span>
21
- Element 3
22
- </span>
23
- </div>
24
- </div>
25
- </DocumentFragment>
26
- `;
27
-
28
- exports[`Buttongrop - rendering the "buttonPosition" to - center 1`] = `
29
- <DocumentFragment>
30
- <div
31
- class="buttonGroup undefined "
32
- data-id="ButtonGroup"
33
- data-selector-id="buttonGroup"
34
- data-test-id="ButtonGroup"
35
- >
36
- <div
37
- class="aligncenter"
38
- >
39
- <span>
40
- Element 1
41
- </span>
42
- <span>
43
- Element 2
44
- </span>
45
- <span>
46
- Element 3
47
- </span>
48
- </div>
49
- </div>
50
- </DocumentFragment>
51
- `;
52
-
53
- exports[`Buttongrop - rendering the "buttonPosition" to - left 1`] = `
54
- <DocumentFragment>
55
- <div
56
- class="buttonGroup undefined "
57
- data-id="ButtonGroup"
58
- data-selector-id="buttonGroup"
59
- data-test-id="ButtonGroup"
60
- >
61
- <div
62
- class="alignleft"
63
- >
64
- <span>
65
- Element 1
66
- </span>
67
- <span>
68
- Element 2
69
- </span>
70
- <span>
71
- Element 3
72
- </span>
73
- </div>
74
- </div>
75
- </DocumentFragment>
76
- `;
77
-
78
- exports[`Buttongrop - rendering the "buttonPosition" to - right 1`] = `
79
- <DocumentFragment>
80
- <div
81
- class="buttonGroup undefined "
82
- data-id="ButtonGroup"
83
- data-selector-id="buttonGroup"
84
- data-test-id="ButtonGroup"
85
- >
86
- <div
87
- class="alignright"
88
- >
89
- <span>
90
- Element 1
91
- </span>
92
- <span>
93
- Element 2
94
- </span>
95
- <span>
96
- Element 3
97
- </span>
98
- </div>
99
- </div>
100
- </DocumentFragment>
101
- `;
102
-
103
- exports[`Buttongrop - rendering the "type" - footer 1`] = `
104
- <DocumentFragment>
105
- <div
106
- class="buttonGroup footer "
107
- data-id="ButtonGroup"
108
- data-selector-id="buttonGroup"
109
- data-test-id="ButtonGroup"
110
- >
111
- <div
112
- class="alignleft"
113
- >
114
- <span>
115
- Element 1
116
- </span>
117
- <span>
118
- Element 2
119
- </span>
120
- <span>
121
- Element 3
122
- </span>
123
- </div>
124
- </div>
125
- </DocumentFragment>
126
- `;
127
-
128
- exports[`Buttongrop - rendering the "type" - header 1`] = `
129
- <DocumentFragment>
130
- <div
131
- class="buttonGroup header "
132
- data-id="ButtonGroup"
133
- data-selector-id="buttonGroup"
134
- data-test-id="ButtonGroup"
135
- >
136
- <div
137
- class="alignleft"
138
- >
139
- <span>
140
- Element 1
141
- </span>
142
- <span>
143
- Element 2
144
- </span>
145
- <span>
146
- Element 3
147
- </span>
148
- </div>
149
- </div>
150
- </DocumentFragment>
151
- `;
152
-
153
- exports[`Buttongrop - rendering the "type" - tab 1`] = `
154
- <DocumentFragment>
155
- <div
156
- class="buttonGroup tab "
157
- data-id="ButtonGroup"
158
- data-selector-id="buttonGroup"
159
- data-test-id="ButtonGroup"
160
- >
161
- <div
162
- class="alignleft"
163
- >
164
- <span>
165
- Element 1
166
- </span>
167
- <span>
168
- Element 2
169
- </span>
170
- <span>
171
- Element 3
172
- </span>
173
- </div>
174
- </div>
175
- </DocumentFragment>
176
- `;
177
-
178
- exports[`Buttongrop - rendering the default props 1`] = `
179
- <DocumentFragment>
180
- <div
181
- class="buttonGroup undefined "
182
- data-id="ButtonGroup"
183
- data-selector-id="buttonGroup"
184
- data-test-id="ButtonGroup"
185
- >
186
- <div
187
- class="alignleft"
188
- />
189
- </div>
190
- </DocumentFragment>
191
- `;
1
+ // Jest Snapshot v1, https://goo.gl/fbAQLP
2
+
3
+ exports[`Buttongrop - Checking the "customclass" 1`] = `
4
+ <DocumentFragment>
5
+ <div
6
+ class="buttonGroup undefined customClassButtonGroup"
7
+ data-id="ButtonGroup"
8
+ data-selector-id="buttonGroup"
9
+ data-test-id="ButtonGroup"
10
+ >
11
+ <div
12
+ class="alignleft"
13
+ >
14
+ <span>
15
+ Element 1
16
+ </span>
17
+ <span>
18
+ Element 2
19
+ </span>
20
+ <span>
21
+ Element 3
22
+ </span>
23
+ </div>
24
+ </div>
25
+ </DocumentFragment>
26
+ `;
27
+
28
+ exports[`Buttongrop - rendering the "buttonPosition" to - center 1`] = `
29
+ <DocumentFragment>
30
+ <div
31
+ class="buttonGroup undefined "
32
+ data-id="ButtonGroup"
33
+ data-selector-id="buttonGroup"
34
+ data-test-id="ButtonGroup"
35
+ >
36
+ <div
37
+ class="aligncenter"
38
+ >
39
+ <span>
40
+ Element 1
41
+ </span>
42
+ <span>
43
+ Element 2
44
+ </span>
45
+ <span>
46
+ Element 3
47
+ </span>
48
+ </div>
49
+ </div>
50
+ </DocumentFragment>
51
+ `;
52
+
53
+ exports[`Buttongrop - rendering the "buttonPosition" to - left 1`] = `
54
+ <DocumentFragment>
55
+ <div
56
+ class="buttonGroup undefined "
57
+ data-id="ButtonGroup"
58
+ data-selector-id="buttonGroup"
59
+ data-test-id="ButtonGroup"
60
+ >
61
+ <div
62
+ class="alignleft"
63
+ >
64
+ <span>
65
+ Element 1
66
+ </span>
67
+ <span>
68
+ Element 2
69
+ </span>
70
+ <span>
71
+ Element 3
72
+ </span>
73
+ </div>
74
+ </div>
75
+ </DocumentFragment>
76
+ `;
77
+
78
+ exports[`Buttongrop - rendering the "buttonPosition" to - right 1`] = `
79
+ <DocumentFragment>
80
+ <div
81
+ class="buttonGroup undefined "
82
+ data-id="ButtonGroup"
83
+ data-selector-id="buttonGroup"
84
+ data-test-id="ButtonGroup"
85
+ >
86
+ <div
87
+ class="alignright"
88
+ >
89
+ <span>
90
+ Element 1
91
+ </span>
92
+ <span>
93
+ Element 2
94
+ </span>
95
+ <span>
96
+ Element 3
97
+ </span>
98
+ </div>
99
+ </div>
100
+ </DocumentFragment>
101
+ `;
102
+
103
+ exports[`Buttongrop - rendering the "type" - footer 1`] = `
104
+ <DocumentFragment>
105
+ <div
106
+ class="buttonGroup footer "
107
+ data-id="ButtonGroup"
108
+ data-selector-id="buttonGroup"
109
+ data-test-id="ButtonGroup"
110
+ >
111
+ <div
112
+ class="alignleft"
113
+ >
114
+ <span>
115
+ Element 1
116
+ </span>
117
+ <span>
118
+ Element 2
119
+ </span>
120
+ <span>
121
+ Element 3
122
+ </span>
123
+ </div>
124
+ </div>
125
+ </DocumentFragment>
126
+ `;
127
+
128
+ exports[`Buttongrop - rendering the "type" - header 1`] = `
129
+ <DocumentFragment>
130
+ <div
131
+ class="buttonGroup header "
132
+ data-id="ButtonGroup"
133
+ data-selector-id="buttonGroup"
134
+ data-test-id="ButtonGroup"
135
+ >
136
+ <div
137
+ class="alignleft"
138
+ >
139
+ <span>
140
+ Element 1
141
+ </span>
142
+ <span>
143
+ Element 2
144
+ </span>
145
+ <span>
146
+ Element 3
147
+ </span>
148
+ </div>
149
+ </div>
150
+ </DocumentFragment>
151
+ `;
152
+
153
+ exports[`Buttongrop - rendering the "type" - tab 1`] = `
154
+ <DocumentFragment>
155
+ <div
156
+ class="buttonGroup tab "
157
+ data-id="ButtonGroup"
158
+ data-selector-id="buttonGroup"
159
+ data-test-id="ButtonGroup"
160
+ >
161
+ <div
162
+ class="alignleft"
163
+ >
164
+ <span>
165
+ Element 1
166
+ </span>
167
+ <span>
168
+ Element 2
169
+ </span>
170
+ <span>
171
+ Element 3
172
+ </span>
173
+ </div>
174
+ </div>
175
+ </DocumentFragment>
176
+ `;
177
+
178
+ exports[`Buttongrop - rendering the default props 1`] = `
179
+ <DocumentFragment>
180
+ <div
181
+ class="buttonGroup undefined "
182
+ data-id="ButtonGroup"
183
+ data-selector-id="buttonGroup"
184
+ data-test-id="ButtonGroup"
185
+ >
186
+ <div
187
+ class="alignleft"
188
+ />
189
+ </div>
190
+ </DocumentFragment>
191
+ `;
package/es/Card/Card.js CHANGED
@@ -6,10 +6,10 @@ import { getLibraryConfig } from '../Provider/Config';
6
6
  import style from './Card.module.css';
7
7
  /* eslint-disable react/forbid-component-props */
8
8
 
9
- /*
10
- isscroll header border change use ref
11
- scroll logic remove from here
12
- scroll logic move to virtualizer list
9
+ /*
10
+ isscroll header border change use ref
11
+ scroll logic remove from here
12
+ scroll logic move to virtualizer list
13
13
  */
14
14
 
15
15
  /* performance handling pending in card component moving to ref instead of setState */
@@ -1,20 +1,20 @@
1
- .notScroll {
2
- position: relative;
3
- }
4
- .scroll {
5
- /* background: var(--dot_white);
6
- position: relative; */
7
- }
8
- /*
9
- .scroll::after {
10
- box-shadow: 0 0 6px var(--zd_dark10);
11
- border-radius: 100px / 10px;
12
- content: '';
13
- left: var(--zd_size50);
14
- position: absolute;
15
- right: var(--zd_size50);
16
- display: block;
17
- z-index: -1;
18
- height: var(--zd_size1);
19
- bottom: 0;
20
- } */
1
+ .notScroll {
2
+ position: relative;
3
+ }
4
+ .scroll {
5
+ /* background: var(--dot_white);
6
+ position: relative; */
7
+ }
8
+ /*
9
+ .scroll::after {
10
+ box-shadow: 0 0 6px var(--zd_dark10);
11
+ border-radius: 100px / 10px;
12
+ content: '';
13
+ left: var(--zd_size50);
14
+ position: absolute;
15
+ right: var(--zd_size50);
16
+ display: block;
17
+ z-index: -1;
18
+ height: var(--zd_size1);
19
+ bottom: 0;
20
+ } */
@@ -1,38 +1,38 @@
1
- /* $Id */
2
- .container {
3
- position: relative;
4
- composes: offSelection from '../common/common.module.css';
5
- }
6
- .readOnly, .readOnly > input, .disabled {
7
- cursor: not-allowed;
8
- }
9
- .enabled {
10
- cursor: pointer;
11
- }
12
- .textBox {
13
- position: relative;
14
- }
15
- .inputLine {
16
- position: absolute;
17
- bottom: 0 ;
18
- transition: border var(--zd_transition2) linear 0s;
19
- border-bottom: 1px solid var(--zdt_datewidget_input_border);
20
- }
21
- [dir=ltr] .inputLine {
22
- left: 0 ;
23
- right: 0 ;
24
- }
25
- [dir=rtl] .inputLine {
26
- right: 0 ;
27
- left: 0 ;
28
- }
29
- .enabled:hover .inputLine {
30
- border-bottom-color: var(--zdt_datewidget_enabled_border);
31
- }
32
- .textBoxFocus .inputLine {
33
- border-bottom-color: var(--zdt_datewidget_textboxfocus_border);
34
- }
35
-
36
- .placeHolder input {
37
- color: var(--zdt_datewidget_placeholder_text);
38
- }
1
+ /* $Id */
2
+ .container {
3
+ position: relative;
4
+ composes: offSelection from '../common/common.module.css';
5
+ }
6
+ .readOnly, .readOnly > input, .disabled {
7
+ cursor: not-allowed;
8
+ }
9
+ .enabled {
10
+ cursor: pointer;
11
+ }
12
+ .textBox {
13
+ position: relative;
14
+ }
15
+ .inputLine {
16
+ position: absolute;
17
+ bottom: 0 ;
18
+ transition: border var(--zd_transition2) linear 0s;
19
+ border-bottom: 1px solid var(--zdt_datewidget_input_border);
20
+ }
21
+ [dir=ltr] .inputLine {
22
+ left: 0 ;
23
+ right: 0 ;
24
+ }
25
+ [dir=rtl] .inputLine {
26
+ right: 0 ;
27
+ left: 0 ;
28
+ }
29
+ .enabled:hover .inputLine {
30
+ border-bottom-color: var(--zdt_datewidget_enabled_border);
31
+ }
32
+ .textBoxFocus .inputLine {
33
+ border-bottom-color: var(--zdt_datewidget_textboxfocus_border);
34
+ }
35
+
36
+ .placeHolder input {
37
+ color: var(--zdt_datewidget_placeholder_text);
38
+ }
@@ -476,7 +476,7 @@ exports[`DateTime rendering the isActive is true and isDefaultPosition is true 1
476
476
  </div>
477
477
  <div
478
478
  aria-label="30"
479
- class="datesStr grid today shrinkOff"
479
+ class="datesStr grid shrinkOff"
480
480
  data-id="dateTime_date"
481
481
  data-selector-id="box"
482
482
  data-test-id="dateTime_date"