@consumidor-positivo/aurora 0.0.80 → 0.0.82

package/dist/components/Header/index.es.js

@@ -56,19 +56,23 @@ const HeaderNavbar = ({ data, renderItem }) => {
     return renderItem(item);
   }) });
 };
-const HeaderNavbarLink = ({
-  name,
-  onClick,
-  dropdown,
-  active
-}) => {
+const HeaderNavbarLink = (navItem) => {
+  const { name, dropdown, active, href } = navItem;
+  const isDropdown = !!dropdown && dropdown.length;
+  function handleItemClick(item, ev) {
+    if (item.onClick) {
+      ev.preventDefault();
+      item.onClick();
+    }
+  }
   return /* @__PURE__ */ jsxs(
     Text,
     {
-      as: "a",
+      as: isDropdown ? "p" : "a",
       variant: "heading-micro",
       weight: "light",
-      onClick,
+      href,
+      onClick: (ev) => handleItemClick(navItem, ev),
       title: name,
       className: classNames("au-header__navbar-link", {
         "au-header__navbar-link--is-dropdown": dropdown,
@@ -88,6 +92,8 @@ const HeaderNavbarLink = ({
                   {
                     as: "a",
                     variant: "heading-micro",
+                    href: item.href,
+                    onClick: (ev) => handleItemClick(item, ev),
                     weight: "light",
                     className: classNames("au-header__dropdown-link", {
                       "au-header__dropdown-link--is-active": item.active

package/dist/components/Header/index.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../../../lib/components/Header/parts/HeaderActions.tsx","../../../lib/components/Header/parts/HeaderBadges.tsx","../../../lib/components/Header/parts/HeaderButton.tsx","../../../lib/components/Header/parts/HeaderHamburger.tsx","../../../lib/components/Header/parts/HeaderLogo.tsx","../../../lib/components/Header/parts/HeaderNavbar.tsx","../../../lib/components/Header/parts/HeaderNavbarLink.tsx","../../../lib/components/Header/parts/HeaderNavigation.tsx","../../../lib/components/Header/parts/HeaderProfile.tsx","../../../lib/components/Header/parts/HeaderWrap.tsx","../../../lib/components/Header/index.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport { ReactNode } from 'react'\n\nexport type HeaderActionsProps = {\n  children: ReactNode | string | JSX.Element | JSX.Element[]\n  divider?: boolean\n}\n\nexport const HeaderActions = ({ children, divider }: HeaderActionsProps) => {\n  return (\n    <div\n      className={classNames('au-header__actions', {\n        'au-header__actions--divider': divider,\n      })}>\n      {children}\n    </div>\n  )\n}\n","import { ReactNode } from 'react'\n\nexport type HeaderBadgesProps = {\n  children: ReactNode | string | JSX.Element | JSX.Element[]\n}\n\nexport const HeaderBadges = ({ children }: HeaderBadgesProps) => {\n  return <div className=\"au-header__badges\">{children}</div>\n}\n","import { ReactNode } from 'react'\n\nexport type HeaderButtonProps = {\n  children: ReactNode | string | JSX.Element | JSX.Element[]\n  onClick: () => void\n}\n\nexport const HeaderButton = ({ children, onClick }: HeaderButtonProps) => {\n  return (\n    <div className=\"au-header__button\" onClick={onClick}>\n      {children}\n    </div>\n  )\n}\n","import { IconMenu } from '@components/icons/default'\n\nexport type HeaderHamburgerProps = {\n  onClick?: () => void\n}\n\nexport const HeaderHamburger = ({ onClick }: HeaderHamburgerProps) => {\n  return (\n    <div className=\"au-header__hamburger\">\n      <div className=\"au-header__hamburger\" onClick={onClick}>\n        <IconMenu />\n      </div>\n    </div>\n  )\n}\n","import { ReactNode } from 'react'\nimport { Conditional } from '@components/misc'\n\nexport type HeaderLogoProps = {\n  children?: ReactNode | string | JSX.Element | JSX.Element[]\n  renderMobile?: ReactNode | string | JSX.Element | JSX.Element[]\n  renderDesktop?: ReactNode | string | JSX.Element | JSX.Element[]\n}\n\nexport const HeaderLogo = ({\n  children,\n  renderMobile,\n  renderDesktop,\n}: HeaderLogoProps) => {\n  return (\n    <div className=\"au-header__logo\">\n      <Conditional\n        condition={!!renderMobile}\n        renderIf={<div className=\"au-header__logo--mobile\">{renderMobile}</div>}\n      />\n      <Conditional\n        condition={!!renderDesktop}\n        renderIf={\n          <div className=\"au-header__logo--desktop\">{renderDesktop}</div>\n        }\n      />\n      {children}\n    </div>\n  )\n}\n","import { ReactNode } from 'react'\nimport { NavbarDataProps } from '../types'\n\nexport type HeaderNavbarProps = {\n  data: NavbarDataProps[]\n  renderItem: (\n    item: NavbarDataProps,\n  ) => ReactNode | string | JSX.Element | JSX.Element[]\n}\n\nexport const HeaderNavbar = ({ data, renderItem }: HeaderNavbarProps) => {\n  return (\n    <nav role=\"navigation\" className=\"au-header__navbar\">\n      {data?.map((item) => {\n        return renderItem(item)\n      })}\n    </nav>\n  )\n}\n","import classNames from 'classnames'\nimport { Text } from '@components/Text'\nimport { IconChevronDown, IconChevronLeft } from '@components/icons/default'\nimport { Conditional } from '@components/misc'\nimport { NavbarDataProps } from '../types'\n\nexport const HeaderNavbarLink = ({\n  name,\n  onClick,\n  dropdown,\n  active,\n}: NavbarDataProps) => {\n  return (\n    <Text\n      as=\"a\"\n      variant=\"heading-micro\"\n      weight=\"light\"\n      onClick={onClick}\n      title={name}\n      className={classNames('au-header__navbar-link', {\n        'au-header__navbar-link--is-dropdown': dropdown,\n        'au-header__navbar-link--is-active': active,\n      })}>\n      {name}\n\n      <Conditional\n        condition={!!dropdown?.length}\n        renderIf={\n          <>\n            <IconChevronDown />\n            <div className=\"au-header__dropdown\">\n              {dropdown?.map((item) => {\n                return (\n                  <Text\n                    key={item.name}\n                    as=\"a\"\n                    variant=\"heading-micro\"\n                    weight=\"light\"\n                    className={classNames('au-header__dropdown-link', {\n                      'au-header__dropdown-link--is-active': item.active,\n                    })}\n                    title={item.name}>\n                    {item.name}\n                    <Conditional\n                      condition={!!item.active}\n                      renderIf={<IconChevronLeft />}\n                    />\n                  </Text>\n                )\n              })}\n            </div>\n          </>\n        }\n      />\n    </Text>\n  )\n}\n","import { ReactNode } from 'react'\n\nexport type HeaderNavigationProps = {\n  children: ReactNode | string | JSX.Element | JSX.Element[]\n}\n\nexport const HeaderNavigation = ({ children }: HeaderNavigationProps) => {\n  return <div className=\"au-header__navigation\">{children}</div>\n}\n","import { getInitialLetters } from '@core/utils/getInitialLetters'\nimport { IconBell, IconChevronDown, IconMenu } from '@components/icons/default'\n\nexport type HeaderProfileProps = {\n  onClickNotifications?: () => void\n  onClickMenu?: () => void\n  fullName: string\n}\n\nexport const HeaderProfile = ({\n  onClickNotifications,\n  onClickMenu,\n  fullName,\n}: HeaderProfileProps) => {\n  const initialLetters = getInitialLetters(fullName)\n  return (\n    <div className=\"au-header__profile\">\n      <div\n        className=\"au-header__profile-notifications\"\n        onClick={onClickNotifications}>\n        <IconBell />\n      </div>\n\n      <div className=\"au-header__profile-menu-mobile\" onClick={onClickMenu}>\n        <IconMenu />\n      </div>\n\n      <div className=\"au-header__profile-menu\" onClick={onClickMenu}>\n        <div className=\"au-header__profile-letters\">{initialLetters}</div>\n        <IconChevronDown />\n      </div>\n    </div>\n  )\n}\n","import classNames from 'classnames'\nimport { ReactNode } from 'react'\n\nexport type HeaderWrapProps = {\n  position?: 'static' | 'fixed'\n  children: ReactNode | string | JSX.Element | JSX.Element[]\n}\n\nexport const HeaderWrap = ({\n  children,\n  position = 'static',\n}: HeaderWrapProps) => {\n  return (\n    <header\n      role=\"banner\"\n      className={classNames('au-header', {\n        'au-header--fixed': position === 'fixed',\n        'au-header--static': position === 'static',\n      })}>\n      <div className=\"au-header__container\">{children}</div>\n    </header>\n  )\n}\n","import { HeaderActions, HeaderActionsProps } from './parts/HeaderActions'\nimport { HeaderBadges, HeaderBadgesProps } from './parts/HeaderBadges'\nimport { HeaderButton, HeaderButtonProps } from './parts/HeaderButton'\nimport { HeaderHamburger, HeaderHamburgerProps } from './parts/HeaderHamburger'\nimport { HeaderLogo, HeaderLogoProps } from './parts/HeaderLogo'\nimport { HeaderNavbar, HeaderNavbarProps } from './parts/HeaderNavbar'\nimport { HeaderNavbarLink } from './parts/HeaderNavbarLink'\nimport {\n  HeaderNavigation,\n  HeaderNavigationProps,\n} from './parts/HeaderNavigation'\nimport { HeaderProfile, HeaderProfileProps } from './parts/HeaderProfile'\nimport { HeaderWrap as Header, HeaderWrapProps } from './parts/HeaderWrap'\nimport { NavbarDataProps } from './types'\n\nimport './styles.scss'\n\ntype Components = {\n  Actions: React.FC<HeaderActionsProps>\n  Badges: React.FC<HeaderBadgesProps>\n  Button: React.FC<HeaderButtonProps>\n  Hamburger: React.FC<HeaderHamburgerProps>\n  Logo: React.FC<HeaderLogoProps>\n  Navbar: React.FC<HeaderNavbarProps>\n  NavbarLink: React.FC<NavbarDataProps>\n  Navigation: React.FC<HeaderNavigationProps>\n  Profile: React.FC<HeaderProfileProps>\n  Root: React.FC<HeaderWrapProps>\n}\n\nconst components: Components = {\n  Actions: HeaderActions,\n  Badges: HeaderBadges,\n  Button: HeaderButton,\n  Hamburger: HeaderHamburger,\n  Logo: HeaderLogo,\n  Navbar: HeaderNavbar,\n  NavbarLink: HeaderNavbarLink,\n  Navigation: HeaderNavigation,\n  Profile: HeaderProfile,\n  Root: Header,\n}\n\nObject.keys(components).forEach((key) => {\n  const component = components[key as keyof Components]\n  component.displayName = `Header.${key}`\n})\n\nexport { components as Header }\n"],"names":["Header"],"mappings":"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"}
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/Header/parts/HeaderActions.tsx","../../../lib/components/Header/parts/HeaderBadges.tsx","../../../lib/components/Header/parts/HeaderButton.tsx","../../../lib/components/Header/parts/HeaderHamburger.tsx","../../../lib/components/Header/parts/HeaderLogo.tsx","../../../lib/components/Header/parts/HeaderNavbar.tsx","../../../lib/components/Header/parts/HeaderNavbarLink.tsx","../../../lib/components/Header/parts/HeaderNavigation.tsx","../../../lib/components/Header/parts/HeaderProfile.tsx","../../../lib/components/Header/parts/HeaderWrap.tsx","../../../lib/components/Header/index.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport { ReactNode } from 'react'\n\nexport type HeaderActionsProps = {\n  children: ReactNode | string | JSX.Element | JSX.Element[]\n  divider?: boolean\n}\n\nexport const HeaderActions = ({ children, divider }: HeaderActionsProps) => {\n  return (\n    <div\n      className={classNames('au-header__actions', {\n        'au-header__actions--divider': divider,\n      })}>\n      {children}\n    </div>\n  )\n}\n","import { ReactNode } from 'react'\n\nexport type HeaderBadgesProps = {\n  children: ReactNode | string | JSX.Element | JSX.Element[]\n}\n\nexport const HeaderBadges = ({ children }: HeaderBadgesProps) => {\n  return <div className=\"au-header__badges\">{children}</div>\n}\n","import { ReactNode } from 'react'\n\nexport type HeaderButtonProps = {\n  children: ReactNode | string | JSX.Element | JSX.Element[]\n  onClick: () => void\n}\n\nexport const HeaderButton = ({ children, onClick }: HeaderButtonProps) => {\n  return (\n    <div className=\"au-header__button\" onClick={onClick}>\n      {children}\n    </div>\n  )\n}\n","import { IconMenu } from '@components/icons/default'\n\nexport type HeaderHamburgerProps = {\n  onClick?: () => void\n}\n\nexport const HeaderHamburger = ({ onClick }: HeaderHamburgerProps) => {\n  return (\n    <div className=\"au-header__hamburger\">\n      <div className=\"au-header__hamburger\" onClick={onClick}>\n        <IconMenu />\n      </div>\n    </div>\n  )\n}\n","import { ReactNode } from 'react'\nimport { Conditional } from '@components/misc'\n\nexport type HeaderLogoProps = {\n  children?: ReactNode | string | JSX.Element | JSX.Element[]\n  renderMobile?: ReactNode | string | JSX.Element | JSX.Element[]\n  renderDesktop?: ReactNode | string | JSX.Element | JSX.Element[]\n}\n\nexport const HeaderLogo = ({\n  children,\n  renderMobile,\n  renderDesktop,\n}: HeaderLogoProps) => {\n  return (\n    <div className=\"au-header__logo\">\n      <Conditional\n        condition={!!renderMobile}\n        renderIf={<div className=\"au-header__logo--mobile\">{renderMobile}</div>}\n      />\n      <Conditional\n        condition={!!renderDesktop}\n        renderIf={\n          <div className=\"au-header__logo--desktop\">{renderDesktop}</div>\n        }\n      />\n      {children}\n    </div>\n  )\n}\n","import { ReactNode } from 'react'\nimport { NavbarDataProps } from '../types'\n\nexport type HeaderNavbarProps = {\n  data: NavbarDataProps[]\n  renderItem: (\n    item: NavbarDataProps,\n  ) => ReactNode | string | JSX.Element | JSX.Element[]\n}\n\nexport const HeaderNavbar = ({ data, renderItem }: HeaderNavbarProps) => {\n  return (\n    <nav role=\"navigation\" className=\"au-header__navbar\">\n      {data?.map((item) => {\n        return renderItem(item)\n      })}\n    </nav>\n  )\n}\n","import classNames from 'classnames'\nimport { Text } from '@components/Text'\nimport { IconChevronDown, IconChevronLeft } from '@components/icons/default'\nimport { Conditional } from '@components/misc'\nimport { NavbarDataProps } from '../types'\n\nexport const HeaderNavbarLink = (navItem: NavbarDataProps) => {\n  const { name, dropdown, active, href } = navItem\n  const isDropdown = !!dropdown && dropdown.length\n\n  function handleItemClick(item: NavbarDataProps, ev: React.MouseEvent) {\n    if (item.onClick) {\n      ev.preventDefault()\n      item.onClick()\n    }\n  }\n\n  return (\n    <Text\n      as={isDropdown ? 'p' : 'a'}\n      variant=\"heading-micro\"\n      weight=\"light\"\n      href={href}\n      onClick={(ev) => handleItemClick(navItem, ev)}\n      title={name}\n      className={classNames('au-header__navbar-link', {\n        'au-header__navbar-link--is-dropdown': dropdown,\n        'au-header__navbar-link--is-active': active,\n      })}>\n      {name}\n\n      <Conditional\n        condition={!!dropdown?.length}\n        renderIf={\n          <>\n            <IconChevronDown />\n            <div className=\"au-header__dropdown\">\n              {dropdown?.map((item) => {\n                return (\n                  <Text\n                    key={item.name}\n                    as=\"a\"\n                    variant=\"heading-micro\"\n                    href={item.href}\n                    onClick={(ev) => handleItemClick(item, ev)}\n                    weight=\"light\"\n                    className={classNames('au-header__dropdown-link', {\n                      'au-header__dropdown-link--is-active': item.active,\n                    })}\n                    title={item.name}>\n                    {item.name}\n                    <Conditional\n                      condition={!!item.active}\n                      renderIf={<IconChevronLeft />}\n                    />\n                  </Text>\n                )\n              })}\n            </div>\n          </>\n        }\n      />\n    </Text>\n  )\n}\n","import { ReactNode } from 'react'\n\nexport type HeaderNavigationProps = {\n  children: ReactNode | string | JSX.Element | JSX.Element[]\n}\n\nexport const HeaderNavigation = ({ children }: HeaderNavigationProps) => {\n  return <div className=\"au-header__navigation\">{children}</div>\n}\n","import { getInitialLetters } from '@core/utils/getInitialLetters'\nimport { IconBell, IconChevronDown, IconMenu } from '@components/icons/default'\n\nexport type HeaderProfileProps = {\n  onClickNotifications?: () => void\n  onClickMenu?: () => void\n  fullName: string\n}\n\nexport const HeaderProfile = ({\n  onClickNotifications,\n  onClickMenu,\n  fullName,\n}: HeaderProfileProps) => {\n  const initialLetters = getInitialLetters(fullName)\n  return (\n    <div className=\"au-header__profile\">\n      <div\n        className=\"au-header__profile-notifications\"\n        onClick={onClickNotifications}>\n        <IconBell />\n      </div>\n\n      <div className=\"au-header__profile-menu-mobile\" onClick={onClickMenu}>\n        <IconMenu />\n      </div>\n\n      <div className=\"au-header__profile-menu\" onClick={onClickMenu}>\n        <div className=\"au-header__profile-letters\">{initialLetters}</div>\n        <IconChevronDown />\n      </div>\n    </div>\n  )\n}\n","import classNames from 'classnames'\nimport { ReactNode } from 'react'\n\nexport type HeaderWrapProps = {\n  position?: 'static' | 'fixed'\n  children: ReactNode | string | JSX.Element | JSX.Element[]\n}\n\nexport const HeaderWrap = ({\n  children,\n  position = 'static',\n}: HeaderWrapProps) => {\n  return (\n    <header\n      role=\"banner\"\n      className={classNames('au-header', {\n        'au-header--fixed': position === 'fixed',\n        'au-header--static': position === 'static',\n      })}>\n      <div className=\"au-header__container\">{children}</div>\n    </header>\n  )\n}\n","import { HeaderActions, HeaderActionsProps } from './parts/HeaderActions'\nimport { HeaderBadges, HeaderBadgesProps } from './parts/HeaderBadges'\nimport { HeaderButton, HeaderButtonProps } from './parts/HeaderButton'\nimport { HeaderHamburger, HeaderHamburgerProps } from './parts/HeaderHamburger'\nimport { HeaderLogo, HeaderLogoProps } from './parts/HeaderLogo'\nimport { HeaderNavbar, HeaderNavbarProps } from './parts/HeaderNavbar'\nimport { HeaderNavbarLink } from './parts/HeaderNavbarLink'\nimport {\n  HeaderNavigation,\n  HeaderNavigationProps,\n} from './parts/HeaderNavigation'\nimport { HeaderProfile, HeaderProfileProps } from './parts/HeaderProfile'\nimport { HeaderWrap as Header, HeaderWrapProps } from './parts/HeaderWrap'\nimport { NavbarDataProps } from './types'\n\nimport './styles.scss'\n\ntype Components = {\n  Actions: React.FC<HeaderActionsProps>\n  Badges: React.FC<HeaderBadgesProps>\n  Button: React.FC<HeaderButtonProps>\n  Hamburger: React.FC<HeaderHamburgerProps>\n  Logo: React.FC<HeaderLogoProps>\n  Navbar: React.FC<HeaderNavbarProps>\n  NavbarLink: React.FC<NavbarDataProps>\n  Navigation: React.FC<HeaderNavigationProps>\n  Profile: React.FC<HeaderProfileProps>\n  Root: React.FC<HeaderWrapProps>\n}\n\nconst components: Components = {\n  Actions: HeaderActions,\n  Badges: HeaderBadges,\n  Button: HeaderButton,\n  Hamburger: HeaderHamburger,\n  Logo: HeaderLogo,\n  Navbar: HeaderNavbar,\n  NavbarLink: HeaderNavbarLink,\n  Navigation: HeaderNavigation,\n  Profile: HeaderProfile,\n  Root: Header,\n}\n\nObject.keys(components).forEach((key) => {\n  const component = components[key as keyof Components]\n  component.displayName = `Header.${key}`\n})\n\nexport { components as Header }\n"],"names":["Header"],"mappings":"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"}

package/dist/components/Header/parts/HeaderNavbarLink.d.ts

@@ -1,3 +1,3 @@
 import { NavbarDataProps } from '../types';
 
-export declare const HeaderNavbarLink: ({ name, onClick, dropdown, active, }: NavbarDataProps) => import("react/jsx-runtime").JSX.Element;
+export declare const HeaderNavbarLink: (navItem: NavbarDataProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Header/styles.css

@@ -1 +1 @@
-.au-header{height:80px;padding:16px 0;border-bottom:1px solid #e2e4e9;background-color:#fff}.au-header--fixed{position:fixed;top:0;left:0;width:100%;z-index:5}.au-header--static{position:relative}.au-header__container{width:100%;max-width:1240px;margin:0 auto;padding:0 24px}@media (min-width: 1024px){.au-header__container{padding:0 16px}}.au-header__container{height:100%;display:flex;justify-content:space-between;align-items:center;gap:16px}.au-header__logo{display:flex;align-items:center}.au-header__logo .au-text{padding-left:16px;margin-left:16px;border-left:1px solid #e2e4e9}.au-header__logo--mobile{display:block}@media (min-width: 1024px){.au-header__logo--mobile{display:none}}.au-header__logo--desktop{display:none}@media (min-width: 1024px){.au-header__logo--desktop{display:block}}.au-header__link,.au-header__button{cursor:pointer}.au-header__badges{display:flex;align-items:center}.au-header__badges>*+*{padding-left:16px;margin-left:16px;position:relative}.au-header__badges>*+*:before{content:"";height:24px;width:1px;background-color:#e2e4e9;position:absolute;left:0;top:calc(50% - 12px)}.au-header__badges .au-logo{max-width:56px}.au-header__badges .au-logo img{width:100%}.au-header__navigation{display:flex}.au-header__navigation>*+*{margin-left:24px}.au-header__navbar{color:#16181d;display:none}@media (min-width: 1024px){.au-header__navbar{display:flex;align-items:center;gap:40px}}.au-header__navbar-link{cursor:pointer}.au-header__navbar-link--is-dropdown{position:relative;display:flex;align-items:center;justify-content:center;gap:8px}.au-header__navbar-link--is-dropdown>.au-icon{transition:transform .3s ease}.au-header__navbar-link--is-dropdown:hover>.au-icon,.au-header__navbar-link--is-dropdown:focus>.au-icon{transform:rotate(-180deg)}.au-header__navbar-link--is-dropdown:hover .au-header__dropdown,.au-header__navbar-link--is-dropdown:focus .au-header__dropdown{opacity:1;visibility:visible;transform:translateY(10px)}.au-header__navbar-link--is-active,.au-header__navbar-link:hover,.au-header__navbar-link:focus{font-weight:700;letter-spacing:-.6px}.au-header__navbar-link:hover,.au-header__navbar-link:focus{color:#16181d}.au-header__navbar-link--is-active{color:#0048db}.au-header__navbar-link--is-active:hover,.au-header__navbar-link--is-active:focus{color:#0048db}.au-header__dropdown{background-color:#fff;border-radius:16px;border:1px solid #e2e4e9;box-shadow:0 2px 8px #a9b1c514,0 4px 4px #0048db0a;max-width:230px;min-width:230px;position:absolute;z-index:2;top:100%;width:100%;left:0;opacity:.2;visibility:hidden;transition:opacity .3s ease,transform .2s linear,visibility .3s ease;transform:translateY(20px)}.au-header__dropdown-link{display:inline-block;padding:16px 24px;width:100%;display:flex;justify-content:space-between}.au-header__dropdown-link--is-active,.au-header__dropdown-link:hover,.au-header__dropdown-link:focus{font-weight:700;letter-spacing:-.6px}.au-header__dropdown-link--is-active{color:#0048db;background-color:#fafbff;border-top:1px solid #e2e4e9}.au-header__actions{display:flex;align-items:center;gap:16px}@media (min-width: 1024px){.au-header__actions--divider{border-left:1px solid #e2e4e9;padding-left:24px;margin-left:24px}}.au-header__profile{display:flex;align-items:center;gap:32px}.au-header__profile-notifications{cursor:pointer}.au-header__profile-menu{display:none;align-items:center;gap:8px;cursor:pointer}@media (min-width: 1024px){.au-header__profile-menu{display:flex}}.au-header__profile-menu-mobile{display:block;cursor:pointer}@media (min-width: 1024px){.au-header__profile-menu-mobile{display:none}}.au-header__profile-letters{display:flex;align-items:center;justify-content:center;border-radius:50%;width:40px;height:40px;background-color:#9abcff;font-weight:500;font-family:Lexend Deca,sans-serif;color:#16181d;font-size:16px;text-transform:uppercase}.au-header__hamburger{cursor:pointer}@media (min-width: 1024px){.au-header__hamburger{display:none}}
+.au-header{height:80px;padding:16px 0;border-bottom:1px solid #e2e4e9;background-color:#fff}.au-header--fixed{position:fixed;top:0;left:0;width:100%;z-index:5}.au-header--static{position:relative}.au-header__container{width:100%;max-width:1240px;margin:0 auto;padding:0 24px}@media (min-width: 1024px){.au-header__container{padding:0 16px}}.au-header__container{height:100%;display:flex;justify-content:space-between;align-items:center;gap:16px}.au-header__logo{display:flex;align-items:center}.au-header__logo .au-text{padding-left:16px;margin-left:16px;border-left:1px solid #e2e4e9}.au-header__logo--mobile{display:block}@media (min-width: 1024px){.au-header__logo--mobile{display:none}}.au-header__logo--desktop{display:none}@media (min-width: 1024px){.au-header__logo--desktop{display:block}}.au-header__link,.au-header__button{cursor:pointer}.au-header__badges{display:flex;align-items:center}.au-header__badges>*+*{padding-left:16px;margin-left:16px;position:relative}.au-header__badges>*+*:before{content:"";height:24px;width:1px;background-color:#e2e4e9;position:absolute;left:0;top:calc(50% - 12px)}.au-header__badges .au-logo{max-width:56px}.au-header__badges .au-logo img{width:100%}.au-header__navigation{display:flex}.au-header__navigation>*+*{margin-left:24px}.au-header__navbar{color:#16181d;display:none}@media (min-width: 1024px){.au-header__navbar{display:flex;align-items:center;gap:40px}}.au-header__navbar-link{cursor:pointer;text-decoration:none}.au-header__navbar-link--is-dropdown{position:relative;display:flex;align-items:center;justify-content:center;gap:8px}.au-header__navbar-link--is-dropdown>.au-icon{transition:transform .3s ease}.au-header__navbar-link--is-dropdown:hover>.au-icon,.au-header__navbar-link--is-dropdown:focus>.au-icon{transform:rotate(-180deg)}.au-header__navbar-link--is-dropdown:hover .au-header__dropdown,.au-header__navbar-link--is-dropdown:focus .au-header__dropdown{opacity:1;visibility:visible;transform:translateY(10px)}.au-header__navbar-link--is-active,.au-header__navbar-link:hover,.au-header__navbar-link:focus{font-weight:700;letter-spacing:-.6px}.au-header__navbar-link:hover,.au-header__navbar-link:focus{color:#16181d}.au-header__navbar-link--is-active{color:#0048db}.au-header__navbar-link--is-active:hover,.au-header__navbar-link--is-active:focus{color:#0048db}.au-header__dropdown{background-color:#fff;border-radius:16px;border:1px solid #e2e4e9;box-shadow:0 2px 8px #a9b1c514,0 4px 4px #0048db0a;max-width:230px;min-width:230px;position:absolute;z-index:2;top:100%;width:100%;left:0;opacity:.2;visibility:hidden;transition:opacity .3s ease,transform .2s linear,visibility .3s ease;transform:translateY(20px)}.au-header__dropdown-link{display:inline-block;padding:16px 24px;width:100%;display:flex;text-decoration:none;justify-content:space-between}.au-header__dropdown-link--is-active,.au-header__dropdown-link:hover,.au-header__dropdown-link:focus{font-weight:700;letter-spacing:-.6px}.au-header__dropdown-link--is-active{color:#0048db;background-color:#fafbff;border-top:1px solid #e2e4e9}.au-header__actions{display:flex;align-items:center;gap:16px}@media (min-width: 1024px){.au-header__actions--divider{border-left:1px solid #e2e4e9;padding-left:24px;margin-left:24px}}.au-header__profile{display:flex;align-items:center;gap:32px}.au-header__profile-notifications{cursor:pointer}.au-header__profile-menu{display:none;align-items:center;gap:8px;cursor:pointer}@media (min-width: 1024px){.au-header__profile-menu{display:flex}}.au-header__profile-menu-mobile{display:block;cursor:pointer}@media (min-width: 1024px){.au-header__profile-menu-mobile{display:none}}.au-header__profile-letters{display:flex;align-items:center;justify-content:center;border-radius:50%;width:40px;height:40px;background-color:#9abcff;font-weight:500;font-family:Lexend Deca,sans-serif;color:#16181d;font-size:16px;text-transform:uppercase}.au-header__hamburger{cursor:pointer}@media (min-width: 1024px){.au-header__hamburger{display:none}}

package/dist/components/Header/types.d.ts

@@ -2,5 +2,6 @@ export type NavbarDataProps = {
     name: string;
     onClick?: () => void;
     active?: boolean;
+    href?: string;
     dropdown?: NavbarDataProps[];
 };

package/dist/components/NavbarVertical/index.d.ts

@@ -3,17 +3,18 @@ import { ReactNode } from 'react';
 type NavbarVerticalDataProps = {
     name: string;
     Icon?: ReactNode | string | JSX.Element | JSX.Element[];
-    onClick: () => void;
+    onClick?: () => void;
     dropdown?: NavbarVerticalDataProps[];
     active?: boolean;
+    href?: string;
 };
 type NavbarVerticalProps = {
     data: NavbarVerticalDataProps[];
-    renderItem: (link: NavbarVerticalDataProps) => ReactNode | string | JSX.Element | JSX.Element[];
+    renderItem: (link: NavbarVerticalDataProps, idx?: number) => ReactNode | string | JSX.Element | JSX.Element[];
     renderActions: () => ReactNode | string | JSX.Element | JSX.Element[];
 };
 export declare const NavbarVertical: {
     ({ data, renderItem, renderActions, }: NavbarVerticalProps): import("react/jsx-runtime").JSX.Element;
-    Link: ({ name, onClick, Icon, dropdown, active, }: NavbarVerticalDataProps) => import("react/jsx-runtime").JSX.Element;
+    Link: ({ name, onClick, Icon, dropdown, href, active, }: NavbarVerticalDataProps) => import("react/jsx-runtime").JSX.Element;
 };
 export {};

package/dist/components/NavbarVertical/index.es.js

@@ -12,8 +12,8 @@ import './styles.css';const NavbarVertical = ({
   renderActions
 }) => {
   return /* @__PURE__ */ jsxs("div", { className: "au-navbar-vertical", children: [
-    data == null ? void 0 : data.map((link) => {
-      return renderItem(link);
+    data == null ? void 0 : data.map((link, idx) => {
+      return renderItem(link, idx);
     }),
     /* @__PURE__ */ jsx("div", { className: "au-navbar-vertical__actions", children: renderActions() })
   ] });
@@ -23,20 +23,23 @@ const NavbarVerticalLink = ({
   onClick,
   Icon,
   dropdown,
+  href,
   active = false
 }) => {
   const [open, setOpen] = useState(active);
-  function handleClick() {
+  function handleClick(ev) {
     if (dropdown) {
       setOpen((prev) => !prev);
-    } else {
+    } else if (onClick) {
+      ev.preventDefault();
       onClick();
     }
   }
   return /* @__PURE__ */ jsxs(
     Text,
     {
-      as: "a",
+      as: dropdown ? "p" : "a",
+      href,
       variant: "heading-micro",
       weight: "light",
       className: classNames("au-navbar-vertical__link", {
@@ -54,20 +57,22 @@ const NavbarVerticalLink = ({
             renderIf: /* @__PURE__ */ jsxs(Fragment, { children: [
               /* @__PURE__ */ jsx(Conditional, { condition: !!open, renderIf: /* @__PURE__ */ jsx(IconChevronUp, {}) }),
               /* @__PURE__ */ jsx(Conditional, { condition: !open, renderIf: /* @__PURE__ */ jsx(IconChevronDown, {}) }),
-              /* @__PURE__ */ jsx("div", { className: "au-navbar-vertical__dropdown", children: dropdown == null ? void 0 : dropdown.map((item) => {
+              /* @__PURE__ */ jsx("div", { className: "au-navbar-vertical__dropdown", children: dropdown == null ? void 0 : dropdown.map((item, idx) => {
                 return /* @__PURE__ */ jsx(
                   Text,
                   {
                     as: "a",
+                    href: item.href,
                     variant: "heading-micro",
                     weight: "light",
                     className: classNames("au-navbar-vertical__dropdown-link", {
                       "au-navbar-vertical__dropdown-link--is-active": item.active
                     }),
                     title: item.name,
+                    onClick: item.onClick,
                     children: item.name
                   },
-                  item.name
+                  `${item.name}-${idx}`
                 );
               }) })
             ] })

package/dist/components/NavbarVertical/index.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../../../lib/components/NavbarVertical/index.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport { ReactNode, useState } from 'react'\nimport { Text } from '../Text'\nimport { IconChevronDown, IconChevronUp } from '../icons/default'\nimport { Conditional } from '../misc'\n\nimport './styles.scss'\n\ntype NavbarVerticalDataProps = {\n  name: string\n  Icon?: ReactNode | string | JSX.Element | JSX.Element[]\n  onClick: () => void\n  dropdown?: NavbarVerticalDataProps[]\n  active?: boolean\n}\n\ntype NavbarVerticalProps = {\n  data: NavbarVerticalDataProps[]\n  renderItem: (\n    link: NavbarVerticalDataProps,\n  ) => ReactNode | string | JSX.Element | JSX.Element[]\n  renderActions: () => ReactNode | string | JSX.Element | JSX.Element[]\n}\n\nexport const NavbarVertical = ({\n  data,\n  renderItem,\n  renderActions,\n}: NavbarVerticalProps) => {\n  return (\n    <div className=\"au-navbar-vertical\">\n      {data?.map((link) => {\n        return renderItem(link)\n      })}\n      <div className=\"au-navbar-vertical__actions\">{renderActions()}</div>\n    </div>\n  )\n}\n\nconst NavbarVerticalLink = ({\n  name,\n  onClick,\n  Icon,\n  dropdown,\n  active = false,\n}: NavbarVerticalDataProps) => {\n  const [open, setOpen] = useState<boolean>(active)\n\n  function handleClick() {\n    if (dropdown) {\n      setOpen((prev) => !prev)\n    } else {\n      onClick()\n    }\n  }\n\n  return (\n    <Text\n      as=\"a\"\n      variant=\"heading-micro\"\n      weight=\"light\"\n      className={classNames('au-navbar-vertical__link', {\n        [`au-navbar-vertical__link--is-active`]: active,\n        [`au-navbar-vertical__link--is-open`]: open,\n      })}\n      onClick={handleClick}>\n      <Conditional condition={!!Icon} renderIf={Icon} />\n      {name}\n\n      <Conditional\n        condition={!!dropdown?.length}\n        renderIf={\n          <>\n            <Conditional condition={!!open} renderIf={<IconChevronUp />} />\n            <Conditional condition={!open} renderIf={<IconChevronDown />} />\n            <div className=\"au-navbar-vertical__dropdown\">\n              {dropdown?.map((item) => {\n                return (\n                  <Text\n                    key={item.name}\n                    as=\"a\"\n                    variant=\"heading-micro\"\n                    weight=\"light\"\n                    className={classNames('au-navbar-vertical__dropdown-link', {\n                      'au-navbar-vertical__dropdown-link--is-active':\n                        item.active,\n                    })}\n                    title={item.name}>\n                    {item.name}\n                  </Text>\n                )\n              })}\n            </div>\n          </>\n        }\n      />\n    </Text>\n  )\n}\n\nNavbarVertical.Link = NavbarVerticalLink\n"],"names":[],"mappings":";;;;;;;;AAwBO,MAAM,iBAAiB,CAAC;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AACF,MAA2B;AAEvB,SAAA,qBAAC,OAAI,EAAA,WAAU,sBACZ,UAAA;AAAA,IAAM,6BAAA,IAAI,CAAC,SAAS;AACnB,aAAO,WAAW,IAAI;AAAA,IAAA;AAAA,IAEvB,oBAAA,OAAA,EAAI,WAAU,+BAA+B,2BAAgB;AAAA,EAChE,EAAA,CAAA;AAEJ;AAEA,MAAM,qBAAqB,CAAC;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AACX,MAA+B;AAC7B,QAAM,CAAC,MAAM,OAAO,IAAI,SAAkB,MAAM;AAEhD,WAAS,cAAc;AACrB,QAAI,UAAU;AACJ,cAAA,CAAC,SAAS,CAAC,IAAI;AAAA,IAAA,OAClB;AACG;IACV;AAAA,EACF;AAGE,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAG;AAAA,MACH,SAAQ;AAAA,MACR,QAAO;AAAA,MACP,WAAW,WAAW,4BAA4B;AAAA,QAChD,CAAC,qCAAqC,GAAG;AAAA,QACzC,CAAC,mCAAmC,GAAG;AAAA,MAAA,CACxC;AAAA,MACD,SAAS;AAAA,MACT,UAAA;AAAA,QAAA,oBAAC,eAAY,WAAW,CAAC,CAAC,MAAM,UAAU,MAAM;AAAA,QAC/C;AAAA,QAED;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,CAAC,EAAC,qCAAU;AAAA,YACvB,UAEI,qBAAA,UAAA,EAAA,UAAA;AAAA,cAAC,oBAAA,aAAA,EAAY,WAAW,CAAC,CAAC,MAAM,UAAU,oBAAC,gBAAc,CAAA,GAAI;AAAA,cAC7D,oBAAC,eAAY,WAAW,CAAC,MAAM,UAAU,oBAAC,kBAAgB,CAAA,GAAI;AAAA,kCAC7D,OAAI,EAAA,WAAU,gCACZ,UAAU,qCAAA,IAAI,CAAC,SAAS;AAErB,uBAAA;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBAEC,IAAG;AAAA,oBACH,SAAQ;AAAA,oBACR,QAAO;AAAA,oBACP,WAAW,WAAW,qCAAqC;AAAA,sBACzD,gDACE,KAAK;AAAA,oBAAA,CACR;AAAA,oBACD,OAAO,KAAK;AAAA,oBACX,UAAK,KAAA;AAAA,kBAAA;AAAA,kBATD,KAAK;AAAA,gBAAA;AAAA,cAYf,IACH;AAAA,YAAA,GACF;AAAA,UAAA;AAAA,QAEJ;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;AAEA,eAAe,OAAO;"}
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/NavbarVertical/index.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport { ReactNode, useState } from 'react'\nimport { Text } from '../Text'\nimport { IconChevronDown, IconChevronUp } from '../icons/default'\nimport { Conditional } from '../misc'\n\nimport './styles.scss'\n\ntype NavbarVerticalDataProps = {\n  name: string\n  Icon?: ReactNode | string | JSX.Element | JSX.Element[]\n  onClick?: () => void\n  dropdown?: NavbarVerticalDataProps[]\n  active?: boolean\n  href?: string\n}\n\ntype NavbarVerticalProps = {\n  data: NavbarVerticalDataProps[]\n  renderItem: (\n    link: NavbarVerticalDataProps,\n    idx?: number\n  ) => ReactNode | string | JSX.Element | JSX.Element[]\n  renderActions: () => ReactNode | string | JSX.Element | JSX.Element[]\n}\n\nexport const NavbarVertical = ({\n  data,\n  renderItem,\n  renderActions,\n}: NavbarVerticalProps) => {\n  return (\n    <div className=\"au-navbar-vertical\">\n      {data?.map((link, idx) => {\n        return renderItem(link, idx)\n      })}\n      <div className=\"au-navbar-vertical__actions\">{renderActions()}</div>\n    </div>\n  )\n}\n\nconst NavbarVerticalLink = ({\n  name,\n  onClick,\n  Icon,\n  dropdown,\n  href,\n  active = false,\n}: NavbarVerticalDataProps) => {\n  const [open, setOpen] = useState<boolean>(active)\n\n  function handleClick(ev: React.MouseEvent) {\n    if (dropdown) {\n      setOpen((prev) => !prev)\n    } else if(onClick) {\n      ev.preventDefault()\n      onClick()\n    }\n  }\n\n  return (\n    <Text\n      as={dropdown ? 'p' : 'a'}\n      href={href}\n      variant=\"heading-micro\"\n      weight=\"light\"\n      className={classNames('au-navbar-vertical__link', {\n        [`au-navbar-vertical__link--is-active`]: active,\n        [`au-navbar-vertical__link--is-open`]: open,\n      })}\n      onClick={handleClick}>\n      <Conditional condition={!!Icon} renderIf={Icon} />\n      {name}\n\n      <Conditional\n        condition={!!dropdown?.length}\n        renderIf={\n          <>\n            <Conditional condition={!!open} renderIf={<IconChevronUp />} />\n            <Conditional condition={!open} renderIf={<IconChevronDown />} />\n            <div className=\"au-navbar-vertical__dropdown\">\n              {dropdown?.map((item, idx) => {\n                return (\n                  <Text\n                    key={`${item.name}-${idx}`}\n                    as=\"a\"\n                    href={item.href}\n                    variant=\"heading-micro\"\n                    weight=\"light\"\n                    className={classNames('au-navbar-vertical__dropdown-link', {\n                      'au-navbar-vertical__dropdown-link--is-active':\n                        item.active,\n                    })}\n                    title={item.name}\n                    onClick={item.onClick}>\n                    {item.name}\n                  </Text>\n                )\n              })}\n            </div>\n          </>\n        }\n      />\n    </Text>\n  )\n}\n\nNavbarVertical.Link = NavbarVerticalLink\n"],"names":[],"mappings":";;;;;;;;AA0BO,MAAM,iBAAiB,CAAC;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AACF,MAA2B;AAEvB,SAAA,qBAAC,OAAI,EAAA,WAAU,sBACZ,UAAA;AAAA,IAAM,6BAAA,IAAI,CAAC,MAAM,QAAQ;AACjB,aAAA,WAAW,MAAM,GAAG;AAAA,IAAA;AAAA,IAE5B,oBAAA,OAAA,EAAI,WAAU,+BAA+B,2BAAgB;AAAA,EAChE,EAAA,CAAA;AAEJ;AAEA,MAAM,qBAAqB,CAAC;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AACX,MAA+B;AAC7B,QAAM,CAAC,MAAM,OAAO,IAAI,SAAkB,MAAM;AAEhD,WAAS,YAAY,IAAsB;AACzC,QAAI,UAAU;AACJ,cAAA,CAAC,SAAS,CAAC,IAAI;AAAA,eACf,SAAS;AACjB,SAAG,eAAe;AACV;IACV;AAAA,EACF;AAGE,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAI,WAAW,MAAM;AAAA,MACrB;AAAA,MACA,SAAQ;AAAA,MACR,QAAO;AAAA,MACP,WAAW,WAAW,4BAA4B;AAAA,QAChD,CAAC,qCAAqC,GAAG;AAAA,QACzC,CAAC,mCAAmC,GAAG;AAAA,MAAA,CACxC;AAAA,MACD,SAAS;AAAA,MACT,UAAA;AAAA,QAAA,oBAAC,eAAY,WAAW,CAAC,CAAC,MAAM,UAAU,MAAM;AAAA,QAC/C;AAAA,QAED;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,CAAC,EAAC,qCAAU;AAAA,YACvB,UAEI,qBAAA,UAAA,EAAA,UAAA;AAAA,cAAC,oBAAA,aAAA,EAAY,WAAW,CAAC,CAAC,MAAM,UAAU,oBAAC,gBAAc,CAAA,GAAI;AAAA,cAC7D,oBAAC,eAAY,WAAW,CAAC,MAAM,UAAU,oBAAC,kBAAgB,CAAA,GAAI;AAAA,cAC9D,oBAAC,SAAI,WAAU,gCACZ,+CAAU,IAAI,CAAC,MAAM,QAAQ;AAE1B,uBAAA;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBAEC,IAAG;AAAA,oBACH,MAAM,KAAK;AAAA,oBACX,SAAQ;AAAA,oBACR,QAAO;AAAA,oBACP,WAAW,WAAW,qCAAqC;AAAA,sBACzD,gDACE,KAAK;AAAA,oBAAA,CACR;AAAA,oBACD,OAAO,KAAK;AAAA,oBACZ,SAAS,KAAK;AAAA,oBACb,UAAK,KAAA;AAAA,kBAAA;AAAA,kBAXD,GAAG,KAAK,IAAI,IAAI,GAAG;AAAA,gBAAA;AAAA,cAc7B,IACH;AAAA,YAAA,GACF;AAAA,UAAA;AAAA,QAEJ;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;AAEA,eAAe,OAAO;"}

package/dist/components/NavbarVertical/styles.css

@@ -1 +1 @@
-.au-navbar-vertical{width:100%;background-color:#fff;height:100%;padding-bottom:100px;position:relative}.au-navbar-vertical__link{padding:16px 24px;display:flex;align-items:center;gap:16px;cursor:pointer;flex-wrap:wrap;border-bottom:1px solid #e2e4e9}.au-navbar-vertical__link:hover,.au-navbar-vertical__link:focus{font-weight:700}.au-navbar-vertical__link--is-active{background-color:#fafbff;color:#0048db;font-weight:700}.au-navbar-vertical__link--is-open .au-navbar-vertical__dropdown{display:block}.au-navbar-vertical__dropdown{display:block;width:100%;border-top:1px solid #dce8ff;padding-top:12px;display:none}.au-navbar-vertical__dropdown-link{display:block;width:100%;padding:12px 0}.au-navbar-vertical__dropdown-link:hover,.au-navbar-vertical__dropdown-link:focus{font-weight:700}.au-navbar-vertical__dropdown-link--is-active{color:#0048db;font-weight:700}.au-navbar-vertical__actions{display:flex;gap:8px;padding:24px;position:absolute;bottom:0;left:0;width:100%}.au-navbar-vertical__actions>*{flex-grow:1}
+.au-navbar-vertical{width:100%;background-color:#fff;height:100%;padding-bottom:100px;position:relative;overflow-y:scroll}.au-navbar-vertical__link{padding:16px 24px;display:flex;align-items:center;gap:16px;cursor:pointer;flex-wrap:wrap;text-decoration:none;border-bottom:1px solid #e2e4e9}.au-navbar-vertical__link:hover,.au-navbar-vertical__link:focus{font-weight:700}.au-navbar-vertical__link--is-active{background-color:#fafbff;color:#0048db;font-weight:700}.au-navbar-vertical__link--is-open .au-navbar-vertical__dropdown{display:block}.au-navbar-vertical__dropdown{display:block;width:100%;border-top:1px solid #dce8ff;padding-top:12px;display:none}.au-navbar-vertical__dropdown-link{display:block;width:100%;padding:12px 0;text-decoration:none}.au-navbar-vertical__dropdown-link:hover,.au-navbar-vertical__dropdown-link:focus{font-weight:700}.au-navbar-vertical__dropdown-link--is-active{color:#0048db;font-weight:700}.au-navbar-vertical__actions{display:flex;gap:8px;padding:24px;position:fixed;bottom:0;left:0;width:100%;background-color:#fff}.au-navbar-vertical__actions>*{flex-grow:1}@media (min-width: 600px){.au-navbar-vertical__actions{position:absolute}}

package/dist/components/Text/types.d.ts

@@ -5,6 +5,7 @@ export interface TextProps extends React.HTMLAttributes<HTMLElement> {
     as?: keyof React.ReactHTML;
     className?: string;
     color?: 'common' | 'secondary';
+    href?: string;
     variant?: TextVariant;
     variantDesk?: TextVariant;
     weight?: TextWeight;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@consumidor-positivo/aurora",
   "private": false,
-  "version": "0.0.80",
+  "version": "0.0.82",
   "type": "module",
   "main": "./dist/main.es.js",
   "modules": "./dist/main.es.js",