@zohodesk/dot 1.0.0-temp-191.1 → 1.0.0-temp-193

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 (173) hide show
  1. package/.cli/propValidation_report.html +1 -1
  2. package/README.md +11 -0
  3. package/es/ActionButton/ActionButton.module.css +192 -192
  4. package/es/AlphabeticList/AlphabeticList.module.css +57 -57
  5. package/es/AttachmentViewer/AttachmentViewer.module.css +352 -352
  6. package/es/ChannelIcon/ChannelIcon.module.css +225 -225
  7. package/es/FormAction/FormAction.module.css +100 -100
  8. package/es/IconButton/IconButton.module.css +22 -22
  9. package/es/TagWithIcon/TagWithIcon.module.css +66 -66
  10. package/es/avatar/AvatarIcon/AvatarIcon.module.css +58 -58
  11. package/es/common/dot_boxShadow.module.css +0 -2
  12. package/es/emptystate/CommonEmptyState/CommonEmptyState.module.css +92 -92
  13. package/es/form/fields/DateField/__tests__/__snapshots__/DateField.spec.js.snap +1 -1
  14. package/es/form/fields/Fields.module.css +17 -0
  15. package/es/form/fields/MultiSelectField/__tests__/__snapshots__/MultiSelectField.spec.js.snap +1 -1
  16. package/es/form/fields/SelectField/__tests__/__snapshots__/SelectField.spec.js.snap +1 -1
  17. package/es/form/fields/TextareaField/TextareaField.js +30 -23
  18. package/es/form/fields/TextareaField/props/defaultProps.js +1 -0
  19. package/es/form/fields/TextareaField/props/propTypes.js +2 -0
  20. package/es/form/fields/ValidationMessage/ValidationMessage.module.css +27 -27
  21. package/es/layout/SubtabLayout/SubtabLayout.module.css +164 -164
  22. package/es/list/Comment/Comment.module.css +29 -29
  23. package/es/list/DepartmentDropDown/__tests__/__snapshots__/DepartmentDropDown.spec.js.snap +2 -2
  24. package/es/list/Dot/Dot.module.css +15 -15
  25. package/es/list/ListLayout/ListLayout.module.css +79 -79
  26. package/es/list/Subject/Subject.module.css +34 -34
  27. package/es/list/Thread/Thread.module.css +42 -42
  28. package/es/list/status/StatusDropdown/__tests__/__snapshots__/StatusDropdown.spec.js.snap +2 -2
  29. package/es/lookup/header/ViewDropDown/__test__/__snapshots__/ViewDropDown.spec.js.snap +4 -2
  30. package/es/v1/DotProvider/DotProvider.js +58 -0
  31. package/es/v1/DotProvider/libraryChunks/dynamicImports.js +40 -0
  32. package/es/v1/DotProvider/libraryChunks/themes/component/blue/Blue_Dark_Component.js +3 -0
  33. package/es/v1/DotProvider/libraryChunks/themes/component/blue/Blue_Light_Component.js +3 -0
  34. package/es/v1/DotProvider/libraryChunks/themes/component/blue/Blue_PureDark_Component.js +3 -0
  35. package/es/v1/DotProvider/libraryChunks/themes/component/green/Green_Dark_Component.js +3 -0
  36. package/es/v1/DotProvider/libraryChunks/themes/component/green/Green_Light_Component.js +3 -0
  37. package/es/v1/DotProvider/libraryChunks/themes/component/green/Green_PureDark_Component.js +3 -0
  38. package/es/v1/DotProvider/libraryChunks/themes/component/orange/Orange_Dark_Component.js +3 -0
  39. package/es/v1/DotProvider/libraryChunks/themes/component/orange/Orange_Light_Component.js +3 -0
  40. package/es/v1/DotProvider/libraryChunks/themes/component/orange/Orange_PureDark_Component.js +3 -0
  41. package/es/v1/DotProvider/libraryChunks/themes/component/red/Red_Dark_Component.js +3 -0
  42. package/es/v1/DotProvider/libraryChunks/themes/component/red/Red_Light_Component.js +3 -0
  43. package/es/v1/DotProvider/libraryChunks/themes/component/red/Red_PureDark_Component.js +3 -0
  44. package/es/v1/DotProvider/libraryChunks/themes/component/yellow/Yellow_Dark_Component.js +3 -0
  45. package/es/v1/DotProvider/libraryChunks/themes/component/yellow/Yellow_Light_Component.js +3 -0
  46. package/es/v1/DotProvider/libraryChunks/themes/component/yellow/Yellow_PureDark_Component.js +3 -0
  47. package/es/v1/DotProvider/libraryChunks/themes/dot/blue/Blue_Dark_Dot.js +1 -0
  48. package/es/v1/DotProvider/libraryChunks/themes/dot/blue/Blue_Light_Dot.js +1 -0
  49. package/es/v1/DotProvider/libraryChunks/themes/dot/blue/Blue_PureDark_Dot.js +1 -0
  50. package/es/v1/DotProvider/libraryChunks/themes/dot/green/Green_Dark_Dot.js +1 -0
  51. package/es/v1/DotProvider/libraryChunks/themes/dot/green/Green_Light_Dot.js +1 -0
  52. package/es/v1/DotProvider/libraryChunks/themes/dot/green/Green_PureDark_Dot.js +1 -0
  53. package/es/v1/DotProvider/libraryChunks/themes/dot/orange/Orange_Dark_Dot.js +1 -0
  54. package/es/v1/DotProvider/libraryChunks/themes/dot/orange/Orange_Light_Dot.js +1 -0
  55. package/es/v1/DotProvider/libraryChunks/themes/dot/orange/Orange_PureDark_Dot.js +1 -0
  56. package/es/v1/DotProvider/libraryChunks/themes/dot/red/Red_Dark_Dot.js +1 -0
  57. package/es/v1/DotProvider/libraryChunks/themes/dot/red/Red_Light_Dot.js +1 -0
  58. package/es/v1/DotProvider/libraryChunks/themes/dot/red/Red_PureDark_Dot.js +1 -0
  59. package/es/v1/DotProvider/libraryChunks/themes/dot/yellow/Yellow_Dark_Dot.js +1 -0
  60. package/es/v1/DotProvider/libraryChunks/themes/dot/yellow/Yellow_Light_Dot.js +1 -0
  61. package/es/v1/DotProvider/libraryChunks/themes/dot/yellow/Yellow_PureDark_Dot.js +1 -0
  62. package/es/v1/DotProvider/libraryChunks/themes/svg/blue/Blue_Dark_SVG.js +1 -0
  63. package/es/v1/DotProvider/libraryChunks/themes/svg/blue/Blue_Light_SVG.js +1 -0
  64. package/es/v1/DotProvider/libraryChunks/themes/svg/blue/Blue_PureDark_SVG.js +1 -0
  65. package/es/v1/DotProvider/libraryChunks/themes/svg/green/Green_Dark_SVG.js +1 -0
  66. package/es/v1/DotProvider/libraryChunks/themes/svg/green/Green_Light_SVG.js +1 -0
  67. package/es/v1/DotProvider/libraryChunks/themes/svg/green/Green_PureDark_SVG.js +1 -0
  68. package/es/v1/DotProvider/libraryChunks/themes/svg/orange/Orange_Dark_SVG.js +1 -0
  69. package/es/v1/DotProvider/libraryChunks/themes/svg/orange/Orange_Light_SVG.js +1 -0
  70. package/es/v1/DotProvider/libraryChunks/themes/svg/orange/Orange_PureDark_SVG.js +1 -0
  71. package/es/v1/DotProvider/libraryChunks/themes/svg/red/Red_Dark_SVG.js +1 -0
  72. package/es/v1/DotProvider/libraryChunks/themes/svg/red/Red_Light_SVG.js +1 -0
  73. package/es/v1/DotProvider/libraryChunks/themes/svg/red/Red_PureDark_SVG.js +1 -0
  74. package/es/v1/DotProvider/libraryChunks/themes/svg/yellow/Yellow_Dark_SVG.js +1 -0
  75. package/es/v1/DotProvider/libraryChunks/themes/svg/yellow/Yellow_Light_SVG.js +1 -0
  76. package/es/v1/DotProvider/libraryChunks/themes/svg/yellow/Yellow_PureDark_SVG.js +1 -0
  77. package/es/v1/DotProvider/props/defaultProps.js +12 -0
  78. package/es/v1/DotProvider/props/propTypes.js +12 -0
  79. package/es/v1/DotProvider/utils/appearanceProperties.js +46 -0
  80. package/es/v1/DotProvider/utils/errorMessage.js +7 -0
  81. package/es/v1/DotProvider/utils/importFiles.js +18 -0
  82. package/es/v1/DotProvider/utils/sizeProperties.js +12 -0
  83. package/es/v1/DotProvider/utils/themeProperties.js +220 -0
  84. package/es/version2/GlobalNotification/GlobalNotification.module.css +177 -177
  85. package/es/version2/lookup/AlertHeader/css/AlertHeaderNew.module.css +87 -87
  86. package/es/version2/notification/DesktopNotificationHeader/DesktopNotificationHeader.module.css +132 -132
  87. package/lib/ActionButton/ActionButton.module.css +192 -192
  88. package/lib/AlphabeticList/AlphabeticList.module.css +57 -57
  89. package/lib/AttachmentViewer/AttachmentViewer.module.css +352 -352
  90. package/lib/ChannelIcon/ChannelIcon.module.css +225 -225
  91. package/lib/FormAction/FormAction.module.css +100 -100
  92. package/lib/IconButton/IconButton.module.css +22 -22
  93. package/lib/TagWithIcon/TagWithIcon.module.css +66 -66
  94. package/lib/avatar/AvatarIcon/AvatarIcon.module.css +58 -58
  95. package/lib/common/dot_boxShadow.module.css +0 -2
  96. package/lib/emptystate/CommonEmptyState/CommonEmptyState.module.css +92 -92
  97. package/lib/form/fields/DateField/__tests__/__snapshots__/DateField.spec.js.snap +1 -1
  98. package/lib/form/fields/Fields.module.css +17 -0
  99. package/lib/form/fields/MultiSelectField/__tests__/__snapshots__/MultiSelectField.spec.js.snap +1 -1
  100. package/lib/form/fields/SelectField/__tests__/__snapshots__/SelectField.spec.js.snap +1 -1
  101. package/lib/form/fields/TextareaField/TextareaField.js +31 -22
  102. package/lib/form/fields/TextareaField/props/defaultProps.js +2 -1
  103. package/lib/form/fields/TextareaField/props/propTypes.js +3 -1
  104. package/lib/form/fields/ValidationMessage/ValidationMessage.module.css +27 -27
  105. package/lib/layout/SubtabLayout/SubtabLayout.module.css +164 -164
  106. package/lib/list/Comment/Comment.module.css +29 -29
  107. package/lib/list/DepartmentDropDown/__tests__/__snapshots__/DepartmentDropDown.spec.js.snap +2 -2
  108. package/lib/list/Dot/Dot.module.css +15 -15
  109. package/lib/list/ListLayout/ListLayout.module.css +79 -79
  110. package/lib/list/Subject/Subject.module.css +34 -34
  111. package/lib/list/Thread/Thread.module.css +42 -42
  112. package/lib/list/status/StatusDropdown/__tests__/__snapshots__/StatusDropdown.spec.js.snap +2 -2
  113. package/lib/lookup/header/ViewDropDown/__test__/__snapshots__/ViewDropDown.spec.js.snap +4 -2
  114. package/lib/v1/DotProvider/DotProvider.js +77 -0
  115. package/lib/v1/DotProvider/libraryChunks/dynamicImports.js +59 -0
  116. package/lib/v1/DotProvider/libraryChunks/themes/component/blue/Blue_Dark_Component.js +7 -0
  117. package/lib/v1/DotProvider/libraryChunks/themes/component/blue/Blue_Light_Component.js +7 -0
  118. package/lib/v1/DotProvider/libraryChunks/themes/component/blue/Blue_PureDark_Component.js +7 -0
  119. package/lib/v1/DotProvider/libraryChunks/themes/component/green/Green_Dark_Component.js +7 -0
  120. package/lib/v1/DotProvider/libraryChunks/themes/component/green/Green_Light_Component.js +7 -0
  121. package/lib/v1/DotProvider/libraryChunks/themes/component/green/Green_PureDark_Component.js +7 -0
  122. package/lib/v1/DotProvider/libraryChunks/themes/component/orange/Orange_Dark_Component.js +7 -0
  123. package/lib/v1/DotProvider/libraryChunks/themes/component/orange/Orange_Light_Component.js +7 -0
  124. package/lib/v1/DotProvider/libraryChunks/themes/component/orange/Orange_PureDark_Component.js +7 -0
  125. package/lib/v1/DotProvider/libraryChunks/themes/component/red/Red_Dark_Component.js +7 -0
  126. package/lib/v1/DotProvider/libraryChunks/themes/component/red/Red_Light_Component.js +7 -0
  127. package/lib/v1/DotProvider/libraryChunks/themes/component/red/Red_PureDark_Component.js +7 -0
  128. package/lib/v1/DotProvider/libraryChunks/themes/component/yellow/Yellow_Dark_Component.js +7 -0
  129. package/lib/v1/DotProvider/libraryChunks/themes/component/yellow/Yellow_Light_Component.js +7 -0
  130. package/lib/v1/DotProvider/libraryChunks/themes/component/yellow/Yellow_PureDark_Component.js +7 -0
  131. package/lib/v1/DotProvider/libraryChunks/themes/dot/blue/Blue_Dark_Dot.js +3 -0
  132. package/lib/v1/DotProvider/libraryChunks/themes/dot/blue/Blue_Light_Dot.js +3 -0
  133. package/lib/v1/DotProvider/libraryChunks/themes/dot/blue/Blue_PureDark_Dot.js +3 -0
  134. package/lib/v1/DotProvider/libraryChunks/themes/dot/green/Green_Dark_Dot.js +3 -0
  135. package/lib/v1/DotProvider/libraryChunks/themes/dot/green/Green_Light_Dot.js +3 -0
  136. package/lib/v1/DotProvider/libraryChunks/themes/dot/green/Green_PureDark_Dot.js +3 -0
  137. package/lib/v1/DotProvider/libraryChunks/themes/dot/orange/Orange_Dark_Dot.js +3 -0
  138. package/lib/v1/DotProvider/libraryChunks/themes/dot/orange/Orange_Light_Dot.js +3 -0
  139. package/lib/v1/DotProvider/libraryChunks/themes/dot/orange/Orange_PureDark_Dot.js +3 -0
  140. package/lib/v1/DotProvider/libraryChunks/themes/dot/red/Red_Dark_Dot.js +3 -0
  141. package/lib/v1/DotProvider/libraryChunks/themes/dot/red/Red_Light_Dot.js +3 -0
  142. package/lib/v1/DotProvider/libraryChunks/themes/dot/red/Red_PureDark_Dot.js +3 -0
  143. package/lib/v1/DotProvider/libraryChunks/themes/dot/yellow/Yellow_Dark_Dot.js +3 -0
  144. package/lib/v1/DotProvider/libraryChunks/themes/dot/yellow/Yellow_Light_Dot.js +3 -0
  145. package/lib/v1/DotProvider/libraryChunks/themes/dot/yellow/Yellow_PureDark_Dot.js +3 -0
  146. package/lib/v1/DotProvider/libraryChunks/themes/svg/blue/Blue_Dark_SVG.js +3 -0
  147. package/lib/v1/DotProvider/libraryChunks/themes/svg/blue/Blue_Light_SVG.js +3 -0
  148. package/lib/v1/DotProvider/libraryChunks/themes/svg/blue/Blue_PureDark_SVG.js +3 -0
  149. package/lib/v1/DotProvider/libraryChunks/themes/svg/green/Green_Dark_SVG.js +3 -0
  150. package/lib/v1/DotProvider/libraryChunks/themes/svg/green/Green_Light_SVG.js +3 -0
  151. package/lib/v1/DotProvider/libraryChunks/themes/svg/green/Green_PureDark_SVG.js +3 -0
  152. package/lib/v1/DotProvider/libraryChunks/themes/svg/orange/Orange_Dark_SVG.js +3 -0
  153. package/lib/v1/DotProvider/libraryChunks/themes/svg/orange/Orange_Light_SVG.js +3 -0
  154. package/lib/v1/DotProvider/libraryChunks/themes/svg/orange/Orange_PureDark_SVG.js +3 -0
  155. package/lib/v1/DotProvider/libraryChunks/themes/svg/red/Red_Dark_SVG.js +3 -0
  156. package/lib/v1/DotProvider/libraryChunks/themes/svg/red/Red_Light_SVG.js +3 -0
  157. package/lib/v1/DotProvider/libraryChunks/themes/svg/red/Red_PureDark_SVG.js +3 -0
  158. package/lib/v1/DotProvider/libraryChunks/themes/svg/yellow/Yellow_Dark_SVG.js +3 -0
  159. package/lib/v1/DotProvider/libraryChunks/themes/svg/yellow/Yellow_Light_SVG.js +3 -0
  160. package/lib/v1/DotProvider/libraryChunks/themes/svg/yellow/Yellow_PureDark_SVG.js +3 -0
  161. package/lib/v1/DotProvider/props/defaultProps.js +19 -0
  162. package/lib/v1/DotProvider/props/propTypes.js +23 -0
  163. package/lib/v1/DotProvider/utils/appearanceProperties.js +79 -0
  164. package/lib/v1/DotProvider/utils/errorMessage.js +14 -0
  165. package/lib/v1/DotProvider/utils/importFiles.js +25 -0
  166. package/lib/v1/DotProvider/utils/sizeProperties.js +31 -0
  167. package/lib/v1/DotProvider/utils/themeProperties.js +325 -0
  168. package/lib/version2/GlobalNotification/GlobalNotification.module.css +177 -177
  169. package/lib/version2/lookup/AlertHeader/css/AlertHeaderNew.module.css +87 -87
  170. package/lib/version2/notification/DesktopNotificationHeader/DesktopNotificationHeader.module.css +132 -132
  171. package/package.json +3 -3
  172. package/result.json +1 -1
  173. package/unittest/index.html +2 -18
@@ -1,35 +1,35 @@
1
- .varClass {
2
- --subject_text: var(--zdt_subject_text);
3
- }
4
-
5
- .subject {
6
- composes: varClass;
7
- /* css:theme-validation:ignore */
8
- color: var(--subject_text);
9
- display: block;
10
- }
11
-
12
- .dotted {
13
- composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
14
- }
15
-
16
- .font_regular {
17
- font-family: var(--zd_regular);
18
- }
19
-
20
- .font_semibold {
21
- font-family: var(--zd_semibold);
22
- }
23
-
24
- .font_bold {
25
- font-family: var(--zd_bold);
26
- }
27
-
28
- .font_semibold,
29
- .font_bold {
30
- composes: ftsmooth from '~@zohodesk/components/lib/common/common.module.css';
31
- }
32
-
33
- .cursorPointer {
34
- cursor: pointer;
1
+ .varClass {
2
+ --subject_text: var(--zdt_subject_text);
3
+ }
4
+
5
+ .subject {
6
+ composes: varClass;
7
+ /* css:theme-validation:ignore */
8
+ color: var(--subject_text);
9
+ display: block;
10
+ }
11
+
12
+ .dotted {
13
+ composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
14
+ }
15
+
16
+ .font_regular {
17
+ font-family: var(--zd_regular);
18
+ }
19
+
20
+ .font_semibold {
21
+ font-family: var(--zd_semibold);
22
+ }
23
+
24
+ .font_bold {
25
+ font-family: var(--zd_bold);
26
+ }
27
+
28
+ .font_semibold,
29
+ .font_bold {
30
+ composes: ftsmooth from '~@zohodesk/components/lib/common/common.module.css';
31
+ }
32
+
33
+ .cursorPointer {
34
+ cursor: pointer;
35
35
  }
@@ -1,43 +1,43 @@
1
- .varClass {
2
- --icon_color: var(--zdt_thread_iconText);
3
- }
4
- .container {
5
- composes: varClass;
6
- position: relative;
7
- color: var(--icon_color);
8
- cursor: pointer;
9
- }
10
- .container:hover {
11
- --icon_color: var(--zdt_thread_hover_iconText);
12
- }
13
- .count {
14
- font-size: var(--zd_font_size9) ;
15
- }
16
- .align_left .count {
17
- position: absolute;
18
- line-height: normal;
19
- top: var(--zd_size3) ;
20
- }
21
- [dir=ltr] .align_left .count {
22
- text-align: left;
23
- left: var(--zd_size8) ;
24
- }
25
- [dir=rtl] .align_left .count {
26
- text-align: right;
27
- right: var(--zd_size8) ;
28
- }
29
- .align_right {
30
- composes: dInflex alignFend from '~@zohodesk/components/lib/common/common.module.css';
31
- }
32
- .align_right .count {
33
- position: relative;
34
- bottom: var(--zd_size2) ;
35
- }
36
- [dir=ltr] .align_right .count {
37
- right: var(--zd_size5) ;
38
- float: right;
39
- }
40
- [dir=rtl] .align_right .count {
41
- left: var(--zd_size5) ;
42
- float: left;
1
+ .varClass {
2
+ --icon_color: var(--zdt_thread_iconText);
3
+ }
4
+ .container {
5
+ composes: varClass;
6
+ position: relative;
7
+ color: var(--icon_color);
8
+ cursor: pointer;
9
+ }
10
+ .container:hover {
11
+ --icon_color: var(--zdt_thread_hover_iconText);
12
+ }
13
+ .count {
14
+ font-size: var(--zd_font_size9) ;
15
+ }
16
+ .align_left .count {
17
+ position: absolute;
18
+ line-height: normal;
19
+ top: var(--zd_size3) ;
20
+ }
21
+ [dir=ltr] .align_left .count {
22
+ text-align: left;
23
+ left: var(--zd_size8) ;
24
+ }
25
+ [dir=rtl] .align_left .count {
26
+ text-align: right;
27
+ right: var(--zd_size8) ;
28
+ }
29
+ .align_right {
30
+ composes: dInflex alignFend from '~@zohodesk/components/lib/common/common.module.css';
31
+ }
32
+ .align_right .count {
33
+ position: relative;
34
+ bottom: var(--zd_size2) ;
35
+ }
36
+ [dir=ltr] .align_right .count {
37
+ right: var(--zd_size5) ;
38
+ float: right;
39
+ }
40
+ [dir=rtl] .align_right .count {
41
+ left: var(--zd_size5) ;
42
+ float: left;
43
43
  }
@@ -17,9 +17,9 @@ exports[`StatusDropdown rendering the defult props 1`] = `
17
17
  >
18
18
  <span
19
19
  class="value toggleDropText shrinkOn"
20
- data-id="boxComponent"
20
+ data-id="undefined_value"
21
21
  data-selector-id="box"
22
- data-test-id="boxComponent"
22
+ data-test-id="undefined_value"
23
23
  />
24
24
  <i
25
25
  aria-hidden="true"
@@ -13,14 +13,16 @@ exports[`ViewDropDown rendering the defult props 1`] = `
13
13
  >
14
14
  <span
15
15
  class="labelText"
16
+ data-id="ViewDropDown_selectedValue"
17
+ data-test-id="ViewDropDown_selectedValue"
16
18
  data-title=""
17
19
  />
18
20
  <i
19
21
  aria-hidden="true"
20
22
  class="zd_font_icons basic icon-down arrowIcon "
21
- data-id="fontIcon"
23
+ data-id="ViewDropDown_icon"
22
24
  data-selector-id="fontIcon"
23
- data-test-id="fontIcon"
25
+ data-test-id="ViewDropDown_icon"
24
26
  style="--zd-iconfont-size: var(--zd_font_size7);"
25
27
  />
26
28
  </div>
@@ -0,0 +1,58 @@
1
+ import { useLayoutEffect } from 'react';
2
+ import { getAppearance, getTheme, getZoomSize, getFontSize } from './libraryChunks/dynamicImports';
3
+ import '@zohodesk/components/assets/Contrast/lightContrastLightness.module.css';
4
+ import '@zohodesk/components/assets/Contrast/darkContrastLightness.module.css';
5
+ import '@zohodesk/components/assets/Contrast/pureDarkContrastLightness.module.css';
6
+ import '@zohodesk/variables/assets/colorVariables.module.css';
7
+ import '@zohodesk/variables/assets/dotVariables.module.css';
8
+ import '@zohodesk/components/es/common/basic.module.css';
9
+ import '@zohodesk/variables/lib/fontFamilyVariables.module.css';
10
+ import '@zohodesk/components/lib/common/boxShadow.module.css';
11
+ import '../../common/dot_boxShadow.module.css';
12
+ import { propTypes } from './props/propTypes';
13
+ import { defaultProps } from './props/defaultProps';
14
+ export default function DotProvider(props) {
15
+ const {
16
+ $ui_appearance,
17
+ $ui_theme,
18
+ $ui_baseZoomSize,
19
+ $ui_baseFontSize,
20
+ $method_providerRef,
21
+ $method_getAssetPromise,
22
+ $data_library,
23
+ $data_sizeVariableName,
24
+ $data_fontSizeVariableName
25
+ } = props;
26
+ useLayoutEffect(() => {
27
+ const promises = [];
28
+ const apperance = getAppearance($ui_appearance, $data_library);
29
+ promises.push(apperance);
30
+ const theme = getTheme($ui_appearance, $ui_theme, $data_library);
31
+ promises.push(theme);
32
+
33
+ if ($ui_baseZoomSize) {
34
+ const zoomSize = getZoomSize();
35
+ promises.push(zoomSize);
36
+
37
+ if ($method_providerRef()) {
38
+ $method_providerRef().style.setProperty($data_sizeVariableName, $ui_baseZoomSize);
39
+ }
40
+ }
41
+
42
+ if ($ui_baseFontSize) {
43
+ const fontSize = getFontSize();
44
+ promises.push(fontSize);
45
+
46
+ if ($method_providerRef()) {
47
+ $method_providerRef().style.setProperty($data_fontSizeVariableName, $ui_baseFontSize);
48
+ }
49
+ }
50
+
51
+ $method_getAssetPromise(Promise.all(promises).then(() => {
52
+ Promise.resolve();
53
+ }));
54
+ }, [$ui_appearance, $ui_theme, $ui_baseZoomSize, $ui_baseFontSize, $method_providerRef, $method_getAssetPromise, $data_library, $data_sizeVariableName, $data_fontSizeVariableName]);
55
+ return null;
56
+ }
57
+ DotProvider.propTypes = propTypes;
58
+ DotProvider.defaultProps = defaultProps;
@@ -0,0 +1,40 @@
1
+ import { importFiles } from "../../../../es/v1/DotProvider/utils/importFiles";
2
+ import { appearanceImports, appearanceMapping } from "../utils/appearanceProperties";
3
+ import { themeImports, themeMapping } from "../utils/themeProperties";
4
+ import { imports, mapping } from "../utils/sizeProperties";
5
+ import { errorMessage } from "../utils/errorMessage";
6
+ const defaultLib = ['component', 'dot', 'svg'];
7
+ const modeArray = ['light', 'dark', 'pureDark'];
8
+ const themeArray = ['blue', 'green', 'orange', 'red', 'yellow'];
9
+ export function getAppearance(mode, library) {
10
+ const libArray = typeof library === 'string' ? [library] : library != undefined ? library : defaultLib;
11
+ errorMessage(modeArray, mode, 'appearance');
12
+ const importFilesArray = [];
13
+ libArray.map(libName => {
14
+ const importFile = appearanceMapping[libName][mode];
15
+ importFilesArray.push(importFile);
16
+ });
17
+ return importFiles({
18
+ file: importFilesArray,
19
+ imports: appearanceImports
20
+ });
21
+ }
22
+ export function getTheme(mode, theme, library) {
23
+ const libArray = typeof library === 'string' ? [library] : library != undefined ? library : defaultLib;
24
+ errorMessage(themeArray, theme, 'theme');
25
+ const importFilesArray = [];
26
+ libArray.map(libName => {
27
+ const importFile = themeMapping[libName][theme][mode];
28
+ importFilesArray.push(importFile);
29
+ });
30
+ return importFiles({
31
+ file: importFilesArray,
32
+ imports: themeImports
33
+ });
34
+ }
35
+ export function getZoomSize() {
36
+ return imports[mapping.zoomSize]();
37
+ }
38
+ export function getFontSize() {
39
+ return imports[mapping.fontSize]();
40
+ }
@@ -0,0 +1,3 @@
1
+ import '@zohodesk/components/assets/Appearance/dark/themes/blue/blue_CTA_DarkTheme.module.css';
2
+ import '@zohodesk/components/assets/Appearance/dark/themes/blue/blue_CTA_DarkModifyCategory.module.css';
3
+ import '@zohodesk/components/assets/Appearance/dark/themes/blue/blue_ComponentTheme_DarkTheme.module.css';
@@ -0,0 +1,3 @@
1
+ import '@zohodesk/components/assets/Appearance/light/themes/blue/blue_CTA_LightTheme.module.css';
2
+ import '@zohodesk/components/assets/Appearance/light/themes/blue/blue_CTA_LightModifyCategory.module.css';
3
+ import '@zohodesk/components/assets/Appearance/light/themes/blue/blue_ComponentTheme_LightTheme.module.css';
@@ -0,0 +1,3 @@
1
+ import '@zohodesk/components/assets/Appearance/pureDark/themes/blue/blue_CTA_PureDarkTheme.module.css';
2
+ import '@zohodesk/components/assets/Appearance/pureDark/themes/blue/blue_CTA_PureDarkModifyCategory.module.css';
3
+ import '@zohodesk/components/assets/Appearance/pureDark/themes/blue/blue_ComponentTheme_PureDarkTheme.module.css';
@@ -0,0 +1,3 @@
1
+ import '@zohodesk/components/assets/Appearance/dark/themes/green/green_CTA_DarkTheme.module.css';
2
+ import '@zohodesk/components/assets/Appearance/dark/themes/green/green_CTA_DarkModifyCategory.module.css';
3
+ import '@zohodesk/components/assets/Appearance/dark/themes/green/green_ComponentTheme_DarkTheme.module.css';
@@ -0,0 +1,3 @@
1
+ import '@zohodesk/components/assets/Appearance/light/themes/green/green_CTA_LightTheme.module.css';
2
+ import '@zohodesk/components/assets/Appearance/light/themes/green/green_CTA_LightModifyCategory.module.css';
3
+ import '@zohodesk/components/assets/Appearance/light/themes/green/green_ComponentTheme_LightTheme.module.css';
@@ -0,0 +1,3 @@
1
+ import '@zohodesk/components/assets/Appearance/pureDark/themes/green/green_CTA_PureDarkTheme.module.css';
2
+ import '@zohodesk/components/assets/Appearance/pureDark/themes/green/green_CTA_PureDarkModifyCategory.module.css';
3
+ import '@zohodesk/components/assets/Appearance/pureDark/themes/green/green_ComponentTheme_PureDarkTheme.module.css';
@@ -0,0 +1,3 @@
1
+ import '@zohodesk/components/assets/Appearance/dark/themes/orange/orange_CTA_DarkTheme.module.css';
2
+ import '@zohodesk/components/assets/Appearance/dark/themes/orange/orange_CTA_DarkModifyCategory.module.css';
3
+ import '@zohodesk/components/assets/Appearance/dark/themes/orange/orange_ComponentTheme_DarkTheme.module.css';
@@ -0,0 +1,3 @@
1
+ import '@zohodesk/components/assets/Appearance/light/themes/orange/orange_CTA_LightTheme.module.css';
2
+ import '@zohodesk/components/assets/Appearance/light/themes/orange/orange_CTA_LightModifyCategory.module.css';
3
+ import '@zohodesk/components/assets/Appearance/light/themes/orange/orange_ComponentTheme_LightTheme.module.css';
@@ -0,0 +1,3 @@
1
+ import '@zohodesk/components/assets/Appearance/pureDark/themes/orange/orange_CTA_PureDarkTheme.module.css';
2
+ import '@zohodesk/components/assets/Appearance/pureDark/themes/orange/orange_CTA_PureDarkModifyCategory.module.css';
3
+ import '@zohodesk/components/assets/Appearance/pureDark/themes/orange/orange_ComponentTheme_PureDarkTheme.module.css';
@@ -0,0 +1,3 @@
1
+ import '@zohodesk/components/assets/Appearance/dark/themes/red/red_CTA_DarkTheme.module.css';
2
+ import '@zohodesk/components/assets/Appearance/dark/themes/red/red_CTA_DarkModifyCategory.module.css';
3
+ import '@zohodesk/components/assets/Appearance/dark/themes/red/red_ComponentTheme_DarkTheme.module.css';
@@ -0,0 +1,3 @@
1
+ import '@zohodesk/components/assets/Appearance/light/themes/red/red_CTA_LightTheme.module.css';
2
+ import '@zohodesk/components/assets/Appearance/light/themes/red/red_CTA_LightModifyCategory.module.css';
3
+ import '@zohodesk/components/assets/Appearance/light/themes/red/red_ComponentTheme_LightTheme.module.css';
@@ -0,0 +1,3 @@
1
+ import '@zohodesk/components/assets/Appearance/pureDark/themes/red/red_CTA_PureDarkTheme.module.css';
2
+ import '@zohodesk/components/assets/Appearance/pureDark/themes/red/red_CTA_PureDarkModifyCategory.module.css';
3
+ import '@zohodesk/components/assets/Appearance/pureDark/themes/red/red_ComponentTheme_PureDarkTheme.module.css';
@@ -0,0 +1,3 @@
1
+ import '@zohodesk/components/assets/Appearance/dark/themes/yellow/yellow_CTA_DarkTheme.module.css';
2
+ import '@zohodesk/components/assets/Appearance/dark/themes/yellow/yellow_CTA_DarkModifyCategory.module.css';
3
+ import '@zohodesk/components/assets/Appearance/dark/themes/yellow/yellow_ComponentTheme_DarkTheme.module.css';
@@ -0,0 +1,3 @@
1
+ import '@zohodesk/components/assets/Appearance/light/themes/yellow/yellow_CTA_LightTheme.module.css';
2
+ import '@zohodesk/components/assets/Appearance/light/themes/yellow/yellow_CTA_LightModifyCategory.module.css';
3
+ import '@zohodesk/components/assets/Appearance/light/themes/yellow/yellow_ComponentTheme_LightTheme.module.css';
@@ -0,0 +1,3 @@
1
+ import '@zohodesk/components/assets/Appearance/pureDark/themes/yellow/yellow_CTA_PureDarkTheme.module.css';
2
+ import '@zohodesk/components/assets/Appearance/pureDark/themes/yellow/yellow_CTA_PureDarkModifyCategory.module.css';
3
+ import '@zohodesk/components/assets/Appearance/pureDark/themes/yellow/yellow_ComponentTheme_PureDarkTheme.module.css';
@@ -0,0 +1 @@
1
+ import './../../../../../../../assets/Appearance/dark/themes/blue/blue_DotTheme_DarkTheme.module.css';
@@ -0,0 +1 @@
1
+ import './../../../../../../../assets/Appearance/light/themes/blue/blue_DotTheme_LightTheme.module.css';
@@ -0,0 +1 @@
1
+ import './../../../../../../../assets/Appearance/pureDark/themes/blue/blue_DotTheme_PureDarkTheme.module.css';
@@ -0,0 +1 @@
1
+ import './../../../../../../../assets/Appearance/dark/themes/green/green_DotTheme_DarkTheme.module.css';
@@ -0,0 +1 @@
1
+ import './../../../../../../../assets/Appearance/light/themes/green/green_DotTheme_LightTheme.module.css';
@@ -0,0 +1 @@
1
+ import './../../../../../../../assets/Appearance/pureDark/themes/green/green_DotTheme_PureDarkTheme.module.css';
@@ -0,0 +1 @@
1
+ import './../../../../../../../assets/Appearance/dark/themes/orange/orange_DotTheme_DarkTheme.module.css';
@@ -0,0 +1 @@
1
+ import './../../../../../../../assets/Appearance/light/themes/orange/orange_DotTheme_LightTheme.module.css';
@@ -0,0 +1 @@
1
+ import './../../../../../../../assets/Appearance/pureDark/themes/orange/orange_DotTheme_PureDarkTheme.module.css';
@@ -0,0 +1 @@
1
+ import './../../../../../../../assets/Appearance/dark/themes/red/red_DotTheme_DarkTheme.module.css';
@@ -0,0 +1 @@
1
+ import './../../../../../../../assets/Appearance/light/themes/red/red_DotTheme_LightTheme.module.css';
@@ -0,0 +1 @@
1
+ import './../../../../../../../assets/Appearance/pureDark/themes/red/red_DotTheme_PureDarkTheme.module.css';
@@ -0,0 +1 @@
1
+ import './../../../../../../../assets/Appearance/dark/themes/yellow/yellow_DotTheme_DarkTheme.module.css';
@@ -0,0 +1 @@
1
+ import './../../../../../../../assets/Appearance/light/themes/yellow/yellow_DotTheme_LightTheme.module.css';
@@ -0,0 +1 @@
1
+ import './../../../../../../../assets/Appearance/pureDark/themes/yellow/yellow_DotTheme_PureDarkTheme.module.css';
@@ -0,0 +1 @@
1
+ import '@zohodesk/svg/assets/Appearance/dark/themes/blue/blue_SVGTheme_DarkTheme.module.css';
@@ -0,0 +1 @@
1
+ import '@zohodesk/svg/assets/Appearance/light/themes/blue/blue_SVGTheme_LightTheme.module.css';
@@ -0,0 +1 @@
1
+ import '@zohodesk/svg/assets/Appearance/pureDark/themes/blue/blue_SVGTheme_PureDarkTheme.module.css';
@@ -0,0 +1 @@
1
+ import '@zohodesk/svg/assets/Appearance/dark/themes/green/green_SVGTheme_DarkTheme.module.css';
@@ -0,0 +1 @@
1
+ import '@zohodesk/svg/assets/Appearance/light/themes/green/green_SVGTheme_LightTheme.module.css';
@@ -0,0 +1 @@
1
+ import '@zohodesk/svg/assets/Appearance/pureDark/themes/green/green_SVGTheme_PureDarkTheme.module.css';
@@ -0,0 +1 @@
1
+ import '@zohodesk/svg/assets/Appearance/dark/themes/orange/orange_SVGTheme_DarkTheme.module.css';
@@ -0,0 +1 @@
1
+ import '@zohodesk/svg/assets/Appearance/light/themes/orange/orange_SVGTheme_LightTheme.module.css';
@@ -0,0 +1 @@
1
+ import '@zohodesk/svg/assets/Appearance/pureDark/themes/orange/orange_SVGTheme_PureDarkTheme.module.css';
@@ -0,0 +1 @@
1
+ import '@zohodesk/svg/assets/Appearance/dark/themes/red/red_SVGTheme_DarkTheme.module.css';
@@ -0,0 +1 @@
1
+ import '@zohodesk/svg/assets/Appearance/light/themes/red/red_SVGTheme_LightTheme.module.css';
@@ -0,0 +1 @@
1
+ import '@zohodesk/svg/assets/Appearance/pureDark/themes/red/red_SVGTheme_PureDarkTheme.module.css';
@@ -0,0 +1 @@
1
+ import '@zohodesk/svg/assets/Appearance/dark/themes/yellow/yellow_SVGTheme_DarkTheme.module.css';
@@ -0,0 +1 @@
1
+ import '@zohodesk/svg/assets/Appearance/light/themes/yellow/yellow_SVGTheme_LightTheme.module.css';
@@ -0,0 +1 @@
1
+ import '@zohodesk/svg/assets/Appearance/pureDark/themes/yellow/yellow_SVGTheme_PureDarkTheme.module.css';
@@ -0,0 +1,12 @@
1
+ export const defaultProps = {
2
+ $ui_appearance: 'light',
3
+ $ui_theme: 'blue',
4
+ $data_library: ['component'],
5
+ $ui_baseZoomSize: 1,
6
+ $ui_baseFontSize: 16,
7
+ $method_providerRef: () => {
8
+ return document.body;
9
+ },
10
+ $data_sizeVariableName: '--zd_baseSize',
11
+ $data_fontSizeVariableName: '--zd_baseFontSize'
12
+ };
@@ -0,0 +1,12 @@
1
+ import PropTypes from 'prop-types';
2
+ export const propTypes = {
3
+ $ui_appearance: PropTypes.oneOf(['light', 'dark', 'pureDark']),
4
+ $ui_theme: PropTypes.oneOf(['blue', 'green', 'orange', 'red', 'yellow']),
5
+ $data_library: PropTypes.arrayOf(PropTypes.oneOf(['component', 'dot', 'svg'])),
6
+ $ui_baseZoomSize: PropTypes.number,
7
+ $ui_baseFontSize: PropTypes.number,
8
+ $method_providerRef: PropTypes.func,
9
+ $method_getAssetPromise: PropTypes.func,
10
+ $data_sizeVariableName: PropTypes.string,
11
+ $data_fontSizeVariableName: PropTypes.string
12
+ };
@@ -0,0 +1,46 @@
1
+ export const appearanceImports = {
2
+ Lib_LightMode_Component: () => import(
3
+ /* webpackChunkName: 'Lib_LightMode_Component' */
4
+ '@zohodesk/components/assets/Appearance/light/mode/Component_LightMode.module.css'),
5
+ Lib_DarkMode_Component: () => import(
6
+ /* webpackChunkName: 'Lib_DarkMode_Component' */
7
+ '@zohodesk/components/assets/Appearance/dark/mode/Component_DarkMode.module.css'),
8
+ Lib_PureDarkMode_Component: () => import(
9
+ /* webpackChunkName: 'Lib_PureDarkMode_Component' */
10
+ '@zohodesk/components/assets/Appearance/pureDark/mode/Component_PureDarkMode.module.css'),
11
+ Lib_LightMode_Dot: () => import(
12
+ /* webpackChunkName: 'Lib_LightMode_Dot' */
13
+ './../../../../assets/Appearance/light/mode/Dot_LightMode.module.css'),
14
+ Lib_DarkMode_Dot: () => import(
15
+ /* webpackChunkName: 'Lib_DarkMode_Dot' */
16
+ './../../../../assets/Appearance/dark/mode/Dot_DarkMode.module.css'),
17
+ Lib_PureDarkMode_Dot: () => import(
18
+ /* webpackChunkName: 'Lib_PureDarkMode_Dot' */
19
+ './../../../../assets/Appearance/pureDark/mode/Dot_PureDarkMode.module.css'),
20
+ Lib_LightMode_SVG: () => import(
21
+ /* webpackChunkName: 'Lib_LightMode_SVG' */
22
+ '@zohodesk/svg/assets/Appearance/light/mode/SVG_LightMode.module.css'),
23
+ Lib_DarkMode_SVG: () => import(
24
+ /* webpackChunkName: 'Lib_DarkMode_SVG' */
25
+ '@zohodesk/svg/assets/Appearance/dark/mode/SVG_DarkMode.module.css'),
26
+ Lib_PureDarkMode_SVG: () => import(
27
+ /* webpackChunkName: 'Lib_PureDarkMode_SVG' */
28
+ '@zohodesk/svg/assets/Appearance/pureDark/mode/SVG_PureDarkMode.module.css')
29
+ };
30
+ export const appearanceMapping = {
31
+ component: {
32
+ light: 'Lib_LightMode_Component',
33
+ dark: 'Lib_DarkMode_Component',
34
+ pureDark: 'Lib_PureDarkMode_Component'
35
+ },
36
+ dot: {
37
+ light: 'Lib_LightMode_Dot',
38
+ dark: 'Lib_DarkMode_Dot',
39
+ pureDark: 'Lib_PureDarkMode_Dot'
40
+ },
41
+ svg: {
42
+ light: 'Lib_LightMode_SVG',
43
+ dark: 'Lib_DarkMode_SVG',
44
+ pureDark: 'Lib_PureDarkMode_SVG'
45
+ }
46
+ };
@@ -0,0 +1,7 @@
1
+ export function errorMessage(array, value, type) {
2
+ if (!array.includes(value)) {
3
+ throw new Error(`We do not support the '${value} ${type}'. Please provide valid '${type}' name or check spelling.`);
4
+ }
5
+
6
+ return;
7
+ }
@@ -0,0 +1,18 @@
1
+ export function importFiles(_ref) {
2
+ let {
3
+ file,
4
+ imports
5
+ } = _ref;
6
+ const promises = [];
7
+ file.forEach(fileKey => {
8
+ if (imports[fileKey]) {
9
+ promises.push(imports[fileKey]());
10
+ } else {
11
+ console.error(`Import not found for ${fileKey}`);
12
+ }
13
+ });
14
+ return Promise.all(promises).then(() => Promise.resolve()).catch(error => {
15
+ console.error(`Error importing files:`, error);
16
+ return Promise.reject(error);
17
+ });
18
+ }
@@ -0,0 +1,12 @@
1
+ export const imports = {
2
+ Lib_ZoomSize: () => import(
3
+ /* webpackChunkName: 'Lib_ZoomSize' */
4
+ '@zohodesk/variables/assets/sizeVariables.module.css'),
5
+ Lib_FontSize: () => import(
6
+ /* webpackChunkName: 'Lib_FontSize' */
7
+ '@zohodesk/variables/assets/fontsizeVariables.module.css')
8
+ };
9
+ export const mapping = {
10
+ zoomSize: 'Lib_ZoomSize',
11
+ fontSize: 'Lib_FontSize'
12
+ };