@activecollab/components 2.0.185 → 2.0.186

package/dist/cjs/components/Nav/Item/Styles.js

@@ -11,10 +11,17 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
 var StyledNavListItemMore = exports.StyledNavListItemMore = (0, _styledComponents.default)(_Item.Item).withConfig({
   displayName: "Styles__StyledNavListItemMore",
   componentId: "sc-m6npdq-0"
-})(["", " cursor:pointer;", ""], function (props) {
+})(["", " cursor:pointer;&::after{content:\"\";", " bottom:0;left:50%;transform:translateX(-50%);height:3px;transition:width 0.3s ease,background-color 0.3s ease;", "}"], function (props) {
   return props.role !== "light" && (0, _styledComponents.css)(["padding:0;"]);
 }, {
-  "pointerEvents": "auto"
+  "position": "absolute",
+  "margin": "auto",
+  "display": "block",
+  "width": "0px",
+  "backgroundColor": "transparent"
+}, {
+  "width": "100%",
+  "backgroundColor": "var(--color-primary)"
 });
 StyledNavListItemMore.displayName = "StyledNavListItemMore";
 //# sourceMappingURL=Styles.js.map

package/dist/cjs/components/Nav/Item/Styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Styles.js","names":["_styledComponents","_interopRequireWildcard","require","_Item","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","StyledNavListItemMore","exports","styled","Item","withConfig","displayName","componentId","props","role","css"],"sources":["../../../../../src/components/Nav/Item/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\n\nimport { Item } from \"./Item\";\n\nexport const StyledNavListItemMore = styled(Item)`\n  ${(props) =>\n    props.role !== \"light\" &&\n    css`\n      padding: 0;\n    `}\n  cursor: pointer;\n  ${tw`tw-pointer-events-auto`}\n`;\n\nStyledNavListItemMore.displayName = \"StyledNavListItemMore\";\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;AAGA,IAAAC,KAAA,GAAAD,OAAA;AAA8B,SAAAE,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,yBAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAJ,wBAAAI,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAjB,CAAA,EAAAc,CAAA,SAAAI,CAAA,GAAAR,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAI,CAAA,KAAAA,CAAA,CAAAX,GAAA,IAAAW,CAAA,CAAAC,GAAA,IAAAR,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAI,CAAA,IAAAV,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAgB,GAAA,CAAAnB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAEvB,IAAMY,qBAAqB,GAAAC,OAAA,CAAAD,qBAAA,GAAG,IAAAE,yBAAM,EAACC,UAAI,CAAC,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,iCAC7C,UAACC,KAAK;EAAA,OACNA,KAAK,CAACC,IAAI,KAAK,OAAO,QACtBC,qBAAG,iBAEF;AAAA,GAEC;EAAA;AAAuB,CAAC,CAC7B;AAEDT,qBAAqB,CAACK,WAAW,GAAG,uBAAuB"}
+{"version":3,"file":"Styles.js","names":["_styledComponents","_interopRequireWildcard","require","_Item","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","StyledNavListItemMore","exports","styled","Item","withConfig","displayName","componentId","props","role","css"],"sources":["../../../../../src/components/Nav/Item/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\n\nimport { Item } from \"./Item\";\n\nexport const StyledNavListItemMore = styled(Item)`\n  ${(props) =>\n    props.role !== \"light\" &&\n    css`\n      padding: 0;\n    `}\n  cursor: pointer;\n\n  &::after {\n    content: \"\";\n    ${tw`tw-absolute tw-block tw-m-auto tw-w-0 tw-bg-transparent`}\n    bottom: 0;\n    left: 50%;\n    transform: translateX(-50%);\n    height: 3px;\n    transition: width 0.3s ease, background-color 0.3s ease;\n    ${tw`tw-w-full tw-bg-primary`}\n  }\n`;\n\nStyledNavListItemMore.displayName = \"StyledNavListItemMore\";\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;AAGA,IAAAC,KAAA,GAAAD,OAAA;AAA8B,SAAAE,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,yBAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAJ,wBAAAI,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAjB,CAAA,EAAAc,CAAA,SAAAI,CAAA,GAAAR,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAI,CAAA,KAAAA,CAAA,CAAAX,GAAA,IAAAW,CAAA,CAAAC,GAAA,IAAAR,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAI,CAAA,IAAAV,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAgB,GAAA,CAAAnB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAEvB,IAAMY,qBAAqB,GAAAC,OAAA,CAAAD,qBAAA,GAAG,IAAAE,yBAAM,EAACC,UAAI,CAAC,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,2KAC7C,UAACC,KAAK;EAAA,OACNA,KAAK,CAACC,IAAI,KAAK,OAAO,QACtBC,qBAAG,iBAEF;AAAA,GAKG;EAAA;EAAA;EAAA;EAAA;EAAA;AAAwD,CAAC,EAMzD;EAAA;EAAA;AAAwB,CAAC,CAEhC;AAEDT,qBAAqB,CAACK,WAAW,GAAG,uBAAuB"}

package/dist/cjs/components/Nav/Nav.js

@@ -102,7 +102,8 @@ var Nav = exports.Nav = function Nav(_ref) {
   }, [children]);
   var navAsSelect = (0, _react.useMemo)(function () {
     return /*#__PURE__*/_react.default.createElement(_Styles2.StyledNavAsSelect, {
-      id: targetId
+      id: targetId,
+      $active: true
     }, /*#__PURE__*/_react.default.createElement("span", null, navItemNames[active]), /*#__PURE__*/_react.default.createElement(_ExpandSingle.ExpandSingle, {
       expanded: moreOpened,
       fill: "currentColor"
@@ -134,8 +135,7 @@ var Nav = exports.Nav = function Nav(_ref) {
       "data-disabled": element.props.disabled
     });
   }), type === "dropdown" ? /*#__PURE__*/_react.default.createElement(_Styles.StyledNavListItemMore, {
-    name: "More",
-    active: Array.from(navItemNames.keys()).indexOf(active) === -1,
+    name: navItemNames[active],
     role: role
   }, /*#__PURE__*/_react.default.createElement(_Select.Select, {
     selected: active,

package/dist/cjs/components/Nav/Nav.js.map

@@ -1 +1 @@
-{"version":3,"file":"Nav.js","names":["_react","_interopRequireWildcard","require","_classnames","_interopRequireDefault","_Styles","_Styles2","_utils","_ExpandSingle","_Select","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","_slicedToArray","arr","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","toString","slice","constructor","name","Array","from","test","len","length","arr2","l","Symbol","iterator","f","next","done","push","value","return","isArray","Nav","exports","_ref","_dimensions$width","_childDimensions$widt","children","_ref$alignment","alignment","onSelect","className","_ref$role","role","targetId","_useState","useState","_useState2","active","setActive","_useState3","_useState4","moreOpened","setMoreOpened","_useState5","_useState6","type","setType","setMoreOpen","useCallback","setMoreClose","navItemNames","useMemo","Children","toArray","map","item","_item$props","props","allOptions","index","id","navRef","useRef","wrapRef","dimensions","useResizeObserver","childDimensions","parentWidth","width","childWidth","_useState7","_useState8","childrenWidth","setChildrenWidth","useLayoutEffect","onClick","metaKey","ctrlKey","target","currentTarget","dataset","disabled","Number","onMoreOptionClick","forEach","child","navAsSelect","createElement","StyledNavAsSelect","ExpandSingle","expanded","fill","useEffect","current","StyledNav","classNames","$align","$role","ref","StyledNavList","element","cloneElement","StyledNavListItemMore","keys","indexOf","Select","selected","disabledInternalSort","options","mode","forceCloseMenu","disableSearch","keepSameOptionsOrder","onChange","onSelectOpen","onSelectClose","displayName"],"sources":["../../../../src/components/Nav/Nav.tsx"],"sourcesContent":["import React, {\n  ReactElement,\n  FC,\n  ReactNode,\n  useState,\n  useRef,\n  useCallback,\n  useMemo,\n  Children,\n  cloneElement,\n  useEffect,\n  useLayoutEffect,\n} from \"react\";\n\nimport classNames from \"classnames\";\n\nimport { ItemProps } from \"./Item/Item\";\nimport { StyledNavListItemMore } from \"./Item/Styles\";\nimport { StyledNav, StyledNavAsSelect, StyledNavList } from \"./Styles\";\nimport { useResizeObserver } from \"../../utils\";\nimport { ExpandSingle } from \"../Expanders/ExpandSingle\";\nimport { Select } from \"../Select/Select\";\n\ntype NavType = \"inline\" | \"dropdown\";\nexport type NavAlignType = \"left\" | \"center\" | \"right\";\nexport type NavRoleType = \"bold\" | \"light\";\n\nexport interface INavProps {\n  children?: ReactElement<ItemProps>[];\n  /** Function for changing active navs. */\n  onSelect?: (index: number) => void;\n  /** Aligment of nav component. */\n  alignment?: NavAlignType;\n  /** CSS classes. */\n  className?: string;\n  /** Role of nav component. */\n  role?: NavRoleType;\n  /** Target id */\n  targetId?: string;\n}\n\nexport const Nav: FC<INavProps> = ({\n  children,\n  alignment = \"left\",\n  onSelect,\n  className,\n  role = \"bold\",\n  targetId,\n}) => {\n  const [active, setActive] = useState(0);\n  const [moreOpened, setMoreOpened] = useState(false);\n  const [type, setType] = useState<NavType>(\"inline\");\n\n  const setMoreOpen = useCallback(() => setMoreOpened(true), []);\n  const setMoreClose = useCallback(() => setMoreOpened(false), []);\n\n  const navItemNames = useMemo(() => {\n    return children\n      ? (Children.toArray(children) as ReactElement<ItemProps>[]).map(\n          (item) => item?.props?.name\n        )\n      : [];\n  }, [children]);\n\n  const allOptions = useMemo(() => {\n    return navItemNames?.map((name, index) => {\n      return { id: index, name: name };\n    });\n  }, [navItemNames]);\n\n  const navRef = useRef<HTMLUListElement | null>(null);\n  const wrapRef = useRef<HTMLElement | null>(null);\n  const dimensions = useResizeObserver(wrapRef);\n  const childDimensions = useResizeObserver(navRef);\n\n  const parentWidth = dimensions?.width ?? 0;\n  const childWidth = childDimensions?.width ?? 0;\n\n  const [childrenWidth, setChildrenWidth] = useState(childWidth);\n\n  useLayoutEffect(() => {\n    if (type === \"inline\") setChildrenWidth(childWidth);\n  }, [childWidth, type]);\n\n  const onClick = useCallback(\n    (e: React.MouseEvent<HTMLElement, MouseEvent>) => {\n      if (e.metaKey || e.ctrlKey) {\n        return;\n      }\n      if (\n        e.target &&\n        e.currentTarget.dataset.index &&\n        !e.currentTarget.dataset.disabled\n      ) {\n        const index = Number(e.currentTarget.dataset.index);\n        setActive(index);\n        if (onSelect) {\n          onSelect(index);\n        }\n      }\n    },\n    [onSelect]\n  );\n\n  const onMoreOptionClick = useCallback(\n    (id) => {\n      setActive(id);\n      if (onSelect) {\n        onSelect(id);\n      }\n    },\n    [onSelect]\n  );\n\n  useMemo(() => {\n    Children.forEach(\n      children as ReactElement[],\n      (child: ReactElement, index) => {\n        if (child && child.props.active) {\n          setActive(index);\n        }\n      }\n    );\n  }, [children]);\n\n  const navAsSelect = useMemo(() => {\n    return (\n      <StyledNavAsSelect id={targetId}>\n        <span>{navItemNames[active]}</span>\n        <ExpandSingle expanded={moreOpened} fill=\"currentColor\" />\n      </StyledNavAsSelect>\n    );\n  }, [active, moreOpened, navItemNames, targetId]);\n\n  useEffect(() => {\n    if (!navRef.current || !wrapRef.current) return;\n\n    if (childrenWidth >= parentWidth) {\n      setType(\"dropdown\");\n    } else {\n      setType(\"inline\");\n    }\n  }, [childrenWidth, parentWidth]);\n\n  if (!children) return;\n\n  return (\n    <StyledNav\n      className={classNames(\"c-nav\", className)}\n      $align={alignment}\n      $role={role}\n      ref={wrapRef}\n    >\n      <StyledNavList ref={navRef}>\n        {type === \"inline\" &&\n          Children.toArray(children).map((child: ReactNode, index: number) => {\n            const element = child as ReactElement;\n            return cloneElement(element, {\n              active: index === active,\n              role,\n              onClick,\n              \"data-index\": index,\n              \"data-disabled\": element.props.disabled,\n            });\n          })}\n        {type === \"dropdown\" ? (\n          <StyledNavListItemMore\n            name=\"More\"\n            active={Array.from(navItemNames.keys()).indexOf(active) === -1}\n            role={role}\n          >\n            <Select\n              selected={active}\n              target={navAsSelect}\n              disabledInternalSort\n              options={allOptions}\n              type=\"single\"\n              mode=\"normal\"\n              forceCloseMenu\n              disableSearch\n              keepSameOptionsOrder\n              onChange={onMoreOptionClick}\n              onSelectOpen={setMoreOpen}\n              onSelectClose={setMoreClose}\n            />\n          </StyledNavListItemMore>\n        ) : null}\n      </StyledNavList>\n    </StyledNav>\n  );\n};\n\nNav.displayName = \"Nav\";\n"],"mappings":"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"}
+{"version":3,"file":"Nav.js","names":["_react","_interopRequireWildcard","require","_classnames","_interopRequireDefault","_Styles","_Styles2","_utils","_ExpandSingle","_Select","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","_slicedToArray","arr","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","toString","slice","constructor","name","Array","from","test","len","length","arr2","l","Symbol","iterator","f","next","done","push","value","return","isArray","Nav","exports","_ref","_dimensions$width","_childDimensions$widt","children","_ref$alignment","alignment","onSelect","className","_ref$role","role","targetId","_useState","useState","_useState2","active","setActive","_useState3","_useState4","moreOpened","setMoreOpened","_useState5","_useState6","type","setType","setMoreOpen","useCallback","setMoreClose","navItemNames","useMemo","Children","toArray","map","item","_item$props","props","allOptions","index","id","navRef","useRef","wrapRef","dimensions","useResizeObserver","childDimensions","parentWidth","width","childWidth","_useState7","_useState8","childrenWidth","setChildrenWidth","useLayoutEffect","onClick","metaKey","ctrlKey","target","currentTarget","dataset","disabled","Number","onMoreOptionClick","forEach","child","navAsSelect","createElement","StyledNavAsSelect","$active","ExpandSingle","expanded","fill","useEffect","current","StyledNav","classNames","$align","$role","ref","StyledNavList","element","cloneElement","StyledNavListItemMore","Select","selected","disabledInternalSort","options","mode","forceCloseMenu","disableSearch","keepSameOptionsOrder","onChange","onSelectOpen","onSelectClose","displayName"],"sources":["../../../../src/components/Nav/Nav.tsx"],"sourcesContent":["import React, {\n  ReactElement,\n  FC,\n  ReactNode,\n  useState,\n  useRef,\n  useCallback,\n  useMemo,\n  Children,\n  cloneElement,\n  useEffect,\n  useLayoutEffect,\n} from \"react\";\n\nimport classNames from \"classnames\";\n\nimport { ItemProps } from \"./Item/Item\";\nimport { StyledNavListItemMore } from \"./Item/Styles\";\nimport { StyledNav, StyledNavAsSelect, StyledNavList } from \"./Styles\";\nimport { useResizeObserver } from \"../../utils\";\nimport { ExpandSingle } from \"../Expanders/ExpandSingle\";\nimport { Select } from \"../Select/Select\";\n\ntype NavType = \"inline\" | \"dropdown\";\nexport type NavAlignType = \"left\" | \"center\" | \"right\";\nexport type NavRoleType = \"bold\" | \"light\";\n\nexport interface INavProps {\n  children?: ReactElement<ItemProps>[];\n  /** Function for changing active navs. */\n  onSelect?: (index: number) => void;\n  /** Aligment of nav component. */\n  alignment?: NavAlignType;\n  /** CSS classes. */\n  className?: string;\n  /** Role of nav component. */\n  role?: NavRoleType;\n  /** Target id */\n  targetId?: string;\n}\n\nexport const Nav: FC<INavProps> = ({\n  children,\n  alignment = \"left\",\n  onSelect,\n  className,\n  role = \"bold\",\n  targetId,\n}) => {\n  const [active, setActive] = useState(0);\n  const [moreOpened, setMoreOpened] = useState(false);\n  const [type, setType] = useState<NavType>(\"inline\");\n\n  const setMoreOpen = useCallback(() => setMoreOpened(true), []);\n  const setMoreClose = useCallback(() => setMoreOpened(false), []);\n\n  const navItemNames = useMemo(() => {\n    return children\n      ? (Children.toArray(children) as ReactElement<ItemProps>[]).map(\n          (item) => item?.props?.name\n        )\n      : [];\n  }, [children]);\n\n  const allOptions = useMemo(() => {\n    return navItemNames?.map((name, index) => {\n      return { id: index, name: name };\n    });\n  }, [navItemNames]);\n\n  const navRef = useRef<HTMLUListElement | null>(null);\n  const wrapRef = useRef<HTMLElement | null>(null);\n  const dimensions = useResizeObserver(wrapRef);\n  const childDimensions = useResizeObserver(navRef);\n\n  const parentWidth = dimensions?.width ?? 0;\n  const childWidth = childDimensions?.width ?? 0;\n\n  const [childrenWidth, setChildrenWidth] = useState(childWidth);\n\n  useLayoutEffect(() => {\n    if (type === \"inline\") setChildrenWidth(childWidth);\n  }, [childWidth, type]);\n\n  const onClick = useCallback(\n    (e: React.MouseEvent<HTMLElement, MouseEvent>) => {\n      if (e.metaKey || e.ctrlKey) {\n        return;\n      }\n      if (\n        e.target &&\n        e.currentTarget.dataset.index &&\n        !e.currentTarget.dataset.disabled\n      ) {\n        const index = Number(e.currentTarget.dataset.index);\n        setActive(index);\n        if (onSelect) {\n          onSelect(index);\n        }\n      }\n    },\n    [onSelect]\n  );\n\n  const onMoreOptionClick = useCallback(\n    (id) => {\n      setActive(id);\n      if (onSelect) {\n        onSelect(id);\n      }\n    },\n    [onSelect]\n  );\n\n  useMemo(() => {\n    Children.forEach(\n      children as ReactElement[],\n      (child: ReactElement, index) => {\n        if (child && child.props.active) {\n          setActive(index);\n        }\n      }\n    );\n  }, [children]);\n\n  const navAsSelect = useMemo(() => {\n    return (\n      <StyledNavAsSelect id={targetId} $active>\n        <span>{navItemNames[active]}</span>\n        <ExpandSingle expanded={moreOpened} fill=\"currentColor\" />\n      </StyledNavAsSelect>\n    );\n  }, [active, moreOpened, navItemNames, targetId]);\n\n  useEffect(() => {\n    if (!navRef.current || !wrapRef.current) return;\n\n    if (childrenWidth >= parentWidth) {\n      setType(\"dropdown\");\n    } else {\n      setType(\"inline\");\n    }\n  }, [childrenWidth, parentWidth]);\n\n  if (!children) return;\n\n  return (\n    <StyledNav\n      className={classNames(\"c-nav\", className)}\n      $align={alignment}\n      $role={role}\n      ref={wrapRef}\n    >\n      <StyledNavList ref={navRef}>\n        {type === \"inline\" &&\n          Children.toArray(children).map((child: ReactNode, index: number) => {\n            const element = child as ReactElement;\n            return cloneElement(element, {\n              active: index === active,\n              role,\n              onClick,\n              \"data-index\": index,\n              \"data-disabled\": element.props.disabled,\n            });\n          })}\n        {type === \"dropdown\" ? (\n          <StyledNavListItemMore name={navItemNames[active]} role={role}>\n            <Select\n              selected={active}\n              target={navAsSelect}\n              disabledInternalSort\n              options={allOptions}\n              type=\"single\"\n              mode=\"normal\"\n              forceCloseMenu\n              disableSearch\n              keepSameOptionsOrder\n              onChange={onMoreOptionClick}\n              onSelectOpen={setMoreOpen}\n              onSelectClose={setMoreClose}\n            />\n          </StyledNavListItemMore>\n        ) : null}\n      </StyledNavList>\n    </StyledNav>\n  );\n};\n\nNav.displayName = \"Nav\";\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AAcA,IAAAC,WAAA,GAAAC,sBAAA,CAAAF,OAAA;AAGA,IAAAG,OAAA,GAAAH,OAAA;AACA,IAAAI,QAAA,GAAAJ,OAAA;AACA,IAAAK,MAAA,GAAAL,OAAA;AACA,IAAAM,aAAA,GAAAN,OAAA;AACA,IAAAO,OAAA,GAAAP,OAAA;AAA0C,SAAAE,uBAAAM,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,yBAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAb,wBAAAa,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAH,UAAA,SAAAG,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAF,OAAA,EAAAE,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAC,GAAA,CAAAJ,CAAA,UAAAG,CAAA,CAAAE,GAAA,CAAAL,CAAA,OAAAM,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAZ,CAAA,oBAAAY,CAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAY,CAAA,SAAAI,CAAA,GAAAR,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAX,CAAA,EAAAY,CAAA,UAAAI,CAAA,KAAAA,CAAA,CAAAX,GAAA,IAAAW,CAAA,CAAAC,GAAA,IAAAR,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAI,CAAA,IAAAV,CAAA,CAAAM,CAAA,IAAAZ,CAAA,CAAAY,CAAA,YAAAN,CAAA,CAAAR,OAAA,GAAAE,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAc,GAAA,CAAAjB,CAAA,EAAAM,CAAA,GAAAA,CAAA;AAAA,SAAAY,eAAAC,GAAA,EAAAH,CAAA,WAAAI,eAAA,CAAAD,GAAA,KAAAE,qBAAA,CAAAF,GAAA,EAAAH,CAAA,KAAAM,2BAAA,CAAAH,GAAA,EAAAH,CAAA,KAAAO,gBAAA;AAAA,SAAAA,iBAAA,cAAAC,SAAA;AAAA,SAAAF,4BAAAG,CAAA,EAAAC,MAAA,SAAAD,CAAA,qBAAAA,CAAA,sBAAAE,iBAAA,CAAAF,CAAA,EAAAC,MAAA,OAAApB,CAAA,GAAAG,MAAA,CAAAI,SAAA,CAAAe,QAAA,CAAAb,IAAA,CAAAU,CAAA,EAAAI,KAAA,aAAAvB,CAAA,iBAAAmB,CAAA,CAAAK,WAAA,EAAAxB,CAAA,GAAAmB,CAAA,CAAAK,WAAA,CAAAC,IAAA,MAAAzB,CAAA,cAAAA,CAAA,mBAAA0B,KAAA,CAAAC,IAAA,CAAAR,CAAA,OAAAnB,CAAA,+DAAA4B,IAAA,CAAA5B,CAAA,UAAAqB,iBAAA,CAAAF,CAAA,EAAAC,MAAA;AAAA,SAAAC,kBAAAR,GAAA,EAAAgB,GAAA,QAAAA,GAAA,YAAAA,GAAA,GAAAhB,GAAA,CAAAiB,MAAA,EAAAD,GAAA,GAAAhB,GAAA,CAAAiB,MAAA,WAAApB,CAAA,MAAAqB,IAAA,OAAAL,KAAA,CAAAG,GAAA,GAAAnB,CAAA,GAAAmB,GAAA,EAAAnB,CAAA,IAAAqB,IAAA,CAAArB,CAAA,IAAAG,GAAA,CAAAH,CAAA,UAAAqB,IAAA;AAAA,SAAAhB,sBAAAnB,CAAA,EAAAoC,CAAA,QAAAnC,CAAA,WAAAD,CAAA,gCAAAqC,MAAA,IAAArC,CAAA,CAAAqC,MAAA,CAAAC,QAAA,KAAAtC,CAAA,4BAAAC,CAAA,QAAAH,CAAA,EAAAM,CAAA,EAAAU,CAAA,EAAAJ,CAAA,EAAAJ,CAAA,OAAAiC,CAAA,OAAAhB,CAAA,iBAAAT,CAAA,IAAAb,CAAA,GAAAA,CAAA,CAAAY,IAAA,CAAAb,CAAA,GAAAwC,IAAA,QAAAJ,CAAA,QAAA7B,MAAA,CAAAN,CAAA,MAAAA,CAAA,UAAAsC,CAAA,uBAAAA,CAAA,IAAAzC,CAAA,GAAAgB,CAAA,CAAAD,IAAA,CAAAZ,CAAA,GAAAwC,IAAA,MAAAnC,CAAA,CAAAoC,IAAA,CAAA5C,CAAA,CAAA6C,KAAA,GAAArC,CAAA,CAAA4B,MAAA,KAAAE,CAAA,GAAAG,CAAA,iBAAAvC,CAAA,IAAAuB,CAAA,OAAAnB,CAAA,GAAAJ,CAAA,yBAAAuC,CAAA,YAAAtC,CAAA,CAAA2C,MAAA,KAAAlC,CAAA,GAAAT,CAAA,CAAA2C,MAAA,IAAArC,MAAA,CAAAG,CAAA,MAAAA,CAAA,2BAAAa,CAAA,QAAAnB,CAAA,aAAAE,CAAA;AAAA,SAAAY,gBAAAD,GAAA,QAAAa,KAAA,CAAAe,OAAA,CAAA5B,GAAA,UAAAA,GAAA;AAoBnC,IAAM6B,GAAkB,GAAAC,OAAA,CAAAD,GAAA,GAAG,SAArBA,GAAkBA,CAAAE,IAAA,EAOzB;EAAA,IAAAC,iBAAA,EAAAC,qBAAA;EAAA,IANJC,QAAQ,GAAAH,IAAA,CAARG,QAAQ;IAAAC,cAAA,GAAAJ,IAAA,CACRK,SAAS;IAATA,SAAS,GAAAD,cAAA,cAAG,MAAM,GAAAA,cAAA;IAClBE,QAAQ,GAAAN,IAAA,CAARM,QAAQ;IACRC,SAAS,GAAAP,IAAA,CAATO,SAAS;IAAAC,SAAA,GAAAR,IAAA,CACTS,IAAI;IAAJA,IAAI,GAAAD,SAAA,cAAG,MAAM,GAAAA,SAAA;IACbE,QAAQ,GAAAV,IAAA,CAARU,QAAQ;EAER,IAAAC,SAAA,GAA4B,IAAAC,eAAQ,EAAC,CAAC,CAAC;IAAAC,UAAA,GAAA7C,cAAA,CAAA2C,SAAA;IAAhCG,MAAM,GAAAD,UAAA;IAAEE,SAAS,GAAAF,UAAA;EACxB,IAAAG,UAAA,GAAoC,IAAAJ,eAAQ,EAAC,KAAK,CAAC;IAAAK,UAAA,GAAAjD,cAAA,CAAAgD,UAAA;IAA5CE,UAAU,GAAAD,UAAA;IAAEE,aAAa,GAAAF,UAAA;EAChC,IAAAG,UAAA,GAAwB,IAAAR,eAAQ,EAAU,QAAQ,CAAC;IAAAS,UAAA,GAAArD,cAAA,CAAAoD,UAAA;IAA5CE,IAAI,GAAAD,UAAA;IAAEE,OAAO,GAAAF,UAAA;EAEpB,IAAMG,WAAW,GAAG,IAAAC,kBAAW,EAAC;IAAA,OAAMN,aAAa,CAAC,IAAI,CAAC;EAAA,GAAE,EAAE,CAAC;EAC9D,IAAMO,YAAY,GAAG,IAAAD,kBAAW,EAAC;IAAA,OAAMN,aAAa,CAAC,KAAK,CAAC;EAAA,GAAE,EAAE,CAAC;EAEhE,IAAMQ,YAAY,GAAG,IAAAC,cAAO,EAAC,YAAM;IACjC,OAAOzB,QAAQ,GACV0B,eAAQ,CAACC,OAAO,CAAC3B,QAAQ,CAAC,CAA+B4B,GAAG,CAC3D,UAACC,IAAI;MAAA,IAAAC,WAAA;MAAA,OAAKD,IAAI,aAAJA,IAAI,gBAAAC,WAAA,GAAJD,IAAI,CAAEE,KAAK,cAAAD,WAAA,uBAAXA,WAAA,CAAapD,IAAI;IAAA,CAC7B,CAAC,GACD,EAAE;EACR,CAAC,EAAE,CAACsB,QAAQ,CAAC,CAAC;EAEd,IAAMgC,UAAU,GAAG,IAAAP,cAAO,EAAC,YAAM;IAC/B,OAAOD,YAAY,aAAZA,YAAY,uBAAZA,YAAY,CAAEI,GAAG,CAAC,UAAClD,IAAI,EAAEuD,KAAK,EAAK;MACxC,OAAO;QAAEC,EAAE,EAAED,KAAK;QAAEvD,IAAI,EAAEA;MAAK,CAAC;IAClC,CAAC,CAAC;EACJ,CAAC,EAAE,CAAC8C,YAAY,CAAC,CAAC;EAElB,IAAMW,MAAM,GAAG,IAAAC,aAAM,EAA0B,IAAI,CAAC;EACpD,IAAMC,OAAO,GAAG,IAAAD,aAAM,EAAqB,IAAI,CAAC;EAChD,IAAME,UAAU,GAAG,IAAAC,wBAAiB,EAACF,OAAO,CAAC;EAC7C,IAAMG,eAAe,GAAG,IAAAD,wBAAiB,EAACJ,MAAM,CAAC;EAEjD,IAAMM,WAAW,IAAA3C,iBAAA,GAAGwC,UAAU,aAAVA,UAAU,uBAAVA,UAAU,CAAEI,KAAK,cAAA5C,iBAAA,cAAAA,iBAAA,GAAI,CAAC;EAC1C,IAAM6C,UAAU,IAAA5C,qBAAA,GAAGyC,eAAe,aAAfA,eAAe,uBAAfA,eAAe,CAAEE,KAAK,cAAA3C,qBAAA,cAAAA,qBAAA,GAAI,CAAC;EAE9C,IAAA6C,UAAA,GAA0C,IAAAnC,eAAQ,EAACkC,UAAU,CAAC;IAAAE,UAAA,GAAAhF,cAAA,CAAA+E,UAAA;IAAvDE,aAAa,GAAAD,UAAA;IAAEE,gBAAgB,GAAAF,UAAA;EAEtC,IAAAG,sBAAe,EAAC,YAAM;IACpB,IAAI7B,IAAI,KAAK,QAAQ,EAAE4B,gBAAgB,CAACJ,UAAU,CAAC;EACrD,CAAC,EAAE,CAACA,UAAU,EAAExB,IAAI,CAAC,CAAC;EAEtB,IAAM8B,OAAO,GAAG,IAAA3B,kBAAW,EACzB,UAAC3E,CAA4C,EAAK;IAChD,IAAIA,CAAC,CAACuG,OAAO,IAAIvG,CAAC,CAACwG,OAAO,EAAE;MAC1B;IACF;IACA,IACExG,CAAC,CAACyG,MAAM,IACRzG,CAAC,CAAC0G,aAAa,CAACC,OAAO,CAACrB,KAAK,IAC7B,CAACtF,CAAC,CAAC0G,aAAa,CAACC,OAAO,CAACC,QAAQ,EACjC;MACA,IAAMtB,MAAK,GAAGuB,MAAM,CAAC7G,CAAC,CAAC0G,aAAa,CAACC,OAAO,CAACrB,KAAK,CAAC;MACnDrB,SAAS,CAACqB,MAAK,CAAC;MAChB,IAAI9B,QAAQ,EAAE;QACZA,QAAQ,CAAC8B,MAAK,CAAC;MACjB;IACF;EACF,CAAC,EACD,CAAC9B,QAAQ,CACX,CAAC;EAED,IAAMsD,iBAAiB,GAAG,IAAAnC,kBAAW,EACnC,UAACY,EAAE,EAAK;IACNtB,SAAS,CAACsB,EAAE,CAAC;IACb,IAAI/B,QAAQ,EAAE;MACZA,QAAQ,CAAC+B,EAAE,CAAC;IACd;EACF,CAAC,EACD,CAAC/B,QAAQ,CACX,CAAC;EAED,IAAAsB,cAAO,EAAC,YAAM;IACZC,eAAQ,CAACgC,OAAO,CACd1D,QAAQ,EACR,UAAC2D,KAAmB,EAAE1B,KAAK,EAAK;MAC9B,IAAI0B,KAAK,IAAIA,KAAK,CAAC5B,KAAK,CAACpB,MAAM,EAAE;QAC/BC,SAAS,CAACqB,KAAK,CAAC;MAClB;IACF,CACF,CAAC;EACH,CAAC,EAAE,CAACjC,QAAQ,CAAC,CAAC;EAEd,IAAM4D,WAAW,GAAG,IAAAnC,cAAO,EAAC,YAAM;IAChC,oBACE5F,MAAA,CAAAY,OAAA,CAAAoH,aAAA,CAAC1H,QAAA,CAAA2H,iBAAiB;MAAC5B,EAAE,EAAE3B,QAAS;MAACwD,OAAO;IAAA,gBACtClI,MAAA,CAAAY,OAAA,CAAAoH,aAAA,eAAOrC,YAAY,CAACb,MAAM,CAAQ,CAAC,eACnC9E,MAAA,CAAAY,OAAA,CAAAoH,aAAA,CAACxH,aAAA,CAAA2H,YAAY;MAACC,QAAQ,EAAElD,UAAW;MAACmD,IAAI,EAAC;IAAc,CAAE,CACxC,CAAC;EAExB,CAAC,EAAE,CAACvD,MAAM,EAAEI,UAAU,EAAES,YAAY,EAAEjB,QAAQ,CAAC,CAAC;EAEhD,IAAA4D,gBAAS,EAAC,YAAM;IACd,IAAI,CAAChC,MAAM,CAACiC,OAAO,IAAI,CAAC/B,OAAO,CAAC+B,OAAO,EAAE;IAEzC,IAAItB,aAAa,IAAIL,WAAW,EAAE;MAChCrB,OAAO,CAAC,UAAU,CAAC;IACrB,CAAC,MAAM;MACLA,OAAO,CAAC,QAAQ,CAAC;IACnB;EACF,CAAC,EAAE,CAAC0B,aAAa,EAAEL,WAAW,CAAC,CAAC;EAEhC,IAAI,CAACzC,QAAQ,EAAE;EAEf,oBACEnE,MAAA,CAAAY,OAAA,CAAAoH,aAAA,CAAC1H,QAAA,CAAAkI,SAAS;IACRjE,SAAS,EAAE,IAAAkE,mBAAU,EAAC,OAAO,EAAElE,SAAS,CAAE;IAC1CmE,MAAM,EAAErE,SAAU;IAClBsE,KAAK,EAAElE,IAAK;IACZmE,GAAG,EAAEpC;EAAQ,gBAEbxG,MAAA,CAAAY,OAAA,CAAAoH,aAAA,CAAC1H,QAAA,CAAAuI,aAAa;IAACD,GAAG,EAAEtC;EAAO,GACxBhB,IAAI,KAAK,QAAQ,IAChBO,eAAQ,CAACC,OAAO,CAAC3B,QAAQ,CAAC,CAAC4B,GAAG,CAAC,UAAC+B,KAAgB,EAAE1B,KAAa,EAAK;IAClE,IAAM0C,OAAO,GAAGhB,KAAqB;IACrC,oBAAO,IAAAiB,mBAAY,EAACD,OAAO,EAAE;MAC3BhE,MAAM,EAAEsB,KAAK,KAAKtB,MAAM;MACxBL,IAAI;MACJ2C,OAAO;MACP,YAAY,EAAEhB,KAAK;MACnB,eAAe,EAAE0C,OAAO,CAAC5C,KAAK,CAACwB;IACjC,CAAC,CAAC;EACJ,CAAC,CAAC,EACHpC,IAAI,KAAK,UAAU,gBAClBtF,MAAA,CAAAY,OAAA,CAAAoH,aAAA,CAAC3H,OAAA,CAAA2I,qBAAqB;IAACnG,IAAI,EAAE8C,YAAY,CAACb,MAAM,CAAE;IAACL,IAAI,EAAEA;EAAK,gBAC5DzE,MAAA,CAAAY,OAAA,CAAAoH,aAAA,CAACvH,OAAA,CAAAwI,MAAM;IACLC,QAAQ,EAAEpE,MAAO;IACjByC,MAAM,EAAEQ,WAAY;IACpBoB,oBAAoB;IACpBC,OAAO,EAAEjD,UAAW;IACpBb,IAAI,EAAC,QAAQ;IACb+D,IAAI,EAAC,QAAQ;IACbC,cAAc;IACdC,aAAa;IACbC,oBAAoB;IACpBC,QAAQ,EAAE7B,iBAAkB;IAC5B8B,YAAY,EAAElE,WAAY;IAC1BmE,aAAa,EAAEjE;EAAa,CAC7B,CACoB,CAAC,GACtB,IACS,CACN,CAAC;AAEhB,CAAC;AAED5B,GAAG,CAAC8F,WAAW,GAAG,KAAK"}

package/dist/cjs/components/Nav/Styles.js

@@ -90,7 +90,13 @@ StyledNavListItem.displayName = "StyledNavListItem";
 var StyledNavAsSelect = exports.StyledNavAsSelect = _styledComponents.default.div.withConfig({
   displayName: "Styles__StyledNavAsSelect",
   componentId: "sc-1khiypw-3"
-})(["padding:0 10px;height:100%;display:flex;align-items:center;svg{color:var(--color-primary);}"]);
+})(["padding:0 10px;height:100%;display:flex;align-items:center;gap:4px;svg{color:var(--color-primary);top:1px;position:relative;}", ""], function (props) {
+  return props.$active && (0, _styledComponents.css)(["", " & *{", "}"], {
+    "color": "var(--color-primary)"
+  }, {
+    "color": "var(--color-primary)"
+  });
+});
 StyledNavAsSelect.displayName = "StyledNavAsSelect";
 var StyledNavAsMoreTarget = exports.StyledNavAsMoreTarget = _styledComponents.default.div.withConfig({
   displayName: "Styles__StyledNavAsMoreTarget",

package/dist/cjs/components/Nav/Styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Styles.js","names":["_styledComponents","_interopRequireWildcard","require","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","StyledNav","exports","styled","nav","withConfig","displayName","componentId","props","$align","css","$role","StyledNavList","ul","StyledNavListItem","li","$disabled","$active","StyledNavAsSelect","div","StyledNavAsMoreTarget"],"sources":["../../../../src/components/Nav/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\n\nimport { NavAlignType, NavRoleType } from \"./Nav\";\n\ninterface StyledNavProps {\n  $align?: NavAlignType;\n  $role?: NavRoleType;\n}\n\nexport const StyledNav = styled.nav<StyledNavProps>`\n  ${tw`tw-flex`}\n  height: 100%;\n  width: 100%;\n  overflow: clip visible;\n\n  ${(props) =>\n    props.$align === \"left\" &&\n    css`\n      ${tw`tw-justify-start`}\n    `}\n\n  ${(props) =>\n    props.$align === \"center\" &&\n    css`\n      ${tw`tw-justify-center`}\n    `}\n\n  ${(props) =>\n    props.$align === \"right\" &&\n    css`\n      ${tw`tw-justify-end`}\n    `}\n\n  ${(props) =>\n    props.$role === \"light\" &&\n    css`\n      height: auto;\n    `}\n`;\n\nStyledNav.displayName = \"StyledNav\";\n\nexport const StyledNavList = styled.ul`\n  ${tw`tw-flex tw-list-none tw-m-0 tw-p-0`}\n  overflow: clip visible;\n`;\n\nStyledNavList.displayName = \"StyledNavList\";\n\ninterface StyledNavListItemProps {\n  $active?: boolean;\n  $disabled?: boolean;\n  $role?: NavRoleType;\n  $asMore?: boolean;\n}\n\nexport const StyledNavListItem = styled.li<StyledNavListItemProps>`\n  ${tw`tw-text-sm tw-cursor-default tw-relative tw-select-none`}\n  color: var(--color-theme-700);\n  font-size: 15px;\n  display: flex;\n  align-items: center;\n  font-weight: 500;\n  padding: 0 10px;\n  flex-shrink: 0;\n\n  &:hover,\n  &:hover * {\n    ${(props) =>\n      !props.$disabled &&\n      css`\n        ${tw`tw-text-primary`}\n      `}\n  }\n\n  ${(props) =>\n    !props.$active &&\n    !props.$disabled &&\n    css`\n      ${tw`tw-cursor-pointer`}\n    `}\n\n  &::after {\n    content: \"\";\n    ${tw`tw-absolute tw-block tw-m-auto tw-w-0 tw-bg-transparent`}\n    bottom: 0;\n    left: 50%;\n    transform: translateX(-50%);\n    height: 3px;\n    transition: width 0.3s ease, background-color 0.3s ease;\n  }\n\n  ${(props) =>\n    props.$active &&\n    css`\n      ${tw`tw-pointer-events-none`}\n      &::after {\n        ${tw`tw-w-full tw-bg-primary`}\n      }\n    `}\n\n  ${(props) =>\n    props.$disabled &&\n    css`\n      ${tw`tw-select-none tw-cursor-not-allowed tw-opacity-50`}\n    `}\n\n  ${(props) =>\n    props.$role === \"light\" &&\n    css`\n      ${tw`tw-text-sm`}\n      color: var(--color-theme-800);\n      font-weight: 400;\n      padding: 0 8px;\n\n      &::after {\n        bottom: -4px;\n        height: 2px;\n      }\n    `}\n\n  ${(props) =>\n    props.$active &&\n    css`\n      ${tw`tw-text-primary`}\n      & * {\n        ${tw`tw-text-primary`}\n      }\n    `}\n`;\n\nStyledNavListItem.displayName = \"StyledNavListItem\";\n\nexport const StyledNavAsSelect = styled.div`\n  padding: 0 10px;\n  height: 100%;\n  display: flex;\n  align-items: center;\n\n  svg {\n    color: var(--color-primary);\n  }\n`;\n\nStyledNavAsSelect.displayName = \"StyledNavAsSelect\";\n\nexport const StyledNavAsMoreTarget = styled.div<{\n  $role?: NavRoleType;\n}>`\n  padding: 0 10px;\n  height: 100%;\n  display: flex;\n  align-items: center;\n\n  ${(props) =>\n    props.$role === \"light\" &&\n    css`\n      padding: 0;\n    `}\n`;\n\nStyledNavAsMoreTarget.displayName = \"StyledNavAsMoreTarget\";\n"],"mappings":"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"}
+{"version":3,"file":"Styles.js","names":["_styledComponents","_interopRequireWildcard","require","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","StyledNav","exports","styled","nav","withConfig","displayName","componentId","props","$align","css","$role","StyledNavList","ul","StyledNavListItem","li","$disabled","$active","StyledNavAsSelect","div","StyledNavAsMoreTarget"],"sources":["../../../../src/components/Nav/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\n\nimport { NavAlignType, NavRoleType } from \"./Nav\";\n\ninterface StyledNavProps {\n  $align?: NavAlignType;\n  $role?: NavRoleType;\n}\n\nexport const StyledNav = styled.nav<StyledNavProps>`\n  ${tw`tw-flex`}\n  height: 100%;\n  width: 100%;\n  overflow: clip visible;\n\n  ${(props) =>\n    props.$align === \"left\" &&\n    css`\n      ${tw`tw-justify-start`}\n    `}\n\n  ${(props) =>\n    props.$align === \"center\" &&\n    css`\n      ${tw`tw-justify-center`}\n    `}\n\n  ${(props) =>\n    props.$align === \"right\" &&\n    css`\n      ${tw`tw-justify-end`}\n    `}\n\n  ${(props) =>\n    props.$role === \"light\" &&\n    css`\n      height: auto;\n    `}\n`;\n\nStyledNav.displayName = \"StyledNav\";\n\nexport const StyledNavList = styled.ul`\n  ${tw`tw-flex tw-list-none tw-m-0 tw-p-0`}\n  overflow: clip visible;\n`;\n\nStyledNavList.displayName = \"StyledNavList\";\n\ninterface StyledNavListItemProps {\n  $active?: boolean;\n  $disabled?: boolean;\n  $role?: NavRoleType;\n  $asMore?: boolean;\n}\n\nexport const StyledNavListItem = styled.li<StyledNavListItemProps>`\n  ${tw`tw-text-sm tw-cursor-default tw-relative tw-select-none`}\n  color: var(--color-theme-700);\n  font-size: 15px;\n  display: flex;\n  align-items: center;\n  font-weight: 500;\n  padding: 0 10px;\n  flex-shrink: 0;\n\n  &:hover,\n  &:hover * {\n    ${(props) =>\n      !props.$disabled &&\n      css`\n        ${tw`tw-text-primary`}\n      `}\n  }\n\n  ${(props) =>\n    !props.$active &&\n    !props.$disabled &&\n    css`\n      ${tw`tw-cursor-pointer`}\n    `}\n\n  &::after {\n    content: \"\";\n    ${tw`tw-absolute tw-block tw-m-auto tw-w-0 tw-bg-transparent`}\n    bottom: 0;\n    left: 50%;\n    transform: translateX(-50%);\n    height: 3px;\n    transition: width 0.3s ease, background-color 0.3s ease;\n  }\n\n  ${(props) =>\n    props.$active &&\n    css`\n      ${tw`tw-pointer-events-none`}\n      &::after {\n        ${tw`tw-w-full tw-bg-primary`}\n      }\n    `}\n\n  ${(props) =>\n    props.$disabled &&\n    css`\n      ${tw`tw-select-none tw-cursor-not-allowed tw-opacity-50`}\n    `}\n\n  ${(props) =>\n    props.$role === \"light\" &&\n    css`\n      ${tw`tw-text-sm`}\n      color: var(--color-theme-800);\n      font-weight: 400;\n      padding: 0 8px;\n\n      &::after {\n        bottom: -4px;\n        height: 2px;\n      }\n    `}\n\n  ${(props) =>\n    props.$active &&\n    css`\n      ${tw`tw-text-primary`}\n      & * {\n        ${tw`tw-text-primary`}\n      }\n    `}\n`;\n\nStyledNavListItem.displayName = \"StyledNavListItem\";\n\nexport const StyledNavAsSelect = styled.div<{ $active: boolean }>`\n  padding: 0 10px;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n\n  svg {\n    color: var(--color-primary);\n    top: 1px;\n    position: relative;\n  }\n\n  ${(props) =>\n    props.$active &&\n    css`\n      ${tw`tw-text-primary`}\n      & * {\n        ${tw`tw-text-primary`}\n      }\n    `}\n`;\n\nStyledNavAsSelect.displayName = \"StyledNavAsSelect\";\n\nexport const StyledNavAsMoreTarget = styled.div<{\n  $role?: NavRoleType;\n}>`\n  padding: 0 10px;\n  height: 100%;\n  display: flex;\n  align-items: center;\n\n  ${(props) =>\n    props.$role === \"light\" &&\n    css`\n      padding: 0;\n    `}\n`;\n\nStyledNavAsMoreTarget.displayName = \"StyledNavAsMoreTarget\";\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;AAAgD,SAAAC,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,yBAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAH,wBAAAG,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAjB,CAAA,EAAAc,CAAA,SAAAI,CAAA,GAAAR,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAI,CAAA,KAAAA,CAAA,CAAAX,GAAA,IAAAW,CAAA,CAAAC,GAAA,IAAAR,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAI,CAAA,IAAAV,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAgB,GAAA,CAAAnB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAUzC,IAAMY,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAGE,yBAAM,CAACC,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,8EAC7B;EAAA;AAAQ,CAAC,EAKX,UAACC,KAAK;EAAA,OACNA,KAAK,CAACC,MAAM,KAAK,MAAM,QACvBC,qBAAG,YACG;IAAA;EAAiB,CAAC,CACvB;AAAA,GAED,UAACF,KAAK;EAAA,OACNA,KAAK,CAACC,MAAM,KAAK,QAAQ,QACzBC,qBAAG,YACG;IAAA;EAAkB,CAAC,CACxB;AAAA,GAED,UAACF,KAAK;EAAA,OACNA,KAAK,CAACC,MAAM,KAAK,OAAO,QACxBC,qBAAG,YACG;IAAA;EAAe,CAAC,CACrB;AAAA,GAED,UAACF,KAAK;EAAA,OACNA,KAAK,CAACG,KAAK,KAAK,OAAO,QACvBD,qBAAG,mBAEF;AAAA,EACJ;AAEDT,SAAS,CAACK,WAAW,GAAG,WAAW;AAE5B,IAAMM,aAAa,GAAAV,OAAA,CAAAU,aAAA,GAAGT,yBAAM,CAACU,EAAE,CAAAR,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,oCAChC;EAAA;EAAA;EAAA;EAAA;AAAmC,CAAC,CAEzC;AAEDK,aAAa,CAACN,WAAW,GAAG,eAAe;AASpC,IAAMQ,iBAAiB,GAAAZ,OAAA,CAAAY,iBAAA,GAAGX,yBAAM,CAACY,EAAE,CAAAV,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,gUACpC;EAAA;EAAA;EAAA;EAAA;EAAA;AAAwD,CAAC,EAWzD,UAACC,KAAK;EAAA,OACN,CAACA,KAAK,CAACQ,SAAS,QAChBN,qBAAG,YACG;IAAA;EAAgB,CAAC,CACtB;AAAA,GAGH,UAACF,KAAK;EAAA,OACN,CAACA,KAAK,CAACS,OAAO,IACd,CAACT,KAAK,CAACQ,SAAS,QAChBN,qBAAG,YACG;IAAA;EAAkB,CAAC,CACxB;AAAA,GAIG;EAAA;EAAA;EAAA;EAAA;EAAA;AAAwD,CAAC,EAQ7D,UAACF,KAAK;EAAA,OACNA,KAAK,CAACS,OAAO,QACbP,qBAAG,2BACG;IAAA;EAAuB,CAAC,EAEtB;IAAA;IAAA;EAAwB,CAAC,CAEhC;AAAA,GAED,UAACF,KAAK;EAAA,OACNA,KAAK,CAACQ,SAAS,QACfN,qBAAG,YACG;IAAA;IAAA;IAAA;EAAmD,CAAC,CACzD;AAAA,GAED,UAACF,KAAK;EAAA,OACNA,KAAK,CAACG,KAAK,KAAK,OAAO,QACvBD,qBAAG,yGACG;IAAA;IAAA;EAAW,CAAC,CASjB;AAAA,GAED,UAACF,KAAK;EAAA,OACNA,KAAK,CAACS,OAAO,QACbP,qBAAG,sBACG;IAAA;EAAgB,CAAC,EAEf;IAAA;EAAgB,CAAC,CAExB;AAAA,EACJ;AAEDI,iBAAiB,CAACR,WAAW,GAAG,mBAAmB;AAE5C,IAAMY,iBAAiB,GAAAhB,OAAA,CAAAgB,iBAAA,GAAGf,yBAAM,CAACgB,GAAG,CAAAd,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,0IAavC,UAACC,KAAK;EAAA,OACNA,KAAK,CAACS,OAAO,QACbP,qBAAG,sBACG;IAAA;EAAgB,CAAC,EAEf;IAAA;EAAgB,CAAC,CAExB;AAAA,EACJ;AAEDQ,iBAAiB,CAACZ,WAAW,GAAG,mBAAmB;AAE5C,IAAMc,qBAAqB,GAAAlB,OAAA,CAAAkB,qBAAA,GAAGjB,yBAAM,CAACgB,GAAG,CAAAd,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,wEAQ3C,UAACC,KAAK;EAAA,OACNA,KAAK,CAACG,KAAK,KAAK,OAAO,QACvBD,qBAAG,iBAEF;AAAA,EACJ;AAEDU,qBAAqB,CAACd,WAAW,GAAG,uBAAuB"}

package/dist/esm/components/Nav/Item/Styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/Nav/Item/Styles.ts"],"names":[],"mappings":";AAKA,eAAO,MAAM,qBAAqB,oSAQjC,CAAC"}
+{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/Nav/Item/Styles.ts"],"names":[],"mappings":";AAKA,eAAO,MAAM,qBAAqB,oSAkBjC,CAAC"}

package/dist/esm/components/Nav/Item/Styles.js

@@ -3,8 +3,15 @@ import { Item } from "./Item";
 export const StyledNavListItemMore = styled(Item).withConfig({
   displayName: "Styles__StyledNavListItemMore",
   componentId: "sc-m6npdq-0"
-})(["", " cursor:pointer;", ""], props => props.role !== "light" && css(["padding:0;"]), {
-  "pointerEvents": "auto"
+})(["", " cursor:pointer;&::after{content:\"\";", " bottom:0;left:50%;transform:translateX(-50%);height:3px;transition:width 0.3s ease,background-color 0.3s ease;", "}"], props => props.role !== "light" && css(["padding:0;"]), {
+  "position": "absolute",
+  "margin": "auto",
+  "display": "block",
+  "width": "0px",
+  "backgroundColor": "transparent"
+}, {
+  "width": "100%",
+  "backgroundColor": "var(--color-primary)"
 });
 StyledNavListItemMore.displayName = "StyledNavListItemMore";
 //# sourceMappingURL=Styles.js.map

package/dist/esm/components/Nav/Item/Styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Styles.js","names":["styled","css","Item","StyledNavListItemMore","withConfig","displayName","componentId","props","role"],"sources":["../../../../../src/components/Nav/Item/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\n\nimport { Item } from \"./Item\";\n\nexport const StyledNavListItemMore = styled(Item)`\n  ${(props) =>\n    props.role !== \"light\" &&\n    css`\n      padding: 0;\n    `}\n  cursor: pointer;\n  ${tw`tw-pointer-events-auto`}\n`;\n\nStyledNavListItemMore.displayName = \"StyledNavListItemMore\";\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAG/C,SAASC,IAAI,QAAQ,QAAQ;AAE7B,OAAO,MAAMC,qBAAqB,GAAGH,MAAM,CAACE,IAAI,CAAC,CAAAE,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,iCAC5CC,KAAK,IACNA,KAAK,CAACC,IAAI,KAAK,OAAO,IACtBP,GAAG,gBAEF,EAEC;EAAA;AAAuB,CAAC,CAC7B;AAEDE,qBAAqB,CAACE,WAAW,GAAG,uBAAuB"}
+{"version":3,"file":"Styles.js","names":["styled","css","Item","StyledNavListItemMore","withConfig","displayName","componentId","props","role"],"sources":["../../../../../src/components/Nav/Item/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\n\nimport { Item } from \"./Item\";\n\nexport const StyledNavListItemMore = styled(Item)`\n  ${(props) =>\n    props.role !== \"light\" &&\n    css`\n      padding: 0;\n    `}\n  cursor: pointer;\n\n  &::after {\n    content: \"\";\n    ${tw`tw-absolute tw-block tw-m-auto tw-w-0 tw-bg-transparent`}\n    bottom: 0;\n    left: 50%;\n    transform: translateX(-50%);\n    height: 3px;\n    transition: width 0.3s ease, background-color 0.3s ease;\n    ${tw`tw-w-full tw-bg-primary`}\n  }\n`;\n\nStyledNavListItemMore.displayName = \"StyledNavListItemMore\";\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAG/C,SAASC,IAAI,QAAQ,QAAQ;AAE7B,OAAO,MAAMC,qBAAqB,GAAGH,MAAM,CAACE,IAAI,CAAC,CAAAE,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,2KAC5CC,KAAK,IACNA,KAAK,CAACC,IAAI,KAAK,OAAO,IACtBP,GAAG,gBAEF,EAKG;EAAA;EAAA;EAAA;EAAA;EAAA;AAAwD,CAAC,EAMzD;EAAA;EAAA;AAAwB,CAAC,CAEhC;AAEDE,qBAAqB,CAACE,WAAW,GAAG,uBAAuB"}

package/dist/esm/components/Nav/Nav.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Nav.d.ts","sourceRoot":"","sources":["../../../../src/components/Nav/Nav.tsx"],"names":[],"mappings":"AAAA,OAAc,EACZ,YAAY,EACZ,EAAE,EAUH,MAAM,OAAO,CAAC;AAIf,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAQxC,MAAM,MAAM,YAAY,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;AACvD,MAAM,MAAM,WAAW,GAAG,MAAM,GAAG,OAAO,CAAC;AAE3C,MAAM,WAAW,SAAS;IACxB,QAAQ,CAAC,EAAE,YAAY,CAAC,SAAS,CAAC,EAAE,CAAC;IACrC,yCAAyC;IACzC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,iCAAiC;IACjC,SAAS,CAAC,EAAE,YAAY,CAAC;IACzB,mBAAmB;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,6BAA6B;IAC7B,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,gBAAgB;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,eAAO,MAAM,GAAG,EAAE,EAAE,CAAC,SAAS,CAqJ7B,CAAC"}
+{"version":3,"file":"Nav.d.ts","sourceRoot":"","sources":["../../../../src/components/Nav/Nav.tsx"],"names":[],"mappings":"AAAA,OAAc,EACZ,YAAY,EACZ,EAAE,EAUH,MAAM,OAAO,CAAC;AAIf,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAQxC,MAAM,MAAM,YAAY,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;AACvD,MAAM,MAAM,WAAW,GAAG,MAAM,GAAG,OAAO,CAAC;AAE3C,MAAM,WAAW,SAAS;IACxB,QAAQ,CAAC,EAAE,YAAY,CAAC,SAAS,CAAC,EAAE,CAAC;IACrC,yCAAyC;IACzC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,iCAAiC;IACjC,SAAS,CAAC,EAAE,YAAY,CAAC;IACzB,mBAAmB;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,6BAA6B;IAC7B,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,gBAAgB;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,eAAO,MAAM,GAAG,EAAE,EAAE,CAAC,SAAS,CAiJ7B,CAAC"}

package/dist/esm/components/Nav/Nav.js

@@ -71,7 +71,8 @@ export const Nav = _ref => {
   }, [children]);
   const navAsSelect = useMemo(() => {
     return /*#__PURE__*/React.createElement(StyledNavAsSelect, {
-      id: targetId
+      id: targetId,
+      $active: true
     }, /*#__PURE__*/React.createElement("span", null, navItemNames[active]), /*#__PURE__*/React.createElement(ExpandSingle, {
       expanded: moreOpened,
       fill: "currentColor"
@@ -103,8 +104,7 @@ export const Nav = _ref => {
       "data-disabled": element.props.disabled
     });
   }), type === "dropdown" ? /*#__PURE__*/React.createElement(StyledNavListItemMore, {
-    name: "More",
-    active: Array.from(navItemNames.keys()).indexOf(active) === -1,
+    name: navItemNames[active],
     role: role
   }, /*#__PURE__*/React.createElement(Select, {
     selected: active,

package/dist/esm/components/Nav/Nav.js.map

@@ -1 +1 @@
-{"version":3,"file":"Nav.js","names":["React","useState","useRef","useCallback","useMemo","Children","cloneElement","useEffect","useLayoutEffect","classNames","StyledNavListItemMore","StyledNav","StyledNavAsSelect","StyledNavList","useResizeObserver","ExpandSingle","Select","Nav","_ref","_dimensions$width","_childDimensions$widt","children","alignment","onSelect","className","role","targetId","active","setActive","moreOpened","setMoreOpened","type","setType","setMoreOpen","setMoreClose","navItemNames","toArray","map","item","_item$props","props","name","allOptions","index","id","navRef","wrapRef","dimensions","childDimensions","parentWidth","width","childWidth","childrenWidth","setChildrenWidth","onClick","e","metaKey","ctrlKey","target","currentTarget","dataset","disabled","Number","onMoreOptionClick","forEach","child","navAsSelect","createElement","expanded","fill","current","$align","$role","ref","element","Array","from","keys","indexOf","selected","disabledInternalSort","options","mode","forceCloseMenu","disableSearch","keepSameOptionsOrder","onChange","onSelectOpen","onSelectClose","displayName"],"sources":["../../../../src/components/Nav/Nav.tsx"],"sourcesContent":["import React, {\n  ReactElement,\n  FC,\n  ReactNode,\n  useState,\n  useRef,\n  useCallback,\n  useMemo,\n  Children,\n  cloneElement,\n  useEffect,\n  useLayoutEffect,\n} from \"react\";\n\nimport classNames from \"classnames\";\n\nimport { ItemProps } from \"./Item/Item\";\nimport { StyledNavListItemMore } from \"./Item/Styles\";\nimport { StyledNav, StyledNavAsSelect, StyledNavList } from \"./Styles\";\nimport { useResizeObserver } from \"../../utils\";\nimport { ExpandSingle } from \"../Expanders/ExpandSingle\";\nimport { Select } from \"../Select/Select\";\n\ntype NavType = \"inline\" | \"dropdown\";\nexport type NavAlignType = \"left\" | \"center\" | \"right\";\nexport type NavRoleType = \"bold\" | \"light\";\n\nexport interface INavProps {\n  children?: ReactElement<ItemProps>[];\n  /** Function for changing active navs. */\n  onSelect?: (index: number) => void;\n  /** Aligment of nav component. */\n  alignment?: NavAlignType;\n  /** CSS classes. */\n  className?: string;\n  /** Role of nav component. */\n  role?: NavRoleType;\n  /** Target id */\n  targetId?: string;\n}\n\nexport const Nav: FC<INavProps> = ({\n  children,\n  alignment = \"left\",\n  onSelect,\n  className,\n  role = \"bold\",\n  targetId,\n}) => {\n  const [active, setActive] = useState(0);\n  const [moreOpened, setMoreOpened] = useState(false);\n  const [type, setType] = useState<NavType>(\"inline\");\n\n  const setMoreOpen = useCallback(() => setMoreOpened(true), []);\n  const setMoreClose = useCallback(() => setMoreOpened(false), []);\n\n  const navItemNames = useMemo(() => {\n    return children\n      ? (Children.toArray(children) as ReactElement<ItemProps>[]).map(\n          (item) => item?.props?.name\n        )\n      : [];\n  }, [children]);\n\n  const allOptions = useMemo(() => {\n    return navItemNames?.map((name, index) => {\n      return { id: index, name: name };\n    });\n  }, [navItemNames]);\n\n  const navRef = useRef<HTMLUListElement | null>(null);\n  const wrapRef = useRef<HTMLElement | null>(null);\n  const dimensions = useResizeObserver(wrapRef);\n  const childDimensions = useResizeObserver(navRef);\n\n  const parentWidth = dimensions?.width ?? 0;\n  const childWidth = childDimensions?.width ?? 0;\n\n  const [childrenWidth, setChildrenWidth] = useState(childWidth);\n\n  useLayoutEffect(() => {\n    if (type === \"inline\") setChildrenWidth(childWidth);\n  }, [childWidth, type]);\n\n  const onClick = useCallback(\n    (e: React.MouseEvent<HTMLElement, MouseEvent>) => {\n      if (e.metaKey || e.ctrlKey) {\n        return;\n      }\n      if (\n        e.target &&\n        e.currentTarget.dataset.index &&\n        !e.currentTarget.dataset.disabled\n      ) {\n        const index = Number(e.currentTarget.dataset.index);\n        setActive(index);\n        if (onSelect) {\n          onSelect(index);\n        }\n      }\n    },\n    [onSelect]\n  );\n\n  const onMoreOptionClick = useCallback(\n    (id) => {\n      setActive(id);\n      if (onSelect) {\n        onSelect(id);\n      }\n    },\n    [onSelect]\n  );\n\n  useMemo(() => {\n    Children.forEach(\n      children as ReactElement[],\n      (child: ReactElement, index) => {\n        if (child && child.props.active) {\n          setActive(index);\n        }\n      }\n    );\n  }, [children]);\n\n  const navAsSelect = useMemo(() => {\n    return (\n      <StyledNavAsSelect id={targetId}>\n        <span>{navItemNames[active]}</span>\n        <ExpandSingle expanded={moreOpened} fill=\"currentColor\" />\n      </StyledNavAsSelect>\n    );\n  }, [active, moreOpened, navItemNames, targetId]);\n\n  useEffect(() => {\n    if (!navRef.current || !wrapRef.current) return;\n\n    if (childrenWidth >= parentWidth) {\n      setType(\"dropdown\");\n    } else {\n      setType(\"inline\");\n    }\n  }, [childrenWidth, parentWidth]);\n\n  if (!children) return;\n\n  return (\n    <StyledNav\n      className={classNames(\"c-nav\", className)}\n      $align={alignment}\n      $role={role}\n      ref={wrapRef}\n    >\n      <StyledNavList ref={navRef}>\n        {type === \"inline\" &&\n          Children.toArray(children).map((child: ReactNode, index: number) => {\n            const element = child as ReactElement;\n            return cloneElement(element, {\n              active: index === active,\n              role,\n              onClick,\n              \"data-index\": index,\n              \"data-disabled\": element.props.disabled,\n            });\n          })}\n        {type === \"dropdown\" ? (\n          <StyledNavListItemMore\n            name=\"More\"\n            active={Array.from(navItemNames.keys()).indexOf(active) === -1}\n            role={role}\n          >\n            <Select\n              selected={active}\n              target={navAsSelect}\n              disabledInternalSort\n              options={allOptions}\n              type=\"single\"\n              mode=\"normal\"\n              forceCloseMenu\n              disableSearch\n              keepSameOptionsOrder\n              onChange={onMoreOptionClick}\n              onSelectOpen={setMoreOpen}\n              onSelectClose={setMoreClose}\n            />\n          </StyledNavListItemMore>\n        ) : null}\n      </StyledNavList>\n    </StyledNav>\n  );\n};\n\nNav.displayName = \"Nav\";\n"],"mappings":"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"}
+{"version":3,"file":"Nav.js","names":["React","useState","useRef","useCallback","useMemo","Children","cloneElement","useEffect","useLayoutEffect","classNames","StyledNavListItemMore","StyledNav","StyledNavAsSelect","StyledNavList","useResizeObserver","ExpandSingle","Select","Nav","_ref","_dimensions$width","_childDimensions$widt","children","alignment","onSelect","className","role","targetId","active","setActive","moreOpened","setMoreOpened","type","setType","setMoreOpen","setMoreClose","navItemNames","toArray","map","item","_item$props","props","name","allOptions","index","id","navRef","wrapRef","dimensions","childDimensions","parentWidth","width","childWidth","childrenWidth","setChildrenWidth","onClick","e","metaKey","ctrlKey","target","currentTarget","dataset","disabled","Number","onMoreOptionClick","forEach","child","navAsSelect","createElement","$active","expanded","fill","current","$align","$role","ref","element","selected","disabledInternalSort","options","mode","forceCloseMenu","disableSearch","keepSameOptionsOrder","onChange","onSelectOpen","onSelectClose","displayName"],"sources":["../../../../src/components/Nav/Nav.tsx"],"sourcesContent":["import React, {\n  ReactElement,\n  FC,\n  ReactNode,\n  useState,\n  useRef,\n  useCallback,\n  useMemo,\n  Children,\n  cloneElement,\n  useEffect,\n  useLayoutEffect,\n} from \"react\";\n\nimport classNames from \"classnames\";\n\nimport { ItemProps } from \"./Item/Item\";\nimport { StyledNavListItemMore } from \"./Item/Styles\";\nimport { StyledNav, StyledNavAsSelect, StyledNavList } from \"./Styles\";\nimport { useResizeObserver } from \"../../utils\";\nimport { ExpandSingle } from \"../Expanders/ExpandSingle\";\nimport { Select } from \"../Select/Select\";\n\ntype NavType = \"inline\" | \"dropdown\";\nexport type NavAlignType = \"left\" | \"center\" | \"right\";\nexport type NavRoleType = \"bold\" | \"light\";\n\nexport interface INavProps {\n  children?: ReactElement<ItemProps>[];\n  /** Function for changing active navs. */\n  onSelect?: (index: number) => void;\n  /** Aligment of nav component. */\n  alignment?: NavAlignType;\n  /** CSS classes. */\n  className?: string;\n  /** Role of nav component. */\n  role?: NavRoleType;\n  /** Target id */\n  targetId?: string;\n}\n\nexport const Nav: FC<INavProps> = ({\n  children,\n  alignment = \"left\",\n  onSelect,\n  className,\n  role = \"bold\",\n  targetId,\n}) => {\n  const [active, setActive] = useState(0);\n  const [moreOpened, setMoreOpened] = useState(false);\n  const [type, setType] = useState<NavType>(\"inline\");\n\n  const setMoreOpen = useCallback(() => setMoreOpened(true), []);\n  const setMoreClose = useCallback(() => setMoreOpened(false), []);\n\n  const navItemNames = useMemo(() => {\n    return children\n      ? (Children.toArray(children) as ReactElement<ItemProps>[]).map(\n          (item) => item?.props?.name\n        )\n      : [];\n  }, [children]);\n\n  const allOptions = useMemo(() => {\n    return navItemNames?.map((name, index) => {\n      return { id: index, name: name };\n    });\n  }, [navItemNames]);\n\n  const navRef = useRef<HTMLUListElement | null>(null);\n  const wrapRef = useRef<HTMLElement | null>(null);\n  const dimensions = useResizeObserver(wrapRef);\n  const childDimensions = useResizeObserver(navRef);\n\n  const parentWidth = dimensions?.width ?? 0;\n  const childWidth = childDimensions?.width ?? 0;\n\n  const [childrenWidth, setChildrenWidth] = useState(childWidth);\n\n  useLayoutEffect(() => {\n    if (type === \"inline\") setChildrenWidth(childWidth);\n  }, [childWidth, type]);\n\n  const onClick = useCallback(\n    (e: React.MouseEvent<HTMLElement, MouseEvent>) => {\n      if (e.metaKey || e.ctrlKey) {\n        return;\n      }\n      if (\n        e.target &&\n        e.currentTarget.dataset.index &&\n        !e.currentTarget.dataset.disabled\n      ) {\n        const index = Number(e.currentTarget.dataset.index);\n        setActive(index);\n        if (onSelect) {\n          onSelect(index);\n        }\n      }\n    },\n    [onSelect]\n  );\n\n  const onMoreOptionClick = useCallback(\n    (id) => {\n      setActive(id);\n      if (onSelect) {\n        onSelect(id);\n      }\n    },\n    [onSelect]\n  );\n\n  useMemo(() => {\n    Children.forEach(\n      children as ReactElement[],\n      (child: ReactElement, index) => {\n        if (child && child.props.active) {\n          setActive(index);\n        }\n      }\n    );\n  }, [children]);\n\n  const navAsSelect = useMemo(() => {\n    return (\n      <StyledNavAsSelect id={targetId} $active>\n        <span>{navItemNames[active]}</span>\n        <ExpandSingle expanded={moreOpened} fill=\"currentColor\" />\n      </StyledNavAsSelect>\n    );\n  }, [active, moreOpened, navItemNames, targetId]);\n\n  useEffect(() => {\n    if (!navRef.current || !wrapRef.current) return;\n\n    if (childrenWidth >= parentWidth) {\n      setType(\"dropdown\");\n    } else {\n      setType(\"inline\");\n    }\n  }, [childrenWidth, parentWidth]);\n\n  if (!children) return;\n\n  return (\n    <StyledNav\n      className={classNames(\"c-nav\", className)}\n      $align={alignment}\n      $role={role}\n      ref={wrapRef}\n    >\n      <StyledNavList ref={navRef}>\n        {type === \"inline\" &&\n          Children.toArray(children).map((child: ReactNode, index: number) => {\n            const element = child as ReactElement;\n            return cloneElement(element, {\n              active: index === active,\n              role,\n              onClick,\n              \"data-index\": index,\n              \"data-disabled\": element.props.disabled,\n            });\n          })}\n        {type === \"dropdown\" ? (\n          <StyledNavListItemMore name={navItemNames[active]} role={role}>\n            <Select\n              selected={active}\n              target={navAsSelect}\n              disabledInternalSort\n              options={allOptions}\n              type=\"single\"\n              mode=\"normal\"\n              forceCloseMenu\n              disableSearch\n              keepSameOptionsOrder\n              onChange={onMoreOptionClick}\n              onSelectOpen={setMoreOpen}\n              onSelectClose={setMoreClose}\n            />\n          </StyledNavListItemMore>\n        ) : null}\n      </StyledNavList>\n    </StyledNav>\n  );\n};\n\nNav.displayName = \"Nav\";\n"],"mappings":"AAAA,OAAOA,KAAK,IAIVC,QAAQ,EACRC,MAAM,EACNC,WAAW,EACXC,OAAO,EACPC,QAAQ,EACRC,YAAY,EACZC,SAAS,EACTC,eAAe,QACV,OAAO;AAEd,OAAOC,UAAU,MAAM,YAAY;AAGnC,SAASC,qBAAqB,QAAQ,eAAe;AACrD,SAASC,SAAS,EAAEC,iBAAiB,EAAEC,aAAa,QAAQ,UAAU;AACtE,SAASC,iBAAiB,QAAQ,aAAa;AAC/C,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,MAAM,QAAQ,kBAAkB;AAoBzC,OAAO,MAAMC,GAAkB,GAAGC,IAAA,IAO5B;EAAA,IAAAC,iBAAA,EAAAC,qBAAA;EAAA,IAP6B;IACjCC,QAAQ;IACRC,SAAS,GAAG,MAAM;IAClBC,QAAQ;IACRC,SAAS;IACTC,IAAI,GAAG,MAAM;IACbC;EACF,CAAC,GAAAR,IAAA;EACC,MAAM,CAACS,MAAM,EAAEC,SAAS,CAAC,GAAG3B,QAAQ,CAAC,CAAC,CAAC;EACvC,MAAM,CAAC4B,UAAU,EAAEC,aAAa,CAAC,GAAG7B,QAAQ,CAAC,KAAK,CAAC;EACnD,MAAM,CAAC8B,IAAI,EAAEC,OAAO,CAAC,GAAG/B,QAAQ,CAAU,QAAQ,CAAC;EAEnD,MAAMgC,WAAW,GAAG9B,WAAW,CAAC,MAAM2B,aAAa,CAAC,IAAI,CAAC,EAAE,EAAE,CAAC;EAC9D,MAAMI,YAAY,GAAG/B,WAAW,CAAC,MAAM2B,aAAa,CAAC,KAAK,CAAC,EAAE,EAAE,CAAC;EAEhE,MAAMK,YAAY,GAAG/B,OAAO,CAAC,MAAM;IACjC,OAAOiB,QAAQ,GACVhB,QAAQ,CAAC+B,OAAO,CAACf,QAAQ,CAAC,CAA+BgB,GAAG,CAC1DC,IAAI;MAAA,IAAAC,WAAA;MAAA,OAAKD,IAAI,aAAAC,WAAA,GAAJD,IAAI,CAAEE,KAAK,qBAAXD,WAAA,CAAaE,IAAI;IAAA,CAC7B,CAAC,GACD,EAAE;EACR,CAAC,EAAE,CAACpB,QAAQ,CAAC,CAAC;EAEd,MAAMqB,UAAU,GAAGtC,OAAO,CAAC,MAAM;IAC/B,OAAO+B,YAAY,oBAAZA,YAAY,CAAEE,GAAG,CAAC,CAACI,IAAI,EAAEE,KAAK,KAAK;MACxC,OAAO;QAAEC,EAAE,EAAED,KAAK;QAAEF,IAAI,EAAEA;MAAK,CAAC;IAClC,CAAC,CAAC;EACJ,CAAC,EAAE,CAACN,YAAY,CAAC,CAAC;EAElB,MAAMU,MAAM,GAAG3C,MAAM,CAA0B,IAAI,CAAC;EACpD,MAAM4C,OAAO,GAAG5C,MAAM,CAAqB,IAAI,CAAC;EAChD,MAAM6C,UAAU,GAAGjC,iBAAiB,CAACgC,OAAO,CAAC;EAC7C,MAAME,eAAe,GAAGlC,iBAAiB,CAAC+B,MAAM,CAAC;EAEjD,MAAMI,WAAW,IAAA9B,iBAAA,GAAG4B,UAAU,oBAAVA,UAAU,CAAEG,KAAK,YAAA/B,iBAAA,GAAI,CAAC;EAC1C,MAAMgC,UAAU,IAAA/B,qBAAA,GAAG4B,eAAe,oBAAfA,eAAe,CAAEE,KAAK,YAAA9B,qBAAA,GAAI,CAAC;EAE9C,MAAM,CAACgC,aAAa,EAAEC,gBAAgB,CAAC,GAAGpD,QAAQ,CAACkD,UAAU,CAAC;EAE9D3C,eAAe,CAAC,MAAM;IACpB,IAAIuB,IAAI,KAAK,QAAQ,EAAEsB,gBAAgB,CAACF,UAAU,CAAC;EACrD,CAAC,EAAE,CAACA,UAAU,EAAEpB,IAAI,CAAC,CAAC;EAEtB,MAAMuB,OAAO,GAAGnD,WAAW,CACxBoD,CAA4C,IAAK;IAChD,IAAIA,CAAC,CAACC,OAAO,IAAID,CAAC,CAACE,OAAO,EAAE;MAC1B;IACF;IACA,IACEF,CAAC,CAACG,MAAM,IACRH,CAAC,CAACI,aAAa,CAACC,OAAO,CAACjB,KAAK,IAC7B,CAACY,CAAC,CAACI,aAAa,CAACC,OAAO,CAACC,QAAQ,EACjC;MACA,MAAMlB,KAAK,GAAGmB,MAAM,CAACP,CAAC,CAACI,aAAa,CAACC,OAAO,CAACjB,KAAK,CAAC;MACnDf,SAAS,CAACe,KAAK,CAAC;MAChB,IAAIpB,QAAQ,EAAE;QACZA,QAAQ,CAACoB,KAAK,CAAC;MACjB;IACF;EACF,CAAC,EACD,CAACpB,QAAQ,CACX,CAAC;EAED,MAAMwC,iBAAiB,GAAG5D,WAAW,CAClCyC,EAAE,IAAK;IACNhB,SAAS,CAACgB,EAAE,CAAC;IACb,IAAIrB,QAAQ,EAAE;MACZA,QAAQ,CAACqB,EAAE,CAAC;IACd;EACF,CAAC,EACD,CAACrB,QAAQ,CACX,CAAC;EAEDnB,OAAO,CAAC,MAAM;IACZC,QAAQ,CAAC2D,OAAO,CACd3C,QAAQ,EACR,CAAC4C,KAAmB,EAAEtB,KAAK,KAAK;MAC9B,IAAIsB,KAAK,IAAIA,KAAK,CAACzB,KAAK,CAACb,MAAM,EAAE;QAC/BC,SAAS,CAACe,KAAK,CAAC;MAClB;IACF,CACF,CAAC;EACH,CAAC,EAAE,CAACtB,QAAQ,CAAC,CAAC;EAEd,MAAM6C,WAAW,GAAG9D,OAAO,CAAC,MAAM;IAChC,oBACEJ,KAAA,CAAAmE,aAAA,CAACvD,iBAAiB;MAACgC,EAAE,EAAElB,QAAS;MAAC0C,OAAO;IAAA,gBACtCpE,KAAA,CAAAmE,aAAA,eAAOhC,YAAY,CAACR,MAAM,CAAQ,CAAC,eACnC3B,KAAA,CAAAmE,aAAA,CAACpD,YAAY;MAACsD,QAAQ,EAAExC,UAAW;MAACyC,IAAI,EAAC;IAAc,CAAE,CACxC,CAAC;EAExB,CAAC,EAAE,CAAC3C,MAAM,EAAEE,UAAU,EAAEM,YAAY,EAAET,QAAQ,CAAC,CAAC;EAEhDnB,SAAS,CAAC,MAAM;IACd,IAAI,CAACsC,MAAM,CAAC0B,OAAO,IAAI,CAACzB,OAAO,CAACyB,OAAO,EAAE;IAEzC,IAAInB,aAAa,IAAIH,WAAW,EAAE;MAChCjB,OAAO,CAAC,UAAU,CAAC;IACrB,CAAC,MAAM;MACLA,OAAO,CAAC,QAAQ,CAAC;IACnB;EACF,CAAC,EAAE,CAACoB,aAAa,EAAEH,WAAW,CAAC,CAAC;EAEhC,IAAI,CAAC5B,QAAQ,EAAE;EAEf,oBACErB,KAAA,CAAAmE,aAAA,CAACxD,SAAS;IACRa,SAAS,EAAEf,UAAU,CAAC,OAAO,EAAEe,SAAS,CAAE;IAC1CgD,MAAM,EAAElD,SAAU;IAClBmD,KAAK,EAAEhD,IAAK;IACZiD,GAAG,EAAE5B;EAAQ,gBAEb9C,KAAA,CAAAmE,aAAA,CAACtD,aAAa;IAAC6D,GAAG,EAAE7B;EAAO,GACxBd,IAAI,KAAK,QAAQ,IAChB1B,QAAQ,CAAC+B,OAAO,CAACf,QAAQ,CAAC,CAACgB,GAAG,CAAC,CAAC4B,KAAgB,EAAEtB,KAAa,KAAK;IAClE,MAAMgC,OAAO,GAAGV,KAAqB;IACrC,oBAAO3D,YAAY,CAACqE,OAAO,EAAE;MAC3BhD,MAAM,EAAEgB,KAAK,KAAKhB,MAAM;MACxBF,IAAI;MACJ6B,OAAO;MACP,YAAY,EAAEX,KAAK;MACnB,eAAe,EAAEgC,OAAO,CAACnC,KAAK,CAACqB;IACjC,CAAC,CAAC;EACJ,CAAC,CAAC,EACH9B,IAAI,KAAK,UAAU,gBAClB/B,KAAA,CAAAmE,aAAA,CAACzD,qBAAqB;IAAC+B,IAAI,EAAEN,YAAY,CAACR,MAAM,CAAE;IAACF,IAAI,EAAEA;EAAK,gBAC5DzB,KAAA,CAAAmE,aAAA,CAACnD,MAAM;IACL4D,QAAQ,EAAEjD,MAAO;IACjB+B,MAAM,EAAEQ,WAAY;IACpBW,oBAAoB;IACpBC,OAAO,EAAEpC,UAAW;IACpBX,IAAI,EAAC,QAAQ;IACbgD,IAAI,EAAC,QAAQ;IACbC,cAAc;IACdC,aAAa;IACbC,oBAAoB;IACpBC,QAAQ,EAAEpB,iBAAkB;IAC5BqB,YAAY,EAAEnD,WAAY;IAC1BoD,aAAa,EAAEnD;EAAa,CAC7B,CACoB,CAAC,GACtB,IACS,CACN,CAAC;AAEhB,CAAC;AAEDjB,GAAG,CAACqE,WAAW,GAAG,KAAK"}

package/dist/esm/components/Nav/Styles.d.ts

@@ -12,7 +12,9 @@ interface StyledNavListItemProps {
     $asMore?: boolean;
 }
 export declare const StyledNavListItem: import("styled-components").StyledComponent<"li", any, StyledNavListItemProps, never>;
-export declare const StyledNavAsSelect: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledNavAsSelect: import("styled-components").StyledComponent<"div", any, {
+    $active: boolean;
+}, never>;
 export declare const StyledNavAsMoreTarget: import("styled-components").StyledComponent<"div", any, {
     $role?: NavRoleType | undefined;
 }, never>;

package/dist/esm/components/Nav/Styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Nav/Styles.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAElD,UAAU,cAAc;IACtB,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,KAAK,CAAC,EAAE,WAAW,CAAC;CACrB;AAED,eAAO,MAAM,SAAS,gFA6BrB,CAAC;AAIF,eAAO,MAAM,aAAa,mEAGzB,CAAC;AAIF,UAAU,sBAAsB;IAC9B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,iBAAiB,uFAyE7B,CAAC;AAIF,eAAO,MAAM,iBAAiB,oEAS7B,CAAC;AAIF,eAAO,MAAM,qBAAqB;;SAajC,CAAC"}
+{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Nav/Styles.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAElD,UAAU,cAAc;IACtB,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,KAAK,CAAC,EAAE,WAAW,CAAC;CACrB;AAED,eAAO,MAAM,SAAS,gFA6BrB,CAAC;AAIF,eAAO,MAAM,aAAa,mEAGzB,CAAC;AAIF,UAAU,sBAAsB;IAC9B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,iBAAiB,uFAyE7B,CAAC;AAIF,eAAO,MAAM,iBAAiB;aAAyB,OAAO;SAqB7D,CAAC;AAIF,eAAO,MAAM,qBAAqB;;SAajC,CAAC"}

package/dist/esm/components/Nav/Styles.js

@@ -62,7 +62,11 @@ StyledNavListItem.displayName = "StyledNavListItem";
 export const StyledNavAsSelect = styled.div.withConfig({
   displayName: "Styles__StyledNavAsSelect",
   componentId: "sc-1khiypw-3"
-})(["padding:0 10px;height:100%;display:flex;align-items:center;svg{color:var(--color-primary);}"]);
+})(["padding:0 10px;height:100%;display:flex;align-items:center;gap:4px;svg{color:var(--color-primary);top:1px;position:relative;}", ""], props => props.$active && css(["", " & *{", "}"], {
+  "color": "var(--color-primary)"
+}, {
+  "color": "var(--color-primary)"
+}));
 StyledNavAsSelect.displayName = "StyledNavAsSelect";
 export const StyledNavAsMoreTarget = styled.div.withConfig({
   displayName: "Styles__StyledNavAsMoreTarget",

package/dist/esm/components/Nav/Styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Styles.js","names":["styled","css","StyledNav","nav","withConfig","displayName","componentId","props","$align","$role","StyledNavList","ul","StyledNavListItem","li","$disabled","$active","StyledNavAsSelect","div","StyledNavAsMoreTarget"],"sources":["../../../../src/components/Nav/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\n\nimport { NavAlignType, NavRoleType } from \"./Nav\";\n\ninterface StyledNavProps {\n  $align?: NavAlignType;\n  $role?: NavRoleType;\n}\n\nexport const StyledNav = styled.nav<StyledNavProps>`\n  ${tw`tw-flex`}\n  height: 100%;\n  width: 100%;\n  overflow: clip visible;\n\n  ${(props) =>\n    props.$align === \"left\" &&\n    css`\n      ${tw`tw-justify-start`}\n    `}\n\n  ${(props) =>\n    props.$align === \"center\" &&\n    css`\n      ${tw`tw-justify-center`}\n    `}\n\n  ${(props) =>\n    props.$align === \"right\" &&\n    css`\n      ${tw`tw-justify-end`}\n    `}\n\n  ${(props) =>\n    props.$role === \"light\" &&\n    css`\n      height: auto;\n    `}\n`;\n\nStyledNav.displayName = \"StyledNav\";\n\nexport const StyledNavList = styled.ul`\n  ${tw`tw-flex tw-list-none tw-m-0 tw-p-0`}\n  overflow: clip visible;\n`;\n\nStyledNavList.displayName = \"StyledNavList\";\n\ninterface StyledNavListItemProps {\n  $active?: boolean;\n  $disabled?: boolean;\n  $role?: NavRoleType;\n  $asMore?: boolean;\n}\n\nexport const StyledNavListItem = styled.li<StyledNavListItemProps>`\n  ${tw`tw-text-sm tw-cursor-default tw-relative tw-select-none`}\n  color: var(--color-theme-700);\n  font-size: 15px;\n  display: flex;\n  align-items: center;\n  font-weight: 500;\n  padding: 0 10px;\n  flex-shrink: 0;\n\n  &:hover,\n  &:hover * {\n    ${(props) =>\n      !props.$disabled &&\n      css`\n        ${tw`tw-text-primary`}\n      `}\n  }\n\n  ${(props) =>\n    !props.$active &&\n    !props.$disabled &&\n    css`\n      ${tw`tw-cursor-pointer`}\n    `}\n\n  &::after {\n    content: \"\";\n    ${tw`tw-absolute tw-block tw-m-auto tw-w-0 tw-bg-transparent`}\n    bottom: 0;\n    left: 50%;\n    transform: translateX(-50%);\n    height: 3px;\n    transition: width 0.3s ease, background-color 0.3s ease;\n  }\n\n  ${(props) =>\n    props.$active &&\n    css`\n      ${tw`tw-pointer-events-none`}\n      &::after {\n        ${tw`tw-w-full tw-bg-primary`}\n      }\n    `}\n\n  ${(props) =>\n    props.$disabled &&\n    css`\n      ${tw`tw-select-none tw-cursor-not-allowed tw-opacity-50`}\n    `}\n\n  ${(props) =>\n    props.$role === \"light\" &&\n    css`\n      ${tw`tw-text-sm`}\n      color: var(--color-theme-800);\n      font-weight: 400;\n      padding: 0 8px;\n\n      &::after {\n        bottom: -4px;\n        height: 2px;\n      }\n    `}\n\n  ${(props) =>\n    props.$active &&\n    css`\n      ${tw`tw-text-primary`}\n      & * {\n        ${tw`tw-text-primary`}\n      }\n    `}\n`;\n\nStyledNavListItem.displayName = \"StyledNavListItem\";\n\nexport const StyledNavAsSelect = styled.div`\n  padding: 0 10px;\n  height: 100%;\n  display: flex;\n  align-items: center;\n\n  svg {\n    color: var(--color-primary);\n  }\n`;\n\nStyledNavAsSelect.displayName = \"StyledNavAsSelect\";\n\nexport const StyledNavAsMoreTarget = styled.div<{\n  $role?: NavRoleType;\n}>`\n  padding: 0 10px;\n  height: 100%;\n  display: flex;\n  align-items: center;\n\n  ${(props) =>\n    props.$role === \"light\" &&\n    css`\n      padding: 0;\n    `}\n`;\n\nStyledNavAsMoreTarget.displayName = \"StyledNavAsMoreTarget\";\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAU/C,OAAO,MAAMC,SAAS,GAAGF,MAAM,CAACG,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,8EAC7B;EAAA;AAAQ,CAAC,EAKVC,KAAK,IACNA,KAAK,CAACC,MAAM,KAAK,MAAM,IACvBP,GAAG,WACG;EAAA;AAAiB,CAAC,CACvB,EAEAM,KAAK,IACNA,KAAK,CAACC,MAAM,KAAK,QAAQ,IACzBP,GAAG,WACG;EAAA;AAAkB,CAAC,CACxB,EAEAM,KAAK,IACNA,KAAK,CAACC,MAAM,KAAK,OAAO,IACxBP,GAAG,WACG;EAAA;AAAe,CAAC,CACrB,EAEAM,KAAK,IACNA,KAAK,CAACE,KAAK,KAAK,OAAO,IACvBR,GAAG,kBAEF,CACJ;AAEDC,SAAS,CAACG,WAAW,GAAG,WAAW;AAEnC,OAAO,MAAMK,aAAa,GAAGV,MAAM,CAACW,EAAE,CAAAP,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,oCAChC;EAAA;EAAA;EAAA;EAAA;AAAmC,CAAC,CAEzC;AAEDI,aAAa,CAACL,WAAW,GAAG,eAAe;AAS3C,OAAO,MAAMO,iBAAiB,GAAGZ,MAAM,CAACa,EAAE,CAAAT,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,gUACpC;EAAA;EAAA;EAAA;EAAA;EAAA;AAAwD,CAAC,EAWxDC,KAAK,IACN,CAACA,KAAK,CAACO,SAAS,IAChBb,GAAG,WACG;EAAA;AAAgB,CAAC,CACtB,EAGFM,KAAK,IACN,CAACA,KAAK,CAACQ,OAAO,IACd,CAACR,KAAK,CAACO,SAAS,IAChBb,GAAG,WACG;EAAA;AAAkB,CAAC,CACxB,EAIG;EAAA;EAAA;EAAA;EAAA;EAAA;AAAwD,CAAC,EAQ5DM,KAAK,IACNA,KAAK,CAACQ,OAAO,IACbd,GAAG,0BACG;EAAA;AAAuB,CAAC,EAEtB;EAAA;EAAA;AAAwB,CAAC,CAEhC,EAEAM,KAAK,IACNA,KAAK,CAACO,SAAS,IACfb,GAAG,WACG;EAAA;EAAA;EAAA;AAAmD,CAAC,CACzD,EAEAM,KAAK,IACNA,KAAK,CAACE,KAAK,KAAK,OAAO,IACvBR,GAAG,wGACG;EAAA;EAAA;AAAW,CAAC,CASjB,EAEAM,KAAK,IACNA,KAAK,CAACQ,OAAO,IACbd,GAAG,qBACG;EAAA;AAAgB,CAAC,EAEf;EAAA;AAAgB,CAAC,CAExB,CACJ;AAEDW,iBAAiB,CAACP,WAAW,GAAG,mBAAmB;AAEnD,OAAO,MAAMW,iBAAiB,GAAGhB,MAAM,CAACiB,GAAG,CAAAb,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,mGAS1C;AAEDU,iBAAiB,CAACX,WAAW,GAAG,mBAAmB;AAEnD,OAAO,MAAMa,qBAAqB,GAAGlB,MAAM,CAACiB,GAAG,CAAAb,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,wEAQ1CC,KAAK,IACNA,KAAK,CAACE,KAAK,KAAK,OAAO,IACvBR,GAAG,gBAEF,CACJ;AAEDiB,qBAAqB,CAACb,WAAW,GAAG,uBAAuB"}
+{"version":3,"file":"Styles.js","names":["styled","css","StyledNav","nav","withConfig","displayName","componentId","props","$align","$role","StyledNavList","ul","StyledNavListItem","li","$disabled","$active","StyledNavAsSelect","div","StyledNavAsMoreTarget"],"sources":["../../../../src/components/Nav/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\n\nimport { NavAlignType, NavRoleType } from \"./Nav\";\n\ninterface StyledNavProps {\n  $align?: NavAlignType;\n  $role?: NavRoleType;\n}\n\nexport const StyledNav = styled.nav<StyledNavProps>`\n  ${tw`tw-flex`}\n  height: 100%;\n  width: 100%;\n  overflow: clip visible;\n\n  ${(props) =>\n    props.$align === \"left\" &&\n    css`\n      ${tw`tw-justify-start`}\n    `}\n\n  ${(props) =>\n    props.$align === \"center\" &&\n    css`\n      ${tw`tw-justify-center`}\n    `}\n\n  ${(props) =>\n    props.$align === \"right\" &&\n    css`\n      ${tw`tw-justify-end`}\n    `}\n\n  ${(props) =>\n    props.$role === \"light\" &&\n    css`\n      height: auto;\n    `}\n`;\n\nStyledNav.displayName = \"StyledNav\";\n\nexport const StyledNavList = styled.ul`\n  ${tw`tw-flex tw-list-none tw-m-0 tw-p-0`}\n  overflow: clip visible;\n`;\n\nStyledNavList.displayName = \"StyledNavList\";\n\ninterface StyledNavListItemProps {\n  $active?: boolean;\n  $disabled?: boolean;\n  $role?: NavRoleType;\n  $asMore?: boolean;\n}\n\nexport const StyledNavListItem = styled.li<StyledNavListItemProps>`\n  ${tw`tw-text-sm tw-cursor-default tw-relative tw-select-none`}\n  color: var(--color-theme-700);\n  font-size: 15px;\n  display: flex;\n  align-items: center;\n  font-weight: 500;\n  padding: 0 10px;\n  flex-shrink: 0;\n\n  &:hover,\n  &:hover * {\n    ${(props) =>\n      !props.$disabled &&\n      css`\n        ${tw`tw-text-primary`}\n      `}\n  }\n\n  ${(props) =>\n    !props.$active &&\n    !props.$disabled &&\n    css`\n      ${tw`tw-cursor-pointer`}\n    `}\n\n  &::after {\n    content: \"\";\n    ${tw`tw-absolute tw-block tw-m-auto tw-w-0 tw-bg-transparent`}\n    bottom: 0;\n    left: 50%;\n    transform: translateX(-50%);\n    height: 3px;\n    transition: width 0.3s ease, background-color 0.3s ease;\n  }\n\n  ${(props) =>\n    props.$active &&\n    css`\n      ${tw`tw-pointer-events-none`}\n      &::after {\n        ${tw`tw-w-full tw-bg-primary`}\n      }\n    `}\n\n  ${(props) =>\n    props.$disabled &&\n    css`\n      ${tw`tw-select-none tw-cursor-not-allowed tw-opacity-50`}\n    `}\n\n  ${(props) =>\n    props.$role === \"light\" &&\n    css`\n      ${tw`tw-text-sm`}\n      color: var(--color-theme-800);\n      font-weight: 400;\n      padding: 0 8px;\n\n      &::after {\n        bottom: -4px;\n        height: 2px;\n      }\n    `}\n\n  ${(props) =>\n    props.$active &&\n    css`\n      ${tw`tw-text-primary`}\n      & * {\n        ${tw`tw-text-primary`}\n      }\n    `}\n`;\n\nStyledNavListItem.displayName = \"StyledNavListItem\";\n\nexport const StyledNavAsSelect = styled.div<{ $active: boolean }>`\n  padding: 0 10px;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n\n  svg {\n    color: var(--color-primary);\n    top: 1px;\n    position: relative;\n  }\n\n  ${(props) =>\n    props.$active &&\n    css`\n      ${tw`tw-text-primary`}\n      & * {\n        ${tw`tw-text-primary`}\n      }\n    `}\n`;\n\nStyledNavAsSelect.displayName = \"StyledNavAsSelect\";\n\nexport const StyledNavAsMoreTarget = styled.div<{\n  $role?: NavRoleType;\n}>`\n  padding: 0 10px;\n  height: 100%;\n  display: flex;\n  align-items: center;\n\n  ${(props) =>\n    props.$role === \"light\" &&\n    css`\n      padding: 0;\n    `}\n`;\n\nStyledNavAsMoreTarget.displayName = \"StyledNavAsMoreTarget\";\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAU/C,OAAO,MAAMC,SAAS,GAAGF,MAAM,CAACG,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,8EAC7B;EAAA;AAAQ,CAAC,EAKVC,KAAK,IACNA,KAAK,CAACC,MAAM,KAAK,MAAM,IACvBP,GAAG,WACG;EAAA;AAAiB,CAAC,CACvB,EAEAM,KAAK,IACNA,KAAK,CAACC,MAAM,KAAK,QAAQ,IACzBP,GAAG,WACG;EAAA;AAAkB,CAAC,CACxB,EAEAM,KAAK,IACNA,KAAK,CAACC,MAAM,KAAK,OAAO,IACxBP,GAAG,WACG;EAAA;AAAe,CAAC,CACrB,EAEAM,KAAK,IACNA,KAAK,CAACE,KAAK,KAAK,OAAO,IACvBR,GAAG,kBAEF,CACJ;AAEDC,SAAS,CAACG,WAAW,GAAG,WAAW;AAEnC,OAAO,MAAMK,aAAa,GAAGV,MAAM,CAACW,EAAE,CAAAP,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,oCAChC;EAAA;EAAA;EAAA;EAAA;AAAmC,CAAC,CAEzC;AAEDI,aAAa,CAACL,WAAW,GAAG,eAAe;AAS3C,OAAO,MAAMO,iBAAiB,GAAGZ,MAAM,CAACa,EAAE,CAAAT,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,gUACpC;EAAA;EAAA;EAAA;EAAA;EAAA;AAAwD,CAAC,EAWxDC,KAAK,IACN,CAACA,KAAK,CAACO,SAAS,IAChBb,GAAG,WACG;EAAA;AAAgB,CAAC,CACtB,EAGFM,KAAK,IACN,CAACA,KAAK,CAACQ,OAAO,IACd,CAACR,KAAK,CAACO,SAAS,IAChBb,GAAG,WACG;EAAA;AAAkB,CAAC,CACxB,EAIG;EAAA;EAAA;EAAA;EAAA;EAAA;AAAwD,CAAC,EAQ5DM,KAAK,IACNA,KAAK,CAACQ,OAAO,IACbd,GAAG,0BACG;EAAA;AAAuB,CAAC,EAEtB;EAAA;EAAA;AAAwB,CAAC,CAEhC,EAEAM,KAAK,IACNA,KAAK,CAACO,SAAS,IACfb,GAAG,WACG;EAAA;EAAA;EAAA;AAAmD,CAAC,CACzD,EAEAM,KAAK,IACNA,KAAK,CAACE,KAAK,KAAK,OAAO,IACvBR,GAAG,wGACG;EAAA;EAAA;AAAW,CAAC,CASjB,EAEAM,KAAK,IACNA,KAAK,CAACQ,OAAO,IACbd,GAAG,qBACG;EAAA;AAAgB,CAAC,EAEf;EAAA;AAAgB,CAAC,CAExB,CACJ;AAEDW,iBAAiB,CAACP,WAAW,GAAG,mBAAmB;AAEnD,OAAO,MAAMW,iBAAiB,GAAGhB,MAAM,CAACiB,GAAG,CAAAb,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,0IAatCC,KAAK,IACNA,KAAK,CAACQ,OAAO,IACbd,GAAG,qBACG;EAAA;AAAgB,CAAC,EAEf;EAAA;AAAgB,CAAC,CAExB,CACJ;AAEDe,iBAAiB,CAACX,WAAW,GAAG,mBAAmB;AAEnD,OAAO,MAAMa,qBAAqB,GAAGlB,MAAM,CAACiB,GAAG,CAAAb,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,wEAQ1CC,KAAK,IACNA,KAAK,CAACE,KAAK,KAAK,OAAO,IACvBR,GAAG,gBAEF,CACJ;AAEDiB,qBAAqB,CAACb,WAAW,GAAG,uBAAuB"}

package/dist/index.js

@@ -13693,7 +13693,13 @@
   var StyledNavAsSelect = styled__default["default"].div.withConfig({
     displayName: "Styles__StyledNavAsSelect",
     componentId: "sc-1khiypw-3"
-  })(["padding:0 10px;height:100%;display:flex;align-items:center;svg{color:var(--color-primary);}"]);
+  })(["padding:0 10px;height:100%;display:flex;align-items:center;gap:4px;svg{color:var(--color-primary);top:1px;position:relative;}", ""], function (props) {
+    return props.$active && styled.css(["", " & *{", "}"], {
+      "color": "var(--color-primary)"
+    }, {
+      "color": "var(--color-primary)"
+    });
+  });
   StyledNavAsSelect.displayName = "StyledNavAsSelect";
   var StyledNavAsMoreTarget = styled__default["default"].div.withConfig({
     displayName: "Styles__StyledNavAsMoreTarget",
@@ -13729,10 +13735,17 @@
   var StyledNavListItemMore = styled__default["default"](Item).withConfig({
     displayName: "Styles__StyledNavListItemMore",
     componentId: "sc-m6npdq-0"
-  })(["", " cursor:pointer;", ""], function (props) {
+  })(["", " cursor:pointer;&::after{content:\"\";", " bottom:0;left:50%;transform:translateX(-50%);height:3px;transition:width 0.3s ease,background-color 0.3s ease;", "}"], function (props) {
     return props.role !== "light" && styled.css(["padding:0;"]);
   }, {
-    "pointerEvents": "auto"
+    "position": "absolute",
+    "margin": "auto",
+    "display": "block",
+    "width": "0px",
+    "backgroundColor": "transparent"
+  }, {
+    "width": "100%",
+    "backgroundColor": "var(--color-primary)"
   });
   StyledNavListItemMore.displayName = "StyledNavListItemMore";
 
@@ -15766,7 +15779,8 @@
     }, [children]);
     var navAsSelect = React.useMemo(function () {
       return /*#__PURE__*/React__default["default"].createElement(StyledNavAsSelect, {
-        id: targetId
+        id: targetId,
+        $active: true
       }, /*#__PURE__*/React__default["default"].createElement("span", null, navItemNames[active]), /*#__PURE__*/React__default["default"].createElement(ExpandSingle, {
         expanded: moreOpened,
         fill: "currentColor"
@@ -15798,8 +15812,7 @@
         "data-disabled": element.props.disabled
       });
     }), type === "dropdown" ? /*#__PURE__*/React__default["default"].createElement(StyledNavListItemMore, {
-      name: "More",
-      active: Array.from(navItemNames.keys()).indexOf(active) === -1,
+      name: navItemNames[active],
       role: role
     }, /*#__PURE__*/React__default["default"].createElement(Select, {
       selected: active,