@bbl-digital/snorre 4.2.98 → 4.3.0

package/lib/v2/core/TabNav/TabNavItem/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/packages/v2/core/TabNav/TabNavItem/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkD,MAAM,OAAO,CAAA;AAYtE,UAAU,WAAW;IACnB,gCAAgC;IAChC,KAAK,EAAE,MAAM,GAAG,MAAM,CAAA;IACtB,mCAAmC;IACnC,WAAW,EAAE,MAAM,CAAA;IACnB,iCAAiC;IACjC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,yCAAyC;IACzC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,8BAA8B;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,MAAM,WAAW,MAAM;IACrB,sDAAsD;IACtD,KAAK,EAAE,MAAM,CAAA;IACb,yCAAyC;IACzC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,2CAA2C;IAC3C,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,0CAA0C;IAC1C,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,uBAAuB;IACvB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,kDAAkD;IAClD,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,qBAAqB;IACrB,WAAW,CAAC,EAAE,WAAW,EAAE,CAAA;IAC3B,gCAAgC;IAChC,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB;AAED,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,MAAM,CAmGhC,CAAA;AAED,OAAO,EAAE,UAAU,EAAE,CAAA;AAErB,eAAe,UAAU,CAAA"}

package/lib/v2/core/TabNav/TabNavItem/index.js

@@ -0,0 +1,111 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.TabNavItem = void 0;
+var _react = require("@emotion/react");
+var _react2 = _interopRequireWildcard(require("react"));
+var _TabContext = require("../TabContext");
+var _useContainerDimensions = require("../utils/useContainerDimensions");
+var _styles = require("./styles");
+var _IconCaretDown = _interopRequireDefault(require("../../../../icons/General/IconCaretDown"));
+var _Link = _interopRequireDefault(require("../../../../core/Link"));
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+/** @jsxImportSource @emotion/react */
+
+const TabNavItem = ({
+  value,
+  displayText,
+  trackingEvent,
+  trackingName,
+  className,
+  isSelect,
+  selected,
+  selectItems,
+  isSmall = false
+}) => {
+  const theme = (0, _react.useTheme)();
+  const childrenRef = /*#__PURE__*/_react2.default.createRef();
+  const [open, setOpen] = _react2.default.useState(false);
+  const {
+    active,
+    setActive,
+    setWidth
+  } = (0, _react2.useContext)(_TabContext.TabContext);
+  const isActive = selected && selected === value || value === active;
+  const ref = (0, _react2.useRef)(null);
+  const {
+    width,
+    bottom,
+    left
+  } = (0, _useContainerDimensions.useContainerDimensions)(ref);
+  (0, _react2.useEffect)(() => {
+    const handleClickOutside = e => {
+      const node = childrenRef.current;
+      if (node && node.contains(e.target)) return;
+      setOpen(false);
+    };
+    open ? document.addEventListener('mousedown', handleClickOutside) : document.removeEventListener('mousedown', handleClickOutside);
+    return () => {
+      document.removeEventListener('mousedown', handleClickOutside);
+    };
+  }, [open, childrenRef]);
+  (0, _react2.useEffect)(() => {
+    if (width) setWidth({
+      [value]: width
+    });
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [width]);
+  const onSelectClick = value => {
+    setActive(value);
+    setOpen(false);
+  };
+  return (0, _jsxRuntime.jsxs)(_react2.Fragment, {
+    children: [(0, _jsxRuntime.jsxs)(_styles.TabNavItemWrapper, {
+      ref: ref,
+      onClick: () => isSelect ? setOpen(!open) : setActive(value),
+      theme: theme,
+      css: theme => [isActive && _styles.styles.active(theme), isSmall && _styles.styles.small()],
+      "data-tracking-name": trackingName,
+      "data-tracking-event": trackingEvent,
+      className: className,
+      children: [displayText ? displayText : value, isSelect && (0, _jsxRuntime.jsx)(_IconCaretDown.default, {
+        flipVertical: open,
+        size: 20
+      })]
+    }), isSelect && open && (0, _jsxRuntime.jsx)(_styles.SelectChildrenWrapper, {
+      left: left,
+      theme: theme,
+      bottom: bottom,
+      ref: childrenRef,
+      minWidth: width,
+      children: selectItems?.map(({
+        displayText,
+        value,
+        onClick,
+        indent,
+        disabled
+      }) => onClick ? (0, _jsxRuntime.jsx)(_styles.SelectOption, {
+        tabIndex: 0,
+        children: (0, _jsxRuntime.jsx)(_Link.default, {
+          nopadding: true,
+          onClick: onClick,
+          children: displayText || value
+        }, value)
+      }, value) : (0, _jsxRuntime.jsx)(_styles.SelectOption, {
+        bold: value === active,
+        tabIndex: 0,
+        indent: indent,
+        disabled: disabled,
+        onClick: !disabled ? () => onSelectClick(value) : undefined,
+        children: displayText
+      }, value))
+    })]
+  });
+};
+exports.TabNavItem = TabNavItem;
+var _default = exports.default = TabNavItem;

package/lib/v2/core/TabNav/TabNavItem/styles.d.ts

@@ -24,3 +24,4 @@ export declare const styles: {
     active: (theme: IAppTheme) => import("@emotion/react").SerializedStyles;
     small: () => import("@emotion/react").SerializedStyles;
 };
+//# sourceMappingURL=styles.d.ts.map

package/lib/v2/core/TabNav/TabNavItem/styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../src/packages/v2/core/TabNav/TabNavItem/styles.ts"],"names":[],"mappings":"AAEA,OAAO,SAAS,MAAM,6BAA6B,CAAA;AAWnD,eAAO,MAAM,iBAAiB;;SAS1B,MAAI,WAAW;qHAclB,CAAA;AAED,eAAO,MAAM,qBAAqB;;SAhB9B,MAAI,WAAW;;YAkBP,MAAM;UACR,MAAM;cACF,MAAM;WACT,SAAS;6GAwCnB,CAAA;AAED,eAAO,MAAM,YAAY;;SA/DrB,MAAI,WAAW;;eAqEJ,OAAO;WACX,OAAO;aACL,MAAM;yGAelB,CAAA;AAED,eAAO,MAAM,MAAM;oBACD,SAAS;;CAc1B,CAAA"}

package/lib/v2/core/TabNav/TabNavItem/styles.js

@@ -0,0 +1,49 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.styles = exports.TabNavItemWrapper = exports.SelectOption = exports.SelectChildrenWrapper = void 0;
+var _base = _interopRequireDefault(require("@emotion/styled/base"));
+var _react = require("@emotion/react");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+const calculateIndent = indent => {
+  const BASE = 8;
+  const INDENT_PADDING_LI = indent === 1 ? BASE * 3 : (indent + 2) * BASE;
+  return /*#__PURE__*/(0, _react.css)("padding-left:", INDENT_PADDING_LI, "px!important;" + (process.env.NODE_ENV === "production" ? "" : ";label:calculateIndent;"));
+};
+const TabNavItemWrapper = exports.TabNavItemWrapper = /*#__PURE__*/(0, _base.default)("button", process.env.NODE_ENV === "production" ? {
+  target: "eucjil52"
+} : {
+  target: "eucjil52",
+  label: "TabNavItemWrapper"
+})(props => /*#__PURE__*/(0, _react.css)("display:flex;border:none;background:transparent;cursor:pointer;padding:0.75rem 1rem;position:relative;font-size:16px;font-weight:600;transition:background ease 250ms;border-radius:8px;&:hover{background:", props.theme.primary10opa, ";color:", props.theme.defaultText, ";}&:focus,&:focus-visible{outline:2px solid ", props.theme.primary, ";outline-offset:1px;}" + (process.env.NODE_ENV === "production" ? "" : ";label:TabNavItemWrapper;")));
+const SelectChildrenWrapper = exports.SelectChildrenWrapper = /*#__PURE__*/(0, _base.default)("ul", process.env.NODE_ENV === "production" ? {
+  target: "eucjil51"
+} : {
+  target: "eucjil51",
+  label: "SelectChildrenWrapper"
+})(props => /*#__PURE__*/(0, _react.css)("position:absolute;z-index:3;top:calc(", props.bottom, "px - 0.5em);left:", props.left, "px;background:#fff;box-shadow:0px 10px 15px 0px rgba(0, 0, 0, 0.1);list-style:none;margin:0;padding:0;min-width:", props.minWidth, "px;max-width:350px;max-height:40vh;overflow-y:auto;overflow-x:hidden;&>li{word-break:break-all;background:#fff;display:flex;width:calc(100% - 1em);cursor:pointer;list-style:none;padding:0.5em;padding-left:1em;border-top:1px solid ", props.theme.border, ";transition:background 150ms ease-in-out;&:first-of-type{border-top:none;}&:hover,&:focus{background:", props.theme.bgLight, ";}}" + (process.env.NODE_ENV === "production" ? "" : ";label:SelectChildrenWrapper;")));
+const SelectOption = exports.SelectOption = /*#__PURE__*/(0, _base.default)("li", process.env.NODE_ENV === "production" ? {
+  target: "eucjil50"
+} : {
+  target: "eucjil50",
+  label: "SelectOption"
+})(({
+  disabled,
+  bold,
+  indent
+}) => /*#__PURE__*/(0, _react.css)("padding:0;padding-left:8px;padding-right:8px;justify-content:flex-start;height:100%;width:100%;opacity:", disabled ? 0.5 : 1, ";font-weight:", bold ? 600 : 400, ";", indent && calculateIndent(indent), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:SelectOption;")));
+var _ref = process.env.NODE_ENV === "production" ? {
+  name: "m1a2da",
+  styles: "padding:0.5rem"
+} : {
+  name: "1o6kqfy-small",
+  styles: "padding:0.5rem;label:small;",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+const styles = exports.styles = {
+  active: theme => /*#__PURE__*/(0, _react.css)("background-color:", theme.primary5darker, ";color:white;:hover{background-color:", theme.primary5darker, ";color:white;}" + (process.env.NODE_ENV === "production" ? "" : ";label:active;")),
+  small: () => _ref
+};

package/lib/v2/core/TabNav/index.d.ts

@@ -26,3 +26,4 @@ interface Props {
 declare const TabNav: React.FC<Props>;
 export { TabNav };
 export default TabNav;
+//# sourceMappingURL=index.d.ts.map

package/lib/v2/core/TabNav/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/packages/v2/core/TabNav/index.tsx"],"names":[],"mappings":"AAAA,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACxC,OAAO,EAAE,gBAAgB,EAAY,MAAM,gBAAgB,CAAA;AAe3D,UAAU,KAAK;IACb,iDAAiD;IACjD,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,qEAAqE;IACrE,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAA;IAC1C,gDAAgD;IAChD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,kDAAkD;IAClD,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,iBAAiB;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,sBAAsB;IACtB,GAAG,CAAC,EAAE,gBAAgB,CAAA;IACtB,uEAAuE;IACvE,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,oBAAoB;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,sCAAsC;IACtC,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,eAAe;IACf,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B;AAWD,QAAA,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAiJ3B,CAAA;AAED,OAAO,EAAE,MAAM,EAAE,CAAA;AAEjB,eAAe,MAAM,CAAA"}

package/lib/v2/core/TabNav/index.js

@@ -0,0 +1,133 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.TabNav = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _react2 = require("@emotion/react");
+var _TabContext = require("./TabContext");
+var _styles = require("./styles");
+var _useContainerDimensions = require("./utils/useContainerDimensions");
+var _useIsMobile = require("../../../hooks/useIsMobile");
+var _Select = _interopRequireWildcard(require("../../../core/Select"));
+var _Link = _interopRequireDefault(require("../../../core/Link"));
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+/** @jsxImportSource @emotion/react */
+
+const TabNav = ({
+  value,
+  children,
+  onChange,
+  css,
+  maxWidth,
+  vertical,
+  actions,
+  className,
+  breakpoint
+}) => {
+  const isMobile = (0, _useIsMobile.useIsMobile)(breakpoint);
+  const theme = (0, _react2.useTheme)();
+
+  // Container dimensions
+  const ref = _react.default.useRef(null);
+  const {
+    width: containerWidth
+  } = (0, _useContainerDimensions.useContainerDimensions)(ref);
+
+  // Button dimensions
+  const buttonRef = _react.default.useRef(null);
+  const {
+    width: actionsWidth
+  } = (0, _useContainerDimensions.useContainerDimensions)(buttonRef);
+  const values = _react.default.Children.map(children, child => child !== null && child.props)?.filter(Boolean) || [];
+  const displayNameFromValue = value => {
+    const item = values.find(item => item.value === value);
+    return item?.displayText || String(value);
+  };
+  const valueWithSelectItemIndex = values.findIndex(item => item.selectItems?.length);
+  const listOfSelectedItems = items => {
+    if (!items) return [];
+    return items.map(prop => ({
+      ...prop
+    }));
+  };
+  if (valueWithSelectItemIndex > -1) {
+    const selectedItems = values[valueWithSelectItemIndex].selectItems;
+
+    // If we have no actual selectedItems, dont show any label while in the mobile/dropdown version
+    const isEverySelectedItemDisabledOrLink = Number(selectedItems?.length) >= 1 && selectedItems?.every(item => item.disabled || item.onClick);
+    if (isEverySelectedItemDisabledOrLink) {
+      const itemsWithOnClick = selectedItems?.filter(item => item.onClick) || [];
+
+      // Remove valueWithSelectItemIndex from the values array, but add on itemsWithOnClick in the list
+      values.splice(valueWithSelectItemIndex, 1, ...listOfSelectedItems(itemsWithOnClick));
+    } else {
+      values.splice(valueWithSelectItemIndex + 1, 0, ...listOfSelectedItems(selectedItems));
+    }
+  }
+  return (0, _jsxRuntime.jsx)(_TabContext.TabContextProvider, {
+    onChange: onChange,
+    value: value || values?.[0].value,
+    children: (0, _jsxRuntime.jsx)(_TabContext.TabContext.Consumer, {
+      children: ({
+        width: childrenTotalWidth,
+        setActive,
+        active
+      }) => {
+        if (breakpoint && isMobile || !breakpoint && actionsWidth + childrenTotalWidth > containerWidth) {
+          // Render dropdown instead of tabs
+
+          return (0, _jsxRuntime.jsxs)(_styles.SelectWrapper, {
+            children: [(0, _jsxRuntime.jsx)(_Select.default, {
+              input: true,
+              width: "auto",
+              text: "Velg",
+              selectedValue: displayNameFromValue(String(active)) || '0',
+              onChange: ({
+                value
+              }) => value && setActive(value),
+              className: className,
+              maxHeight: "40vh",
+              children: values.map(({
+                displayText,
+                value: v,
+                selectItems,
+                onClick,
+                indent,
+                disabled
+              }) => onClick ? (0, _jsxRuntime.jsx)(_styles.SelectLinkWrapper, {
+                children: (0, _jsxRuntime.jsx)(_Link.default, {
+                  nopadding: true,
+                  small: true,
+                  onClick: onClick,
+                  children: displayText || v
+                })
+              }, v) : (0, _jsxRuntime.jsx)(_Select.Option, {
+                value: v,
+                indent: indent,
+                disabled: disabled || Boolean(selectItems?.length),
+                children: displayText || v
+              }, v))
+            }), actions]
+          });
+        }
+        return (0, _jsxRuntime.jsxs)(_styles.TabNavWrapper, {
+          ref: ref,
+          theme: theme,
+          className: className,
+          css: () => [vertical && _styles.styles.vertical, maxWidth && _styles.styles.maxWidth(maxWidth), css],
+          children: [children, actions && (0, _jsxRuntime.jsx)(_styles.TabNavActions, {
+            ref: buttonRef,
+            children: actions
+          })]
+        });
+      }
+    })
+  });
+};
+exports.TabNav = TabNav;
+var _default = exports.default = TabNav;

package/lib/v2/core/TabNav/styles.d.ts

@@ -19,3 +19,4 @@ export declare const styles: {
     vertical: import("@emotion/react").SerializedStyles;
 };
 export default styles;
+//# sourceMappingURL=styles.d.ts.map

package/lib/v2/core/TabNav/styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/packages/v2/core/TabNav/styles.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,aAAa;;SAwBtB,MAIJ,WAAS;yGAjBR,CAAA;AAED,eAAO,MAAM,aAAa;;SAWtB,MAIJ,WAAS;2GAFR,CAAA;AAED,eAAO,MAAM,iBAAiB;;SAJ1B,MAIJ,WAAS;yGAAmC,CAAA;AAE5C,eAAO,MAAM,aAAa;;SANtB,MAIJ,WAAS;yGAYR,CAAA;AAED,eAAO,MAAM,MAAM;sBACC,MAAM;;CAsBzB,CAAA;AAED,eAAe,MAAM,CAAA"}

package/lib/v2/core/TabNav/styles.js

@@ -0,0 +1,62 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.styles = exports.default = exports.TabNavWrapper = exports.TabNavActions = exports.SelectWrapper = exports.SelectLinkWrapper = void 0;
+var _base = _interopRequireDefault(require("@emotion/styled/base"));
+var _react = require("@emotion/react");
+var _breakpoints = _interopRequireDefault(require("../../../globals/styles/breakpoints"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+var _ref = process.env.NODE_ENV === "production" ? {
+  name: "1qytrcl",
+  styles: "display:flex;gap:0.5rem;width:100%;position:relative;padding:0;margin:0;align-content:space-between;align-items:flex-end"
+} : {
+  name: "mniq5c-TabNavWrapper",
+  styles: "display:flex;gap:0.5rem;width:100%;position:relative;padding:0;margin:0;align-content:space-between;align-items:flex-end;label:TabNavWrapper;",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+const TabNavWrapper = exports.TabNavWrapper = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
+  target: "e2i76m83"
+} : {
+  target: "e2i76m83",
+  label: "TabNavWrapper"
+})(props => _ref);
+const TabNavActions = exports.TabNavActions = /*#__PURE__*/(0, _base.default)("span", process.env.NODE_ENV === "production" ? {
+  target: "e2i76m82"
+} : {
+  target: "e2i76m82",
+  label: "TabNavActions"
+})("position:absolute;right:0;bottom:1em;@media (max-width: ", _breakpoints.default.medium, "){bottom:0;padding:1em;&:after{display:none;}}");
+const SelectLinkWrapper = exports.SelectLinkWrapper = /*#__PURE__*/(0, _base.default)("li", process.env.NODE_ENV === "production" ? {
+  target: "e2i76m81"
+} : {
+  target: "e2i76m81",
+  label: "SelectLinkWrapper"
+})();
+const SelectWrapper = exports.SelectWrapper = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
+  target: "e2i76m80"
+} : {
+  target: "e2i76m80",
+  label: "SelectWrapper"
+})(process.env.NODE_ENV === "production" ? {
+  name: "1cickod",
+  styles: "display:flex;flex-direction:column;gap:0.5em;&>span>div>ul>li>button{word-break:break-all;text-align:left;}"
+} : {
+  name: "1cickod",
+  styles: "display:flex;flex-direction:column;gap:0.5em;&>span>div>ul>li>button{word-break:break-all;text-align:left;}",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+const styles = exports.styles = {
+  maxWidth: width => /*#__PURE__*/(0, _react.css)("max-width:", width, "px;" + (process.env.NODE_ENV === "production" ? "" : ";label:maxWidth;")),
+  vertical: process.env.NODE_ENV === "production" ? {
+    name: "1yrkr6r",
+    styles: "flex-direction:column;align-items:flex-start;&:after{left:0;top:0;width:4px;height:100%;}& button::after,& button:hover::after{height:100%;width:4px;top:0;}"
+  } : {
+    name: "qxb6uv-vertical",
+    styles: "flex-direction:column;align-items:flex-start;&:after{left:0;top:0;width:4px;height:100%;}& button::after,& button:hover::after{height:100%;width:4px;top:0;};label:vertical;",
+    toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+  }
+};
+var _default = exports.default = styles;

package/lib/v2/core/TabNav/utils/useContainerDimensions.d.ts

@@ -5,3 +5,4 @@ export declare const useContainerDimensions: (ref: React.RefObject<HTMLButtonEle
     left: number;
     bottom: number;
 };
+//# sourceMappingURL=useContainerDimensions.d.ts.map

package/lib/v2/core/TabNav/utils/useContainerDimensions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useContainerDimensions.d.ts","sourceRoot":"","sources":["../../../../../src/packages/v2/core/TabNav/utils/useContainerDimensions.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,sBAAsB,GACjC,KAAK,KAAK,CAAC,SAAS,CAAC,iBAAiB,GAAG,cAAc,GAAG,eAAe,CAAC;;;;;;CAkC3E,CAAA"}

package/lib/v2/core/TabNav/utils/useContainerDimensions.js

@@ -0,0 +1,33 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useContainerDimensions = void 0;
+var _react = require("react");
+const useContainerDimensions = ref => {
+  const [dimensions, setDimensions] = (0, _react.useState)({
+    width: 0,
+    height: 0,
+    top: 0,
+    left: 0,
+    bottom: 0
+  });
+  const getDimensions = (0, _react.useCallback)(() => ({
+    width: ref.current?.offsetWidth || 0,
+    height: ref.current?.offsetHeight || 0,
+    top: ref.current?.offsetTop || 0,
+    left: ref.current?.offsetLeft || 0,
+    bottom: Number(ref.current?.offsetTop) + Number(ref.current?.offsetHeight) || 0
+  }), [ref]);
+  (0, _react.useEffect)(() => {
+    const handleResize = () => setDimensions(getDimensions());
+    if (ref.current) setDimensions(getDimensions());
+    window.addEventListener('resize', handleResize);
+    return () => {
+      window.removeEventListener('resize', handleResize);
+    };
+  }, [getDimensions, ref]);
+  return dimensions;
+};
+exports.useContainerDimensions = useContainerDimensions;

package/lib/v2/hooks/useOverflow.d.ts

@@ -8,3 +8,4 @@ interface OverflowState {
 }
 declare const useOverflow: (ref: RefObject<HTMLElement>) => OverflowState;
 export default useOverflow;
+//# sourceMappingURL=useOverflow.d.ts.map

package/lib/v2/hooks/useOverflow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useOverflow.d.ts","sourceRoot":"","sources":["../../../src/packages/v2/hooks/useOverflow.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuB,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtD,UAAU,aAAa;IACrB,YAAY,EAAE,OAAO,CAAA;IACrB,aAAa,EAAE,OAAO,CAAA;IACtB,SAAS,EAAE,OAAO,CAAA;IAClB,SAAS,EAAE,OAAO,CAAA;IAClB,WAAW,EAAE,OAAO,CAAA;CACrB;AAED,QAAA,MAAM,WAAW,GAAI,KAAK,SAAS,CAAC,WAAW,CAAC,KAAG,aAoClD,CAAA;AAED,eAAe,WAAW,CAAA"}

package/lib/v2/hooks/useOverflow.js

@@ -0,0 +1,49 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = require("react");
+const useOverflow = ref => {
+  const [overflowLeft, setOverflowLeft] = (0, _react.useState)(false);
+  const [overflowRight, setOverflowRight] = (0, _react.useState)(false);
+  const [overflowY, setOverflowY] = (0, _react.useState)(false);
+  const [overflowX, setOverflowX] = (0, _react.useState)(false);
+  const [anyOverflow, setAnyOverflow] = (0, _react.useState)(false);
+  const checkOverflow = () => {
+    const element = ref.current;
+    if (!element) return;
+    const {
+      scrollLeft,
+      scrollWidth,
+      clientWidth,
+      scrollHeight,
+      clientHeight
+    } = element;
+    setOverflowLeft(scrollLeft > 0);
+    setOverflowRight(scrollLeft < scrollWidth - clientWidth);
+    setOverflowX(scrollWidth > clientWidth);
+    const hasOverflowX = scrollWidth > clientWidth;
+    const hasOverflowY = scrollHeight > clientHeight;
+    setOverflowY(hasOverflowY);
+    setAnyOverflow(hasOverflowX || hasOverflowY);
+  };
+  (0, _react.useEffect)(() => {
+    const element = ref.current;
+    if (!element) return;
+    checkOverflow();
+    element.addEventListener('scroll', checkOverflow);
+    return () => element.removeEventListener('scroll', checkOverflow);
+  }, [ref]);
+
+  // Return the overflow state
+  return {
+    overflowLeft,
+    overflowRight,
+    overflowY,
+    anyOverflow,
+    overflowX
+  };
+};
+var _default = exports.default = useOverflow;

package/lib/v2/index.d.ts

@@ -12,3 +12,4 @@ import HeaderCell from '../core/BoxedTable/HeaderCell';
 import TableHeader from '../core/BoxedTable/TableHeader';
 import TableRow from '../core/BoxedTable/TableRow';
 export { Chip, Button, ButtonsFilter, MemberBenefitsCard, Box, TabNav, TabNavItem, BoxedTable, RowCell, DraggableRow, HeaderCell, TableHeader, TableRow, };
+//# sourceMappingURL=index.d.ts.map

package/lib/v2/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/packages/v2/index.tsx"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,aAAa,CAAA;AAC9B,OAAO,MAAM,MAAM,eAAe,CAAA;AAClC,OAAO,aAAa,MAAM,sBAAsB,CAAA;AAChD,OAAO,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAA;AACxE,OAAO,GAAG,MAAM,YAAY,CAAA;AAC5B,OAAO,MAAM,MAAM,eAAe,CAAA;AAClC,OAAO,UAAU,MAAM,0BAA0B,CAAA;AACjD,OAAO,UAAU,MAAM,mBAAmB,CAAA;AAC1C,OAAO,OAAO,MAAM,4BAA4B,CAAA;AAChD,OAAO,YAAY,MAAM,iCAAiC,CAAA;AAC1D,OAAO,UAAU,MAAM,+BAA+B,CAAA;AACtD,OAAO,WAAW,MAAM,gCAAgC,CAAA;AACxD,OAAO,QAAQ,MAAM,6BAA6B,CAAA;AAElD,OAAO,EACL,IAAI,EACJ,MAAM,EACN,aAAa,EACb,kBAAkB,EAClB,GAAG,EACH,MAAM,EACN,UAAU,EACV,UAAU,EACV,OAAO,EACP,YAAY,EACZ,UAAU,EACV,WAAW,EACX,QAAQ,GACT,CAAA"}

package/lib/v2/index.js

@@ -0,0 +1,97 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "Box", {
+  enumerable: true,
+  get: function () {
+    return _Box.default;
+  }
+});
+Object.defineProperty(exports, "BoxedTable", {
+  enumerable: true,
+  get: function () {
+    return _BoxedTable.default;
+  }
+});
+Object.defineProperty(exports, "Button", {
+  enumerable: true,
+  get: function () {
+    return _Button.default;
+  }
+});
+Object.defineProperty(exports, "ButtonsFilter", {
+  enumerable: true,
+  get: function () {
+    return _ButtonsFilter.default;
+  }
+});
+Object.defineProperty(exports, "Chip", {
+  enumerable: true,
+  get: function () {
+    return _Chip.default;
+  }
+});
+Object.defineProperty(exports, "DraggableRow", {
+  enumerable: true,
+  get: function () {
+    return _DraggableRow.default;
+  }
+});
+Object.defineProperty(exports, "HeaderCell", {
+  enumerable: true,
+  get: function () {
+    return _HeaderCell.default;
+  }
+});
+Object.defineProperty(exports, "MemberBenefitsCard", {
+  enumerable: true,
+  get: function () {
+    return _MemberbenefitsCard.MemberBenefitsCard;
+  }
+});
+Object.defineProperty(exports, "RowCell", {
+  enumerable: true,
+  get: function () {
+    return _RowCell.default;
+  }
+});
+Object.defineProperty(exports, "TabNav", {
+  enumerable: true,
+  get: function () {
+    return _TabNav.default;
+  }
+});
+Object.defineProperty(exports, "TabNavItem", {
+  enumerable: true,
+  get: function () {
+    return _TabNavItem.default;
+  }
+});
+Object.defineProperty(exports, "TableHeader", {
+  enumerable: true,
+  get: function () {
+    return _TableHeader.default;
+  }
+});
+Object.defineProperty(exports, "TableRow", {
+  enumerable: true,
+  get: function () {
+    return _TableRow.default;
+  }
+});
+var _Chip = _interopRequireDefault(require("./core/Chip"));
+var _Button = _interopRequireDefault(require("./core/Button"));
+var _ButtonsFilter = _interopRequireDefault(require("./core/ButtonsFilter"));
+var _MemberbenefitsCard = require("./Memberbenefits/MemberbenefitsCard");
+var _Box = _interopRequireDefault(require("./core/Box"));
+var _TabNav = _interopRequireDefault(require("./core/TabNav"));
+var _TabNavItem = _interopRequireDefault(require("./core/TabNav/TabNavItem"));
+var _BoxedTable = _interopRequireDefault(require("./core/BoxedTable"));
+var _RowCell = _interopRequireDefault(require("../core/BoxedTable/RowCell"));
+var _DraggableRow = _interopRequireDefault(require("../core/BoxedTable/DraggableRow"));
+var _HeaderCell = _interopRequireDefault(require("../core/BoxedTable/HeaderCell"));
+var _TableHeader = _interopRequireDefault(require("../core/BoxedTable/TableHeader"));
+var _TableRow = _interopRequireDefault(require("../core/BoxedTable/TableRow"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }