@ultraviolet/plus 0.15.2 → 0.15.3

package/dist/components/Navigation/NavigationProvider.cjs

@@ -0,0 +1,111 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const react = require("react");
+const constants = require("./constants.cjs");
+const en = require("./locales/en.cjs");
+const NavigationContext = react.createContext({
+  expanded: true,
+  /**
+   * This function will trigger the expand/collapse of the navigation and
+   * will also trigger the animation
+   */
+  toggleExpand: () => {
+  },
+  animation: false,
+  locales: en,
+  pinItem: () => [],
+  unpinItem: () => [],
+  pinnedItems: [],
+  pinLimit: 7,
+  navigationRef: {
+    current: null
+  },
+  width: constants.NAVIGATION_WIDTH,
+  setWidth: () => {
+  },
+  reorderItems: () => [],
+  items: {},
+  registerItem: () => {
+  },
+  setPinnedItems: () => {
+  }
+});
+const useNavigation = () => react.useContext(NavigationContext);
+const NavigationProvider = ({
+  children,
+  pinnedFeature = false,
+  initialPinned,
+  initialExpanded = true,
+  locales = en,
+  pinLimit = 7,
+  onClickExpand,
+  initialWidth = constants.NAVIGATION_WIDTH
+}) => {
+  const [expanded, setExpanded] = react.useState(initialExpanded);
+  const [pinnedItems, setPinnedItems] = react.useState(initialPinned ?? []);
+  const [animation, setAnimation] = react.useState(false);
+  const [width, setWidth] = react.useState(initialWidth);
+  const [items, registerItem] = react.useReducer((oldState, newState) => ({
+    ...oldState,
+    ...newState
+  }), {});
+  const navigationRef = react.useRef(null);
+  const toggleExpand = react.useCallback((toggle) => {
+    if (typeof toggle !== "boolean" && toggle !== void 0) {
+      throw new Error(`toggleExpand only accepts boolean or undefined as parameter. You most likely did <button onClick={toggleExpand}> instead of <button onClick={() => toggleExpand()}>`);
+    }
+    if (toggle !== void 0 && toggle === expanded) {
+      return;
+    }
+    onClickExpand?.(!expanded);
+    if (navigationRef.current) {
+      navigationRef.current.style.width = "";
+    }
+    setAnimation(expanded ? "collapse" : "expand");
+    setTimeout(() => {
+      setExpanded(toggle !== void 0 ? toggle : !expanded);
+      setAnimation(false);
+    }, constants.ANIMATION_DURATION);
+  }, [expanded, onClickExpand, setAnimation, setExpanded]);
+  const pinItem = react.useCallback((item) => {
+    const newValue = [...pinnedItems, item];
+    setPinnedItems(newValue);
+    return newValue;
+  }, [pinnedItems]);
+  const unpinItem = react.useCallback((item) => {
+    const newValue = pinnedItems.filter((localItem) => localItem !== item);
+    setPinnedItems(newValue);
+    return newValue;
+  }, [pinnedItems]);
+  const reorderItems = react.useCallback((initialIndex, endIndex) => {
+    const newPinnedItems = [...pinnedItems];
+    const [removed] = newPinnedItems.splice(initialIndex, 1);
+    newPinnedItems.splice(endIndex, 0, removed);
+    setPinnedItems(newPinnedItems);
+    return newPinnedItems;
+  }, [pinnedItems]);
+  const value = react.useMemo(() => ({
+    expanded,
+    toggleExpand,
+    pinnedItems,
+    pinItem,
+    unpinItem,
+    pinnedFeature,
+    locales,
+    pinLimit,
+    animation,
+    setAnimation,
+    navigationRef,
+    width,
+    setWidth,
+    reorderItems,
+    registerItem,
+    items,
+    setPinnedItems
+  }), [expanded, toggleExpand, pinnedItems, pinItem, unpinItem, pinnedFeature, locales, pinLimit, animation, width, reorderItems, items, setPinnedItems]);
+  return /* @__PURE__ */ jsxRuntime.jsx(NavigationContext.Provider, { value, children });
+};
+exports.NavigationContext = NavigationContext;
+exports.NavigationProvider = NavigationProvider;
+exports.useNavigation = useNavigation;

package/dist/components/Navigation/NavigationProvider.d.ts

@@ -1,9 +1,11 @@
 import type { Dispatch, ReactNode, RefObject } from 'react';
+import { type PinUnPinType } from './constants';
 import NavigationLocales from './locales/en';
 type Item = {
     label: string;
     active?: boolean;
     onClick?: (toggle?: true | false) => void;
+    onClickPinUnpin?: (parameters: PinUnPinType) => void;
 };
 type Items = Record<string, Item>;
 type ContextProps = {
@@ -12,8 +14,8 @@ type ContextProps = {
     animation: boolean | 'expand' | 'collapse';
     pinnedFeature?: boolean;
     onClickPinUnpin?: (pinned: string[]) => void;
-    pinItem: (item: string) => void;
-    unpinItem: (item: string) => void;
+    pinItem: (item: string) => string[];
+    unpinItem: (item: string) => string[];
     pinnedItems: string[];
     pinLimit: number;
     navigationRef: RefObject<HTMLDivElement>;
@@ -32,9 +34,10 @@ type ContextProps = {
     /**
      * The end index of the item
      */
-    endIndex: number) => void;
+    endIndex: number) => string[];
     items: Items;
     registerItem: Dispatch<Items>;
+    setPinnedItems: (value: string[]) => void;
 };
 export declare const NavigationContext: import("react").Context<ContextProps>;
 export declare const useNavigation: () => ContextProps;
@@ -68,20 +71,6 @@ type NavigationProviderProps = {
      * and it automatically collapse / expand.
      */
     onClickExpand?: (expanded: boolean) => void;
-    /**
-     * This function is triggered when the user click on the pin/unpin button
-     * of an item. To access all pinned item you can use the `useNavigation` hook
-     * and access the `pinnedItems` property.
-     */
-    onClickPinUnpin?: (
-    /**
-     * The state of the item after the click
-     */
-    state: 'pin' | 'unpin', 
-    /**
-     * The current items that has been pinned on click
-     */
-    pinned: string) => void;
 };
-export declare const NavigationProvider: ({ children, pinnedFeature, initialPinned, initialExpanded, locales, pinLimit, onClickExpand, initialWidth, onClickPinUnpin, }: NavigationProviderProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const NavigationProvider: ({ children, pinnedFeature, initialPinned, initialExpanded, locales, pinLimit, onClickExpand, initialWidth, }: NavigationProviderProps) => import("@emotion/react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Navigation/NavigationProvider.js

@@ -12,10 +12,8 @@ const NavigationContext = createContext({
   },
   animation: false,
   locales: NavigationLocales,
-  pinItem: () => {
-  },
-  unpinItem: () => {
-  },
+  pinItem: () => [],
+  unpinItem: () => [],
   pinnedItems: [],
   pinLimit: 7,
   navigationRef: {
@@ -24,10 +22,11 @@ const NavigationContext = createContext({
   width: NAVIGATION_WIDTH,
   setWidth: () => {
   },
-  reorderItems: () => {
-  },
+  reorderItems: () => [],
   items: {},
   registerItem: () => {
+  },
+  setPinnedItems: () => {
   }
 });
 const useNavigation = () => useContext(NavigationContext);
@@ -39,8 +38,7 @@ const NavigationProvider = ({
   locales = NavigationLocales,
   pinLimit = 7,
   onClickExpand,
-  initialWidth = NAVIGATION_WIDTH,
-  onClickPinUnpin
+  initialWidth = NAVIGATION_WIDTH
 }) => {
   const [expanded, setExpanded] = useState(initialExpanded);
   const [pinnedItems, setPinnedItems] = useState(initialPinned ?? []);
@@ -69,18 +67,21 @@ const NavigationProvider = ({
     }, ANIMATION_DURATION);
   }, [expanded, onClickExpand, setAnimation, setExpanded]);
   const pinItem = useCallback((item) => {
-    setPinnedItems([...pinnedItems, item]);
-    onClickPinUnpin?.("pin", item);
-  }, [onClickPinUnpin, pinnedItems]);
+    const newValue = [...pinnedItems, item];
+    setPinnedItems(newValue);
+    return newValue;
+  }, [pinnedItems]);
   const unpinItem = useCallback((item) => {
-    setPinnedItems(pinnedItems.filter((localItem) => localItem !== item));
-    onClickPinUnpin?.("unpin", item);
-  }, [onClickPinUnpin, pinnedItems]);
+    const newValue = pinnedItems.filter((localItem) => localItem !== item);
+    setPinnedItems(newValue);
+    return newValue;
+  }, [pinnedItems]);
   const reorderItems = useCallback((initialIndex, endIndex) => {
     const newPinnedItems = [...pinnedItems];
     const [removed] = newPinnedItems.splice(initialIndex, 1);
     newPinnedItems.splice(endIndex, 0, removed);
     setPinnedItems(newPinnedItems);
+    return newPinnedItems;
   }, [pinnedItems]);
   const value = useMemo(() => ({
     expanded,
@@ -98,8 +99,9 @@ const NavigationProvider = ({
     setWidth,
     reorderItems,
     registerItem,
-    items
-  }), [expanded, toggleExpand, pinnedItems, pinItem, unpinItem, pinnedFeature, locales, pinLimit, animation, width, reorderItems, items]);
+    items,
+    setPinnedItems
+  }), [expanded, toggleExpand, pinnedItems, pinItem, unpinItem, pinnedFeature, locales, pinLimit, animation, width, reorderItems, items, setPinnedItems]);
   return /* @__PURE__ */ jsx(NavigationContext.Provider, { value, children });
 };
 export {

package/dist/components/Navigation/components/Group.cjs

@@ -0,0 +1,57 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const _styled = require("@emotion/styled/base");
+const ui = require("@ultraviolet/ui");
+const react = require("react");
+const NavigationProvider = require("../NavigationProvider.cjs");
+const constants = require("../constants.cjs");
+const _interopDefaultCompat = (e) => e && typeof e === "object" && "default" in e ? e : { default: e };
+const _styled__default = /* @__PURE__ */ _interopDefaultCompat(_styled);
+const StyledText = /* @__PURE__ */ _styled__default.default(ui.Text, process.env.NODE_ENV === "production" ? {
+  target: "eh4zgrv2"
+} : {
+  target: "eh4zgrv2",
+  label: "StyledText"
+})("padding-bottom:", ({
+  theme
+}) => theme.space["1"], ";padding-left:", ({
+  theme
+}) => theme.space["1"], ";transition:opacity ", constants.ANIMATION_DURATION, "ms ease-in-out,height ", constants.ANIMATION_DURATION, "ms ease-in-out;height:", ({
+  theme
+}) => `calc(${theme.typography.bodySmallStrong.lineHeight} + ${theme.space["1"]})`, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3BsdXMvc3JjL2NvbXBvbmVudHMvTmF2aWdhdGlvbi9jb21wb25lbnRzL0dyb3VwLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFZK0IiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvdWx0cmF2aW9sZXQvdWx0cmF2aW9sZXQvcGFja2FnZXMvcGx1cy9zcmMvY29tcG9uZW50cy9OYXZpZ2F0aW9uL2NvbXBvbmVudHMvR3JvdXAudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgeyBTdGFjaywgVGV4dCB9IGZyb20gJ0B1bHRyYXZpb2xldC91aSdcbmltcG9ydCB0eXBlIHsgUmVhY3ROb2RlIH0gZnJvbSAncmVhY3QnXG5pbXBvcnQgeyBDaGlsZHJlbiB9IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgdXNlTmF2aWdhdGlvbiB9IGZyb20gJy4uL05hdmlnYXRpb25Qcm92aWRlcidcbmltcG9ydCB7IEFOSU1BVElPTl9EVVJBVElPTiwgZ3JvdXBBbmltYXRpb24gfSBmcm9tICcuLi9jb25zdGFudHMnXG5cbnR5cGUgR3JvdXBQcm9wcyA9IHtcbiAgY2hpbGRyZW46IFJlYWN0Tm9kZVxuICBsYWJlbDogc3RyaW5nXG59XG5cbmNvbnN0IFN0eWxlZFRleHQgPSBzdHlsZWQoVGV4dClgXG4gIHBhZGRpbmctYm90dG9tOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLnNwYWNlWycxJ119O1xuICBwYWRkaW5nLWxlZnQ6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuc3BhY2VbJzEnXX07XG5cbiAgdHJhbnNpdGlvbjpcbiAgICBvcGFjaXR5ICR7QU5JTUFUSU9OX0RVUkFUSU9OfW1zIGVhc2UtaW4tb3V0LFxuICAgIGhlaWdodCAke0FOSU1BVElPTl9EVVJBVElPTn1tcyBlYXNlLWluLW91dDtcbiAgaGVpZ2h0OiAkeyh7IHRoZW1lIH0pID0+XG4gICAgYGNhbGMoJHt0aGVtZS50eXBvZ3JhcGh5LmJvZHlTbWFsbFN0cm9uZy5saW5lSGVpZ2h0fSArICR7dGhlbWUuc3BhY2VbJzEnXX0pYH07IC8vIFRoaXMgaXMgb25seSBmb3IgYW5pbWF0aW9uXG5gXG5cbmNvbnN0IFN0eWxlZFN0YWNrID0gc3R5bGVkKFN0YWNrKWBcbiAgcGFkZGluZy10b3A6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuc3BhY2VbJzEnXX07XG5gXG5cbmNvbnN0IENvbnRhaW5lciA9IHN0eWxlZC5kaXZgXG4gICZbZGF0YS1hbmltYXRpb249J2V4cGFuZCddIHtcbiAgICAke1N0eWxlZFRleHR9IHtcbiAgICAgIGFuaW1hdGlvbjogJHtncm91cEFuaW1hdGlvbn0gJHtBTklNQVRJT05fRFVSQVRJT059bXMgZWFzZS1pbi1vdXQ7XG4gICAgfVxuICB9XG5cbiAgJltkYXRhLWFuaW1hdGlvbj0nY29sbGFwc2UnXSB7XG4gICAgJHtTdHlsZWRUZXh0fSB7XG4gICAgICBhbmltYXRpb246ICR7Z3JvdXBBbmltYXRpb259ICR7QU5JTUFUSU9OX0RVUkFUSU9OfW1zIGVhc2UtaW4tb3V0IHJldmVyc2U7XG4gICAgfVxuICB9XG5gXG5cbmV4cG9ydCBjb25zdCBHcm91cCA9ICh7IGNoaWxkcmVuLCBsYWJlbCB9OiBHcm91cFByb3BzKSA9PiB7XG4gIGNvbnN0IGNvbnRleHQgPSB1c2VOYXZpZ2F0aW9uKClcblxuICBpZiAoIWNvbnRleHQpIHtcbiAgICB0aHJvdyBuZXcgRXJyb3IoXG4gICAgICAnTmF2aWdhdGlvbi5Hcm91cCBjYW4gb25seSBiZSB1c2VkIGluc2lkZSBhIE5hdmlnYXRpb25Qcm92aWRlci4nLFxuICAgIClcbiAgfVxuXG4gIGNvbnN0IHsgZXhwYW5kZWQsIGFuaW1hdGlvbiB9ID0gY29udGV4dFxuXG4gIGlmIChDaGlsZHJlbi5jb3VudChjaGlsZHJlbikgPiAwKSB7XG4gICAgcmV0dXJuIChcbiAgICAgIDxDb250YWluZXIgZGF0YS1hbmltYXRpb249e2FuaW1hdGlvbn0+XG4gICAgICAgIDxTdHlsZWRTdGFjayBkaXJlY3Rpb249XCJjb2x1bW5cIj5cbiAgICAgICAgICB7ZXhwYW5kZWQgfHwgYW5pbWF0aW9uID09PSAnZXhwYW5kJyA/IChcbiAgICAgICAgICAgIDxTdHlsZWRUZXh0XG4gICAgICAgICAgICAgIGFzPVwic3BhblwiXG4gICAgICAgICAgICAgIHZhcmlhbnQ9XCJib2R5U21hbGxTdHJvbmdcIlxuICAgICAgICAgICAgICBzZW50aW1lbnQ9XCJuZXV0cmFsXCJcbiAgICAgICAgICAgICAgcHJvbWluZW5jZT1cIndlYWtcIlxuICAgICAgICAgICAgPlxuICAgICAgICAgICAgICB7bGFiZWx9XG4gICAgICAgICAgICA8L1N0eWxlZFRleHQ+XG4gICAgICAgICAgKSA6IG51bGx9XG4gICAgICAgICAge2NoaWxkcmVufVxuICAgICAgICA8L1N0eWxlZFN0YWNrPlxuICAgICAgPC9Db250YWluZXI+XG4gICAgKVxuICB9XG5cbiAgcmV0dXJuIG51bGxcbn1cbiJdfQ== */"));
+const StyledStack = /* @__PURE__ */ _styled__default.default(ui.Stack, process.env.NODE_ENV === "production" ? {
+  target: "eh4zgrv1"
+} : {
+  target: "eh4zgrv1",
+  label: "StyledStack"
+})("padding-top:", ({
+  theme
+}) => theme.space["1"], ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3BsdXMvc3JjL2NvbXBvbmVudHMvTmF2aWdhdGlvbi9jb21wb25lbnRzL0dyb3VwLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF1QmlDIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3BsdXMvc3JjL2NvbXBvbmVudHMvTmF2aWdhdGlvbi9jb21wb25lbnRzL0dyb3VwLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xuaW1wb3J0IHsgU3RhY2ssIFRleHQgfSBmcm9tICdAdWx0cmF2aW9sZXQvdWknXG5pbXBvcnQgdHlwZSB7IFJlYWN0Tm9kZSB9IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgQ2hpbGRyZW4gfSBmcm9tICdyZWFjdCdcbmltcG9ydCB7IHVzZU5hdmlnYXRpb24gfSBmcm9tICcuLi9OYXZpZ2F0aW9uUHJvdmlkZXInXG5pbXBvcnQgeyBBTklNQVRJT05fRFVSQVRJT04sIGdyb3VwQW5pbWF0aW9uIH0gZnJvbSAnLi4vY29uc3RhbnRzJ1xuXG50eXBlIEdyb3VwUHJvcHMgPSB7XG4gIGNoaWxkcmVuOiBSZWFjdE5vZGVcbiAgbGFiZWw6IHN0cmluZ1xufVxuXG5jb25zdCBTdHlsZWRUZXh0ID0gc3R5bGVkKFRleHQpYFxuICBwYWRkaW5nLWJvdHRvbTogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5zcGFjZVsnMSddfTtcbiAgcGFkZGluZy1sZWZ0OiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLnNwYWNlWycxJ119O1xuXG4gIHRyYW5zaXRpb246XG4gICAgb3BhY2l0eSAke0FOSU1BVElPTl9EVVJBVElPTn1tcyBlYXNlLWluLW91dCxcbiAgICBoZWlnaHQgJHtBTklNQVRJT05fRFVSQVRJT059bXMgZWFzZS1pbi1vdXQ7XG4gIGhlaWdodDogJHsoeyB0aGVtZSB9KSA9PlxuICAgIGBjYWxjKCR7dGhlbWUudHlwb2dyYXBoeS5ib2R5U21hbGxTdHJvbmcubGluZUhlaWdodH0gKyAke3RoZW1lLnNwYWNlWycxJ119KWB9OyAvLyBUaGlzIGlzIG9ubHkgZm9yIGFuaW1hdGlvblxuYFxuXG5jb25zdCBTdHlsZWRTdGFjayA9IHN0eWxlZChTdGFjaylgXG4gIHBhZGRpbmctdG9wOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLnNwYWNlWycxJ119O1xuYFxuXG5jb25zdCBDb250YWluZXIgPSBzdHlsZWQuZGl2YFxuICAmW2RhdGEtYW5pbWF0aW9uPSdleHBhbmQnXSB7XG4gICAgJHtTdHlsZWRUZXh0fSB7XG4gICAgICBhbmltYXRpb246ICR7Z3JvdXBBbmltYXRpb259ICR7QU5JTUFUSU9OX0RVUkFUSU9OfW1zIGVhc2UtaW4tb3V0O1xuICAgIH1cbiAgfVxuXG4gICZbZGF0YS1hbmltYXRpb249J2NvbGxhcHNlJ10ge1xuICAgICR7U3R5bGVkVGV4dH0ge1xuICAgICAgYW5pbWF0aW9uOiAke2dyb3VwQW5pbWF0aW9ufSAke0FOSU1BVElPTl9EVVJBVElPTn1tcyBlYXNlLWluLW91dCByZXZlcnNlO1xuICAgIH1cbiAgfVxuYFxuXG5leHBvcnQgY29uc3QgR3JvdXAgPSAoeyBjaGlsZHJlbiwgbGFiZWwgfTogR3JvdXBQcm9wcykgPT4ge1xuICBjb25zdCBjb250ZXh0ID0gdXNlTmF2aWdhdGlvbigpXG5cbiAgaWYgKCFjb250ZXh0KSB7XG4gICAgdGhyb3cgbmV3IEVycm9yKFxuICAgICAgJ05hdmlnYXRpb24uR3JvdXAgY2FuIG9ubHkgYmUgdXNlZCBpbnNpZGUgYSBOYXZpZ2F0aW9uUHJvdmlkZXIuJyxcbiAgICApXG4gIH1cblxuICBjb25zdCB7IGV4cGFuZGVkLCBhbmltYXRpb24gfSA9IGNvbnRleHRcblxuICBpZiAoQ2hpbGRyZW4uY291bnQoY2hpbGRyZW4pID4gMCkge1xuICAgIHJldHVybiAoXG4gICAgICA8Q29udGFpbmVyIGRhdGEtYW5pbWF0aW9uPXthbmltYXRpb259PlxuICAgICAgICA8U3R5bGVkU3RhY2sgZGlyZWN0aW9uPVwiY29sdW1uXCI+XG4gICAgICAgICAge2V4cGFuZGVkIHx8IGFuaW1hdGlvbiA9PT0gJ2V4cGFuZCcgPyAoXG4gICAgICAgICAgICA8U3R5bGVkVGV4dFxuICAgICAgICAgICAgICBhcz1cInNwYW5cIlxuICAgICAgICAgICAgICB2YXJpYW50PVwiYm9keVNtYWxsU3Ryb25nXCJcbiAgICAgICAgICAgICAgc2VudGltZW50PVwibmV1dHJhbFwiXG4gICAgICAgICAgICAgIHByb21pbmVuY2U9XCJ3ZWFrXCJcbiAgICAgICAgICAgID5cbiAgICAgICAgICAgICAge2xhYmVsfVxuICAgICAgICAgICAgPC9TdHlsZWRUZXh0PlxuICAgICAgICAgICkgOiBudWxsfVxuICAgICAgICAgIHtjaGlsZHJlbn1cbiAgICAgICAgPC9TdHlsZWRTdGFjaz5cbiAgICAgIDwvQ29udGFpbmVyPlxuICAgIClcbiAgfVxuXG4gIHJldHVybiBudWxsXG59XG4iXX0= */"));
+const Container = /* @__PURE__ */ _styled__default.default("div", process.env.NODE_ENV === "production" ? {
+  target: "eh4zgrv0"
+} : {
+  target: "eh4zgrv0",
+  label: "Container"
+})("&[data-animation='expand']{", StyledText, "{animation:", constants.groupAnimation, " ", constants.ANIMATION_DURATION, "ms ease-in-out;}}&[data-animation='collapse']{", StyledText, "{animation:", constants.groupAnimation, " ", constants.ANIMATION_DURATION, "ms ease-in-out reverse;}}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3BsdXMvc3JjL2NvbXBvbmVudHMvTmF2aWdhdGlvbi9jb21wb25lbnRzL0dyb3VwLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEyQjRCIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3BsdXMvc3JjL2NvbXBvbmVudHMvTmF2aWdhdGlvbi9jb21wb25lbnRzL0dyb3VwLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xuaW1wb3J0IHsgU3RhY2ssIFRleHQgfSBmcm9tICdAdWx0cmF2aW9sZXQvdWknXG5pbXBvcnQgdHlwZSB7IFJlYWN0Tm9kZSB9IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgQ2hpbGRyZW4gfSBmcm9tICdyZWFjdCdcbmltcG9ydCB7IHVzZU5hdmlnYXRpb24gfSBmcm9tICcuLi9OYXZpZ2F0aW9uUHJvdmlkZXInXG5pbXBvcnQgeyBBTklNQVRJT05fRFVSQVRJT04sIGdyb3VwQW5pbWF0aW9uIH0gZnJvbSAnLi4vY29uc3RhbnRzJ1xuXG50eXBlIEdyb3VwUHJvcHMgPSB7XG4gIGNoaWxkcmVuOiBSZWFjdE5vZGVcbiAgbGFiZWw6IHN0cmluZ1xufVxuXG5jb25zdCBTdHlsZWRUZXh0ID0gc3R5bGVkKFRleHQpYFxuICBwYWRkaW5nLWJvdHRvbTogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5zcGFjZVsnMSddfTtcbiAgcGFkZGluZy1sZWZ0OiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLnNwYWNlWycxJ119O1xuXG4gIHRyYW5zaXRpb246XG4gICAgb3BhY2l0eSAke0FOSU1BVElPTl9EVVJBVElPTn1tcyBlYXNlLWluLW91dCxcbiAgICBoZWlnaHQgJHtBTklNQVRJT05fRFVSQVRJT059bXMgZWFzZS1pbi1vdXQ7XG4gIGhlaWdodDogJHsoeyB0aGVtZSB9KSA9PlxuICAgIGBjYWxjKCR7dGhlbWUudHlwb2dyYXBoeS5ib2R5U21hbGxTdHJvbmcubGluZUhlaWdodH0gKyAke3RoZW1lLnNwYWNlWycxJ119KWB9OyAvLyBUaGlzIGlzIG9ubHkgZm9yIGFuaW1hdGlvblxuYFxuXG5jb25zdCBTdHlsZWRTdGFjayA9IHN0eWxlZChTdGFjaylgXG4gIHBhZGRpbmctdG9wOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLnNwYWNlWycxJ119O1xuYFxuXG5jb25zdCBDb250YWluZXIgPSBzdHlsZWQuZGl2YFxuICAmW2RhdGEtYW5pbWF0aW9uPSdleHBhbmQnXSB7XG4gICAgJHtTdHlsZWRUZXh0fSB7XG4gICAgICBhbmltYXRpb246ICR7Z3JvdXBBbmltYXRpb259ICR7QU5JTUFUSU9OX0RVUkFUSU9OfW1zIGVhc2UtaW4tb3V0O1xuICAgIH1cbiAgfVxuXG4gICZbZGF0YS1hbmltYXRpb249J2NvbGxhcHNlJ10ge1xuICAgICR7U3R5bGVkVGV4dH0ge1xuICAgICAgYW5pbWF0aW9uOiAke2dyb3VwQW5pbWF0aW9ufSAke0FOSU1BVElPTl9EVVJBVElPTn1tcyBlYXNlLWluLW91dCByZXZlcnNlO1xuICAgIH1cbiAgfVxuYFxuXG5leHBvcnQgY29uc3QgR3JvdXAgPSAoeyBjaGlsZHJlbiwgbGFiZWwgfTogR3JvdXBQcm9wcykgPT4ge1xuICBjb25zdCBjb250ZXh0ID0gdXNlTmF2aWdhdGlvbigpXG5cbiAgaWYgKCFjb250ZXh0KSB7XG4gICAgdGhyb3cgbmV3IEVycm9yKFxuICAgICAgJ05hdmlnYXRpb24uR3JvdXAgY2FuIG9ubHkgYmUgdXNlZCBpbnNpZGUgYSBOYXZpZ2F0aW9uUHJvdmlkZXIuJyxcbiAgICApXG4gIH1cblxuICBjb25zdCB7IGV4cGFuZGVkLCBhbmltYXRpb24gfSA9IGNvbnRleHRcblxuICBpZiAoQ2hpbGRyZW4uY291bnQoY2hpbGRyZW4pID4gMCkge1xuICAgIHJldHVybiAoXG4gICAgICA8Q29udGFpbmVyIGRhdGEtYW5pbWF0aW9uPXthbmltYXRpb259PlxuICAgICAgICA8U3R5bGVkU3RhY2sgZGlyZWN0aW9uPVwiY29sdW1uXCI+XG4gICAgICAgICAge2V4cGFuZGVkIHx8IGFuaW1hdGlvbiA9PT0gJ2V4cGFuZCcgPyAoXG4gICAgICAgICAgICA8U3R5bGVkVGV4dFxuICAgICAgICAgICAgICBhcz1cInNwYW5cIlxuICAgICAgICAgICAgICB2YXJpYW50PVwiYm9keVNtYWxsU3Ryb25nXCJcbiAgICAgICAgICAgICAgc2VudGltZW50PVwibmV1dHJhbFwiXG4gICAgICAgICAgICAgIHByb21pbmVuY2U9XCJ3ZWFrXCJcbiAgICAgICAgICAgID5cbiAgICAgICAgICAgICAge2xhYmVsfVxuICAgICAgICAgICAgPC9TdHlsZWRUZXh0PlxuICAgICAgICAgICkgOiBudWxsfVxuICAgICAgICAgIHtjaGlsZHJlbn1cbiAgICAgICAgPC9TdHlsZWRTdGFjaz5cbiAgICAgIDwvQ29udGFpbmVyPlxuICAgIClcbiAgfVxuXG4gIHJldHVybiBudWxsXG59XG4iXX0= */"));
+const Group = ({
+  children,
+  label
+}) => {
+  const context = NavigationProvider.useNavigation();
+  if (!context) {
+    throw new Error("Navigation.Group can only be used inside a NavigationProvider.");
+  }
+  const {
+    expanded,
+    animation
+  } = context;
+  if (react.Children.count(children) > 0) {
+    return /* @__PURE__ */ jsxRuntime.jsx(Container, { "data-animation": animation, children: /* @__PURE__ */ jsxRuntime.jsxs(StyledStack, { direction: "column", children: [
+      expanded || animation === "expand" ? /* @__PURE__ */ jsxRuntime.jsx(StyledText, { as: "span", variant: "bodySmallStrong", sentiment: "neutral", prominence: "weak", children: label }) : null,
+      children
+    ] }) });
+  }
+  return null;
+};
+exports.Group = Group;