@zohodesk/dot 1.0.0-temp-198.3.3 → 1.0.0-temp-187.1
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.
- package/.cli/UnValidatedFiles.html +1 -1
- package/.cli/propValidation_report.html +1 -1
- package/README.md +28 -0
- package/assets/Appearance/dark/mode/Dot_DarkMode.module.css +1 -0
- package/assets/Appearance/light/mode/Dot_LightMode.module.css +1 -0
- package/assets/Appearance/pureDark/mode/Dot_PureDarkMode.module.css +1 -0
- package/es/ActionButton/ActionButton.module.css +192 -192
- package/es/AlphabeticList/AlphabeticList.module.css +57 -57
- package/es/AttachmentViewer/AttachmentImage.js +68 -32
- package/es/AttachmentViewer/AttachmentViewer.js +120 -41
- package/es/AttachmentViewer/AttachmentViewer.module.css +364 -352
- package/es/AttachmentViewer/__tests__/AttachmentImage.spec.js +63 -13
- package/es/AttachmentViewer/__tests__/__snapshots__/AttachmentImage.spec.js.snap +9 -5
- package/es/AttachmentViewer/__tests__/__snapshots__/AttachmentViewer.spec.js.snap +16 -117
- package/es/AttachmentViewer/props/defaultProps.js +5 -1
- package/es/AttachmentViewer/props/propTypes.js +7 -3
- package/es/AttachmentViewer/utils.js +49 -0
- package/es/ChannelIcon/ChannelIcon.module.css +225 -225
- package/es/FormAction/FormAction.module.css +100 -100
- package/es/IconButton/IconButton.module.css +22 -22
- package/es/Image/Image.js +6 -2
- package/es/Image/props/propTypes.js +3 -1
- package/es/TagWithIcon/TagWithIcon.module.css +66 -66
- package/es/avatar/AvatarIcon/AvatarIcon.module.css +58 -58
- package/es/common/dot_boxShadow.module.css +2 -0
- package/es/emptystate/CommonEmptyState/CommonEmptyState.module.css +92 -92
- package/es/form/fields/TagsMultiSelect/TagsMultiSelect.js +4 -2
- package/es/form/fields/TextEditor/TextEditor.js +64 -64
- package/es/form/fields/TextEditor/TextEditor.module.css +73 -61
- package/es/form/fields/TextEditor/__tests__/__snapshots__/TextEditor.spec.js.snap +1 -1
- package/es/form/fields/TextEditor/props/defaultProps.js +4 -1
- package/es/form/fields/TextEditor/props/propTypes.js +10 -3
- package/es/form/fields/ValidationMessage/ValidationMessage.module.css +27 -27
- package/es/layout/SubtabLayout/SubtabLayout.module.css +164 -164
- package/es/list/Comment/Comment.module.css +29 -29
- package/es/list/DepartmentDropDown/DepartmentDropDown.js +7 -2
- package/es/list/DepartmentDropDown/props/defaultProps.js +2 -1
- package/es/list/DepartmentDropDown/props/propTypes.js +2 -1
- package/es/list/Dot/Dot.module.css +15 -15
- package/es/list/ListLayout/ListLayout.module.css +79 -79
- package/es/list/Subject/Subject.module.css +34 -34
- package/es/list/Thread/Thread.module.css +42 -42
- package/es/list/status/StatusListItem/StatusListItem.module.css +35 -5
- package/es/utils/editorUtils.js +6 -6
- package/es/v1/AttachmentViewer/AttachmentImage.js +44 -23
- package/es/v1/AttachmentViewer/AttachmentViewer.js +120 -41
- package/es/v1/AttachmentViewer/props/propTypes.js +7 -3
- package/es/v1/Image/Image.js +6 -2
- package/es/v1/Image/props/propTypes.js +3 -1
- package/es/v1/form/fields/TextEditor/TextEditor.js +63 -64
- package/es/v1/form/fields/TextEditor/props/defaultProps.js +4 -1
- package/es/v1/form/fields/TextEditor/props/propTypes.js +10 -3
- package/es/v1/utils/editorUtils.js +6 -6
- package/es/version2/GlobalNotification/GlobalNotification.module.css +177 -177
- package/es/version2/lookup/AlertHeader/css/AlertHeaderNew.module.css +87 -87
- package/es/version2/notification/DesktopNotificationHeader/DesktopNotificationHeader.module.css +132 -132
- package/lib/ActionButton/ActionButton.module.css +192 -192
- package/lib/AlphabeticList/AlphabeticList.module.css +57 -57
- package/lib/AttachmentViewer/AttachmentImage.js +74 -36
- package/lib/AttachmentViewer/AttachmentViewer.js +151 -70
- package/lib/AttachmentViewer/AttachmentViewer.module.css +364 -352
- package/lib/AttachmentViewer/__tests__/AttachmentImage.spec.js +64 -13
- package/lib/AttachmentViewer/__tests__/__snapshots__/AttachmentImage.spec.js.snap +9 -5
- package/lib/AttachmentViewer/__tests__/__snapshots__/AttachmentViewer.spec.js.snap +16 -117
- package/lib/AttachmentViewer/props/defaultProps.js +5 -1
- package/lib/AttachmentViewer/props/propTypes.js +7 -3
- package/lib/AttachmentViewer/utils.js +60 -1
- package/lib/ChannelIcon/ChannelIcon.module.css +225 -225
- package/lib/FormAction/FormAction.module.css +100 -100
- package/lib/IconButton/IconButton.module.css +22 -22
- package/lib/Image/Image.js +6 -2
- package/lib/Image/props/propTypes.js +3 -1
- package/lib/TagWithIcon/TagWithIcon.module.css +66 -66
- package/lib/avatar/AvatarIcon/AvatarIcon.module.css +58 -58
- package/lib/common/dot_boxShadow.module.css +2 -0
- package/lib/emptystate/CommonEmptyState/CommonEmptyState.module.css +92 -92
- package/lib/form/fields/TagsMultiSelect/TagsMultiSelect.js +5 -3
- package/lib/form/fields/TextEditor/TextEditor.js +74 -74
- package/lib/form/fields/TextEditor/TextEditor.module.css +73 -61
- package/lib/form/fields/TextEditor/__tests__/__snapshots__/TextEditor.spec.js.snap +1 -1
- package/lib/form/fields/TextEditor/props/defaultProps.js +4 -1
- package/lib/form/fields/TextEditor/props/propTypes.js +10 -3
- package/lib/form/fields/ValidationMessage/ValidationMessage.module.css +27 -27
- package/lib/layout/SubtabLayout/SubtabLayout.module.css +164 -164
- package/lib/list/Comment/Comment.module.css +29 -29
- package/lib/list/DepartmentDropDown/DepartmentDropDown.js +8 -3
- package/lib/list/DepartmentDropDown/props/defaultProps.js +2 -1
- package/lib/list/DepartmentDropDown/props/propTypes.js +1 -1
- package/lib/list/Dot/Dot.module.css +15 -15
- package/lib/list/ListLayout/ListLayout.module.css +79 -79
- package/lib/list/Subject/Subject.module.css +34 -34
- package/lib/list/Thread/Thread.module.css +42 -42
- package/lib/list/status/StatusListItem/StatusListItem.module.css +35 -5
- package/lib/utils/editorUtils.js +6 -5
- package/lib/v1/AttachmentViewer/AttachmentImage.js +52 -24
- package/lib/v1/AttachmentViewer/AttachmentViewer.js +151 -70
- package/lib/v1/AttachmentViewer/props/propTypes.js +7 -3
- package/lib/v1/Image/Image.js +6 -2
- package/lib/v1/Image/props/propTypes.js +3 -1
- package/lib/v1/form/fields/TextEditor/TextEditor.js +73 -74
- package/lib/v1/form/fields/TextEditor/props/defaultProps.js +4 -1
- package/lib/v1/form/fields/TextEditor/props/propTypes.js +10 -3
- package/lib/v1/utils/editorUtils.js +6 -5
- package/lib/version2/GlobalNotification/GlobalNotification.module.css +177 -177
- package/lib/version2/lookup/AlertHeader/css/AlertHeaderNew.module.css +87 -87
- package/lib/version2/notification/DesktopNotificationHeader/DesktopNotificationHeader.module.css +132 -132
- package/package.json +3 -3
- package/result.json +1 -1
- package/unittest/index.html +1 -1
- package/es/DotProvider/DotProvider.js +0 -60
- package/es/DotProvider/hooks/useDotProvider.js +0 -55
- package/es/DotProvider/hooks/useDownloadAssetsAndSetAttr.js +0 -97
- package/es/DotProvider/libraryChunks/themes/component/blue/Blue_Dark_Component.js +0 -3
- package/es/DotProvider/libraryChunks/themes/component/blue/Blue_Light_Component.js +0 -3
- package/es/DotProvider/libraryChunks/themes/component/blue/Blue_PureDark_Component.js +0 -3
- package/es/DotProvider/libraryChunks/themes/component/green/Green_Dark_Component.js +0 -3
- package/es/DotProvider/libraryChunks/themes/component/green/Green_Light_Component.js +0 -3
- package/es/DotProvider/libraryChunks/themes/component/green/Green_PureDark_Component.js +0 -3
- package/es/DotProvider/libraryChunks/themes/component/orange/Orange_Dark_Component.js +0 -3
- package/es/DotProvider/libraryChunks/themes/component/orange/Orange_Light_Component.js +0 -3
- package/es/DotProvider/libraryChunks/themes/component/orange/Orange_PureDark_Component.js +0 -3
- package/es/DotProvider/libraryChunks/themes/component/red/Red_Dark_Component.js +0 -3
- package/es/DotProvider/libraryChunks/themes/component/red/Red_Light_Component.js +0 -3
- package/es/DotProvider/libraryChunks/themes/component/red/Red_PureDark_Component.js +0 -3
- package/es/DotProvider/libraryChunks/themes/component/yellow/Yellow_Dark_Component.js +0 -3
- package/es/DotProvider/libraryChunks/themes/component/yellow/Yellow_Light_Component.js +0 -3
- package/es/DotProvider/libraryChunks/themes/component/yellow/Yellow_PureDark_Component.js +0 -3
- package/es/DotProvider/libraryChunks/themes/dot/blue/Blue_Dark_Dot.js +0 -1
- package/es/DotProvider/libraryChunks/themes/dot/blue/Blue_Light_Dot.js +0 -1
- package/es/DotProvider/libraryChunks/themes/dot/blue/Blue_PureDark_Dot.js +0 -1
- package/es/DotProvider/libraryChunks/themes/dot/green/Green_Dark_Dot.js +0 -1
- package/es/DotProvider/libraryChunks/themes/dot/green/Green_Light_Dot.js +0 -1
- package/es/DotProvider/libraryChunks/themes/dot/green/Green_PureDark_Dot.js +0 -1
- package/es/DotProvider/libraryChunks/themes/dot/orange/Orange_Dark_Dot.js +0 -1
- package/es/DotProvider/libraryChunks/themes/dot/orange/Orange_Light_Dot.js +0 -1
- package/es/DotProvider/libraryChunks/themes/dot/orange/Orange_PureDark_Dot.js +0 -1
- package/es/DotProvider/libraryChunks/themes/dot/red/Red_Dark_Dot.js +0 -1
- package/es/DotProvider/libraryChunks/themes/dot/red/Red_Light_Dot.js +0 -1
- package/es/DotProvider/libraryChunks/themes/dot/red/Red_PureDark_Dot.js +0 -1
- package/es/DotProvider/libraryChunks/themes/dot/yellow/Yellow_Dark_Dot.js +0 -1
- package/es/DotProvider/libraryChunks/themes/dot/yellow/Yellow_Light_Dot.js +0 -1
- package/es/DotProvider/libraryChunks/themes/dot/yellow/Yellow_PureDark_Dot.js +0 -1
- package/es/DotProvider/libraryChunks/themes/svg/blue/Blue_Dark_SVG.js +0 -1
- package/es/DotProvider/libraryChunks/themes/svg/blue/Blue_Light_SVG.js +0 -1
- package/es/DotProvider/libraryChunks/themes/svg/blue/Blue_PureDark_SVG.js +0 -1
- package/es/DotProvider/libraryChunks/themes/svg/green/Green_Dark_SVG.js +0 -1
- package/es/DotProvider/libraryChunks/themes/svg/green/Green_Light_SVG.js +0 -1
- package/es/DotProvider/libraryChunks/themes/svg/green/Green_PureDark_SVG.js +0 -1
- package/es/DotProvider/libraryChunks/themes/svg/orange/Orange_Dark_SVG.js +0 -1
- package/es/DotProvider/libraryChunks/themes/svg/orange/Orange_Light_SVG.js +0 -1
- package/es/DotProvider/libraryChunks/themes/svg/orange/Orange_PureDark_SVG.js +0 -1
- package/es/DotProvider/libraryChunks/themes/svg/red/Red_Dark_SVG.js +0 -1
- package/es/DotProvider/libraryChunks/themes/svg/red/Red_Light_SVG.js +0 -1
- package/es/DotProvider/libraryChunks/themes/svg/red/Red_PureDark_SVG.js +0 -1
- package/es/DotProvider/libraryChunks/themes/svg/yellow/Yellow_Dark_SVG.js +0 -1
- package/es/DotProvider/libraryChunks/themes/svg/yellow/Yellow_Light_SVG.js +0 -1
- package/es/DotProvider/libraryChunks/themes/svg/yellow/Yellow_PureDark_SVG.js +0 -1
- package/es/DotProvider/props/defaultProps.js +0 -11
- package/es/DotProvider/props/propTypes.js +0 -16
- package/es/DotProvider/utils/assetPromiseHandlers/fontSizeAssetPromise.js +0 -4
- package/es/DotProvider/utils/assetPromiseHandlers/themeAppearanceAssetPromise.js +0 -28
- package/es/DotProvider/utils/assetPromiseHandlers/themeColorAssetPromise.js +0 -29
- package/es/DotProvider/utils/assetPromiseHandlers/zoomSizeAssetPromise.js +0 -4
- package/es/DotProvider/utils/constants.js +0 -14
- package/es/DotProvider/utils/errorValidation.js +0 -17
- package/es/DotProvider/utils/getAssetsImportPromises.js +0 -17
- package/es/DotProvider/utils/sizeAssetsConfig.js +0 -12
- package/es/DotProvider/utils/themeAppearanceAssetsConfig.js +0 -47
- package/es/DotProvider/utils/themeColorAssetsConfig.js +0 -221
- package/lib/DotProvider/DotProvider.js +0 -88
- package/lib/DotProvider/hooks/useDotProvider.js +0 -83
- package/lib/DotProvider/hooks/useDownloadAssetsAndSetAttr.js +0 -119
- package/lib/DotProvider/libraryChunks/themes/component/blue/Blue_Dark_Component.js +0 -7
- package/lib/DotProvider/libraryChunks/themes/component/blue/Blue_Light_Component.js +0 -7
- package/lib/DotProvider/libraryChunks/themes/component/blue/Blue_PureDark_Component.js +0 -7
- package/lib/DotProvider/libraryChunks/themes/component/green/Green_Dark_Component.js +0 -7
- package/lib/DotProvider/libraryChunks/themes/component/green/Green_Light_Component.js +0 -7
- package/lib/DotProvider/libraryChunks/themes/component/green/Green_PureDark_Component.js +0 -7
- package/lib/DotProvider/libraryChunks/themes/component/orange/Orange_Dark_Component.js +0 -7
- package/lib/DotProvider/libraryChunks/themes/component/orange/Orange_Light_Component.js +0 -7
- package/lib/DotProvider/libraryChunks/themes/component/orange/Orange_PureDark_Component.js +0 -7
- package/lib/DotProvider/libraryChunks/themes/component/red/Red_Dark_Component.js +0 -7
- package/lib/DotProvider/libraryChunks/themes/component/red/Red_Light_Component.js +0 -7
- package/lib/DotProvider/libraryChunks/themes/component/red/Red_PureDark_Component.js +0 -7
- package/lib/DotProvider/libraryChunks/themes/component/yellow/Yellow_Dark_Component.js +0 -7
- package/lib/DotProvider/libraryChunks/themes/component/yellow/Yellow_Light_Component.js +0 -7
- package/lib/DotProvider/libraryChunks/themes/component/yellow/Yellow_PureDark_Component.js +0 -7
- package/lib/DotProvider/libraryChunks/themes/dot/blue/Blue_Dark_Dot.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/dot/blue/Blue_Light_Dot.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/dot/blue/Blue_PureDark_Dot.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/dot/green/Green_Dark_Dot.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/dot/green/Green_Light_Dot.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/dot/green/Green_PureDark_Dot.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/dot/orange/Orange_Dark_Dot.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/dot/orange/Orange_Light_Dot.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/dot/orange/Orange_PureDark_Dot.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/dot/red/Red_Dark_Dot.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/dot/red/Red_Light_Dot.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/dot/red/Red_PureDark_Dot.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/dot/yellow/Yellow_Dark_Dot.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/dot/yellow/Yellow_Light_Dot.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/dot/yellow/Yellow_PureDark_Dot.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/svg/blue/Blue_Dark_SVG.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/svg/blue/Blue_Light_SVG.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/svg/blue/Blue_PureDark_SVG.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/svg/green/Green_Dark_SVG.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/svg/green/Green_Light_SVG.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/svg/green/Green_PureDark_SVG.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/svg/orange/Orange_Dark_SVG.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/svg/orange/Orange_Light_SVG.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/svg/orange/Orange_PureDark_SVG.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/svg/red/Red_Dark_SVG.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/svg/red/Red_Light_SVG.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/svg/red/Red_PureDark_SVG.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/svg/yellow/Yellow_Dark_SVG.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/svg/yellow/Yellow_Light_SVG.js +0 -3
- package/lib/DotProvider/libraryChunks/themes/svg/yellow/Yellow_PureDark_SVG.js +0 -3
- package/lib/DotProvider/props/defaultProps.js +0 -20
- package/lib/DotProvider/props/propTypes.js +0 -28
- package/lib/DotProvider/utils/assetPromiseHandlers/fontSizeAssetPromise.js +0 -12
- package/lib/DotProvider/utils/assetPromiseHandlers/themeAppearanceAssetPromise.js +0 -39
- package/lib/DotProvider/utils/assetPromiseHandlers/themeColorAssetPromise.js +0 -40
- package/lib/DotProvider/utils/assetPromiseHandlers/zoomSizeAssetPromise.js +0 -12
- package/lib/DotProvider/utils/constants.js +0 -34
- package/lib/DotProvider/utils/errorValidation.js +0 -25
- package/lib/DotProvider/utils/getAssetsImportPromises.js +0 -22
- package/lib/DotProvider/utils/sizeAssetsConfig.js +0 -31
- package/lib/DotProvider/utils/themeAppearanceAssetsConfig.js +0 -69
- package/lib/DotProvider/utils/themeColorAssetsConfig.js +0 -249
package/unittest/index.html
CHANGED
|
@@ -1,60 +0,0 @@
|
|
|
1
|
-
import React, { useRef, useCallback, forwardRef } from "react";
|
|
2
|
-
import { defaultProps } from "./props/defaultProps";
|
|
3
|
-
import { propTypes } from "./props/propTypes";
|
|
4
|
-
import useDotProvider from "./hooks/useDotProvider";
|
|
5
|
-
const DotProvider = /*#__PURE__*/forwardRef((props, ref) => {
|
|
6
|
-
const {
|
|
7
|
-
tag: Element = 'div',
|
|
8
|
-
themeAppearance,
|
|
9
|
-
themeColor,
|
|
10
|
-
baseZoomUnit,
|
|
11
|
-
baseFontUnit,
|
|
12
|
-
zoomUnitVariable,
|
|
13
|
-
fontUnitVariable,
|
|
14
|
-
themeAppearanceAttr,
|
|
15
|
-
themeColorAttr,
|
|
16
|
-
providerRef,
|
|
17
|
-
onAssetsDownloadSuccess,
|
|
18
|
-
getAssetsPromises,
|
|
19
|
-
children,
|
|
20
|
-
...rest
|
|
21
|
-
} = props;
|
|
22
|
-
const wrapperElementRef = useRef(null);
|
|
23
|
-
const getProviderElement = useCallback(() => {
|
|
24
|
-
if (typeof providerRef === 'function') {
|
|
25
|
-
return providerRef();
|
|
26
|
-
} else if (Element !== React.Fragment) {
|
|
27
|
-
return wrapperElementRef.current;
|
|
28
|
-
} else {
|
|
29
|
-
return document.documentElement;
|
|
30
|
-
}
|
|
31
|
-
}, [providerRef, Element]);
|
|
32
|
-
const getEleRef = useCallback(ele => {
|
|
33
|
-
wrapperElementRef.current = ele;
|
|
34
|
-
|
|
35
|
-
if (ref && typeof ref === 'function') {
|
|
36
|
-
ref(ele);
|
|
37
|
-
} else if (ref && typeof ref === 'object') {
|
|
38
|
-
ref.current = ele;
|
|
39
|
-
}
|
|
40
|
-
}, [ref]);
|
|
41
|
-
useDotProvider({
|
|
42
|
-
themeAppearance: themeAppearance,
|
|
43
|
-
themeColor: themeColor,
|
|
44
|
-
themeAppearanceAttr: themeAppearanceAttr,
|
|
45
|
-
themeColorAttr: themeColorAttr,
|
|
46
|
-
baseZoomUnit: baseZoomUnit,
|
|
47
|
-
baseFontUnit: baseFontUnit,
|
|
48
|
-
zoomUnitVariable: zoomUnitVariable,
|
|
49
|
-
fontUnitVariable: fontUnitVariable,
|
|
50
|
-
getProviderElement,
|
|
51
|
-
onAssetsDownloadSuccess: onAssetsDownloadSuccess,
|
|
52
|
-
getAssetsPromises: getAssetsPromises
|
|
53
|
-
});
|
|
54
|
-
return /*#__PURE__*/React.createElement(Element, { ...rest,
|
|
55
|
-
ref: getEleRef
|
|
56
|
-
}, children);
|
|
57
|
-
});
|
|
58
|
-
DotProvider.propTypes = propTypes;
|
|
59
|
-
DotProvider.defaultProps = defaultProps;
|
|
60
|
-
export default DotProvider;
|
|
@@ -1,55 +0,0 @@
|
|
|
1
|
-
import { useLayoutEffect } from 'react';
|
|
2
|
-
import useDownloadAssetsAndSetAttr from "./useDownloadAssetsAndSetAttr";
|
|
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
|
-
|
|
13
|
-
function useDotProvider(_ref) {
|
|
14
|
-
let {
|
|
15
|
-
themeAppearance,
|
|
16
|
-
themeColor,
|
|
17
|
-
baseZoomUnit,
|
|
18
|
-
baseFontUnit,
|
|
19
|
-
getProviderElement,
|
|
20
|
-
zoomUnitVariable,
|
|
21
|
-
fontUnitVariable,
|
|
22
|
-
themeAppearanceAttr,
|
|
23
|
-
themeColorAttr,
|
|
24
|
-
onAssetsDownloadSuccess,
|
|
25
|
-
getAssetsPromises
|
|
26
|
-
} = _ref;
|
|
27
|
-
const assetsPromises = useDownloadAssetsAndSetAttr({
|
|
28
|
-
themeAppearance,
|
|
29
|
-
themeColor,
|
|
30
|
-
baseZoomUnit,
|
|
31
|
-
baseFontUnit,
|
|
32
|
-
getProviderElement,
|
|
33
|
-
zoomUnitVariable,
|
|
34
|
-
fontUnitVariable,
|
|
35
|
-
themeAppearanceAttr,
|
|
36
|
-
themeColorAttr
|
|
37
|
-
});
|
|
38
|
-
const {
|
|
39
|
-
themeAppearancePromise,
|
|
40
|
-
themeColorPromise,
|
|
41
|
-
zoomSizePromise,
|
|
42
|
-
fontSizePromise
|
|
43
|
-
} = assetsPromises;
|
|
44
|
-
const allPromises = [...themeAppearancePromise, ...themeColorPromise, zoomSizePromise, fontSizePromise];
|
|
45
|
-
useLayoutEffect(() => {
|
|
46
|
-
Promise.all(allPromises).then(() => {
|
|
47
|
-
typeof onAssetsDownloadSuccess === 'function' && onAssetsDownloadSuccess();
|
|
48
|
-
}).catch(error => {
|
|
49
|
-
console.error('Error loading assets:', error);
|
|
50
|
-
});
|
|
51
|
-
typeof getAssetsPromises === 'function' && getAssetsPromises(assetsPromises);
|
|
52
|
-
}, [...allPromises]);
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
export default useDotProvider;
|
|
@@ -1,97 +0,0 @@
|
|
|
1
|
-
import { useMemo, useLayoutEffect } from 'react';
|
|
2
|
-
import { getThemeAppearanceAssetPromise } from "../utils/assetPromiseHandlers/themeAppearanceAssetPromise.js";
|
|
3
|
-
import { getThemeColorAssetPromise } from "../utils/assetPromiseHandlers/themeColorAssetPromise.js";
|
|
4
|
-
import { getFontSizeAssetPromise } from "../utils/assetPromiseHandlers/fontSizeAssetPromise.js";
|
|
5
|
-
import { getZoomSizeAssetPromise } from "../utils/assetPromiseHandlers/zoomSizeAssetPromise.js";
|
|
6
|
-
export default function useDownloadAssetsAndSetAttr(_ref) {
|
|
7
|
-
let {
|
|
8
|
-
themeAppearance,
|
|
9
|
-
themeColor,
|
|
10
|
-
baseZoomUnit,
|
|
11
|
-
baseFontUnit,
|
|
12
|
-
getProviderElement,
|
|
13
|
-
zoomUnitVariable,
|
|
14
|
-
fontUnitVariable,
|
|
15
|
-
themeAppearanceAttr,
|
|
16
|
-
themeColorAttr
|
|
17
|
-
} = _ref;
|
|
18
|
-
const themeAppearancePromise = useMemo(() => {
|
|
19
|
-
const themeAppearanceAssetPromise = getThemeAppearanceAssetPromise({
|
|
20
|
-
themeAppearance
|
|
21
|
-
});
|
|
22
|
-
return themeAppearanceAssetPromise;
|
|
23
|
-
}, [themeAppearance]);
|
|
24
|
-
const themeColorPromise = useMemo(() => {
|
|
25
|
-
const themeColorAssetPromise = getThemeColorAssetPromise({
|
|
26
|
-
themeAppearance,
|
|
27
|
-
themeColor
|
|
28
|
-
});
|
|
29
|
-
return themeColorAssetPromise;
|
|
30
|
-
}, [themeAppearance, themeColor]);
|
|
31
|
-
const modifiedZoomUnitWithSuffix = useMemo(() => {
|
|
32
|
-
return !isNaN(Number(baseZoomUnit)) ? `${Number(baseZoomUnit)}px` : baseZoomUnit;
|
|
33
|
-
}, [baseZoomUnit]);
|
|
34
|
-
const zoomSizePromise = useMemo(() => {
|
|
35
|
-
const assetPromise = getZoomSizeAssetPromise();
|
|
36
|
-
return assetPromise;
|
|
37
|
-
}, []);
|
|
38
|
-
const fontSizePromise = useMemo(() => {
|
|
39
|
-
const assetPromise = getFontSizeAssetPromise();
|
|
40
|
-
return assetPromise;
|
|
41
|
-
}, []);
|
|
42
|
-
const combinedPromise = {
|
|
43
|
-
themeAppearancePromise,
|
|
44
|
-
themeColorPromise,
|
|
45
|
-
zoomSizePromise,
|
|
46
|
-
fontSizePromise
|
|
47
|
-
};
|
|
48
|
-
|
|
49
|
-
function setThemeAttribute() {
|
|
50
|
-
const themePromise = [...themeAppearancePromise, ...themeColorPromise];
|
|
51
|
-
Promise.all(themePromise).then(() => {
|
|
52
|
-
const providerElement = getProviderElement();
|
|
53
|
-
|
|
54
|
-
if (providerElement) {
|
|
55
|
-
providerElement.setAttribute(themeAppearanceAttr, themeAppearance);
|
|
56
|
-
providerElement.setAttribute(themeColorAttr, themeColor);
|
|
57
|
-
}
|
|
58
|
-
}).catch(error => {
|
|
59
|
-
console.error('Error on setting theme appearance and color attributes:', error);
|
|
60
|
-
});
|
|
61
|
-
}
|
|
62
|
-
|
|
63
|
-
function setZoomSizeAttribute() {
|
|
64
|
-
zoomSizePromise.then(() => {
|
|
65
|
-
const providerElement = getProviderElement();
|
|
66
|
-
|
|
67
|
-
if (providerElement) {
|
|
68
|
-
providerElement.style.setProperty(zoomUnitVariable, modifiedZoomUnitWithSuffix);
|
|
69
|
-
}
|
|
70
|
-
}).catch(error => {
|
|
71
|
-
console.error('Error on setting zoom-size property', error);
|
|
72
|
-
});
|
|
73
|
-
}
|
|
74
|
-
|
|
75
|
-
function setFontSizeAttribute() {
|
|
76
|
-
fontSizePromise.then(() => {
|
|
77
|
-
const providerElement = getProviderElement();
|
|
78
|
-
|
|
79
|
-
if (providerElement) {
|
|
80
|
-
providerElement.style.setProperty(fontUnitVariable, baseFontUnit);
|
|
81
|
-
}
|
|
82
|
-
}).catch(error => {
|
|
83
|
-
console.error('Error on setting font-size property', error);
|
|
84
|
-
});
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
useLayoutEffect(() => {
|
|
88
|
-
setThemeAttribute();
|
|
89
|
-
}, [themeAppearanceAttr, themeColorAttr, themeAppearance, themeColor, getProviderElement]);
|
|
90
|
-
useLayoutEffect(() => {
|
|
91
|
-
setZoomSizeAttribute();
|
|
92
|
-
}, [zoomUnitVariable, modifiedZoomUnitWithSuffix, getProviderElement]);
|
|
93
|
-
useLayoutEffect(() => {
|
|
94
|
-
setFontSizeAttribute();
|
|
95
|
-
}, [fontUnitVariable, baseFontUnit, getProviderElement]);
|
|
96
|
-
return combinedPromise;
|
|
97
|
-
}
|
|
@@ -1,3 +0,0 @@
|
|
|
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';
|
|
@@ -1,3 +0,0 @@
|
|
|
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';
|
|
@@ -1,3 +0,0 @@
|
|
|
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';
|
|
@@ -1,3 +0,0 @@
|
|
|
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';
|
|
@@ -1,3 +0,0 @@
|
|
|
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';
|
|
@@ -1,3 +0,0 @@
|
|
|
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';
|
|
@@ -1,3 +0,0 @@
|
|
|
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';
|
|
@@ -1,3 +0,0 @@
|
|
|
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';
|
|
@@ -1,3 +0,0 @@
|
|
|
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';
|
|
@@ -1,3 +0,0 @@
|
|
|
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';
|
|
@@ -1,3 +0,0 @@
|
|
|
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';
|
|
@@ -1,3 +0,0 @@
|
|
|
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';
|
|
@@ -1,3 +0,0 @@
|
|
|
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';
|
|
@@ -1,3 +0,0 @@
|
|
|
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';
|
|
@@ -1,3 +0,0 @@
|
|
|
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';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import "./../../../../../../assets/Appearance/dark/themes/blue/blue_DotTheme_DarkTheme.module.css";
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import "./../../../../../../assets/Appearance/light/themes/blue/blue_DotTheme_LightTheme.module.css";
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import "./../../../../../../assets/Appearance/pureDark/themes/blue/blue_DotTheme_PureDarkTheme.module.css";
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import "./../../../../../../assets/Appearance/dark/themes/green/green_DotTheme_DarkTheme.module.css";
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import "./../../../../../../assets/Appearance/light/themes/green/green_DotTheme_LightTheme.module.css";
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import "./../../../../../../assets/Appearance/pureDark/themes/green/green_DotTheme_PureDarkTheme.module.css";
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import "./../../../../../../assets/Appearance/dark/themes/orange/orange_DotTheme_DarkTheme.module.css";
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import "./../../../../../../assets/Appearance/light/themes/orange/orange_DotTheme_LightTheme.module.css";
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import "./../../../../../../assets/Appearance/pureDark/themes/orange/orange_DotTheme_PureDarkTheme.module.css";
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import "./../../../../../../assets/Appearance/dark/themes/red/red_DotTheme_DarkTheme.module.css";
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import "./../../../../../../assets/Appearance/light/themes/red/red_DotTheme_LightTheme.module.css";
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import "./../../../../../../assets/Appearance/pureDark/themes/red/red_DotTheme_PureDarkTheme.module.css";
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import "./../../../../../../assets/Appearance/dark/themes/yellow/yellow_DotTheme_DarkTheme.module.css";
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import "./../../../../../../assets/Appearance/light/themes/yellow/yellow_DotTheme_LightTheme.module.css";
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import "./../../../../../../assets/Appearance/pureDark/themes/yellow/yellow_DotTheme_PureDarkTheme.module.css";
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import '@zohodesk/svg/assets/Appearance/dark/themes/blue/blue_SVGTheme_DarkTheme.module.css';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import '@zohodesk/svg/assets/Appearance/light/themes/blue/blue_SVGTheme_LightTheme.module.css';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import '@zohodesk/svg/assets/Appearance/pureDark/themes/blue/blue_SVGTheme_PureDarkTheme.module.css';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import '@zohodesk/svg/assets/Appearance/dark/themes/green/green_SVGTheme_DarkTheme.module.css';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import '@zohodesk/svg/assets/Appearance/light/themes/green/green_SVGTheme_LightTheme.module.css';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import '@zohodesk/svg/assets/Appearance/pureDark/themes/green/green_SVGTheme_PureDarkTheme.module.css';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import '@zohodesk/svg/assets/Appearance/dark/themes/orange/orange_SVGTheme_DarkTheme.module.css';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import '@zohodesk/svg/assets/Appearance/light/themes/orange/orange_SVGTheme_LightTheme.module.css';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import '@zohodesk/svg/assets/Appearance/pureDark/themes/orange/orange_SVGTheme_PureDarkTheme.module.css';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import '@zohodesk/svg/assets/Appearance/dark/themes/red/red_SVGTheme_DarkTheme.module.css';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import '@zohodesk/svg/assets/Appearance/light/themes/red/red_SVGTheme_LightTheme.module.css';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import '@zohodesk/svg/assets/Appearance/pureDark/themes/red/red_SVGTheme_PureDarkTheme.module.css';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import '@zohodesk/svg/assets/Appearance/dark/themes/yellow/yellow_SVGTheme_DarkTheme.module.css';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import '@zohodesk/svg/assets/Appearance/light/themes/yellow/yellow_SVGTheme_LightTheme.module.css';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import '@zohodesk/svg/assets/Appearance/pureDark/themes/yellow/yellow_SVGTheme_PureDarkTheme.module.css';
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import { THEME_APPEARANCE_LIGHT, THEME_COLOR_BLUE } from "../utils/constants";
|
|
2
|
-
export const defaultProps = {
|
|
3
|
-
themeAppearance: THEME_APPEARANCE_LIGHT,
|
|
4
|
-
themeColor: THEME_COLOR_BLUE,
|
|
5
|
-
baseZoomUnit: '1px',
|
|
6
|
-
baseFontUnit: '16px',
|
|
7
|
-
zoomUnitVariable: '--zd_baseUnit',
|
|
8
|
-
fontUnitVariable: '--zd_baseFontUnit',
|
|
9
|
-
themeAppearanceAttr: 'data-mode',
|
|
10
|
-
themeColorAttr: 'data-theme'
|
|
11
|
-
};
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import PropTypes from 'prop-types';
|
|
2
|
-
import { THEME_APPEARANCES, THEME_COLORS } from "../utils/constants";
|
|
3
|
-
export const propTypes = {
|
|
4
|
-
themeAppearance: PropTypes.oneOf(THEME_APPEARANCES),
|
|
5
|
-
themeColor: PropTypes.oneOf(THEME_COLORS),
|
|
6
|
-
baseZoomUnit: PropTypes.string,
|
|
7
|
-
baseFontUnit: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
8
|
-
zoomUnitVariable: PropTypes.string,
|
|
9
|
-
fontUnitVariable: PropTypes.string,
|
|
10
|
-
themeAppearanceAttr: PropTypes.string,
|
|
11
|
-
themeColorAttr: PropTypes.string,
|
|
12
|
-
providerRef: PropTypes.func,
|
|
13
|
-
onAssetsDownloadSuccess: PropTypes.func,
|
|
14
|
-
getAssetsPromises: PropTypes.func,
|
|
15
|
-
children: PropTypes.node
|
|
16
|
-
};
|
|
@@ -1,28 +0,0 @@
|
|
|
1
|
-
import { getAssetsImportPromises } from "../getAssetsImportPromises";
|
|
2
|
-
import { themeAppearanceImports, themeAppearanceMapping } from "../themeAppearanceAssetsConfig";
|
|
3
|
-
import { validateAndLogError } from "../errorValidation";
|
|
4
|
-
import { LIBRARIES, THEME_APPEARANCES } from "../constants";
|
|
5
|
-
export function getThemeAppearanceAssetPromise(_ref) {
|
|
6
|
-
let {
|
|
7
|
-
themeAppearance
|
|
8
|
-
} = _ref;
|
|
9
|
-
const isError = validateAndLogError({
|
|
10
|
-
options: THEME_APPEARANCES,
|
|
11
|
-
value: themeAppearance,
|
|
12
|
-
type: 'themeAppearance'
|
|
13
|
-
});
|
|
14
|
-
|
|
15
|
-
if (!isError) {
|
|
16
|
-
const assetImportKeys = [];
|
|
17
|
-
LIBRARIES.map(library => {
|
|
18
|
-
const assetImportKey = themeAppearanceMapping[library][themeAppearance];
|
|
19
|
-
assetImportKeys.push(assetImportKey);
|
|
20
|
-
});
|
|
21
|
-
return getAssetsImportPromises({
|
|
22
|
-
assetImportKeys: assetImportKeys,
|
|
23
|
-
assetImports: themeAppearanceImports
|
|
24
|
-
});
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
return [];
|
|
28
|
-
}
|
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
import { getAssetsImportPromises } from "../getAssetsImportPromises";
|
|
2
|
-
import { themeColorImports, themeColorMapping } from "../themeColorAssetsConfig";
|
|
3
|
-
import { validateAndLogError } from "../errorValidation";
|
|
4
|
-
import { LIBRARIES, THEME_COLORS } from "../constants";
|
|
5
|
-
export function getThemeColorAssetPromise(_ref) {
|
|
6
|
-
let {
|
|
7
|
-
themeAppearance,
|
|
8
|
-
themeColor
|
|
9
|
-
} = _ref;
|
|
10
|
-
const isError = validateAndLogError({
|
|
11
|
-
options: THEME_COLORS,
|
|
12
|
-
value: themeColor,
|
|
13
|
-
type: 'themeColor'
|
|
14
|
-
});
|
|
15
|
-
|
|
16
|
-
if (!isError) {
|
|
17
|
-
const assetImportKeys = [];
|
|
18
|
-
LIBRARIES.map(library => {
|
|
19
|
-
const assetImportKey = themeColorMapping[library][themeColor][themeAppearance];
|
|
20
|
-
assetImportKeys.push(assetImportKey);
|
|
21
|
-
});
|
|
22
|
-
return getAssetsImportPromises({
|
|
23
|
-
assetImportKeys: assetImportKeys,
|
|
24
|
-
assetImports: themeColorImports
|
|
25
|
-
});
|
|
26
|
-
}
|
|
27
|
-
|
|
28
|
-
return [];
|
|
29
|
-
}
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
export const LIBRARY_COMPONENT = 'component';
|
|
2
|
-
export const LIBRARY_DOT = 'dot';
|
|
3
|
-
export const LIBRARY_SVG = 'svg';
|
|
4
|
-
export const THEME_APPEARANCE_LIGHT = 'light';
|
|
5
|
-
export const THEME_APPEARANCE_DARK = 'dark';
|
|
6
|
-
export const THEME_APPEARANCE_PURE_DARK = 'pureDark';
|
|
7
|
-
export const THEME_COLOR_BLUE = 'blue';
|
|
8
|
-
export const THEME_COLOR_GREEN = 'green';
|
|
9
|
-
export const THEME_COLOR_ORANGE = 'orange';
|
|
10
|
-
export const THEME_COLOR_RED = 'red';
|
|
11
|
-
export const THEME_COLOR_YELLOW = 'yellow';
|
|
12
|
-
export const LIBRARIES = [LIBRARY_COMPONENT, LIBRARY_DOT, LIBRARY_SVG];
|
|
13
|
-
export const THEME_APPEARANCES = [THEME_APPEARANCE_LIGHT, THEME_APPEARANCE_DARK, THEME_APPEARANCE_PURE_DARK];
|
|
14
|
-
export const THEME_COLORS = [THEME_COLOR_BLUE, THEME_COLOR_GREEN, THEME_COLOR_ORANGE, THEME_COLOR_RED, THEME_COLOR_YELLOW];
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import { THEME_APPEARANCES, THEME_COLORS } from "./constants";
|
|
2
|
-
export function validateAndLogError(_ref) {
|
|
3
|
-
let {
|
|
4
|
-
options,
|
|
5
|
-
value,
|
|
6
|
-
type
|
|
7
|
-
} = _ref;
|
|
8
|
-
let isError = !options.includes(value);
|
|
9
|
-
|
|
10
|
-
if (isError) {
|
|
11
|
-
const themeAppearances = THEME_APPEARANCES.toString();
|
|
12
|
-
const themeColors = THEME_COLORS.toString();
|
|
13
|
-
console.error(`We do not support the '${value} ${type}'. Please provide valid '${type}' values or check spelling. DotProvider supports ${themeAppearances} appearance & ${themeColors} theme.`);
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
return isError;
|
|
17
|
-
}
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
export function getAssetsImportPromises(_ref) {
|
|
2
|
-
let {
|
|
3
|
-
assetImportKeys,
|
|
4
|
-
assetImports
|
|
5
|
-
} = _ref;
|
|
6
|
-
const promises = [];
|
|
7
|
-
assetImportKeys.forEach(importKey => {
|
|
8
|
-
const assetURL = assetImports[importKey];
|
|
9
|
-
|
|
10
|
-
if (assetURL) {
|
|
11
|
-
promises.push(assetURL());
|
|
12
|
-
} else {
|
|
13
|
-
console.error(`Import not found for ${importKey} from ${assetImports}`);
|
|
14
|
-
}
|
|
15
|
-
});
|
|
16
|
-
return promises;
|
|
17
|
-
}
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
export const sizeImports = {
|
|
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 sizeMapping = {
|
|
10
|
-
zoomSize: 'Lib_ZoomSize',
|
|
11
|
-
fontSize: 'Lib_FontSize'
|
|
12
|
-
};
|
|
@@ -1,47 +0,0 @@
|
|
|
1
|
-
import { LIBRARY_COMPONENT, LIBRARY_DOT, LIBRARY_SVG, THEME_APPEARANCE_DARK, THEME_APPEARANCE_LIGHT, THEME_APPEARANCE_PURE_DARK } from "./constants";
|
|
2
|
-
export const themeAppearanceImports = {
|
|
3
|
-
Lib_LightMode_Component: () => import(
|
|
4
|
-
/* webpackChunkName: 'Lib_LightMode_Component' */
|
|
5
|
-
'@zohodesk/components/assets/Appearance/light/mode/Component_LightMode.module.css'),
|
|
6
|
-
Lib_DarkMode_Component: () => import(
|
|
7
|
-
/* webpackChunkName: 'Lib_DarkMode_Component' */
|
|
8
|
-
'@zohodesk/components/assets/Appearance/dark/mode/Component_DarkMode.module.css'),
|
|
9
|
-
Lib_PureDarkMode_Component: () => import(
|
|
10
|
-
/* webpackChunkName: 'Lib_PureDarkMode_Component' */
|
|
11
|
-
'@zohodesk/components/assets/Appearance/pureDark/mode/Component_PureDarkMode.module.css'),
|
|
12
|
-
Lib_LightMode_Dot: () => import(
|
|
13
|
-
/* webpackChunkName: 'Lib_LightMode_Dot' */
|
|
14
|
-
"./../../../assets/Appearance/light/mode/Dot_LightMode.module.css"),
|
|
15
|
-
Lib_DarkMode_Dot: () => import(
|
|
16
|
-
/* webpackChunkName: 'Lib_DarkMode_Dot' */
|
|
17
|
-
"./../../../assets/Appearance/dark/mode/Dot_DarkMode.module.css"),
|
|
18
|
-
Lib_PureDarkMode_Dot: () => import(
|
|
19
|
-
/* webpackChunkName: 'Lib_PureDarkMode_Dot' */
|
|
20
|
-
"./../../../assets/Appearance/pureDark/mode/Dot_PureDarkMode.module.css"),
|
|
21
|
-
Lib_LightMode_SVG: () => import(
|
|
22
|
-
/* webpackChunkName: 'Lib_LightMode_SVG' */
|
|
23
|
-
'@zohodesk/svg/assets/Appearance/light/mode/SVG_LightMode.module.css'),
|
|
24
|
-
Lib_DarkMode_SVG: () => import(
|
|
25
|
-
/* webpackChunkName: 'Lib_DarkMode_SVG' */
|
|
26
|
-
'@zohodesk/svg/assets/Appearance/dark/mode/SVG_DarkMode.module.css'),
|
|
27
|
-
Lib_PureDarkMode_SVG: () => import(
|
|
28
|
-
/* webpackChunkName: 'Lib_PureDarkMode_SVG' */
|
|
29
|
-
'@zohodesk/svg/assets/Appearance/pureDark/mode/SVG_PureDarkMode.module.css')
|
|
30
|
-
};
|
|
31
|
-
export const themeAppearanceMapping = {
|
|
32
|
-
[LIBRARY_COMPONENT]: {
|
|
33
|
-
[THEME_APPEARANCE_LIGHT]: 'Lib_LightMode_Component',
|
|
34
|
-
[THEME_APPEARANCE_DARK]: 'Lib_DarkMode_Component',
|
|
35
|
-
[THEME_APPEARANCE_PURE_DARK]: 'Lib_PureDarkMode_Component'
|
|
36
|
-
},
|
|
37
|
-
[LIBRARY_DOT]: {
|
|
38
|
-
[THEME_APPEARANCE_LIGHT]: 'Lib_LightMode_Dot',
|
|
39
|
-
[THEME_APPEARANCE_DARK]: 'Lib_DarkMode_Dot',
|
|
40
|
-
[THEME_APPEARANCE_PURE_DARK]: 'Lib_PureDarkMode_Dot'
|
|
41
|
-
},
|
|
42
|
-
[LIBRARY_SVG]: {
|
|
43
|
-
[THEME_APPEARANCE_LIGHT]: 'Lib_LightMode_SVG',
|
|
44
|
-
[THEME_APPEARANCE_DARK]: 'Lib_DarkMode_SVG',
|
|
45
|
-
[THEME_APPEARANCE_PURE_DARK]: 'Lib_PureDarkMode_SVG'
|
|
46
|
-
}
|
|
47
|
-
};
|