@chakra-ui/menu - npm Package Compare versions

Comparing version 2.1.15 to 2.2.0

dist/get-next-item-from-search.js

@@ -0,1 +1,2 @@
+'use client'
 "use strict";
@@ -58,1 +59,2 @@ var __defProp = Object.defineProperty;
 });
+//# sourceMappingURL=get-next-item-from-search.js.map

dist/index.js

@@ -0,1 +1,2 @@
+'use client'
 "use strict";
@@ -656,2 +657,3 @@ var __defProp = Object.defineProperty;
     () => () => fn(),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
     deps
@@ -783,2 +785,3 @@ );
   const { className, children, ...rest } = props;
+  const styles = useMenuStyles();
   const child = import_react4.Children.only(children);
@@ -791,16 +794,3 @@ const clone = (0, import_react4.isValidElement)(child) ? (0, import_react4.cloneElement)(child, {
   const _className = (0, import_shared_utils6.cx)("chakra-menu__icon-wrapper", className);
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-    import_system6.chakra.span,
-    {
-      className: _className,
-      ...rest,
-      __css: {
-        display: "inline-flex",
-        alignItems: "center",
-        justifyContent: "center",
-        flexShrink: 0
-      },
-      children: clone
-    }
-  );
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_system6.chakra.span, { className: _className, ...rest, __css: styles.icon, children: clone });
 };
@@ -1019,1 +1009,2 @@ MenuIcon.displayName = "MenuIcon";
 });
+//# sourceMappingURL=index.js.map

dist/menu-button.js

@@ -0,1 +1,2 @@
+'use client'
 "use strict";
@@ -255,2 +256,3 @@ var __defProp = Object.defineProperty;
     () => () => fn(),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
     deps
@@ -323,1 +325,2 @@ );
 });
+//# sourceMappingURL=menu-button.js.map

dist/menu-command.js

@@ -0,1 +1,2 @@
+'use client'
 "use strict";
@@ -222,2 +223,3 @@ var __defProp = Object.defineProperty;
     () => () => fn(),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
     deps
@@ -266,1 +268,2 @@ );
 });
+//# sourceMappingURL=menu-command.js.map

dist/menu-divider.js

@@ -0,1 +1,2 @@
+'use client'
 "use strict";
@@ -223,2 +224,3 @@ var __defProp = Object.defineProperty;
     () => () => fn(),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
     deps
@@ -266,1 +268,2 @@ );
 });
+//# sourceMappingURL=menu-divider.js.map

dist/menu-group.js

@@ -0,1 +1,2 @@
+'use client'
 "use strict";
@@ -223,2 +224,3 @@ var __defProp = Object.defineProperty;
     () => () => fn(),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
     deps
@@ -262,1 +264,2 @@ );
 });
+//# sourceMappingURL=menu-group.js.map

dist/menu-icon.js

@@ -0,1 +1,2 @@
+'use client'
 "use strict";
@@ -26,29 +27,236 @@ var __defProp = Object.defineProperty;
 module.exports = __toCommonJS(menu_icon_exports);
+var import_system2 = require("@chakra-ui/system");
+var import_shared_utils3 = require("@chakra-ui/shared-utils");
+var import_react3 = require("react");
+
+// src/menu.tsx
+var import_react_context2 = require("@chakra-ui/react-context");
 var import_system = require("@chakra-ui/system");
+var import_shared_utils2 = require("@chakra-ui/shared-utils");
+var import_react2 = require("react");
+
+// src/use-menu.ts
+var import_clickable = require("@chakra-ui/clickable");
+var import_descendant = require("@chakra-ui/descendant");
+var import_react_use_focus_effect = require("@chakra-ui/react-use-focus-effect");
+var import_popper = require("@chakra-ui/popper");
+var import_react_use_disclosure = require("@chakra-ui/react-use-disclosure");
+var import_react_use_outside_click = require("@chakra-ui/react-use-outside-click");
+var import_react_use_animation_state = require("@chakra-ui/react-use-animation-state");
+var import_react_context = require("@chakra-ui/react-context");
+var import_react_children_utils = require("@chakra-ui/react-children-utils");
+var import_react_use_controllable_state = require("@chakra-ui/react-use-controllable-state");
+var import_react_use_update_effect = require("@chakra-ui/react-use-update-effect");
+var import_react_use_merge_refs = require("@chakra-ui/react-use-merge-refs");
 var import_shared_utils = require("@chakra-ui/shared-utils");
+var import_lazy_utils = require("@chakra-ui/lazy-utils");
 var import_react = require("react");
+var [
+  MenuDescendantsProvider,
+  useMenuDescendantsContext,
+  useMenuDescendants,
+  useMenuDescendant
+] = (0, import_descendant.createDescendantContext)();
+var [MenuProvider, useMenuContext] = (0, import_react_context.createContext)({
+  strict: false,
+  name: "MenuContext"
+});
+function useIds(idProp, ...prefixes) {
+  const reactId = (0, import_react.useId)();
+  const id = idProp || reactId;
+  return (0, import_react.useMemo)(() => {
+    return prefixes.map((prefix) => `${prefix}-${id}`);
+  }, [id, prefixes]);
+}
+function getOwnerDocument(node) {
+  var _a;
+  return (_a = node == null ? void 0 : node.ownerDocument) != null ? _a : document;
+}
+function useMenu(props = {}) {
+  const {
+    id,
+    closeOnSelect = true,
+    closeOnBlur = true,
+    initialFocusRef,
+    autoSelect = true,
+    isLazy,
+    isOpen: isOpenProp,
+    defaultIsOpen,
+    onClose: onCloseProp,
+    onOpen: onOpenProp,
+    placement = "bottom-start",
+    lazyBehavior = "unmount",
+    direction,
+    computePositionOnMount = false,
+    ...popperProps
+  } = props;
+  const menuRef = (0, import_react.useRef)(null);
+  const buttonRef = (0, import_react.useRef)(null);
+  const descendants = useMenuDescendants();
+  const focusMenu = (0, import_react.useCallback)(() => {
+    requestAnimationFrame(() => {
+      var _a;
+      (_a = menuRef.current) == null ? void 0 : _a.focus({ preventScroll: false });
+    });
+  }, []);
+  const focusFirstItem = (0, import_react.useCallback)(() => {
+    const id2 = setTimeout(() => {
+      var _a;
+      if (initialFocusRef) {
+        (_a = initialFocusRef.current) == null ? void 0 : _a.focus();
+      } else {
+        const first = descendants.firstEnabled();
+        if (first)
+          setFocusedIndex(first.index);
+      }
+    });
+    timeoutIds.current.add(id2);
+  }, [descendants, initialFocusRef]);
+  const focusLastItem = (0, import_react.useCallback)(() => {
+    const id2 = setTimeout(() => {
+      const last = descendants.lastEnabled();
+      if (last)
+        setFocusedIndex(last.index);
+    });
+    timeoutIds.current.add(id2);
+  }, [descendants]);
+  const onOpenInternal = (0, import_react.useCallback)(() => {
+    onOpenProp == null ? void 0 : onOpenProp();
+    if (autoSelect) {
+      focusFirstItem();
+    } else {
+      focusMenu();
+    }
+  }, [autoSelect, focusFirstItem, focusMenu, onOpenProp]);
+  const { isOpen, onOpen, onClose, onToggle } = (0, import_react_use_disclosure.useDisclosure)({
+    isOpen: isOpenProp,
+    defaultIsOpen,
+    onClose: onCloseProp,
+    onOpen: onOpenInternal
+  });
+  (0, import_react_use_outside_click.useOutsideClick)({
+    enabled: isOpen && closeOnBlur,
+    ref: menuRef,
+    handler: (event) => {
+      var _a;
+      if (!((_a = buttonRef.current) == null ? void 0 : _a.contains(event.target))) {
+        onClose();
+      }
+    }
+  });
+  const popper = (0, import_popper.usePopper)({
+    ...popperProps,
+    enabled: isOpen || computePositionOnMount,
+    placement,
+    direction
+  });
+  const [focusedIndex, setFocusedIndex] = (0, import_react.useState)(-1);
+  (0, import_react_use_update_effect.useUpdateEffect)(() => {
+    if (!isOpen) {
+      setFocusedIndex(-1);
+    }
+  }, [isOpen]);
+  (0, import_react_use_focus_effect.useFocusOnHide)(menuRef, {
+    focusRef: buttonRef,
+    visible: isOpen,
+    shouldFocus: true
+  });
+  const animationState = (0, import_react_use_animation_state.useAnimationState)({ isOpen, ref: menuRef });
+  const [buttonId, menuId] = useIds(id, `menu-button`, `menu-list`);
+  const openAndFocusMenu = (0, import_react.useCallback)(() => {
+    onOpen();
+    focusMenu();
+  }, [onOpen, focusMenu]);
+  const timeoutIds = (0, import_react.useRef)(/* @__PURE__ */ new Set([]));
+  useUnmountEffect(() => {
+    timeoutIds.current.forEach((id2) => clearTimeout(id2));
+    timeoutIds.current.clear();
+  });
+  const openAndFocusFirstItem = (0, import_react.useCallback)(() => {
+    onOpen();
+    focusFirstItem();
+  }, [focusFirstItem, onOpen]);
+  const openAndFocusLastItem = (0, import_react.useCallback)(() => {
+    onOpen();
+    focusLastItem();
+  }, [onOpen, focusLastItem]);
+  const refocus = (0, import_react.useCallback)(() => {
+    var _a, _b;
+    const doc = getOwnerDocument(menuRef.current);
+    const hasFocusWithin = (_a = menuRef.current) == null ? void 0 : _a.contains(doc.activeElement);
+    const shouldRefocus = isOpen && !hasFocusWithin;
+    if (!shouldRefocus)
+      return;
+    const node = (_b = descendants.item(focusedIndex)) == null ? void 0 : _b.node;
+    node == null ? void 0 : node.focus();
+  }, [isOpen, focusedIndex, descendants]);
+  const rafId = (0, import_react.useRef)(null);
+  return {
+    openAndFocusMenu,
+    openAndFocusFirstItem,
+    openAndFocusLastItem,
+    onTransitionEnd: refocus,
+    unstable__animationState: animationState,
+    descendants,
+    popper,
+    buttonId,
+    menuId,
+    forceUpdate: popper.forceUpdate,
+    orientation: "vertical",
+    isOpen,
+    onToggle,
+    onOpen,
+    onClose,
+    menuRef,
+    buttonRef,
+    focusedIndex,
+    closeOnSelect,
+    closeOnBlur,
+    autoSelect,
+    setFocusedIndex,
+    isLazy,
+    lazyBehavior,
+    initialFocusRef,
+    rafId
+  };
+}
+function useUnmountEffect(fn, deps = []) {
+  return (0, import_react.useEffect)(
+    () => () => fn(),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    deps
+  );
+}
+
+// src/menu.tsx
 var import_jsx_runtime = require("react/jsx-runtime");
+var [MenuStylesProvider, useMenuStyles] = (0, import_react_context2.createContext)({
+  name: `MenuStylesContext`,
+  errorMessage: `useMenuStyles returned is 'undefined'. Seems you forgot to wrap the components in "<Menu />" `
+});
+var Menu = (props) => {
+  const { children } = props;
+  const styles = (0, import_system.useMultiStyleConfig)("Menu", props);
+  const ownProps = (0, import_system.omitThemingProps)(props);
+  const { direction } = (0, import_system.useTheme)();
+  const { descendants, ...ctx } = useMenu({ ...ownProps, direction });
+  const context = (0, import_react2.useMemo)(() => ctx, [ctx]);
+  const { isOpen, onClose, forceUpdate } = context;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MenuDescendantsProvider, { value: descendants, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MenuProvider, { value: context, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MenuStylesProvider, { value: styles, children: (0, import_shared_utils2.runIfFn)(children, { isOpen, onClose, forceUpdate }) }) }) });
+};
+Menu.displayName = "Menu";
+
+// src/menu-icon.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
 var MenuIcon = (props) => {
   const { className, children, ...rest } = props;
-  const child = import_react.Children.only(children);
-  const clone = (0, import_react.isValidElement)(child) ? (0, import_react.cloneElement)(child, {
+  const styles = useMenuStyles();
+  const child = import_react3.Children.only(children);
+  const clone = (0, import_react3.isValidElement)(child) ? (0, import_react3.cloneElement)(child, {
     focusable: "false",
     "aria-hidden": true,
-    className: (0, import_shared_utils.cx)("chakra-menu__icon", child.props.className)
+    className: (0, import_shared_utils3.cx)("chakra-menu__icon", child.props.className)
   }) : null;
-  const _className = (0, import_shared_utils.cx)("chakra-menu__icon-wrapper", className);
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_system.chakra.span,
-    {
-      className: _className,
-      ...rest,
-      __css: {
-        display: "inline-flex",
-        alignItems: "center",
-        justifyContent: "center",
-        flexShrink: 0
-      },
-      children: clone
-    }
-  );
+  const _className = (0, import_shared_utils3.cx)("chakra-menu__icon-wrapper", className);
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_system2.chakra.span, { className: _className, ...rest, __css: styles.icon, children: clone });
 };
@@ -60,1 +268,2 @@ MenuIcon.displayName = "MenuIcon";
 });
+//# sourceMappingURL=menu-icon.js.map

dist/menu-item-option.js

@@ -0,1 +1,2 @@
+'use client'
 "use strict";
@@ -354,2 +355,3 @@ var __defProp = Object.defineProperty;
     () => () => fn(),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
     deps
@@ -418,2 +420,3 @@ );
   const { className, children, ...rest } = props;
+  const styles = useMenuStyles();
   const child = import_react4.Children.only(children);
@@ -426,16 +429,3 @@ const clone = (0, import_react4.isValidElement)(child) ? (0, import_react4.cloneElement)(child, {
   const _className = (0, import_shared_utils3.cx)("chakra-menu__icon-wrapper", className);
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-    import_system3.chakra.span,
-    {
-      className: _className,
-      ...rest,
-      __css: {
-        display: "inline-flex",
-        alignItems: "center",
-        justifyContent: "center",
-        flexShrink: 0
-      },
-      children: clone
-    }
-  );
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_system3.chakra.span, { className: _className, ...rest, __css: styles.icon, children: clone });
 };
@@ -485,1 +475,2 @@ MenuIcon.displayName = "MenuIcon";
 });
+//# sourceMappingURL=menu-item-option.js.map

dist/menu-item.js

@@ -0,1 +1,2 @@
+'use client'
 "use strict";
@@ -355,2 +356,3 @@ var __defProp = Object.defineProperty;
     () => () => fn(),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
     deps
@@ -403,2 +405,3 @@ );
   const { className, children, ...rest } = props;
+  const styles = useMenuStyles();
   const child = import_react3.Children.only(children);
@@ -411,16 +414,3 @@ const clone = (0, import_react3.isValidElement)(child) ? (0, import_react3.cloneElement)(child, {
   const _className = (0, import_shared_utils3.cx)("chakra-menu__icon-wrapper", className);
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-    import_system3.chakra.span,
-    {
-      className: _className,
-      ...rest,
-      __css: {
-        display: "inline-flex",
-        alignItems: "center",
-        justifyContent: "center",
-        flexShrink: 0
-      },
-      children: clone
-    }
-  );
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_system3.chakra.span, { className: _className, ...rest, __css: styles.icon, children: clone });
 };
@@ -489,1 +479,2 @@ MenuIcon.displayName = "MenuIcon";
 });
+//# sourceMappingURL=menu-item.js.map

dist/menu-list.js

@@ -0,1 +1,2 @@
+'use client'
 "use strict";
@@ -426,2 +427,3 @@ var __defProp = Object.defineProperty;
     () => () => fn(),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
     deps
@@ -515,1 +517,2 @@ );
 });
+//# sourceMappingURL=menu-list.js.map

dist/menu-option-group.js

@@ -0,1 +1,2 @@
+'use client'
 "use strict";
@@ -275,2 +276,3 @@ var __defProp = Object.defineProperty;
     () => () => fn(),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
     deps
@@ -330,1 +332,2 @@ );
 });
+//# sourceMappingURL=menu-option-group.js.map

dist/menu.js

@@ -0,1 +1,2 @@
+'use client'
 "use strict";
@@ -220,2 +221,3 @@ var __defProp = Object.defineProperty;
     () => () => fn(),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
     deps
@@ -247,1 +249,2 @@ );
 });
+//# sourceMappingURL=menu.js.map

dist/styled-menu-item.js

@@ -0,1 +1,2 @@
+'use client'
 "use strict";
@@ -223,2 +224,3 @@ var __defProp = Object.defineProperty;
     () => () => fn(),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
     deps
@@ -275,1 +277,2 @@ );
 });
+//# sourceMappingURL=styled-menu-item.js.map

dist/use-menu.js

@@ -0,1 +1,2 @@
+'use client'
 "use strict";
@@ -637,2 +638,3 @@ var __defProp = Object.defineProperty;
     () => () => fn(),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
     deps
@@ -658,1 +660,2 @@ );
 });
+//# sourceMappingURL=use-menu.js.map

dist/use-shortcut.js

@@ -0,1 +1,2 @@
+'use client'
 "use strict";
@@ -75,1 +76,2 @@ var __defProp = Object.defineProperty;
 });
+//# sourceMappingURL=use-shortcut.js.map

package.json

 {
   "name": "@chakra-ui/menu",
-  "version": "2.1.15",
+  "version": "2.2.0",
   "description": "A React component to render accessible menus",
@@ -35,16 +35,16 @@ "keywords": [
   "dependencies": {
-    "@chakra-ui/clickable": "2.0.14",
-    "@chakra-ui/descendant": "3.0.14",
-    "@chakra-ui/popper": "3.0.14",
+    "@chakra-ui/clickable": "2.1.0",
+    "@chakra-ui/descendant": "3.1.0",
+    "@chakra-ui/popper": "3.1.0",
     "@chakra-ui/lazy-utils": "2.0.5",
-    "@chakra-ui/transition": "2.0.16",
-    "@chakra-ui/react-context": "2.0.8",
+    "@chakra-ui/transition": "2.1.0",
+    "@chakra-ui/react-context": "2.1.0",
     "@chakra-ui/react-children-utils": "2.0.6",
-    "@chakra-ui/react-use-animation-state": "2.0.9",
-    "@chakra-ui/react-use-disclosure": "2.0.8",
-    "@chakra-ui/react-use-focus-effect": "2.0.11",
-    "@chakra-ui/react-use-merge-refs": "2.0.7",
-    "@chakra-ui/react-use-controllable-state": "2.0.8",
-    "@chakra-ui/react-use-outside-click": "2.1.0",
-    "@chakra-ui/react-use-update-effect": "2.0.7",
+    "@chakra-ui/react-use-animation-state": "2.1.0",
+    "@chakra-ui/react-use-disclosure": "2.1.0",
+    "@chakra-ui/react-use-focus-effect": "2.1.0",
+    "@chakra-ui/react-use-merge-refs": "2.1.0",
+    "@chakra-ui/react-use-controllable-state": "2.1.0",
+    "@chakra-ui/react-use-outside-click": "2.2.0",
+    "@chakra-ui/react-use-update-effect": "2.1.0",
     "@chakra-ui/shared-utils": "2.0.5"
@@ -57,9 +57,9 @@ },
     "clean-package": "2.2.0",
-    "@chakra-ui/system": "2.5.8",
-    "@chakra-ui/image": "2.0.16",
-    "@chakra-ui/modal": "2.2.12",
-    "@chakra-ui/provider": "2.3.0",
-    "@chakra-ui/portal": "2.0.16",
-    "@chakra-ui/theme": "3.1.2",
-    "@chakra-ui/button": "2.0.18"
+    "@chakra-ui/system": "2.6.0",
+    "@chakra-ui/image": "2.1.0",
+    "@chakra-ui/modal": "2.3.0",
+    "@chakra-ui/provider": "2.4.0",
+    "@chakra-ui/portal": "2.1.0",
+    "@chakra-ui/theme": "3.2.0",
+    "@chakra-ui/button": "2.1.0"
   },
@@ -72,10 +72,2 @@ "peerDependencies": {
   "clean-package": "../../../clean-package.config.json",
-  "tsup": {
-    "clean": true,
-    "target": "es2019",
-    "format": [
-      "cjs",
-      "esm"
-    ]
-  },
   "module": "dist/index.mjs",
@@ -82,0 +74,0 @@ "types": "dist/index.d.ts",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

860056

increased by171.71%

Number of package files

106

increased by70.97%

Lines of code

8419

increased by2.68%

Dependency changes

• + Added@chakra-ui/clickable@2.1.0(transitive)

• + Added@chakra-ui/descendant@3.1.0(transitive)

• + Added@chakra-ui/popper@3.1.0(transitive)

• + Added@chakra-ui/react-context@2.1.0(transitive)

• + Added@chakra-ui/react-use-animation-state@2.1.0(transitive)

• + Added@chakra-ui/react-use-callback-ref@2.1.0(transitive)

• + Added@chakra-ui/react-use-controllable-state@2.1.0(transitive)

• + Added@chakra-ui/react-use-disclosure@2.1.0(transitive)

• + Added@chakra-ui/react-use-event-listener@2.1.0(transitive)

• + Added@chakra-ui/react-use-focus-effect@2.1.0(transitive)

• + Added@chakra-ui/react-use-merge-refs@2.1.0(transitive)

• + Added@chakra-ui/react-use-outside-click@2.2.0(transitive)

• + Added@chakra-ui/react-use-update-effect@2.1.0(transitive)

• + Added@chakra-ui/transition@2.1.0(transitive)

• - Removed@chakra-ui/clickable@2.0.14(transitive)

• - Removed@chakra-ui/descendant@3.0.14(transitive)

• - Removed@chakra-ui/popper@3.0.14(transitive)

• - Removed@chakra-ui/react-context@2.0.8(transitive)

• - Removed@chakra-ui/react-use-animation-state@2.0.9(transitive)

• - Removed@chakra-ui/react-use-callback-ref@2.0.7(transitive)

• - Removed@chakra-ui/react-use-controllable-state@2.0.8(transitive)

• - Removed@chakra-ui/react-use-disclosure@2.0.8(transitive)

• - Removed@chakra-ui/react-use-event-listener@2.0.7(transitive)

• - Removed@chakra-ui/react-use-focus-effect@2.0.11(transitive)

• - Removed@chakra-ui/react-use-merge-refs@2.0.7(transitive)

• - Removed@chakra-ui/react-use-outside-click@2.1.0(transitive)

• - Removed@chakra-ui/react-use-safe-layout-effect@2.0.5(transitive)

• - Removed@chakra-ui/react-use-update-effect@2.0.7(transitive)

• - Removed@chakra-ui/transition@2.0.16(transitive)

• Updated@chakra-ui/clickable@2.1.0

• Updated@chakra-ui/descendant@3.1.0

• Updated@chakra-ui/popper@3.1.0

• Updated@chakra-ui/react-context@2.1.0

• Updated@chakra-ui/react-use-animation-state@2.1.0

• Updated@chakra-ui/react-use-controllable-state@2.1.0

• Updated@chakra-ui/react-use-disclosure@2.1.0

• Updated@chakra-ui/react-use-focus-effect@2.1.0

• Updated@chakra-ui/react-use-merge-refs@2.1.0

• Updated@chakra-ui/react-use-outside-click@2.2.0

• Updated@chakra-ui/react-use-update-effect@2.1.0

• Updated@chakra-ui/transition@2.1.0