@zohodesk/dot 1.9.11 → 1.9.12

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 (12) hide show
  1. package/README.md +6 -0
  2. package/es/DotProvider/props/defaultProps.js +1 -1
  3. package/es/version2/lookup/AlertHeader/AlertHeader.js +5 -3
  4. package/es/version2/lookup/AlertHeader/__tests__/AlertHeader.spec.js +24 -0
  5. package/es/version2/lookup/AlertHeader/__tests__/__snapshots__/AlertHeader.spec.js.snap +34 -0
  6. package/es/version2/lookup/AlertHeader/props/propTypes.js +2 -1
  7. package/lib/DotProvider/props/defaultProps.js +2 -2
  8. package/lib/version2/lookup/AlertHeader/AlertHeader.js +5 -2
  9. package/lib/version2/lookup/AlertHeader/__tests__/AlertHeader.spec.js +26 -0
  10. package/lib/version2/lookup/AlertHeader/__tests__/__snapshots__/AlertHeader.spec.js.snap +34 -0
  11. package/lib/version2/lookup/AlertHeader/props/propTypes.js +2 -1
  12. package/package.json +25 -23
package/README.md CHANGED
@@ -2,6 +2,12 @@
2
2
 
3
3
  In this Library, we Provide Some Basic Components to Build Your Application
4
4
 
5
+ # 1.9.12
6
+
7
+ - DUMMY_ARRAY import path issue fixed in DotProvider DefaultProps
8
+ - **version2/lookup/AlertHeader/AlertHeader**
9
+ - `renderAlertIcon` prop added. Accepts a React node or render function to replace the default icon rendered by `AlertIcons`.
10
+
5
11
  # 1.9.11
6
12
 
7
13
  - padding, margin based css properties migrated to padding-inline,padding-block, margin-inline, margin-block
package/es/DotProvider/props/defaultProps.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { THEME_APPEARANCE_LIGHT, THEME_COLOR_BLUE } from "../utils/constants";
2
- import { DUMMY_ARRAY } from '@zohodesk/utils';
2
+ import { DUMMY_ARRAY } from '@zohodesk/utils/es/constantProps/constant';
3
3
  export const defaultProps = {
4
4
  themeAppearance: THEME_APPEARANCE_LIGHT,
5
5
  themeColor: THEME_COLOR_BLUE,
package/es/version2/lookup/AlertHeader/AlertHeader.js CHANGED
@@ -2,7 +2,8 @@ import React, { useRef } from 'react'; //AlertDependencies
2
2
 
3
3
  import { Container, Box } from '@zohodesk/components/es/Layout';
4
4
  import AlertClose from "../../AlertClose/AlertClose";
5
- import AlertIcons from "../../alertIcons/AlertIcons"; //CSS
5
+ import AlertIcons from "../../alertIcons/AlertIcons";
6
+ import renderNode from '@zohodesk/utils/es/renderNode'; //CSS
6
7
 
7
8
  import style from "./css/AlertHeaderNew.module.css";
8
9
  import cssJSLogic from "./css/cssJSLogic";
@@ -24,7 +25,8 @@ export default function AlertHeader(props) {
24
25
  type,
25
26
  htmlId,
26
27
  customStyle,
27
- dragBoundaryLimit
28
+ dragBoundaryLimit,
29
+ renderAlertIcon
28
30
  } = props;
29
31
  const finalStyle = mergeStyle(style, customStyle);
30
32
  const {
@@ -51,7 +53,7 @@ export default function AlertHeader(props) {
51
53
  eleRef: dragRef
52
54
  }, needIcon && /*#__PURE__*/React.createElement("div", {
53
55
  className: finalStyle.iconContainer
54
- }, /*#__PURE__*/React.createElement(AlertIcons, {
56
+ }, renderNode(renderAlertIcon) || /*#__PURE__*/React.createElement(AlertIcons, {
55
57
  type: type
56
58
  })), (title || children) && /*#__PURE__*/React.createElement(Box, {
57
59
  flexible: true
package/es/version2/lookup/AlertHeader/__tests__/AlertHeader.spec.js CHANGED
@@ -8,4 +8,28 @@ describe('AlertHeader', () => {
8
8
  } = render( /*#__PURE__*/React.createElement(AlertHeader, null));
9
9
  expect(asFragment()).toMatchSnapshot();
10
10
  });
11
+ test('renders custom renderAlertIcon when needIcon is true', () => {
12
+ const customIcon = /*#__PURE__*/React.createElement("span", {
13
+ "data-test-id": "custom-icon"
14
+ }, "icon");
15
+ const {
16
+ asFragment
17
+ } = render( /*#__PURE__*/React.createElement(AlertHeader, {
18
+ needIcon: true,
19
+ renderAlertIcon: customIcon
20
+ }));
21
+ expect(asFragment()).toMatchSnapshot();
22
+ });
23
+ test('does not render custom renderAlertIcon when needIcon is false', () => {
24
+ const customIcon = /*#__PURE__*/React.createElement("span", {
25
+ "data-test-id": "custom-icon"
26
+ }, "icon");
27
+ const {
28
+ asFragment
29
+ } = render( /*#__PURE__*/React.createElement(AlertHeader, {
30
+ needIcon: false,
31
+ renderAlertIcon: customIcon
32
+ }));
33
+ expect(asFragment()).toMatchSnapshot();
34
+ });
11
35
  });
package/es/version2/lookup/AlertHeader/__tests__/__snapshots__/AlertHeader.spec.js.snap CHANGED
@@ -1,5 +1,17 @@
1
1
  // Jest Snapshot v1, https://goo.gl/fbAQLP
2
2
 
3
+ exports[`AlertHeader does not render custom renderAlertIcon when needIcon is false 1`] = `
4
+ <DocumentFragment>
5
+ <div
6
+ class="container danger flex rowdir wrap vCenter"
7
+ data-drag-hook="true"
8
+ data-id="containerComponent"
9
+ data-selector-id="container"
10
+ data-test-id="containerComponent"
11
+ />
12
+ </DocumentFragment>
13
+ `;
14
+
3
15
  exports[`AlertHeader rendering the defult props 1`] = `
4
16
  <DocumentFragment>
5
17
  <div
@@ -86,3 +98,25 @@ exports[`AlertHeader rendering the defult props 1`] = `
86
98
  </div>
87
99
  </DocumentFragment>
88
100
  `;
101
+
102
+ exports[`AlertHeader renders custom renderAlertIcon when needIcon is true 1`] = `
103
+ <DocumentFragment>
104
+ <div
105
+ class="container danger flex rowdir wrap vCenter"
106
+ data-drag-hook="true"
107
+ data-id="containerComponent"
108
+ data-selector-id="container"
109
+ data-test-id="containerComponent"
110
+ >
111
+ <div
112
+ class="iconContainer"
113
+ >
114
+ <span
115
+ data-test-id="custom-icon"
116
+ >
117
+ icon
118
+ </span>
119
+ </div>
120
+ </div>
121
+ </DocumentFragment>
122
+ `;
package/es/version2/lookup/AlertHeader/props/propTypes.js CHANGED
@@ -15,5 +15,6 @@ export default {
15
15
  left: PropTypes.number,
16
16
  right: PropTypes.number,
17
17
  bottom: PropTypes.number
18
- })
18
+ }),
19
+ renderAlertIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.node])
19
20
  };
package/lib/DotProvider/props/defaultProps.js CHANGED
@@ -7,7 +7,7 @@ exports.defaultProps = void 0;
7
7
 
8
8
  var _constants = require("../utils/constants");
9
9
 
10
- var _utils = require("@zohodesk/utils");
10
+ var _constant = require("@zohodesk/utils/es/constantProps/constant");
11
11
 
12
12
  var defaultProps = {
13
13
  themeAppearance: _constants.THEME_APPEARANCE_LIGHT,
@@ -16,7 +16,7 @@ var defaultProps = {
16
16
  baseFontUnit: '16px',
17
17
  zoomUnitVariable: '--zd_baseUnit',
18
18
  fontUnitVariable: '--zd_baseFontUnit',
19
- excludeFeatures: _utils.DUMMY_ARRAY,
19
+ excludeFeatures: _constant.DUMMY_ARRAY,
20
20
  themeAppearanceAttr: 'data-mode',
21
21
  themeColorAttr: 'data-theme'
22
22
  };
package/lib/version2/lookup/AlertHeader/AlertHeader.js CHANGED
@@ -15,6 +15,8 @@ var _AlertClose = _interopRequireDefault(require("../../AlertClose/AlertClose"))
15
15
 
16
16
  var _AlertIcons = _interopRequireDefault(require("../../alertIcons/AlertIcons"));
17
17
 
18
+ var _renderNode = _interopRequireDefault(require("@zohodesk/utils/es/renderNode"));
19
+
18
20
  var _AlertHeaderNewModule = _interopRequireDefault(require("./css/AlertHeaderNew.module.css"));
19
21
 
20
22
  var _cssJSLogic2 = _interopRequireDefault(require("./css/cssJSLogic"));
@@ -48,7 +50,8 @@ function AlertHeader(props) {
48
50
  type = props.type,
49
51
  htmlId = props.htmlId,
50
52
  customStyle = props.customStyle,
51
- dragBoundaryLimit = props.dragBoundaryLimit;
53
+ dragBoundaryLimit = props.dragBoundaryLimit,
54
+ renderAlertIcon = props.renderAlertIcon;
52
55
  var finalStyle = (0, _utils.mergeStyle)(_AlertHeaderNewModule["default"], customStyle);
53
56
 
54
57
  var _cssJSLogic = (0, _cssJSLogic2["default"])({
@@ -75,7 +78,7 @@ function AlertHeader(props) {
75
78
  eleRef: dragRef
76
79
  }, needIcon && /*#__PURE__*/_react["default"].createElement("div", {
77
80
  className: finalStyle.iconContainer
78
- }, /*#__PURE__*/_react["default"].createElement(_AlertIcons["default"], {
81
+ }, (0, _renderNode["default"])(renderAlertIcon) || /*#__PURE__*/_react["default"].createElement(_AlertIcons["default"], {
79
82
  type: type
80
83
  })), (title || children) && /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
81
84
  flexible: true
package/lib/version2/lookup/AlertHeader/__tests__/AlertHeader.spec.js CHANGED
@@ -15,4 +15,30 @@ describe('AlertHeader', function () {
15
15
 
16
16
  expect(asFragment()).toMatchSnapshot();
17
17
  });
18
+ test('renders custom renderAlertIcon when needIcon is true', function () {
19
+ var customIcon = /*#__PURE__*/_react["default"].createElement("span", {
20
+ "data-test-id": "custom-icon"
21
+ }, "icon");
22
+
23
+ var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_AlertHeader["default"], {
24
+ needIcon: true,
25
+ renderAlertIcon: customIcon
26
+ })),
27
+ asFragment = _render2.asFragment;
28
+
29
+ expect(asFragment()).toMatchSnapshot();
30
+ });
31
+ test('does not render custom renderAlertIcon when needIcon is false', function () {
32
+ var customIcon = /*#__PURE__*/_react["default"].createElement("span", {
33
+ "data-test-id": "custom-icon"
34
+ }, "icon");
35
+
36
+ var _render3 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_AlertHeader["default"], {
37
+ needIcon: false,
38
+ renderAlertIcon: customIcon
39
+ })),
40
+ asFragment = _render3.asFragment;
41
+
42
+ expect(asFragment()).toMatchSnapshot();
43
+ });
18
44
  });
package/lib/version2/lookup/AlertHeader/__tests__/__snapshots__/AlertHeader.spec.js.snap CHANGED
@@ -1,5 +1,17 @@
1
1
  // Jest Snapshot v1, https://goo.gl/fbAQLP
2
2
 
3
+ exports[`AlertHeader does not render custom renderAlertIcon when needIcon is false 1`] = `
4
+ <DocumentFragment>
5
+ <div
6
+ class="container danger flex rowdir wrap vCenter"
7
+ data-drag-hook="true"
8
+ data-id="containerComponent"
9
+ data-selector-id="container"
10
+ data-test-id="containerComponent"
11
+ />
12
+ </DocumentFragment>
13
+ `;
14
+
3
15
  exports[`AlertHeader rendering the defult props 1`] = `
4
16
  <DocumentFragment>
5
17
  <div
@@ -86,3 +98,25 @@ exports[`AlertHeader rendering the defult props 1`] = `
86
98
  </div>
87
99
  </DocumentFragment>
88
100
  `;
101
+
102
+ exports[`AlertHeader renders custom renderAlertIcon when needIcon is true 1`] = `
103
+ <DocumentFragment>
104
+ <div
105
+ class="container danger flex rowdir wrap vCenter"
106
+ data-drag-hook="true"
107
+ data-id="containerComponent"
108
+ data-selector-id="container"
109
+ data-test-id="containerComponent"
110
+ >
111
+ <div
112
+ class="iconContainer"
113
+ >
114
+ <span
115
+ data-test-id="custom-icon"
116
+ >
117
+ icon
118
+ </span>
119
+ </div>
120
+ </div>
121
+ </DocumentFragment>
122
+ `;
package/lib/version2/lookup/AlertHeader/props/propTypes.js CHANGED
@@ -25,6 +25,7 @@ var _default = {
25
25
  left: _propTypes["default"].number,
26
26
  right: _propTypes["default"].number,
27
27
  bottom: _propTypes["default"].number
28
- })
28
+ }),
29
+ renderAlertIcon: _propTypes["default"].oneOfType([_propTypes["default"].func, _propTypes["default"].node])
29
30
  };
30
31
  exports["default"] = _default;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zohodesk/dot",
3
- "version": "1.9.11",
3
+ "version": "1.9.12",
4
4
  "main": "lib/index",
5
5
  "module": "es/index.js",
6
6
  "private": false,
@@ -18,7 +18,7 @@
18
18
  ],
19
19
  "scripts": {
20
20
  "clean": "react-cli clean lib es coverage assets && mkdir assets",
21
- "dubCheck": "node ./node_modules/@zohodesk-private/node-plugins/es/dublication_css_file_finder ../components/src ../internal/desk-components/src node_modules/@zohodesk/icons/es node_modules/@zohodesk/variables/es node_modules/@zohodesk/svg/es",
21
+ "dubCheck": "npx z-node-plugins dub:check ../components/src ../internal/desk-components/src node_modules/@zohodesk/icons/es node_modules/@zohodesk/variables/es node_modules/@zohodesk/svg/es",
22
22
  "build:lib": "cbt build:lib src,assets lib,assets",
23
23
  "build:es": "cbt build:es src,assets es,assets",
24
24
  "build:es:watch": "cbt build:es src es",
@@ -40,22 +40,22 @@
40
40
  "download": "npm run downloadOnly && cd ../ && npm run download",
41
41
  "downloadOnly": "react-cli clean ./node_modules ./package-lock.json && npm install --legacy-peer-deps",
42
42
  "expublish": "node ../publish.js -- exp",
43
- "css:lineheight:validate": "node ./node_modules/@zohodesk-private/node-plugins/es/lineheight_automation/lineHeightErrorCheck.js ./src/",
44
- "variable:addignore": "node ./node_modules/@zohodesk-private/css-variable-migrator/es/variableIgnore.js ./src",
45
- "variable:convert": "node ./node_modules/@zohodesk-private/css-variable-migrator/es/pxParserPostcss.js ./src",
46
- "variable:check": "node ./node_modules/@zohodesk-private/css-variable-migrator/es/variableErrorCheck.js ./src ./node_modules/@zohodesk-private/css-variable-migrator/es/config/cssVariableReplacementOptions.json",
43
+ "css:lineheight:validate": "npx z-node-plugins lineheight:errorcheck ./src/",
44
+ "variable:addignore": "npx css-variable-migrator addignore ./src",
45
+ "variable:convert": "npx css-variable-migrator convert ./src",
46
+ "variable:check": "npx css-variable-migrator check ./src",
47
47
  "css:review": " npm run dubCheck && npm run css:lineheight:validate && npm run theme:validate ",
48
- "theme:validate": "node ./node_modules/@zohodesk-private/node-plugins/es/appearance_theme_validation validate ./src ./.cli ./.cli/stringContains.js",
49
- "theme:addignore": "node ./node_modules/@zohodesk-private/node-plugins/es/appearance_theme_validation addignore ./src ./.cli ./.cli/stringContains.js",
50
- "theme:removeignore": "node ./node_modules/@zohodesk-private/node-plugins/es/appearance_theme_validation removeignore ./src ./.cli",
48
+ "theme:validate": "npx z-node-plugins theme:validate ./src ./.cli ./.cli/stringContains.js",
49
+ "theme:addignore": "npx z-node-plugins theme:addignore ./src ./.cli ./.cli/stringContains.js",
50
+ "theme:removeignore": "npx z-node-plugins theme:removeignore ./src ./.cli",
51
51
  "review:props": "node ./node_modules/@zohodesk-private/react-prop-validator/es/propValidation.js propValidationArg.json",
52
- "css:layer_config_generate": "node ./node_modules/@zohodesk-private/node-plugins/es/css_layer_generator/scan_css_generate_json.js ./src ./assets css_layer_config.json",
53
- "css:layer_wrap_es": "node ./node_modules/@zohodesk-private/node-plugins/es/css_layer_generator/write_layer_in_css.js ./es ./assets css_layer_config.json --rewrite=src=es --rewrite=assets=assets --skip-existing-layer",
54
- "css:layer_wrap_lib": "node ./node_modules/@zohodesk-private/node-plugins/es/css_layer_generator/write_layer_in_css.js ./lib ./assets css_layer_config.json --rewrite=src=lib --rewrite=assets=assets --skip-existing-layer",
55
- "css:layer_generate_order": "node ./node_modules/@zohodesk-private/node-plugins/es/css_layer_generator/generate_layer_order.js css_layer_config.json ./src/dot_layer.module.css",
56
- "css:layer_config_validate": "node ./node_modules/@zohodesk-private/node-plugins/es/css_layer_generator/validate.js css_layer_config.json ./src/ ./assets",
52
+ "css:layer_config_generate": "npx z-node-plugins css:scan ./src ./assets css_layer_config.json",
53
+ "css:layer_wrap_es": "npx z-node-plugins css:layer_wrap ./es ./assets css_layer_config.json --rewrite=src=es --rewrite=assets=assets --skip-existing-layer",
54
+ "css:layer_wrap_lib": "npx z-node-plugins css:layer_wrap ./lib ./assets css_layer_config.json --rewrite=src=lib --rewrite=assets=assets --skip-existing-layer",
55
+ "css:layer_generate_order": "npx z-node-plugins css:layer_order css_layer_config.json ./src/dot_layer.module.css",
56
+ "css:layer_config_validate": "npx z-node-plugins css:layer_validate css_layer_config.json ./src/ ./assets",
57
57
  "css:build": "npm run css:layer_config_validate && npm run css:layer_generate_order && npm run build",
58
- "css:layer_remove": "node ./node_modules/@zohodesk-private/node-plugins/es/css_layer_generator/remove_layer.js ./es ./assets css_layer_config.json --rewrite=src=es --rewrite=assets=assets",
58
+ "css:layer_remove": "npx z-node-plugins css:layer_remove ./es ./assets css_layer_config.json --rewrite=src=es --rewrite=assets=assets",
59
59
  "cssVariableConvert": "react-cli variableConverter ./lib ./lib && react-cli variableConverter ./es ./es",
60
60
  "publish": "node ../publish.js",
61
61
  "check_package": "node ../check_dependencies.js"
@@ -66,15 +66,15 @@
66
66
  "@testing-library/react-hooks": "^7.0.2",
67
67
  "@testing-library/user-event": "^13.0.10",
68
68
  "@zohodesk-private/color-variable-preprocessor": "1.3.1",
69
- "@zohodesk-private/css-variable-migrator": "1.0.9",
70
- "@zohodesk-private/node-plugins": "1.1.13",
69
+ "@zohodesk-private/css-variable-migrator": "1.0.11",
70
+ "@zohodesk-private/node-plugins": "1.1.14",
71
71
  "@zohodesk-private/react-prop-validator": "1.2.3",
72
72
  "@zohodesk/a11y": "2.3.9",
73
73
  "@zohodesk/client_build_tool": "0.0.20",
74
- "@zohodesk/components": "1.6.12",
74
+ "@zohodesk/components": "1.6.13",
75
75
  "@zohodesk/dotkit": "1.0.9",
76
76
  "@zohodesk/hooks": "2.0.8",
77
- "@zohodesk/icons": "1.2.8",
77
+ "@zohodesk/icons": "1.3.3",
78
78
  "@zohodesk/layout": "3.1.0",
79
79
  "@zohodesk/react-cli": "1.1.27",
80
80
  "@zohodesk/svg": "1.3.5",
@@ -83,19 +83,21 @@
83
83
  "@zohodesk/virtualizer": "1.0.13",
84
84
  "postcss-discard-comments": "^7.0.5",
85
85
  "react-sortable-hoc": "^0.8.3",
86
- "velocity-react": "1.4.3"
86
+ "velocity-react": "1.4.3",
87
+ "@dot-system/css-utility": "0.1.1"
87
88
  },
88
89
  "peerDependencies": {
89
90
  "velocity-react": "1.4.3",
90
91
  "@zohodesk/variables": "1.3.1",
91
- "@zohodesk/components": "1.6.12",
92
- "@zohodesk/icons": "1.2.8",
92
+ "@zohodesk/components": "1.6.13",
93
+ "@zohodesk/icons": "1.3.3",
93
94
  "@zohodesk/svg": "1.3.5",
94
95
  "@zohodesk/virtualizer": "1.0.13",
95
96
  "react-sortable-hoc": "^0.8.3",
96
97
  "@zohodesk/hooks": "2.0.8",
97
98
  "@zohodesk/utils": "1.3.16",
98
99
  "@zohodesk/a11y": "2.3.9",
99
- "@zohodesk/layout": "3.1.0"
100
+ "@zohodesk/layout": "3.1.0",
101
+ "@dot-system/css-utility": "0.1.1"
100
102
  }
101
103
  }