@zohodesk/dot 1.7.14 → 1.7.16

package/es/DotProvider/utils/themeAppearanceAssetsConfig.js

@@ -2,13 +2,13 @@ import { LIBRARY_COMPONENT, LIBRARY_DOT, LIBRARY_SVG, THEME_APPEARANCE_DARK, THE
 export const themeAppearanceImports = {
   Lib_LightMode_Component: () => import(
   /* webpackChunkName: 'Lib_LightMode_Component' */
-  '@zohodesk/components/assets/Appearance/light/mode/Component_LightMode.module.css'),
+  "../libraryChunks/appearance/component/Light_Component"),
   Lib_DarkMode_Component: () => import(
   /* webpackChunkName: 'Lib_DarkMode_Component' */
-  '@zohodesk/components/assets/Appearance/dark/mode/Component_DarkMode.module.css'),
+  "../libraryChunks/appearance/component/Dark_Component"),
   Lib_PureDarkMode_Component: () => import(
   /* webpackChunkName: 'Lib_PureDarkMode_Component' */
-  '@zohodesk/components/assets/Appearance/pureDark/mode/Component_PureDarkMode.module.css'),
+  "../libraryChunks/appearance/component/PureDark_Component"),
   Lib_LightMode_Dot: () => import(
   /* webpackChunkName: 'Lib_LightMode_Dot' */
   "./../../../assets/Appearance/light/mode/Dot_LightMode.module.css"),

package/es/Onboarding/hooks/useOnboardingSlider.js

@@ -18,7 +18,7 @@ const useOnboardingSlider = _ref => {
   }, []);
   const handleSliderNext = useCallback(() => {
     progressRef.current = 0;
-    setCurrentSlide(currentSlide + 1);
+    setCurrentSlide(prev => prev + 1);
     setAutoplay(false);
   }, []);
   const handleMouseEnter = useCallback(() => {

package/lib/DotProvider/__tests__/DotProvider.spec.js

@@ -40,7 +40,12 @@ describe('DotProvider Snapshot', function () {
             _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DotProvider["default"], null, "This is a DotProvider component")), asFragment = _render.asFragment; // wait for the data attributes and styles to be applied
 
             _context.next = 3;
-            return (0, _react2.waitFor)(function () {});
+            return (0, _react2.waitFor)(function () {
+              var el = document.body.querySelector('[data-mode]');
+              expect(el === null || el === void 0 ? void 0 : el.getAttribute('data-mode')).toBe('light');
+              var el2 = document.body.querySelector('[data-theme]');
+              expect(el2 === null || el2 === void 0 ? void 0 : el2.getAttribute('data-theme')).toBe('blue');
+            });
 
           case 3:
             // take the snapshot after the attributes and styles are applied
@@ -169,71 +174,85 @@ describe('DotProvider Snapshot', function () {
       }
     }, _callee6);
   })));
-  THEME_APPEARANCE.map(function (appearance) {
-    test.each(THEME_COLOR)("rendering the theme-appearance of ".concat(appearance, " along with theme-color of %s"), /*#__PURE__*/function () {
-      var _ref7 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee7(theme) {
-        var _render6, asFragment;
-
-        return _regeneratorRuntime().wrap(function _callee7$(_context7) {
-          while (1) {
-            switch (_context7.prev = _context7.next) {
-              case 0:
-                _render6 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DotProvider["default"], {
-                  themeAppearance: appearance,
-                  themeColor: theme
-                })), asFragment = _render6.asFragment;
-                _context7.next = 3;
-                return (0, _react2.waitFor)(function () {});
-
-              case 3:
-                expect(asFragment()).toMatchSnapshot();
-
-              case 4:
-              case "end":
-                return _context7.stop();
+  THEME_APPEARANCE.forEach(function (appearance) {
+    describe("Theme appearance: ".concat(appearance), function () {
+      test.each(THEME_COLOR)("should render with themeAppearance = ".concat(appearance, " and themeColor = %s "), /*#__PURE__*/function () {
+        var _ref7 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee7(theme) {
+          var _render6, asFragment;
+
+          return _regeneratorRuntime().wrap(function _callee7$(_context7) {
+            while (1) {
+              switch (_context7.prev = _context7.next) {
+                case 0:
+                  _render6 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DotProvider["default"], {
+                    themeAppearance: appearance,
+                    themeColor: theme
+                  })), asFragment = _render6.asFragment;
+                  _context7.next = 3;
+                  return (0, _react2.waitFor)(function () {
+                    var el = document.body.querySelector('[data-mode]');
+                    expect(el === null || el === void 0 ? void 0 : el.getAttribute('data-mode')).toBe(appearance);
+                    var el2 = document.body.querySelector('[data-theme]');
+                    expect(el2 === null || el2 === void 0 ? void 0 : el2.getAttribute('data-theme')).toBe(theme);
+                  });
+
+                case 3:
+                  expect(asFragment()).toMatchSnapshot();
+
+                case 4:
+                case "end":
+                  return _context7.stop();
+              }
             }
-          }
-        }, _callee7);
-      }));
-
-      return function (_x) {
-        return _ref7.apply(this, arguments);
-      };
-    }());
+          }, _callee7);
+        }));
+
+        return function (_x) {
+          return _ref7.apply(this, arguments);
+        };
+      }());
+    });
   });
-  THEME_APPEARANCE.map(function (appearance) {
-    test.each(THEME_COLOR)("rendering the custom themeAppearanceAttr and themeColorAttr props with theme-appearance of ".concat(appearance, " along with theme-color of %s"), /*#__PURE__*/function () {
-      var _ref8 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee8(theme) {
-        var _render7, asFragment;
-
-        return _regeneratorRuntime().wrap(function _callee8$(_context8) {
-          while (1) {
-            switch (_context8.prev = _context8.next) {
-              case 0:
-                _render7 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DotProvider["default"], {
-                  themeAppearance: appearance,
-                  themeColor: theme,
-                  themeAppearanceAttr: "data-desk-mode",
-                  themeColorAttr: "data-desk-theme"
-                })), asFragment = _render7.asFragment;
-                _context8.next = 3;
-                return (0, _react2.waitFor)(function () {});
-
-              case 3:
-                expect(asFragment()).toMatchSnapshot();
-
-              case 4:
-              case "end":
-                return _context8.stop();
+  THEME_APPEARANCE.forEach(function (appearance) {
+    describe("Theme appearance: ".concat(appearance), function () {
+      test.each(THEME_COLOR)("should render with themeAppearance = ".concat(appearance, " and themeColor = %s with custom attributes"), /*#__PURE__*/function () {
+        var _ref8 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee8(theme) {
+          var _render7, asFragment;
+
+          return _regeneratorRuntime().wrap(function _callee8$(_context8) {
+            while (1) {
+              switch (_context8.prev = _context8.next) {
+                case 0:
+                  _render7 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DotProvider["default"], {
+                    themeAppearance: appearance,
+                    themeColor: theme,
+                    themeAppearanceAttr: "data-desk-mode",
+                    themeColorAttr: "data-desk-theme"
+                  })), asFragment = _render7.asFragment;
+                  _context8.next = 3;
+                  return (0, _react2.waitFor)(function () {
+                    var el = document.body.querySelector('[data-desk-mode]');
+                    expect(el === null || el === void 0 ? void 0 : el.getAttribute('data-desk-mode')).toBe(appearance);
+                    var el2 = document.body.querySelector('[data-desk-theme]');
+                    expect(el2 === null || el2 === void 0 ? void 0 : el2.getAttribute('data-desk-theme')).toBe(theme);
+                  });
+
+                case 3:
+                  expect(asFragment()).toMatchSnapshot();
+
+                case 4:
+                case "end":
+                  return _context8.stop();
+              }
             }
-          }
-        }, _callee8);
-      }));
-
-      return function (_x2) {
-        return _ref8.apply(this, arguments);
-      };
-    }());
+          }, _callee8);
+        }));
+
+        return function (_x2) {
+          return _ref8.apply(this, arguments);
+        };
+      }());
+    });
   });
   test.each(BASE_ZOOM_UNIT)("rendering the baseZoomUnit props of %s", /*#__PURE__*/function () {
     var _ref9 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee9(zoom) {