@veracity/vui 3.1.2 → 4.0.0-floatinguitake3.2154362

package/dist/header/headerAccount.js

@@ -12,7 +12,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 /** Disables popper's dynamic re-positioning */
 /** Displays user account information and helpful links, like settings or logout. */
 function HeaderAccount(props) {
-	const { contentProps, options = {}, sections, triggerProps, userInfo,...rest } = props;
+	const { contentProps, sections, triggerProps, userInfo, ...rest } = props;
 	const { isMobile } = useHeaderContext();
 	const styles = useStyleConfig("Header", useHeaderContext()).account;
 	const name = isObject(userInfo) ? userInfo.displayName : "";
@@ -47,7 +47,7 @@ function HeaderAccount(props) {
 				children: sections.map(({ heading, links }, index) => /* @__PURE__ */ jsxs(Fragment, { children: [
 					/* @__PURE__ */ jsx(list_default.Divider, {}),
 					heading && /* @__PURE__ */ jsx(list_default.Heading, { text: heading }),
-					links?.map(({ icon, url,...rest$1 }, index$1) => /* @__PURE__ */ jsx(list_default.Item, {
+					links?.map(({ icon, url, ...rest$1 }, index$1) => /* @__PURE__ */ jsx(list_default.Item, {
 						iconLeft: icon,
 						linkProps: { href: url },
 						...rest$1
@@ -62,5 +62,5 @@ var headerAccount_default = HeaderAccount;
 
 //#endregion
 export { HeaderAccount, headerAccount_default as default };
-globalThis.__vuiVersion__ = "3.1.2"
+globalThis.__vuiVersion__ = "4.0.0-beta.1"
 //# sourceMappingURL=headerAccount.js.map

package/dist/header/headerAccount.js.map

@@ -1 +1 @@
-{"version":3,"file":"headerAccount.js","names":["Avatar","HeaderAccountUserInfo","List","rest","index"],"sources":["../../src/header/headerAccount.tsx"],"sourcesContent":["import { Fragment } from 'react'\n\nimport Avatar from '../avatar'\nimport { useStyleConfig } from '../core'\nimport List from '../list'\nimport Popover from '../popover'\nimport { isJsx, isObject } from '../utils'\nimport { useHeaderContext } from './context'\nimport type { HeaderAccountProps, HeaderAccountUserInfoData } from './headerAccount.types'\nimport HeaderAccountUserInfo from './headerAccountUserInfo'\n\n/** Disables popper's dynamic re-positioning */\n\n/** Displays user account information and helpful links, like settings or logout. */\nexport function HeaderAccount(props: HeaderAccountProps) {\n  const { contentProps, options = {}, sections, triggerProps, userInfo, ...rest } = props\n  const { isMobile } = useHeaderContext()\n  const styles = useStyleConfig('Header', useHeaderContext()).account\n  const name = isObject<HeaderAccountUserInfoData>(userInfo) ? userInfo.displayName : ''\n  const variant = styles?.trigger?.variant ?? 'solidDarkBlue'\n  const offsetX = isMobile ? 64 : 39\n\n  return (\n    <Popover isLazy={false} offset={[offsetX, 16]} placement=\"bottom-end\" {...rest}>\n      <Popover.Trigger\n        as={Avatar}\n        className=\"vui-headerAccountTrigger\"\n        isInteractive\n        ml={1}\n        name={name}\n        role=\"button\"\n        size=\"lg\"\n        title=\"Account\"\n        variant={variant}\n        {...styles.trigger}\n        {...triggerProps}\n      />\n\n      <Popover.Content\n        borderRadius={0}\n        className=\"vui-headerAccountContent\"\n        column\n        {...styles.content}\n        w={isMobile ? 280 : 320}\n        {...contentProps}\n      >\n        {isJsx(userInfo) ? userInfo : userInfo && <HeaderAccountUserInfo {...userInfo} />}\n\n        {isJsx(sections)\n          ? sections\n          : sections && (\n              <List className=\"vui-headerAccountList\" mb={2}>\n                {sections.map(({ heading, links }, index) => (\n                  <Fragment key={index}>\n                    <List.Divider />\n\n                    {heading && <List.Heading text={heading} />}\n\n                    {links?.map(({ icon, url, ...rest }, index) => (\n                      <List.Item iconLeft={icon} key={index} linkProps={{ href: url }} {...rest} />\n                    ))}\n                  </Fragment>\n                ))}\n              </List>\n            )}\n      </Popover.Content>\n    </Popover>\n  )\n}\n\nHeaderAccount.displayName = 'HeaderAccount'\n\nexport default HeaderAccount\n"],"mappings":";;;;;;;;;;;;;AAcA,SAAgB,cAAc,OAA2B;CACvD,MAAM,EAAE,cAAc,UAAU,EAAE,EAAE,UAAU,cAAc,SAAU,GAAG,SAAS;CAClF,MAAM,EAAE,aAAa,kBAAkB;CACvC,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC,CAAC;CAC5D,MAAM,OAAO,SAAoC,SAAS,GAAG,SAAS,cAAc;CACpF,MAAM,UAAU,QAAQ,SAAS,WAAW;AAG5C,QACE,qBAAC;EAAQ,QAAQ;EAAO,QAAQ,CAHlB,WAAW,KAAK,IAGY,GAAG;EAAE,WAAU;EAAa,GAAI;aACxE,oBAAC,QAAQ;GACP,IAAIA;GACJ,WAAU;GACV;GACA,IAAI;GACE;GACN,MAAK;GACL,MAAK;GACL,OAAM;GACG;GACT,GAAI,OAAO;GACX,GAAI;IACJ,EAEF,qBAAC,QAAQ;GACP,cAAc;GACd,WAAU;GACV;GACA,GAAI,OAAO;GACX,GAAG,WAAW,MAAM;GACpB,GAAI;cAEH,MAAM,SAAS,GAAG,WAAW,YAAY,oBAACC,iCAAsB,GAAI,WAAY,EAEhF,MAAM,SAAS,GACZ,WACA,YACE,oBAACC;IAAK,WAAU;IAAwB,IAAI;cACzC,SAAS,KAAK,EAAE,SAAS,SAAS,UACjC,qBAAC;KACC,oBAACA,aAAK,YAAU;KAEf,WAAW,oBAACA,aAAK,WAAQ,MAAM,UAAW;KAE1C,OAAO,KAAK,EAAE,MAAM,IAAK,GAAGC,UAAQ,YACnC,oBAACD,aAAK;MAAK,UAAU;MAAkB,WAAW,EAAE,MAAM,KAAK;MAAE,GAAIC;QAArCC,QAA6C,CAC7E;SAPW,MAQJ,CACX;KACG;IAEG;GACV;;AAId,cAAc,cAAc;AAE5B,4BAAe"}
+{"version":3,"file":"headerAccount.js","names":["Avatar","HeaderAccountUserInfo","List","rest","index"],"sources":["../../src/header/headerAccount.tsx"],"sourcesContent":["import { Fragment } from 'react'\n\nimport Avatar from '../avatar'\nimport { useStyleConfig } from '../core'\nimport List from '../list'\nimport Popover from '../popover'\nimport { isJsx, isObject } from '../utils'\nimport { useHeaderContext } from './context'\nimport type { HeaderAccountProps, HeaderAccountUserInfoData } from './headerAccount.types'\nimport HeaderAccountUserInfo from './headerAccountUserInfo'\n\n/** Disables popper's dynamic re-positioning */\n\n/** Displays user account information and helpful links, like settings or logout. */\nexport function HeaderAccount(props: HeaderAccountProps) {\n  const { contentProps, sections, triggerProps, userInfo, ...rest } = props\n  const { isMobile } = useHeaderContext()\n  const styles = useStyleConfig('Header', useHeaderContext()).account\n  const name = isObject<HeaderAccountUserInfoData>(userInfo) ? userInfo.displayName : ''\n  const variant = styles?.trigger?.variant ?? 'solidDarkBlue'\n  const offsetX = isMobile ? 64 : 39\n\n  return (\n    <Popover isLazy={false} offset={[offsetX, 16]} placement=\"bottom-end\" {...rest}>\n      <Popover.Trigger\n        as={Avatar}\n        className=\"vui-headerAccountTrigger\"\n        isInteractive\n        ml={1}\n        name={name}\n        role=\"button\"\n        size=\"lg\"\n        title=\"Account\"\n        variant={variant}\n        {...styles.trigger}\n        {...triggerProps}\n      />\n\n      <Popover.Content\n        borderRadius={0}\n        className=\"vui-headerAccountContent\"\n        column\n        {...styles.content}\n        w={isMobile ? 280 : 320}\n        {...contentProps}\n      >\n        {isJsx(userInfo) ? userInfo : userInfo && <HeaderAccountUserInfo {...userInfo} />}\n\n        {isJsx(sections)\n          ? sections\n          : sections && (\n              <List className=\"vui-headerAccountList\" mb={2}>\n                {sections.map(({ heading, links }, index) => (\n                  <Fragment key={index}>\n                    <List.Divider />\n\n                    {heading && <List.Heading text={heading} />}\n\n                    {links?.map(({ icon, url, ...rest }, index) => (\n                      <List.Item iconLeft={icon} key={index} linkProps={{ href: url }} {...rest} />\n                    ))}\n                  </Fragment>\n                ))}\n              </List>\n            )}\n      </Popover.Content>\n    </Popover>\n  )\n}\n\nHeaderAccount.displayName = 'HeaderAccount'\n\nexport default HeaderAccount\n"],"mappings":";;;;;;;;;;;;;AAcA,SAAgB,cAAc,OAA2B;CACvD,MAAM,EAAE,cAAc,UAAU,cAAc,UAAU,GAAG,SAAS;CACpE,MAAM,EAAE,aAAa,kBAAkB;CACvC,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC,CAAC;CAC5D,MAAM,OAAO,SAAoC,SAAS,GAAG,SAAS,cAAc;CACpF,MAAM,UAAU,QAAQ,SAAS,WAAW;AAG5C,QACE,qBAAC;EAAQ,QAAQ;EAAO,QAAQ,CAHlB,WAAW,KAAK,IAGY,GAAG;EAAE,WAAU;EAAa,GAAI;aACxE,oBAAC,QAAQ;GACP,IAAIA;GACJ,WAAU;GACV;GACA,IAAI;GACE;GACN,MAAK;GACL,MAAK;GACL,OAAM;GACG;GACT,GAAI,OAAO;GACX,GAAI;IACJ,EAEF,qBAAC,QAAQ;GACP,cAAc;GACd,WAAU;GACV;GACA,GAAI,OAAO;GACX,GAAG,WAAW,MAAM;GACpB,GAAI;cAEH,MAAM,SAAS,GAAG,WAAW,YAAY,oBAACC,iCAAsB,GAAI,WAAY,EAEhF,MAAM,SAAS,GACZ,WACA,YACE,oBAACC;IAAK,WAAU;IAAwB,IAAI;cACzC,SAAS,KAAK,EAAE,SAAS,SAAS,UACjC,qBAAC;KACC,oBAACA,aAAK,YAAU;KAEf,WAAW,oBAACA,aAAK,WAAQ,MAAM,UAAW;KAE1C,OAAO,KAAK,EAAE,MAAM,KAAK,GAAGC,UAAQ,YACnC,oBAACD,aAAK;MAAK,UAAU;MAAkB,WAAW,EAAE,MAAM,KAAK;MAAE,GAAIC;QAArCC,QAA6C,CAC7E;SAPW,MAQJ,CACX;KACG;IAEG;GACV;;AAId,cAAc,cAAc;AAE5B,4BAAe"}

package/dist/header/headerAccount.types.d.ts

@@ -42,4 +42,5 @@ type HeaderAccountUserInfoData = {
 type HeaderAccountUserInfoProps = BoxProps & HeaderAccountUserInfoData;
 //#endregion
 export { HeaderAccountData, HeaderAccountProps, HeaderAccountSectionData, HeaderAccountUserInfoData, HeaderAccountUserInfoProps };
+
 //# sourceMappingURL=headerAccount.types.d.ts.map

package/dist/header/headerAccount.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"headerAccount.types.d.ts","names":[],"sources":["../../src/header/headerAccount.types.ts"],"sourcesContent":[],"mappings":";;;;;;;;;;;;KAOY,iBAAA,CAAA,CAAA;aACC;aACA;;KAGD,kBAAA,CAAA,CAAA,CAAqB;EALrB,CAAA,CAAA,CAAA,CAAA,QAAA,CAAA,GAAA,CAAA,QAAA,CAAA,GAAA,CAAA,IAAA,CAAA,SAAA,CAAA,CAAA,CAAA;EAKA,QAAA,CAAA,CAAA,CAAA,KAAA;EAAqB,CAAA,CAAA,CAAA,CAAA,KAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,CAAA,GAAA,CAAA,cAAA,CAAA,SAAA,CAAA,CAAA,CAAA;EAIhB,YAAA,CAAA,CAAA,CAAA,mBAAA;EAEJ,CAAA,CAAA,CAAA,CAAA,MAAA,CAAA,GAAA,CAAA,CAAA,CAAA,GAAA,CAAA,EAAA,CAAA,IAAA,CAAA,QAAA,CAAA,KAAA,CAAA,IAAA,CAAA,WAAA,CAAA,CAAA,CAAA;EAAgC,QAAI,CAAA,CAAA,CAApC,iBAAoC,CAAA,CAAA,QAAA,CAAA,CAAA,CAAA,CAAA,CAAJ,GAAA,CAAI,OAAA;EAEjB,CAAA,CAAA,CAAA,CAAA,KAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,CAAA,GAAA,CAAA,cAAA,CAAA,SAAA,CAAA,CAAA,CAAA;EAAqB,YAAA,CAAA,CAAA,CAApC,cAAoC,CAArB,mBAAqB,CAAA,CAAA,WAAA,CAAA;EAApC,CAAA,CAAA,CAAA,CAAA,MAAA,CAAA,GAAA,CAAA,IAAA,CAAA,WAAA,CAAA,EAAA,CAAA,GAAA,CAAA,EAAA,CAAA,GAAA,CAAA,OAAA,CAAA,OAAA,CAAA,CAAA,CAAA;EAEJ,QAAA,CAAA,CAAA,CAAA,iBAAA,CAAA,CAAA,QAAA,CAAA,CAAA,CAAA,CAAA,CAAgC,GAAA,CAAI,OAApC;CAAgC;;AAIjC,IAAA,CAAA,wBAAA,CAAA,CAAA,CAAwB;EAKxB,OAAA,CAAA,CAAA,CAAA,MAAA;EASA,KAAA,CAAA,CAAA,CAZF,cAYE,CAAA,CAAA;;KATA,yBAAA,CAAA,CAAA;;;;;;;;KASA,0BAAA,CAAA,CAAA,CAA6B,WAAW"}
+{"version":3,"file":"headerAccount.types.d.ts","names":[],"sources":["../../src/header/headerAccount.types.ts"],"sourcesContent":[],"mappings":";;;;;;;;;;;;KAOY,iBAAA;aACC;aACA;;KAGD,kBAAA,GAAqB;EALrB;EAKA,QAAA,CAAA,EAAA,KAAA;EAAqB;EAIhB,YAAA,CAAA,EAAA,mBAAA;EAEJ;EAAgC,QAAI,CAAA,EAApC,iBAAoC,CAAA,UAAA,CAAA,GAAJ,GAAA,CAAI,OAAA;EAEjB;EAAqB,YAAA,CAAA,EAApC,cAAoC,CAArB,mBAAqB,EAAA,WAAA,CAAA;EAApC;EAEJ,QAAA,CAAA,EAAA,iBAAA,CAAA,UAAA,CAAA,GAAgC,GAAA,CAAI,OAApC;CAAgC;;AAIjC,KAAA,wBAAA,GAAwB;EAKxB,OAAA,CAAA,EAAA,MAAA;EASA,KAAA,CAAA,EAZF,cAYE,EAAA;;KATA,yBAAA;;;;;;;;KASA,0BAAA,GAA6B,WAAW"}

package/dist/header/headerAccountUserInfo.d.ts

@@ -7,4 +7,5 @@ import "../index.js";
 declare const HeaderAccountUserInfo: VuiComponent<"div", HeaderAccountUserInfoProps>;
 //#endregion
 export { HeaderAccountUserInfo };
+
 //# sourceMappingURL=headerAccountUserInfo.d.ts.map

package/dist/header/headerAccountUserInfo.js

@@ -10,7 +10,7 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 //#region src/header/headerAccountUserInfo.tsx
 /** Displays user information, like username and company name, within HeaderAccount part. */
 const HeaderAccountUserInfo = vui((props, ref) => {
-	const { children, className, color, companyName, displayName, isApplication, role,...rest } = props;
+	const { children, className, color, companyName, displayName, isApplication, role, ...rest } = props;
 	const styles = useStyleConfig("Header", useHeaderContext());
 	const localColor = color || styles.accountUserInfo.color || "darkBlue.main";
 	return /* @__PURE__ */ jsx(box_default, {
@@ -68,5 +68,5 @@ var headerAccountUserInfo_default = HeaderAccountUserInfo;
 
 //#endregion
 export { HeaderAccountUserInfo, headerAccountUserInfo_default as default };
-globalThis.__vuiVersion__ = "3.1.2"
+globalThis.__vuiVersion__ = "4.0.0-beta.1"
 //# sourceMappingURL=headerAccountUserInfo.js.map

package/dist/header/headerAccountUserInfo.js.map

@@ -1 +1 @@
-{"version":3,"file":"headerAccountUserInfo.js","names":["Box","Avatar","T"],"sources":["../../src/header/headerAccountUserInfo.tsx"],"sourcesContent":["import Avatar from '../avatar'\nimport Box from '../box'\nimport { useStyleConfig, vui } from '../core'\nimport T from '../t'\nimport { cs } from '../utils'\nimport { useHeaderContext } from './context'\nimport type { HeaderAccountUserInfoProps } from './headerAccount.types'\n\n/** Displays user information, like username and company name, within HeaderAccount part. */\nexport const HeaderAccountUserInfo = vui<'div', HeaderAccountUserInfoProps>((props, ref) => {\n  const { children, className, color, companyName, displayName, isApplication, role, ...rest } = props\n  const styles = useStyleConfig('Header', useHeaderContext())\n  const localColor = color || styles.accountUserInfo.color || 'darkBlue.main'\n\n  return (\n    <Box\n      className={cs('vui-headerAccountUserInfo', className)}\n      p={2}\n      pb={1}\n      ref={ref}\n      spaceX={2}\n      {...styles.accountUserInfo}\n      {...rest}\n      lineHeight={isApplication ? '18px' : 'inherit'}\n      pr={isApplication ? 0 : 'inherit'}\n      textAlign={isApplication ? 'right' : 'inherit'}\n    >\n      {children ?? (\n        <>\n          {!isApplication && (\n            <Avatar className=\"vui-headerAccountUserInfoAvatar\" name={displayName} size=\"xl\" variant=\"solidDarkBlue\" />\n          )}\n          <Box column rowGap={role ? 0 : 0.5}>\n            {displayName && (\n              <T\n                color={localColor}\n                fontSize={isApplication ? '12px' : 'inherit'}\n                isTruncated\n                pr={1}\n                title={displayName}\n                weight=\"demi\"\n              >\n                {displayName}\n              </T>\n            )}\n            {companyName && (\n              <T\n                color={localColor}\n                fontSize={isApplication ? '12px' : 'inherit'}\n                isTruncated\n                pr={1}\n                title={companyName}\n              >\n                {companyName}\n              </T>\n            )}\n            {role && (\n              <T\n                color={localColor}\n                fontSize={isApplication ? '12px' : 'inherit'}\n                isTruncated\n                opacity={0.65}\n                pr={1}\n                title={role}\n              >\n                {role}\n              </T>\n            )}\n          </Box>\n        </>\n      )}\n    </Box>\n  )\n})\n\nHeaderAccountUserInfo.displayName = 'HeaderAccountUserInfo'\n\nexport default HeaderAccountUserInfo\n"],"mappings":";;;;;;;;;;;AASA,MAAa,wBAAwB,KAAwC,OAAO,QAAQ;CAC1F,MAAM,EAAE,UAAU,WAAW,OAAO,aAAa,aAAa,eAAe,KAAM,GAAG,SAAS;CAC/F,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC;CAC3D,MAAM,aAAa,SAAS,OAAO,gBAAgB,SAAS;AAE5D,QACE,oBAACA;EACC,WAAW,GAAG,6BAA6B,UAAU;EACrD,GAAG;EACH,IAAI;EACC;EACL,QAAQ;EACR,GAAI,OAAO;EACX,GAAI;EACJ,YAAY,gBAAgB,SAAS;EACrC,IAAI,gBAAgB,IAAI;EACxB,WAAW,gBAAgB,UAAU;YAEpC,YACC,4CACG,CAAC,iBACA,oBAACC;GAAO,WAAU;GAAkC,MAAM;GAAa,MAAK;GAAK,SAAQ;IAAkB,EAE7G,qBAACD;GAAI;GAAO,QAAQ,OAAO,IAAI;;IAC5B,eACC,oBAACE;KACC,OAAO;KACP,UAAU,gBAAgB,SAAS;KACnC;KACA,IAAI;KACJ,OAAO;KACP,QAAO;eAEN;MACC;IAEL,eACC,oBAACA;KACC,OAAO;KACP,UAAU,gBAAgB,SAAS;KACnC;KACA,IAAI;KACJ,OAAO;eAEN;MACC;IAEL,QACC,oBAACA;KACC,OAAO;KACP,UAAU,gBAAgB,SAAS;KACnC;KACA,SAAS;KACT,IAAI;KACJ,OAAO;eAEN;MACC;;IAEF,IACL;GAED;EAER;AAEF,sBAAsB,cAAc;AAEpC,oCAAe"}
+{"version":3,"file":"headerAccountUserInfo.js","names":["Box","Avatar","T"],"sources":["../../src/header/headerAccountUserInfo.tsx"],"sourcesContent":["import Avatar from '../avatar'\nimport Box from '../box'\nimport { useStyleConfig, vui } from '../core'\nimport T from '../t'\nimport { cs } from '../utils'\nimport { useHeaderContext } from './context'\nimport type { HeaderAccountUserInfoProps } from './headerAccount.types'\n\n/** Displays user information, like username and company name, within HeaderAccount part. */\nexport const HeaderAccountUserInfo = vui<'div', HeaderAccountUserInfoProps>((props, ref) => {\n  const { children, className, color, companyName, displayName, isApplication, role, ...rest } = props\n  const styles = useStyleConfig('Header', useHeaderContext())\n  const localColor = color || styles.accountUserInfo.color || 'darkBlue.main'\n\n  return (\n    <Box\n      className={cs('vui-headerAccountUserInfo', className)}\n      p={2}\n      pb={1}\n      ref={ref}\n      spaceX={2}\n      {...styles.accountUserInfo}\n      {...rest}\n      lineHeight={isApplication ? '18px' : 'inherit'}\n      pr={isApplication ? 0 : 'inherit'}\n      textAlign={isApplication ? 'right' : 'inherit'}\n    >\n      {children ?? (\n        <>\n          {!isApplication && (\n            <Avatar className=\"vui-headerAccountUserInfoAvatar\" name={displayName} size=\"xl\" variant=\"solidDarkBlue\" />\n          )}\n          <Box column rowGap={role ? 0 : 0.5}>\n            {displayName && (\n              <T\n                color={localColor}\n                fontSize={isApplication ? '12px' : 'inherit'}\n                isTruncated\n                pr={1}\n                title={displayName}\n                weight=\"demi\"\n              >\n                {displayName}\n              </T>\n            )}\n            {companyName && (\n              <T\n                color={localColor}\n                fontSize={isApplication ? '12px' : 'inherit'}\n                isTruncated\n                pr={1}\n                title={companyName}\n              >\n                {companyName}\n              </T>\n            )}\n            {role && (\n              <T\n                color={localColor}\n                fontSize={isApplication ? '12px' : 'inherit'}\n                isTruncated\n                opacity={0.65}\n                pr={1}\n                title={role}\n              >\n                {role}\n              </T>\n            )}\n          </Box>\n        </>\n      )}\n    </Box>\n  )\n})\n\nHeaderAccountUserInfo.displayName = 'HeaderAccountUserInfo'\n\nexport default HeaderAccountUserInfo\n"],"mappings":";;;;;;;;;;;AASA,MAAa,wBAAwB,KAAwC,OAAO,QAAQ;CAC1F,MAAM,EAAE,UAAU,WAAW,OAAO,aAAa,aAAa,eAAe,MAAM,GAAG,SAAS;CAC/F,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC;CAC3D,MAAM,aAAa,SAAS,OAAO,gBAAgB,SAAS;AAE5D,QACE,oBAACA;EACC,WAAW,GAAG,6BAA6B,UAAU;EACrD,GAAG;EACH,IAAI;EACC;EACL,QAAQ;EACR,GAAI,OAAO;EACX,GAAI;EACJ,YAAY,gBAAgB,SAAS;EACrC,IAAI,gBAAgB,IAAI;EACxB,WAAW,gBAAgB,UAAU;YAEpC,YACC,4CACG,CAAC,iBACA,oBAACC;GAAO,WAAU;GAAkC,MAAM;GAAa,MAAK;GAAK,SAAQ;IAAkB,EAE7G,qBAACD;GAAI;GAAO,QAAQ,OAAO,IAAI;;IAC5B,eACC,oBAACE;KACC,OAAO;KACP,UAAU,gBAAgB,SAAS;KACnC;KACA,IAAI;KACJ,OAAO;KACP,QAAO;eAEN;MACC;IAEL,eACC,oBAACA;KACC,OAAO;KACP,UAAU,gBAAgB,SAAS;KACnC;KACA,IAAI;KACJ,OAAO;eAEN;MACC;IAEL,QACC,oBAACA;KACC,OAAO;KACP,UAAU,gBAAgB,SAAS;KACnC;KACA,SAAS;KACT,IAAI;KACJ,OAAO;eAEN;MACC;;IAEF,IACL;GAED;EAER;AAEF,sBAAsB,cAAc;AAEpC,oCAAe"}

package/dist/header/headerApplicationName.d.ts

@@ -31,4 +31,5 @@ declare const HeaderApplicationName: VuiComponent<"div", AnimationProps & Backgr
 }>;
 //#endregion
 export { HeaderApplicationName };
+
 //# sourceMappingURL=headerApplicationName.d.ts.map

package/dist/header/headerApplicationName.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"headerApplicationName.d.ts","names":[],"sources":["../../src/header/headerApplicationName.tsx"],"sourcesContent":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;cAOa,2CA+BX,cAAA,CAAA,CAAA,CA/BgC,oBAAA,CAAA,CAAA,CAAA,WAAA,CAAA,CAAA,CAAA,cAAA,CAAA,CAAA,CAAA,gBAAA,CAAA,CAAA,CAAA,iBAAA,CAAA,CAAA,CAAA,eAAA,CAAA,CAAA,CAAA,gBAAA,CAAA,CAAA,CAAA,mBAAA,CAAA,CAAA,CAAA,qBAAA,CAAA,CAAA,CAAA,sBAAA,CAAA,CAAA,CAAA,oBAAA,CAAA,CAAA,CAAA,gBAAA,CAAA,CAAA,CAAA,mBAAA,CAAA,CAAA,CAAA,qBAAA,CAAA,CAAA,CAAA,sBAAA,CAAA,CAAA,CAAA,oBAAA,CAAA,CAAA,CAAA,gBAAA,CAAA,CAAA,CAAA,iBAAA,CAAA,CAAA,CAAA,YAAA,CAAA,CAAA,CAAA,iBAAA,CAAA,CAAA,CAAA,iBAAA,CAAA,CAAA,CAAA,iBAAA,CAAA,CAAA,CAAA,YAAA,CAAA,CAAA,CAAA,YAAA,CAAA,CAAA,CAAA,mBAAA,CAAA,CAAA,CAAA,mBAAA,CAAA,CAAA,CAAA,gBAAA,CAAA,CAAA,CAAA,gBAAA,CAAA,CAAA,CAAA,SAAA,CAAA,CAAA,CAAA,cAAA,CAAA,CAAA,CAAA,YAAA,CAAA,CAAA,CAAA,cAAA,CAAA,CAAA,CAAA,eAAA,CAAA,CAAA,CAAA,YAAA,CAAA,CAAA,CAAA,eAAA,CAAA,CAAA,CAAA,iBAAA,CAAA,CAAA,CAAA,mBAAA,CAAA,CAAA,CAAA,iBAAA,CAAA,CAAA,CAAA,aAAA,CAAA,CAAA,CAAA,aAAA,CAAA,CAAA,CAAA,eAAA,CAAA,CAAA,CAAA,cAAA,CAAA,CAAA,CAAA,kBAAA,CAAA,CAAA,CAAA,SAAA,CAAA,CAAA,CAAA,gBAAA,CAAA,CAAA,CAAA,cAAA,CAAA,CAAA,CAAA,UAAA,CAAA,CAAA,CAAA,QAAA,CAAA,CAAA,CAAA,QAAA,CAAA,CAAA,CAAA,QAAA,CAAA,CAAA,CAAA,cAAA,CAAA,CAAA,CAAA,WAAA,CAAA,CAAA,CAAA,eAAA,CAAA,CAAA,CAAA,YAAA,CAAA,CAAA,CAAA,iBAAA,CAAA,CAAA,CAAA,oBAAA,CAAA,CAAA,CAAA,iBAAA,CAAA,CAAA,CAAA,wBAAA,CAAA,CAAA,CAAA,qBAAA,CAAA,CAAA,CAAA,sBAAA,CAAA,CAAA,CAAA,aAAA,CAAA,CAAA,CAAA,eAAA,CAAA,CAAA,CAAA,WAAA,CAAA,CAAA,CAAA,kBAAA,CAAA,CAAA,CAAA,WAAA,CAAA,CAAA,CAAA,eAAA,CAAA,CAAA,CAAA,gBAAA,CAAA,CAAA,CAAA,UAAA,CAAA,CAAA,CAAA,cAAA,CAAA,CAAA,CAAA,aAAA,CAAA,CAAA,CAAA,cAAA,CAAA,CAAA,CAAA,cAAA,CAAA,CAAA,CAAA,aAAA,CAAA,CAAA,CAAA,WAAA,CAAA,CAAA,CAAA,QAAA,CAAA,CAAA,CAAA,UAAA,CAAA,CAAA,CAAA,WAAA,CAAA,CAAA,CAAA,SAAA,CAAA,CAAA,CAAA,eAAA,CAAA,CAAA,CAAA,uBAAA,CAAA,CAAA,CAAA,cAAA,CAAA,CAAA,CAAA,aAAA,CAAA,CAAA,CAAA,UAAA,CAAA,CAAA,CAAA,WAAA,CAAA,CAAA,CAAA,aAAA,CAAA,CAAA,CAAA,cAAA,CAAA,CAAA,CAAA,aAAA,CAAA,CAAA,CAAA,cAAA,CAAA,CAAA,CAAA,WAAA,CAAA,CAAA,CAAA,cAAA,CAAA,CAAA,CAAA,gBAAA,CAAA,CAAA,CAAA,iBAAA,CAAA,CAAA,CAAA,eAAA,CAAA,CAAA,CAAA,YAAA,CAAA,CAAA,CAAA,YAAA,CAAA,CAAA,CAAA,YAAA,CAAA,CAAA,CAAA,eAAA,CAAA,CAAA,CAAA,iBAAA,CAAA,CAAA,CAAA,kBAAA,CAAA,CAAA,CAAA,gBAAA,CAAA,CAAA,CAAA,aAAA,CAAA,CAAA,CAAA,aAAA,CAAA,CAAA,CAAA,WAAA,CAAA,CAAA,CAAA,WAAA,CAAA,CAAA,CAAA,kBAAA,CAAA,CAAA,CAAA,kBAAA,CAAA,CAAA,CAAA,mBAAA,CAAA,CAAA,CAAA,gBAAA,CAAA,CAAA,CAAA,cAAA,CAAA,CAAA,CAAA,oBAAA,CAAA,CAAA,CAAA,eAAA,CAAA,CAAA,CAAA,eAAA,CAAA,CAAA,CAAA,WAAA,CAAA,CAAA,CAAA,UAAA,CAAA,CAAA,CAAA,UAAA,CAAA,CAAA,CAAA,UAAA,CAAA,CAAA,CAAA,WAAA,CAAA,CAAA,CAAA,WAAA,CAAA,CAAA,CAAA,eAAA,CAAA,CAAA,CAAA,uBAAA,CAAA,CAAA,CAAA,uBAAA,CAAA,CAAA,CAAA,6BAAA,CAAA,CAAA,CAAA,oBAAA,CAAA,CAAA,CAAA,eAAA,CAAA,CAAA,CAAA,aAAA,CAAA,CAAA,CAAA,cAAA,CAAA,CAAA,CAAA,eAAA,CAAA,CAAA,CAAA,eAAA,CAAA,CAAA,CAAA,UAAA,CAAA,CAAA,CAAA,kBAAA,CAAA,CAAA,CAAA,mBAAA,CAAA,CAAA,CAAA,cAAA,CAAA,CAAA,CAAA,kBAAA,CAAA,CAAA,CAAA,kBAAA,CAAA,CAAA,CAAA,eAAA,CAAA,CAAA,CAAA,iBAAA,CAAA,CAAA,CAAA,kBAAA,CAAA,CAAA,CAAA,sBAAA,CAAA,CAAA,CAAA,cAAA,CAAA,CAAA,CAAA;UAAA,eAAA"}
+{"version":3,"file":"headerApplicationName.d.ts","names":[],"sources":["../../src/header/headerApplicationName.tsx"],"sourcesContent":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;cAOa,2CA+BX,cAAA,GA/BgC,oBAAA,GAAA,WAAA,GAAA,cAAA,GAAA,gBAAA,GAAA,iBAAA,GAAA,eAAA,GAAA,gBAAA,GAAA,mBAAA,GAAA,qBAAA,GAAA,sBAAA,GAAA,oBAAA,GAAA,gBAAA,GAAA,mBAAA,GAAA,qBAAA,GAAA,sBAAA,GAAA,oBAAA,GAAA,gBAAA,GAAA,iBAAA,GAAA,YAAA,GAAA,iBAAA,GAAA,iBAAA,GAAA,iBAAA,GAAA,YAAA,GAAA,YAAA,GAAA,mBAAA,GAAA,mBAAA,GAAA,gBAAA,GAAA,gBAAA,GAAA,SAAA,GAAA,cAAA,GAAA,YAAA,GAAA,cAAA,GAAA,eAAA,GAAA,YAAA,GAAA,eAAA,GAAA,iBAAA,GAAA,mBAAA,GAAA,iBAAA,GAAA,aAAA,GAAA,aAAA,GAAA,eAAA,GAAA,cAAA,GAAA,kBAAA,GAAA,SAAA,GAAA,gBAAA,GAAA,cAAA,GAAA,UAAA,GAAA,QAAA,GAAA,QAAA,GAAA,QAAA,GAAA,cAAA,GAAA,WAAA,GAAA,eAAA,GAAA,YAAA,GAAA,iBAAA,GAAA,oBAAA,GAAA,iBAAA,GAAA,wBAAA,GAAA,qBAAA,GAAA,sBAAA,GAAA,aAAA,GAAA,eAAA,GAAA,WAAA,GAAA,kBAAA,GAAA,WAAA,GAAA,eAAA,GAAA,gBAAA,GAAA,UAAA,GAAA,cAAA,GAAA,aAAA,GAAA,cAAA,GAAA,cAAA,GAAA,aAAA,GAAA,WAAA,GAAA,QAAA,GAAA,UAAA,GAAA,WAAA,GAAA,SAAA,GAAA,eAAA,GAAA,uBAAA,GAAA,cAAA,GAAA,aAAA,GAAA,UAAA,GAAA,WAAA,GAAA,aAAA,GAAA,cAAA,GAAA,aAAA,GAAA,cAAA,GAAA,WAAA,GAAA,cAAA,GAAA,gBAAA,GAAA,iBAAA,GAAA,eAAA,GAAA,YAAA,GAAA,YAAA,GAAA,YAAA,GAAA,eAAA,GAAA,iBAAA,GAAA,kBAAA,GAAA,gBAAA,GAAA,aAAA,GAAA,aAAA,GAAA,WAAA,GAAA,WAAA,GAAA,kBAAA,GAAA,kBAAA,GAAA,mBAAA,GAAA,gBAAA,GAAA,cAAA,GAAA,oBAAA,GAAA,eAAA,GAAA,eAAA,GAAA,WAAA,GAAA,UAAA,GAAA,UAAA,GAAA,UAAA,GAAA,WAAA,GAAA,WAAA,GAAA,eAAA,GAAA,uBAAA,GAAA,uBAAA,GAAA,6BAAA,GAAA,oBAAA,GAAA,eAAA,GAAA,aAAA,GAAA,cAAA,GAAA,eAAA,GAAA,eAAA,GAAA,UAAA,GAAA,kBAAA,GAAA,mBAAA,GAAA,cAAA,GAAA,kBAAA,GAAA,kBAAA,GAAA,eAAA,GAAA,iBAAA,GAAA,kBAAA,GAAA,sBAAA,GAAA,cAAA,GAAA;UAAA,eAAA"}

package/dist/header/headerApplicationName.js

@@ -8,7 +8,7 @@ import { jsx } from "react/jsx-runtime";
 //#region src/header/headerApplicationName.tsx
 /** Logo displayed in the left corner of the Header. */
 const HeaderApplicationName = vui((props, ref) => {
-	const { color, title, url,...rest } = props;
+	const { color, title, url, ...rest } = props;
 	const isTablet = useUp("md");
 	const additionalClassName = isTablet ? "vui-headerApplicationNameTablet" : "vui-headerApplicationNameMobile";
 	const mobileProps = {
@@ -41,5 +41,5 @@ var headerApplicationName_default = HeaderApplicationName;
 
 //#endregion
 export { HeaderApplicationName, headerApplicationName_default as default };
-globalThis.__vuiVersion__ = "3.1.2"
+globalThis.__vuiVersion__ = "4.0.0-beta.1"
 //# sourceMappingURL=headerApplicationName.js.map

package/dist/header/headerApplicationName.js.map

@@ -1 +1 @@
-{"version":3,"file":"headerApplicationName.js","names":[],"sources":["../../src/header/headerApplicationName.tsx"],"sourcesContent":["import { Box } from '../box'\nimport { useUp, vui } from '../core'\nimport { Heading } from '../heading'\nimport type { HeadingProps } from '../heading/heading.types'\nimport { cs } from '../utils'\n\n/** Logo displayed in the left corner of the Header. */\nexport const HeaderApplicationName = vui<'div', HeadingProps & { url?: string }>((props, ref) => {\n  const { color, title, url, ...rest } = props\n\n  const isTablet = useUp('md')\n\n  const additionalClassName = isTablet ? 'vui-headerApplicationNameTablet' : 'vui-headerApplicationNameMobile'\n\n  const mobileProps = {\n    fontSize: 18,\n    lineHeight: '21px',\n    mt: isTablet ? 0 : 'inherit',\n    maxW: isTablet ? 'inherit' : '156px',\n  }\n\n  const linkProps = url ? { as: 'a', href: url, outline: 'none', focusRing: 2 } : {}\n\n  const localColor = color || 'darkBlue.main'\n\n  return (\n    <Box {...linkProps}>\n      <Heading\n        className={cs('vui-headerApplicationName', additionalClassName)}\n        size=\"title\"\n        {...rest}\n        {...(mobileProps as any)}\n        color={localColor}\n      >\n        {title}\n      </Heading>\n    </Box>\n  )\n})\n\nHeaderApplicationName.displayName = 'HeaderApplicationName'\n\nexport default HeaderApplicationName\n"],"mappings":";;;;;;;;;AAOA,MAAa,wBAAwB,KAA6C,OAAO,QAAQ;CAC/F,MAAM,EAAE,OAAO,OAAO,IAAK,GAAG,SAAS;CAEvC,MAAM,WAAW,MAAM,KAAK;CAE5B,MAAM,sBAAsB,WAAW,oCAAoC;CAE3E,MAAM,cAAc;EAClB,UAAU;EACV,YAAY;EACZ,IAAI,WAAW,IAAI;EACnB,MAAM,WAAW,YAAY;EAC9B;CAED,MAAM,YAAY,MAAM;EAAE,IAAI;EAAK,MAAM;EAAK,SAAS;EAAQ,WAAW;EAAG,GAAG,EAAE;CAElF,MAAM,aAAa,SAAS;AAE5B,QACE,oBAAC;EAAI,GAAI;YACP,oBAAC;GACC,WAAW,GAAG,6BAA6B,oBAAoB;GAC/D,MAAK;GACL,GAAI;GACJ,GAAK;GACL,OAAO;aAEN;IACO;GACN;EAER;AAEF,sBAAsB,cAAc;AAEpC,oCAAe"}
+{"version":3,"file":"headerApplicationName.js","names":[],"sources":["../../src/header/headerApplicationName.tsx"],"sourcesContent":["import { Box } from '../box'\nimport { useUp, vui } from '../core'\nimport { Heading } from '../heading'\nimport type { HeadingProps } from '../heading/heading.types'\nimport { cs } from '../utils'\n\n/** Logo displayed in the left corner of the Header. */\nexport const HeaderApplicationName = vui<'div', HeadingProps & { url?: string }>((props, ref) => {\n  const { color, title, url, ...rest } = props\n\n  const isTablet = useUp('md')\n\n  const additionalClassName = isTablet ? 'vui-headerApplicationNameTablet' : 'vui-headerApplicationNameMobile'\n\n  const mobileProps = {\n    fontSize: 18,\n    lineHeight: '21px',\n    mt: isTablet ? 0 : 'inherit',\n    maxW: isTablet ? 'inherit' : '156px',\n  }\n\n  const linkProps = url ? { as: 'a', href: url, outline: 'none', focusRing: 2 } : {}\n\n  const localColor = color || 'darkBlue.main'\n\n  return (\n    <Box {...linkProps}>\n      <Heading\n        className={cs('vui-headerApplicationName', additionalClassName)}\n        size=\"title\"\n        {...rest}\n        {...(mobileProps as any)}\n        color={localColor}\n      >\n        {title}\n      </Heading>\n    </Box>\n  )\n})\n\nHeaderApplicationName.displayName = 'HeaderApplicationName'\n\nexport default HeaderApplicationName\n"],"mappings":";;;;;;;;;AAOA,MAAa,wBAAwB,KAA6C,OAAO,QAAQ;CAC/F,MAAM,EAAE,OAAO,OAAO,KAAK,GAAG,SAAS;CAEvC,MAAM,WAAW,MAAM,KAAK;CAE5B,MAAM,sBAAsB,WAAW,oCAAoC;CAE3E,MAAM,cAAc;EAClB,UAAU;EACV,YAAY;EACZ,IAAI,WAAW,IAAI;EACnB,MAAM,WAAW,YAAY;EAC9B;CAED,MAAM,YAAY,MAAM;EAAE,IAAI;EAAK,MAAM;EAAK,SAAS;EAAQ,WAAW;EAAG,GAAG,EAAE;CAElF,MAAM,aAAa,SAAS;AAE5B,QACE,oBAAC;EAAI,GAAI;YACP,oBAAC;GACC,WAAW,GAAG,6BAA6B,oBAAoB;GAC/D,MAAK;GACL,GAAI;GACJ,GAAK;GACL,OAAO;aAEN;IACO;GACN;EAER;AAEF,sBAAsB,cAAc;AAEpC,oCAAe"}

package/dist/header/headerContent.d.ts

@@ -7,4 +7,5 @@ import "../index.js";
 declare const HeaderContent: VuiComponent<"div", BoxProps>;
 //#endregion
 export { HeaderContent };
+
 //# sourceMappingURL=headerContent.d.ts.map

package/dist/header/headerContent.js

@@ -8,7 +8,7 @@ import { jsx } from "react/jsx-runtime";
 //#region src/header/headerContent.tsx
 /** Controls max-width of the content and centers itself horizontally. */
 const HeaderContent = vui((props, ref) => {
-	const { className,...rest } = props;
+	const { className, ...rest } = props;
 	const styles = useStyleConfig("Header", useHeaderContext());
 	return /* @__PURE__ */ jsx(box_default, {
 		centerV: true,
@@ -27,5 +27,5 @@ var headerContent_default = HeaderContent;
 
 //#endregion
 export { HeaderContent, headerContent_default as default };
-globalThis.__vuiVersion__ = "3.1.2"
+globalThis.__vuiVersion__ = "4.0.0-beta.1"
 //# sourceMappingURL=headerContent.js.map

package/dist/header/headerContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"headerContent.js","names":["Box"],"sources":["../../src/header/headerContent.tsx"],"sourcesContent":["import Box from '../box'\nimport { useStyleConfig, vui } from '../core'\nimport { cs } from '../utils'\nimport { useHeaderContext } from './context'\nimport type { HeaderContentProps } from './header.types'\n\n/** Controls max-width of the content and centers itself horizontally. */\nexport const HeaderContent = vui<'div', HeaderContentProps>((props, ref) => {\n  const { className, ...rest } = props\n  const styles = useStyleConfig('Header', useHeaderContext())\n\n  return (\n    <Box\n      centerV\n      className={cs('vui-headerContent', className)}\n      h={1}\n      mx=\"auto\"\n      position=\"relative\"\n      ref={ref}\n      w={1}\n      {...styles.content}\n      {...rest}\n    />\n  )\n})\n\nHeaderContent.displayName = 'HeaderContent'\n\nexport default HeaderContent\n"],"mappings":";;;;;;;;;AAOA,MAAa,gBAAgB,KAAgC,OAAO,QAAQ;CAC1E,MAAM,EAAE,UAAW,GAAG,SAAS;CAC/B,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC;AAE3D,QACE,oBAACA;EACC;EACA,WAAW,GAAG,qBAAqB,UAAU;EAC7C,GAAG;EACH,IAAG;EACH,UAAS;EACJ;EACL,GAAG;EACH,GAAI,OAAO;EACX,GAAI;GACJ;EAEJ;AAEF,cAAc,cAAc;AAE5B,4BAAe"}
+{"version":3,"file":"headerContent.js","names":["Box"],"sources":["../../src/header/headerContent.tsx"],"sourcesContent":["import Box from '../box'\nimport { useStyleConfig, vui } from '../core'\nimport { cs } from '../utils'\nimport { useHeaderContext } from './context'\nimport type { HeaderContentProps } from './header.types'\n\n/** Controls max-width of the content and centers itself horizontally. */\nexport const HeaderContent = vui<'div', HeaderContentProps>((props, ref) => {\n  const { className, ...rest } = props\n  const styles = useStyleConfig('Header', useHeaderContext())\n\n  return (\n    <Box\n      centerV\n      className={cs('vui-headerContent', className)}\n      h={1}\n      mx=\"auto\"\n      position=\"relative\"\n      ref={ref}\n      w={1}\n      {...styles.content}\n      {...rest}\n    />\n  )\n})\n\nHeaderContent.displayName = 'HeaderContent'\n\nexport default HeaderContent\n"],"mappings":";;;;;;;;;AAOA,MAAa,gBAAgB,KAAgC,OAAO,QAAQ;CAC1E,MAAM,EAAE,WAAW,GAAG,SAAS;CAC/B,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC;AAE3D,QACE,oBAACA;EACC;EACA,WAAW,GAAG,qBAAqB,UAAU;EAC7C,GAAG;EACH,IAAG;EACH,UAAS;EACJ;EACL,GAAG;EACH,GAAI,OAAO;EACX,GAAI;GACJ;EAEJ;AAEF,cAAc,cAAc;AAE5B,4BAAe"}

package/dist/header/headerCreateAccount.d.ts

@@ -7,4 +7,5 @@ import "../index.js";
 declare const HeaderCreateAccount: VuiComponent<"div", HeaderCreateAccountProps>;
 //#endregion
 export { HeaderCreateAccount };
+
 //# sourceMappingURL=headerCreateAccount.d.ts.map

package/dist/header/headerCreateAccount.js

@@ -10,7 +10,7 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 //#region src/header/headerCreateAccount.tsx
 /** Text inviting to create an account when logged out. */
 const HeaderCreateAccount = vui((props, ref) => {
-	const { children, className, url,...rest } = props;
+	const { children, className, url, ...rest } = props;
 	const { isMobile, links } = useHeaderContext() ?? {};
 	const styles = useStyleConfig("Header", useHeaderContext()).createAccount;
 	const screenProps = isMobile ? {
@@ -46,5 +46,5 @@ var headerCreateAccount_default = HeaderCreateAccount;
 
 //#endregion
 export { HeaderCreateAccount, headerCreateAccount_default as default };
-globalThis.__vuiVersion__ = "3.1.2"
+globalThis.__vuiVersion__ = "4.0.0-beta.1"
 //# sourceMappingURL=headerCreateAccount.js.map

package/dist/header/headerCreateAccount.js.map

@@ -1 +1 @@
-{"version":3,"file":"headerCreateAccount.js","names":["Box","T","Link"],"sources":["../../src/header/headerCreateAccount.tsx"],"sourcesContent":["import Box from '../box'\nimport { useStyleConfig, vui } from '../core'\nimport Link from '../link'\nimport T from '../t'\nimport { cs } from '../utils'\nimport { useHeaderContext } from './context'\nimport type { HeaderCreateAccountProps } from './header.types'\n\n/** Text inviting to create an account when logged out. */\nexport const HeaderCreateAccount = vui<'div', HeaderCreateAccountProps>((props, ref) => {\n  const { children, className, url, ...rest } = props\n  const { isMobile, links } = useHeaderContext() ?? {}\n  const styles = useStyleConfig('Header', useHeaderContext()).createAccount\n\n  const screenProps = isMobile ? { borderBottom: '1px solid sandstone.main', p: 2 } : { ml: 3 }\n\n  const linkVariant = isMobile ? 'dark' : (styles?.link?.variant ?? 'dark')\n\n  return (\n    <Box\n      className={cs('vui-headerCreateAccount', className)}\n      column\n      flexShrink={0}\n      ref={ref}\n      {...styles.container}\n      {...screenProps}\n      {...rest}\n    >\n      {children ?? (\n        <>\n          <T size=\"sm\" {...styles.text} color={isMobile ? 'darkBlue.main' : (styles?.text?.color ?? 'darkBlue.main')}>\n            New to Veracity?\n          </T>\n\n          <Link fontWeight=\"medium\" href={url ?? links.signUp} isUnderlined size=\"sm\" variant={linkVariant}>\n            Create account\n          </Link>\n        </>\n      )}\n    </Box>\n  )\n})\n\nHeaderCreateAccount.displayName = 'HeaderCreateAccount'\n\nexport default HeaderCreateAccount\n"],"mappings":";;;;;;;;;;;AASA,MAAa,sBAAsB,KAAsC,OAAO,QAAQ;CACtF,MAAM,EAAE,UAAU,WAAW,IAAK,GAAG,SAAS;CAC9C,MAAM,EAAE,UAAU,UAAU,kBAAkB,IAAI,EAAE;CACpD,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC,CAAC;CAE5D,MAAM,cAAc,WAAW;EAAE,cAAc;EAA4B,GAAG;EAAG,GAAG,EAAE,IAAI,GAAG;CAE7F,MAAM,cAAc,WAAW,SAAU,QAAQ,MAAM,WAAW;AAElE,QACE,oBAACA;EACC,WAAW,GAAG,2BAA2B,UAAU;EACnD;EACA,YAAY;EACP;EACL,GAAI,OAAO;EACX,GAAI;EACJ,GAAI;YAEH,YACC,4CACE,oBAACC;GAAE,MAAK;GAAK,GAAI,OAAO;GAAM,OAAO,WAAW,kBAAmB,QAAQ,MAAM,SAAS;aAAkB;IAExG,EAEJ,oBAACC;GAAK,YAAW;GAAS,MAAM,OAAO,MAAM;GAAQ;GAAa,MAAK;GAAK,SAAS;aAAa;IAE3F,IACN;GAED;EAER;AAEF,oBAAoB,cAAc;AAElC,kCAAe"}
+{"version":3,"file":"headerCreateAccount.js","names":["Box","T","Link"],"sources":["../../src/header/headerCreateAccount.tsx"],"sourcesContent":["import Box from '../box'\nimport { useStyleConfig, vui } from '../core'\nimport Link from '../link'\nimport T from '../t'\nimport { cs } from '../utils'\nimport { useHeaderContext } from './context'\nimport type { HeaderCreateAccountProps } from './header.types'\n\n/** Text inviting to create an account when logged out. */\nexport const HeaderCreateAccount = vui<'div', HeaderCreateAccountProps>((props, ref) => {\n  const { children, className, url, ...rest } = props\n  const { isMobile, links } = useHeaderContext() ?? {}\n  const styles = useStyleConfig('Header', useHeaderContext()).createAccount\n\n  const screenProps = isMobile ? { borderBottom: '1px solid sandstone.main', p: 2 } : { ml: 3 }\n\n  const linkVariant = isMobile ? 'dark' : (styles?.link?.variant ?? 'dark')\n\n  return (\n    <Box\n      className={cs('vui-headerCreateAccount', className)}\n      column\n      flexShrink={0}\n      ref={ref}\n      {...styles.container}\n      {...screenProps}\n      {...rest}\n    >\n      {children ?? (\n        <>\n          <T size=\"sm\" {...styles.text} color={isMobile ? 'darkBlue.main' : (styles?.text?.color ?? 'darkBlue.main')}>\n            New to Veracity?\n          </T>\n\n          <Link fontWeight=\"medium\" href={url ?? links.signUp} isUnderlined size=\"sm\" variant={linkVariant}>\n            Create account\n          </Link>\n        </>\n      )}\n    </Box>\n  )\n})\n\nHeaderCreateAccount.displayName = 'HeaderCreateAccount'\n\nexport default HeaderCreateAccount\n"],"mappings":";;;;;;;;;;;AASA,MAAa,sBAAsB,KAAsC,OAAO,QAAQ;CACtF,MAAM,EAAE,UAAU,WAAW,KAAK,GAAG,SAAS;CAC9C,MAAM,EAAE,UAAU,UAAU,kBAAkB,IAAI,EAAE;CACpD,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC,CAAC;CAE5D,MAAM,cAAc,WAAW;EAAE,cAAc;EAA4B,GAAG;EAAG,GAAG,EAAE,IAAI,GAAG;CAE7F,MAAM,cAAc,WAAW,SAAU,QAAQ,MAAM,WAAW;AAElE,QACE,oBAACA;EACC,WAAW,GAAG,2BAA2B,UAAU;EACnD;EACA,YAAY;EACP;EACL,GAAI,OAAO;EACX,GAAI;EACJ,GAAI;YAEH,YACC,4CACE,oBAACC;GAAE,MAAK;GAAK,GAAI,OAAO;GAAM,OAAO,WAAW,kBAAmB,QAAQ,MAAM,SAAS;aAAkB;IAExG,EAEJ,oBAACC;GAAK,YAAW;GAAS,MAAM,OAAO,MAAM;GAAQ;GAAa,MAAK;GAAK,SAAS;aAAa;IAE3F,IACN;GAED;EAER;AAEF,oBAAoB,cAAc;AAElC,kCAAe"}

package/dist/header/headerDivider.d.ts

@@ -8,4 +8,5 @@ import "../index.js";
 declare const HeaderDivider: VuiComponent<"hr", DividerProps>;
 //#endregion
 export { HeaderDivider };
+
 //# sourceMappingURL=headerDivider.d.ts.map

package/dist/header/headerDivider.js

@@ -8,7 +8,7 @@ import { jsx } from "react/jsx-runtime";
 //#region src/header/headerDivider.tsx
 /** Vertical line dividing part of the Header content. */
 const HeaderDivider = vui((props, ref) => {
-	const { className,...rest } = props;
+	const { className, ...rest } = props;
 	const styles = useStyleConfig("Header", useHeaderContext());
 	return /* @__PURE__ */ jsx(divider_default, {
 		borderColor: "darkBlue.main",
@@ -25,5 +25,5 @@ var headerDivider_default = HeaderDivider;
 
 //#endregion
 export { HeaderDivider, headerDivider_default as default };
-globalThis.__vuiVersion__ = "3.1.2"
+globalThis.__vuiVersion__ = "4.0.0-beta.1"
 //# sourceMappingURL=headerDivider.js.map

package/dist/header/headerDivider.js.map

@@ -1 +1 @@
-{"version":3,"file":"headerDivider.js","names":["Divider"],"sources":["../../src/header/headerDivider.tsx"],"sourcesContent":["import { useStyleConfig, vui } from '../core'\nimport type { DividerProps } from '../divider'\nimport Divider from '../divider'\nimport { cs } from '../utils'\nimport { useHeaderContext } from './context'\n\n/** Vertical line dividing part of the Header content. */\nexport const HeaderDivider = vui<'hr', DividerProps>((props, ref) => {\n  const { className, ...rest } = props\n  const styles = useStyleConfig('Header', useHeaderContext())\n\n  return (\n    <Divider\n      borderColor=\"darkBlue.main\"\n      className={cs('vui-headerDivider', className)}\n      h={40}\n      isVertical\n      ref={ref}\n      {...styles.divider}\n      {...rest}\n    />\n  )\n})\n\nHeaderDivider.displayName = 'HeaderDivider'\nexport default HeaderDivider\n"],"mappings":";;;;;;;;;AAOA,MAAa,gBAAgB,KAAyB,OAAO,QAAQ;CACnE,MAAM,EAAE,UAAW,GAAG,SAAS;CAC/B,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC;AAE3D,QACE,oBAACA;EACC,aAAY;EACZ,WAAW,GAAG,qBAAqB,UAAU;EAC7C,GAAG;EACH;EACK;EACL,GAAI,OAAO;EACX,GAAI;GACJ;EAEJ;AAEF,cAAc,cAAc;AAC5B,4BAAe"}
+{"version":3,"file":"headerDivider.js","names":["Divider"],"sources":["../../src/header/headerDivider.tsx"],"sourcesContent":["import { useStyleConfig, vui } from '../core'\nimport type { DividerProps } from '../divider'\nimport Divider from '../divider'\nimport { cs } from '../utils'\nimport { useHeaderContext } from './context'\n\n/** Vertical line dividing part of the Header content. */\nexport const HeaderDivider = vui<'hr', DividerProps>((props, ref) => {\n  const { className, ...rest } = props\n  const styles = useStyleConfig('Header', useHeaderContext())\n\n  return (\n    <Divider\n      borderColor=\"darkBlue.main\"\n      className={cs('vui-headerDivider', className)}\n      h={40}\n      isVertical\n      ref={ref}\n      {...styles.divider}\n      {...rest}\n    />\n  )\n})\n\nHeaderDivider.displayName = 'HeaderDivider'\nexport default HeaderDivider\n"],"mappings":";;;;;;;;;AAOA,MAAa,gBAAgB,KAAyB,OAAO,QAAQ;CACnE,MAAM,EAAE,WAAW,GAAG,SAAS;CAC/B,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC;AAE3D,QACE,oBAACA;EACC,aAAY;EACZ,WAAW,GAAG,qBAAqB,UAAU;EAC7C,GAAG;EACH;EACK;EACL,GAAI,OAAO;EACX,GAAI;GACJ;EAEJ;AAEF,cAAc,cAAc;AAC5B,4BAAe"}

package/dist/header/headerLinkItem.d.ts

@@ -7,4 +7,5 @@ import "../index.js";
 declare const HeaderLinkItem: VuiComponent<"li", HeaderLinkItemProps>;
 //#endregion
 export { HeaderLinkItem };
+
 //# sourceMappingURL=headerLinkItem.d.ts.map

package/dist/header/headerLinkItem.js

@@ -9,7 +9,7 @@ import { jsx } from "react/jsx-runtime";
 //#region src/header/headerLinkItem.tsx
 /** Individual link item of the Header. */
 const HeaderLinkItem = vui((props, ref) => {
-	const { className, icon, isActive, linkProps, onClick: onClickProp, url,...rest } = props;
+	const { className, icon, isActive, linkProps, onClick: onClickProp, url, ...rest } = props;
 	const { isMobile, setIsMobileOpen } = useHeaderContext() ?? {};
 	const styles = useStyleConfig("Header", useHeaderContext()).linkItem;
 	const onClick = useCallbackRef((e) => {
@@ -86,5 +86,5 @@ var headerLinkItem_default = HeaderLinkItem;
 
 //#endregion
 export { HeaderLinkItem, headerLinkItem_default as default };
-globalThis.__vuiVersion__ = "3.1.2"
+globalThis.__vuiVersion__ = "4.0.0-beta.1"
 //# sourceMappingURL=headerLinkItem.js.map

package/dist/header/headerLinkItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"headerLinkItem.js","names":["List"],"sources":["../../src/header/headerLinkItem.tsx"],"sourcesContent":["import { useStyleConfig, vui } from '../core'\nimport List from '../list'\nimport type { MouseEvent } from '../utils'\nimport { cs, useCallbackRef } from '../utils'\nimport { useHeaderContext } from './context'\nimport type { HeaderLinkItemProps } from './header.types'\n\n/** Individual link item of the Header. */\nexport const HeaderLinkItem = vui<'li', HeaderLinkItemProps>((props, ref) => {\n  const { className, icon, isActive, linkProps, onClick: onClickProp, url, ...rest } = props\n  const { isMobile, setIsMobileOpen } = useHeaderContext() ?? {}\n  const styles = useStyleConfig('Header', useHeaderContext()).linkItem\n\n  const onClick = useCallbackRef((e: MouseEvent<HTMLLIElement>) => {\n    setIsMobileOpen(false)\n    onClickProp?.(e)\n  })\n  const linkPropsExtended = { ...linkProps, display: 'inline-flex', alignItems: 'center' }\n  const linkActiveProps = isActive\n    ? isMobile\n      ? {\n          bg: 'skyBlue.95',\n          borderColor: 'seaBlue.main',\n          borderLeftWidth: 3,\n          hoverBg: 'skyBlue.90',\n          pl: '13px',\n          activeBorderBottomWidth: 0,\n          pt: '0px',\n        }\n      : { borderBottomWidth: 4, pt: '4px' }\n    : {}\n\n  const linkMobileProps = isMobile\n    ? {\n        color: 'darkBlue.main',\n        hoverColor: 'darkBlue.main',\n        hoverBg: 'skyBlue.90',\n        activeColor: 'darkBlue.main',\n        activeBg: 'transparent',\n        activeBorderColor: 'seaBlue.main',\n        activeBorderLeftWidth: 0,\n        pt: '0',\n        activePl: isActive ? '13px' : '16px',\n      }\n    : { activeBorderBottomWidth: 0, pt: '0px', activePt: isActive ? '1px' : '0' }\n\n  const itemScreenProps = isMobile ? {} : { display: 'inline-flex', fontWeight: 'medium', h: '100%' }\n\n  return (\n    <List.Item\n      className={cs('vui-headerLinkItem', className, `${isActive && 'is-active'}`)}\n      iconLeft={icon}\n      linkProps={{\n        href: url,\n        ringInset: true,\n        transition: 'all 0.1s, border-width 0s, padding 0s',\n        w: { xs: '100%', lg: 'max-content' },\n        px: { xs: '16px', lg: '10px', xl: '16px' },\n        ...styles.link,\n        ...linkPropsExtended,\n        ...linkMobileProps,\n        ...linkActiveProps,\n      }}\n      onClick={onClick}\n      ref={ref}\n      {...itemScreenProps}\n      {...styles.container}\n      {...rest}\n    />\n  )\n})\n\nHeaderLinkItem.displayName = 'HeaderLinkItem'\nexport default HeaderLinkItem\n"],"mappings":";;;;;;;;;;AAQA,MAAa,iBAAiB,KAAgC,OAAO,QAAQ;CAC3E,MAAM,EAAE,WAAW,MAAM,UAAU,WAAW,SAAS,aAAa,IAAK,GAAG,SAAS;CACrF,MAAM,EAAE,UAAU,oBAAoB,kBAAkB,IAAI,EAAE;CAC9D,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC,CAAC;CAE5D,MAAM,UAAU,gBAAgB,MAAiC;AAC/D,kBAAgB,MAAM;AACtB,gBAAc,EAAE;GAChB;CACF,MAAM,oBAAoB;EAAE,GAAG;EAAW,SAAS;EAAe,YAAY;EAAU;CACxF,MAAM,kBAAkB,WACpB,WACE;EACE,IAAI;EACJ,aAAa;EACb,iBAAiB;EACjB,SAAS;EACT,IAAI;EACJ,yBAAyB;EACzB,IAAI;EACL,GACD;EAAE,mBAAmB;EAAG,IAAI;EAAO,GACrC,EAAE;CAEN,MAAM,kBAAkB,WACpB;EACE,OAAO;EACP,YAAY;EACZ,SAAS;EACT,aAAa;EACb,UAAU;EACV,mBAAmB;EACnB,uBAAuB;EACvB,IAAI;EACJ,UAAU,WAAW,SAAS;EAC/B,GACD;EAAE,yBAAyB;EAAG,IAAI;EAAO,UAAU,WAAW,QAAQ;EAAK;CAE/E,MAAM,kBAAkB,WAAW,EAAE,GAAG;EAAE,SAAS;EAAe,YAAY;EAAU,GAAG;EAAQ;AAEnG,QACE,oBAACA,aAAK;EACJ,WAAW,GAAG,sBAAsB,WAAW,GAAG,YAAY,cAAc;EAC5E,UAAU;EACV,WAAW;GACT,MAAM;GACN,WAAW;GACX,YAAY;GACZ,GAAG;IAAE,IAAI;IAAQ,IAAI;IAAe;GACpC,IAAI;IAAE,IAAI;IAAQ,IAAI;IAAQ,IAAI;IAAQ;GAC1C,GAAG,OAAO;GACV,GAAG;GACH,GAAG;GACH,GAAG;GACJ;EACQ;EACJ;EACL,GAAI;EACJ,GAAI,OAAO;EACX,GAAI;GACJ;EAEJ;AAEF,eAAe,cAAc;AAC7B,6BAAe"}
+{"version":3,"file":"headerLinkItem.js","names":["List"],"sources":["../../src/header/headerLinkItem.tsx"],"sourcesContent":["import { useStyleConfig, vui } from '../core'\nimport List from '../list'\nimport type { MouseEvent } from '../utils'\nimport { cs, useCallbackRef } from '../utils'\nimport { useHeaderContext } from './context'\nimport type { HeaderLinkItemProps } from './header.types'\n\n/** Individual link item of the Header. */\nexport const HeaderLinkItem = vui<'li', HeaderLinkItemProps>((props, ref) => {\n  const { className, icon, isActive, linkProps, onClick: onClickProp, url, ...rest } = props\n  const { isMobile, setIsMobileOpen } = useHeaderContext() ?? {}\n  const styles = useStyleConfig('Header', useHeaderContext()).linkItem\n\n  const onClick = useCallbackRef((e: MouseEvent<HTMLLIElement>) => {\n    setIsMobileOpen(false)\n    onClickProp?.(e)\n  })\n  const linkPropsExtended = { ...linkProps, display: 'inline-flex', alignItems: 'center' }\n  const linkActiveProps = isActive\n    ? isMobile\n      ? {\n          bg: 'skyBlue.95',\n          borderColor: 'seaBlue.main',\n          borderLeftWidth: 3,\n          hoverBg: 'skyBlue.90',\n          pl: '13px',\n          activeBorderBottomWidth: 0,\n          pt: '0px',\n        }\n      : { borderBottomWidth: 4, pt: '4px' }\n    : {}\n\n  const linkMobileProps = isMobile\n    ? {\n        color: 'darkBlue.main',\n        hoverColor: 'darkBlue.main',\n        hoverBg: 'skyBlue.90',\n        activeColor: 'darkBlue.main',\n        activeBg: 'transparent',\n        activeBorderColor: 'seaBlue.main',\n        activeBorderLeftWidth: 0,\n        pt: '0',\n        activePl: isActive ? '13px' : '16px',\n      }\n    : { activeBorderBottomWidth: 0, pt: '0px', activePt: isActive ? '1px' : '0' }\n\n  const itemScreenProps = isMobile ? {} : { display: 'inline-flex', fontWeight: 'medium', h: '100%' }\n\n  return (\n    <List.Item\n      className={cs('vui-headerLinkItem', className, `${isActive && 'is-active'}`)}\n      iconLeft={icon}\n      linkProps={{\n        href: url,\n        ringInset: true,\n        transition: 'all 0.1s, border-width 0s, padding 0s',\n        w: { xs: '100%', lg: 'max-content' },\n        px: { xs: '16px', lg: '10px', xl: '16px' },\n        ...styles.link,\n        ...linkPropsExtended,\n        ...linkMobileProps,\n        ...linkActiveProps,\n      }}\n      onClick={onClick}\n      ref={ref}\n      {...itemScreenProps}\n      {...styles.container}\n      {...rest}\n    />\n  )\n})\n\nHeaderLinkItem.displayName = 'HeaderLinkItem'\nexport default HeaderLinkItem\n"],"mappings":";;;;;;;;;;AAQA,MAAa,iBAAiB,KAAgC,OAAO,QAAQ;CAC3E,MAAM,EAAE,WAAW,MAAM,UAAU,WAAW,SAAS,aAAa,KAAK,GAAG,SAAS;CACrF,MAAM,EAAE,UAAU,oBAAoB,kBAAkB,IAAI,EAAE;CAC9D,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC,CAAC;CAE5D,MAAM,UAAU,gBAAgB,MAAiC;AAC/D,kBAAgB,MAAM;AACtB,gBAAc,EAAE;GAChB;CACF,MAAM,oBAAoB;EAAE,GAAG;EAAW,SAAS;EAAe,YAAY;EAAU;CACxF,MAAM,kBAAkB,WACpB,WACE;EACE,IAAI;EACJ,aAAa;EACb,iBAAiB;EACjB,SAAS;EACT,IAAI;EACJ,yBAAyB;EACzB,IAAI;EACL,GACD;EAAE,mBAAmB;EAAG,IAAI;EAAO,GACrC,EAAE;CAEN,MAAM,kBAAkB,WACpB;EACE,OAAO;EACP,YAAY;EACZ,SAAS;EACT,aAAa;EACb,UAAU;EACV,mBAAmB;EACnB,uBAAuB;EACvB,IAAI;EACJ,UAAU,WAAW,SAAS;EAC/B,GACD;EAAE,yBAAyB;EAAG,IAAI;EAAO,UAAU,WAAW,QAAQ;EAAK;CAE/E,MAAM,kBAAkB,WAAW,EAAE,GAAG;EAAE,SAAS;EAAe,YAAY;EAAU,GAAG;EAAQ;AAEnG,QACE,oBAACA,aAAK;EACJ,WAAW,GAAG,sBAAsB,WAAW,GAAG,YAAY,cAAc;EAC5E,UAAU;EACV,WAAW;GACT,MAAM;GACN,WAAW;GACX,YAAY;GACZ,GAAG;IAAE,IAAI;IAAQ,IAAI;IAAe;GACpC,IAAI;IAAE,IAAI;IAAQ,IAAI;IAAQ,IAAI;IAAQ;GAC1C,GAAG,OAAO;GACV,GAAG;GACH,GAAG;GACH,GAAG;GACJ;EACQ;EACJ;EACL,GAAI;EACJ,GAAI,OAAO;EACX,GAAI;GACJ;EAEJ;AAEF,eAAe,cAAc;AAC7B,6BAAe"}

package/dist/header/headerLogo.d.ts

@@ -7,4 +7,5 @@ import "../index.js";
 declare const HeaderLogo: VuiComponent<"div", LogoProps>;
 //#endregion
 export { HeaderLogo };
+
 //# sourceMappingURL=headerLogo.d.ts.map

package/dist/header/headerLogo.js

@@ -7,7 +7,7 @@ import { jsx } from "react/jsx-runtime";
 //#region src/header/headerLogo.tsx
 /** Logo displayed in the left corner of the Header. */
 const HeaderLogo = vui((props, ref) => {
-	const { brand, children, className, src, url,...rest } = props;
+	const { brand, children, className, src, url, ...rest } = props;
 	const { links } = useHeaderContext() ?? {};
 	const styles = useStyleConfig("Header", useHeaderContext()).logo;
 	return /* @__PURE__ */ jsx(Logo, {
@@ -26,5 +26,5 @@ var headerLogo_default = HeaderLogo;
 
 //#endregion
 export { HeaderLogo, headerLogo_default as default };
-globalThis.__vuiVersion__ = "3.1.2"
+globalThis.__vuiVersion__ = "4.0.0-beta.1"
 //# sourceMappingURL=headerLogo.js.map

package/dist/header/headerLogo.js.map

@@ -1 +1 @@
-{"version":3,"file":"headerLogo.js","names":[],"sources":["../../src/header/headerLogo.tsx"],"sourcesContent":["import { useStyleConfig, vui } from '../core'\nimport { Logo } from '../logo'\nimport type { LogoProps } from '../logo/logo.types'\nimport { useHeaderContext } from './context'\n\n/** Logo displayed in the left corner of the Header. */\nexport const HeaderLogo = vui<'div', LogoProps>((props, ref) => {\n  const { brand, children, className, src, url, ...rest } = props\n  const { links } = useHeaderContext() ?? {}\n\n  const styles = useStyleConfig('Header', useHeaderContext()).logo\n\n  const logoUrl = url ?? links.home\n\n  return (\n    <Logo brand={brand} className={className} ref={ref} src={src} styles={styles} url={logoUrl} {...rest}>\n      {children}\n    </Logo>\n  )\n})\n\nHeaderLogo.displayName = 'HeaderLogo'\n\nexport default HeaderLogo\n"],"mappings":";;;;;;;;AAMA,MAAa,aAAa,KAAuB,OAAO,QAAQ;CAC9D,MAAM,EAAE,OAAO,UAAU,WAAW,KAAK,IAAK,GAAG,SAAS;CAC1D,MAAM,EAAE,UAAU,kBAAkB,IAAI,EAAE;CAE1C,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC,CAAC;AAI5D,QACE,oBAAC;EAAY;EAAkB;EAAgB;EAAU;EAAa;EAAQ,KAHhE,OAAO,MAAM;EAGiE,GAAI;EAC7F;GACI;EAET;AAEF,WAAW,cAAc;AAEzB,yBAAe"}
+{"version":3,"file":"headerLogo.js","names":[],"sources":["../../src/header/headerLogo.tsx"],"sourcesContent":["import { useStyleConfig, vui } from '../core'\nimport { Logo } from '../logo'\nimport type { LogoProps } from '../logo/logo.types'\nimport { useHeaderContext } from './context'\n\n/** Logo displayed in the left corner of the Header. */\nexport const HeaderLogo = vui<'div', LogoProps>((props, ref) => {\n  const { brand, children, className, src, url, ...rest } = props\n  const { links } = useHeaderContext() ?? {}\n\n  const styles = useStyleConfig('Header', useHeaderContext()).logo\n\n  const logoUrl = url ?? links.home\n\n  return (\n    <Logo brand={brand} className={className} ref={ref} src={src} styles={styles} url={logoUrl} {...rest}>\n      {children}\n    </Logo>\n  )\n})\n\nHeaderLogo.displayName = 'HeaderLogo'\n\nexport default HeaderLogo\n"],"mappings":";;;;;;;;AAMA,MAAa,aAAa,KAAuB,OAAO,QAAQ;CAC9D,MAAM,EAAE,OAAO,UAAU,WAAW,KAAK,KAAK,GAAG,SAAS;CAC1D,MAAM,EAAE,UAAU,kBAAkB,IAAI,EAAE;CAE1C,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC,CAAC;AAI5D,QACE,oBAAC;EAAY;EAAkB;EAAgB;EAAU;EAAa;EAAQ,KAHhE,OAAO,MAAM;EAGiE,GAAI;EAC7F;GACI;EAET;AAEF,WAAW,cAAc;AAEzB,yBAAe"}

package/dist/header/headerMainLinks.d.ts

@@ -7,4 +7,5 @@ import "../index.js";
 declare const HeaderMainLinks: VuiComponent<"ul", HeaderMainLinksProps>;
 //#endregion
 export { HeaderMainLinks };
+
 //# sourceMappingURL=headerMainLinks.d.ts.map

package/dist/header/headerMainLinks.js

@@ -9,7 +9,7 @@ import { jsx } from "react/jsx-runtime";
 //#region src/header/headerMainLinks.tsx
 /** List of Header Links. */
 const HeaderMainLinks = vui((props, ref) => {
-	const { children, className, links,...rest } = props;
+	const { children, className, links, ...rest } = props;
 	const { isMobile } = useHeaderContext() ?? {};
 	const styles = useStyleConfig("Header", useHeaderContext());
 	const screenStyles = isMobile ? {
@@ -31,5 +31,5 @@ var headerMainLinks_default = HeaderMainLinks;
 
 //#endregion
 export { HeaderMainLinks, headerMainLinks_default as default };
-globalThis.__vuiVersion__ = "3.1.2"
+globalThis.__vuiVersion__ = "4.0.0-beta.1"
 //# sourceMappingURL=headerMainLinks.js.map

package/dist/header/headerMainLinks.js.map

@@ -1 +1 @@
-{"version":3,"file":"headerMainLinks.js","names":["List","HeaderLinkItem"],"sources":["../../src/header/headerMainLinks.tsx"],"sourcesContent":["import { useStyleConfig, vui } from '../core'\nimport List from '../list'\nimport { cs } from '../utils'\nimport { useHeaderContext } from './context'\nimport type { HeaderMainLinksProps } from './header.types'\nimport HeaderLinkItem from './headerLinkItem'\n\n/** List of Header Links. */\nexport const HeaderMainLinks = vui<'ul', HeaderMainLinksProps>((props, ref) => {\n  const { children, className, links, ...rest } = props\n  const { isMobile } = useHeaderContext() ?? {}\n  const styles = useStyleConfig('Header', useHeaderContext())\n\n  const screenStyles = isMobile\n    ? {\n        flexDirection: 'column',\n        mb: 1,\n      }\n    : { h: '100%' }\n\n  return (\n    <List\n      className={cs('vui-headerMainLinks', className)}\n      display=\"flex\"\n      ref={ref}\n      {...styles.mainLinks}\n      {...screenStyles}\n      {...rest}\n    >\n      {children ?? links?.map((link, index) => <HeaderLinkItem key={index} {...link} />)}\n    </List>\n  )\n})\n\nHeaderMainLinks.displayName = 'HeaderMainLinks'\n\nexport default HeaderMainLinks\n"],"mappings":";;;;;;;;;;AAQA,MAAa,kBAAkB,KAAiC,OAAO,QAAQ;CAC7E,MAAM,EAAE,UAAU,WAAW,MAAO,GAAG,SAAS;CAChD,MAAM,EAAE,aAAa,kBAAkB,IAAI,EAAE;CAC7C,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC;CAE3D,MAAM,eAAe,WACjB;EACE,eAAe;EACf,IAAI;EACL,GACD,EAAE,GAAG,QAAQ;AAEjB,QACE,oBAACA;EACC,WAAW,GAAG,uBAAuB,UAAU;EAC/C,SAAQ;EACH;EACL,GAAI,OAAO;EACX,GAAI;EACJ,GAAI;YAEH,YAAY,OAAO,KAAK,MAAM,UAAU,oBAACC,0BAA2B,GAAI,QAAX,MAAmB,CAAC;GAC7E;EAET;AAEF,gBAAgB,cAAc;AAE9B,8BAAe"}
+{"version":3,"file":"headerMainLinks.js","names":["List","HeaderLinkItem"],"sources":["../../src/header/headerMainLinks.tsx"],"sourcesContent":["import { useStyleConfig, vui } from '../core'\nimport List from '../list'\nimport { cs } from '../utils'\nimport { useHeaderContext } from './context'\nimport type { HeaderMainLinksProps } from './header.types'\nimport HeaderLinkItem from './headerLinkItem'\n\n/** List of Header Links. */\nexport const HeaderMainLinks = vui<'ul', HeaderMainLinksProps>((props, ref) => {\n  const { children, className, links, ...rest } = props\n  const { isMobile } = useHeaderContext() ?? {}\n  const styles = useStyleConfig('Header', useHeaderContext())\n\n  const screenStyles = isMobile\n    ? {\n        flexDirection: 'column',\n        mb: 1,\n      }\n    : { h: '100%' }\n\n  return (\n    <List\n      className={cs('vui-headerMainLinks', className)}\n      display=\"flex\"\n      ref={ref}\n      {...styles.mainLinks}\n      {...screenStyles}\n      {...rest}\n    >\n      {children ?? links?.map((link, index) => <HeaderLinkItem key={index} {...link} />)}\n    </List>\n  )\n})\n\nHeaderMainLinks.displayName = 'HeaderMainLinks'\n\nexport default HeaderMainLinks\n"],"mappings":";;;;;;;;;;AAQA,MAAa,kBAAkB,KAAiC,OAAO,QAAQ;CAC7E,MAAM,EAAE,UAAU,WAAW,OAAO,GAAG,SAAS;CAChD,MAAM,EAAE,aAAa,kBAAkB,IAAI,EAAE;CAC7C,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC;CAE3D,MAAM,eAAe,WACjB;EACE,eAAe;EACf,IAAI;EACL,GACD,EAAE,GAAG,QAAQ;AAEjB,QACE,oBAACA;EACC,WAAW,GAAG,uBAAuB,UAAU;EAC/C,SAAQ;EACH;EACL,GAAI,OAAO;EACX,GAAI;EACJ,GAAI;YAEH,YAAY,OAAO,KAAK,MAAM,UAAU,oBAACC,0BAA2B,GAAI,QAAX,MAAmB,CAAC;GAC7E;EAET;AAEF,gBAAgB,cAAc;AAE9B,8BAAe"}

package/dist/header/headerMobileContent.d.ts

@@ -8,4 +8,5 @@ import "../index.js";
 declare const HeaderMobileContent: VuiComponent<"div", BoxProps>;
 //#endregion
 export { HeaderMobileContent };
+
 //# sourceMappingURL=headerMobileContent.d.ts.map

package/dist/header/headerMobileContent.js

@@ -10,7 +10,7 @@ import { jsx } from "react/jsx-runtime";
 //#region src/header/headerMobileContent.tsx
 /** Displays part of the Header content when on a mobile screen. */
 const HeaderMobileContent = vui((props, ref) => {
-	const { className,...rest } = props;
+	const { className, ...rest } = props;
 	const { isMobileOpen, mobileContentRef } = useHeaderContext() ?? {};
 	const styles = useStyleConfig("Header", useHeaderContext());
 	const islargerThanTablet = useUp("lg");
@@ -36,5 +36,5 @@ var headerMobileContent_default = HeaderMobileContent;
 
 //#endregion
 export { HeaderMobileContent, headerMobileContent_default as default };
-globalThis.__vuiVersion__ = "3.1.2"
+globalThis.__vuiVersion__ = "4.0.0-beta.1"
 //# sourceMappingURL=headerMobileContent.js.map

package/dist/header/headerMobileContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"headerMobileContent.js","names":["Box"],"sources":["../../src/header/headerMobileContent.tsx"],"sourcesContent":["import type { BoxProps } from '../box'\nimport Box from '../box'\nimport { useStyleConfig, useUp, vui } from '../core'\nimport { cs, mergeRefs } from '../utils'\nimport { useHeaderContext } from './context'\n\n/** Displays part of the Header content when on a mobile screen. */\nexport const HeaderMobileContent = vui<'div', BoxProps>((props, ref) => {\n  const { className, ...rest } = props\n  const { isMobileOpen, mobileContentRef } = useHeaderContext() ?? {}\n  const styles = useStyleConfig('Header', useHeaderContext())\n  const islargerThanTablet = useUp('lg')\n\n  return isMobileOpen ? (\n    <Box\n      bg=\"white\"\n      className={cs('vui-headerMobileContent', className)}\n      column\n      overflowX=\"hidden\"\n      overflowY=\"auto\"\n      position=\"absolute\"\n      ref={mergeRefs(ref, mobileContentRef)}\n      right={islargerThanTablet ? '-40px' : '-16px'}\n      shadow={2}\n      top=\"calc(100% + 1px)\"\n      w={islargerThanTablet ? 320 : 280}\n      zIndex=\"100\"\n      {...styles.mobileContent}\n      {...rest}\n    />\n  ) : null\n})\n\nHeaderMobileContent.displayName = 'HeaderMobileContent'\nexport default HeaderMobileContent\n"],"mappings":";;;;;;;;;;;AAOA,MAAa,sBAAsB,KAAsB,OAAO,QAAQ;CACtE,MAAM,EAAE,UAAW,GAAG,SAAS;CAC/B,MAAM,EAAE,cAAc,qBAAqB,kBAAkB,IAAI,EAAE;CACnE,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC;CAC3D,MAAM,qBAAqB,MAAM,KAAK;AAEtC,QAAO,eACL,oBAACA;EACC,IAAG;EACH,WAAW,GAAG,2BAA2B,UAAU;EACnD;EACA,WAAU;EACV,WAAU;EACV,UAAS;EACT,KAAK,UAAU,KAAK,iBAAiB;EACrC,OAAO,qBAAqB,UAAU;EACtC,QAAQ;EACR,KAAI;EACJ,GAAG,qBAAqB,MAAM;EAC9B,QAAO;EACP,GAAI,OAAO;EACX,GAAI;GACJ,GACA;EACJ;AAEF,oBAAoB,cAAc;AAClC,kCAAe"}
+{"version":3,"file":"headerMobileContent.js","names":["Box"],"sources":["../../src/header/headerMobileContent.tsx"],"sourcesContent":["import type { BoxProps } from '../box'\nimport Box from '../box'\nimport { useStyleConfig, useUp, vui } from '../core'\nimport { cs, mergeRefs } from '../utils'\nimport { useHeaderContext } from './context'\n\n/** Displays part of the Header content when on a mobile screen. */\nexport const HeaderMobileContent = vui<'div', BoxProps>((props, ref) => {\n  const { className, ...rest } = props\n  const { isMobileOpen, mobileContentRef } = useHeaderContext() ?? {}\n  const styles = useStyleConfig('Header', useHeaderContext())\n  const islargerThanTablet = useUp('lg')\n\n  return isMobileOpen ? (\n    <Box\n      bg=\"white\"\n      className={cs('vui-headerMobileContent', className)}\n      column\n      overflowX=\"hidden\"\n      overflowY=\"auto\"\n      position=\"absolute\"\n      ref={mergeRefs(ref, mobileContentRef)}\n      right={islargerThanTablet ? '-40px' : '-16px'}\n      shadow={2}\n      top=\"calc(100% + 1px)\"\n      w={islargerThanTablet ? 320 : 280}\n      zIndex=\"100\"\n      {...styles.mobileContent}\n      {...rest}\n    />\n  ) : null\n})\n\nHeaderMobileContent.displayName = 'HeaderMobileContent'\nexport default HeaderMobileContent\n"],"mappings":";;;;;;;;;;;AAOA,MAAa,sBAAsB,KAAsB,OAAO,QAAQ;CACtE,MAAM,EAAE,WAAW,GAAG,SAAS;CAC/B,MAAM,EAAE,cAAc,qBAAqB,kBAAkB,IAAI,EAAE;CACnE,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC;CAC3D,MAAM,qBAAqB,MAAM,KAAK;AAEtC,QAAO,eACL,oBAACA;EACC,IAAG;EACH,WAAW,GAAG,2BAA2B,UAAU;EACnD;EACA,WAAU;EACV,WAAU;EACV,UAAS;EACT,KAAK,UAAU,KAAK,iBAAiB;EACrC,OAAO,qBAAqB,UAAU;EACtC,QAAQ;EACR,KAAI;EACJ,GAAG,qBAAqB,MAAM;EAC9B,QAAO;EACP,GAAI,OAAO;EACX,GAAI;GACJ,GACA;EACJ;AAEF,oBAAoB,cAAc;AAClC,kCAAe"}

package/dist/header/headerMobileToggle.d.ts

@@ -8,4 +8,5 @@ import "../index.js";
 declare const HeaderMobileToggle: VuiComponent<"button", ButtonProps>;
 //#endregion
 export { HeaderMobileToggle };
+
 //# sourceMappingURL=headerMobileToggle.d.ts.map

package/dist/header/headerMobileToggle.js

@@ -10,7 +10,7 @@ import { jsx } from "react/jsx-runtime";
 //#region src/header/headerMobileToggle.tsx
 /** Button that toggles display of the mobile content. */
 const HeaderMobileToggle = vui((props, ref) => {
-	const { className,...rest } = props;
+	const { className, ...rest } = props;
 	const { isMobileOpen, mobileToggleRef, setIsMobileOpen } = useHeaderContext() ?? {};
 	const styles = useStyleConfig("Header", useHeaderContext());
 	const iconName = isMobileOpen ? "falTimes" : "falBars";
@@ -31,5 +31,5 @@ var headerMobileToggle_default = HeaderMobileToggle;
 
 //#endregion
 export { HeaderMobileToggle, headerMobileToggle_default as default };
-globalThis.__vuiVersion__ = "3.1.2"
+globalThis.__vuiVersion__ = "4.0.0-beta.1"
 //# sourceMappingURL=headerMobileToggle.js.map

package/dist/header/headerMobileToggle.js.map

@@ -1 +1 @@
-{"version":3,"file":"headerMobileToggle.js","names":["Icon"],"sources":["../../src/header/headerMobileToggle.tsx"],"sourcesContent":["import type { ButtonProps } from '../button'\nimport { IconButton } from '../button'\nimport { useStyleConfig, vui } from '../core'\nimport Icon from '../icon'\nimport { cs, mergeRefs } from '../utils'\nimport { useHeaderContext } from './context'\n\n/** Button that toggles display of the mobile content. */\nexport const HeaderMobileToggle = vui<'button', ButtonProps>((props, ref) => {\n  const { className, ...rest } = props\n  const { isMobileOpen, mobileToggleRef, setIsMobileOpen } = useHeaderContext() ?? {}\n  const styles = useStyleConfig('Header', useHeaderContext())\n\n  const iconName = isMobileOpen ? 'falTimes' : 'falBars'\n\n  return (\n    <IconButton\n      className={cs('vui-headerMobileToggle', className)}\n      icon={<Icon name={iconName} />}\n      ml={1}\n      onClick={() => setIsMobileOpen(s => !s)}\n      p=\"3px\"\n      ref={mergeRefs(ref, mobileToggleRef)}\n      title=\"More options\"\n      {...styles.mobileToggle}\n      {...rest}\n    />\n  )\n})\n\nHeaderMobileToggle.displayName = 'HeaderMobileToggle'\n\nexport default HeaderMobileToggle\n"],"mappings":";;;;;;;;;;;AAQA,MAAa,qBAAqB,KAA4B,OAAO,QAAQ;CAC3E,MAAM,EAAE,UAAW,GAAG,SAAS;CAC/B,MAAM,EAAE,cAAc,iBAAiB,oBAAoB,kBAAkB,IAAI,EAAE;CACnF,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC;CAE3D,MAAM,WAAW,eAAe,aAAa;AAE7C,QACE,oBAAC;EACC,WAAW,GAAG,0BAA0B,UAAU;EAClD,MAAM,oBAACA,gBAAK,MAAM,WAAY;EAC9B,IAAI;EACJ,eAAe,iBAAgB,MAAK,CAAC,EAAE;EACvC,GAAE;EACF,KAAK,UAAU,KAAK,gBAAgB;EACpC,OAAM;EACN,GAAI,OAAO;EACX,GAAI;GACJ;EAEJ;AAEF,mBAAmB,cAAc;AAEjC,iCAAe"}
+{"version":3,"file":"headerMobileToggle.js","names":["Icon"],"sources":["../../src/header/headerMobileToggle.tsx"],"sourcesContent":["import type { ButtonProps } from '../button'\nimport { IconButton } from '../button'\nimport { useStyleConfig, vui } from '../core'\nimport Icon from '../icon'\nimport { cs, mergeRefs } from '../utils'\nimport { useHeaderContext } from './context'\n\n/** Button that toggles display of the mobile content. */\nexport const HeaderMobileToggle = vui<'button', ButtonProps>((props, ref) => {\n  const { className, ...rest } = props\n  const { isMobileOpen, mobileToggleRef, setIsMobileOpen } = useHeaderContext() ?? {}\n  const styles = useStyleConfig('Header', useHeaderContext())\n\n  const iconName = isMobileOpen ? 'falTimes' : 'falBars'\n\n  return (\n    <IconButton\n      className={cs('vui-headerMobileToggle', className)}\n      icon={<Icon name={iconName} />}\n      ml={1}\n      onClick={() => setIsMobileOpen(s => !s)}\n      p=\"3px\"\n      ref={mergeRefs(ref, mobileToggleRef)}\n      title=\"More options\"\n      {...styles.mobileToggle}\n      {...rest}\n    />\n  )\n})\n\nHeaderMobileToggle.displayName = 'HeaderMobileToggle'\n\nexport default HeaderMobileToggle\n"],"mappings":";;;;;;;;;;;AAQA,MAAa,qBAAqB,KAA4B,OAAO,QAAQ;CAC3E,MAAM,EAAE,WAAW,GAAG,SAAS;CAC/B,MAAM,EAAE,cAAc,iBAAiB,oBAAoB,kBAAkB,IAAI,EAAE;CACnF,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC;CAE3D,MAAM,WAAW,eAAe,aAAa;AAE7C,QACE,oBAAC;EACC,WAAW,GAAG,0BAA0B,UAAU;EAClD,MAAM,oBAACA,gBAAK,MAAM,WAAY;EAC9B,IAAI;EACJ,eAAe,iBAAgB,MAAK,CAAC,EAAE;EACvC,GAAE;EACF,KAAK,UAAU,KAAK,gBAAgB;EACpC,OAAM;EACN,GAAI,OAAO;EACX,GAAI;GACJ;EAEJ;AAEF,mBAAmB,cAAc;AAEjC,iCAAe"}

package/dist/header/headerNotifications.d.ts

@@ -7,4 +7,5 @@ import "../index.js";
 declare const HeaderNotifications: VuiComponent<"a", HeaderNotificationsProps>;
 //#endregion
 export { HeaderNotifications };
+
 //# sourceMappingURL=headerNotifications.d.ts.map

package/dist/header/headerNotifications.js

@@ -24,7 +24,7 @@ const Badge = styled.spanBox`
 `;
 /** Icon link to Veracity notifications engine with an optional number of new notifications. */
 const HeaderNotifications = vui((props, ref) => {
-	const { children, className, count = 0, url,...rest } = props;
+	const { children, className, count = 0, url, ...rest } = props;
 	const { links } = useHeaderContext() ?? {};
 	const styles = useStyleConfig("Header", useHeaderContext()).notifications;
 	return /* @__PURE__ */ jsx(button_default, {
@@ -52,5 +52,5 @@ var headerNotifications_default = HeaderNotifications;
 
 //#endregion
 export { HeaderNotifications, headerNotifications_default as default };
-globalThis.__vuiVersion__ = "3.1.2"
+globalThis.__vuiVersion__ = "4.0.0-beta.1"
 //# sourceMappingURL=headerNotifications.js.map

package/dist/header/headerNotifications.js.map

@@ -1 +1 @@
-{"version":3,"file":"headerNotifications.js","names":["Button"],"sources":["../../src/header/headerNotifications.tsx"],"sourcesContent":["import Button from '../button'\nimport { styled, useStyleConfig, vui } from '../core'\nimport { cs } from '../utils'\nimport { useHeaderContext } from './context'\nimport type { HeaderNotificationsProps } from './header.types'\n\nconst Badge = styled.spanBox`\n  align-items: center;\n  background-color: energyRed.45;\n  border-radius: round;\n  color: white;\n  display: flex;\n  font-size: 12px;\n  font-weight: medium;\n  height: 20px;\n  justify-content: center;\n  position: absolute;\n  right: 1px;\n  top: 1px;\n  min-width: 20px;\n`\n\n/** Icon link to Veracity notifications engine with an optional number of new notifications. */\nexport const HeaderNotifications = vui<'a', HeaderNotificationsProps>((props, ref) => {\n  const { children, className, count = 0, url, ...rest } = props\n  const { links } = useHeaderContext() ?? {}\n  const styles = useStyleConfig('Header', useHeaderContext()).notifications\n\n  return (\n    <Button\n      as=\"a\"\n      className={cs('vui-headerNotifications', className)}\n      href={url ?? links.notifications}\n      minW={0}\n      position=\"relative\"\n      px=\"9px\"\n      ref={ref}\n      size=\"lg\"\n      title=\"Notifications\"\n      variant=\"tertiaryDark\"\n      {...styles.container}\n      {...rest}\n    >\n      {children ?? (\n        <>\n          <Button.Icon name=\"uiBell\" />\n          {count > 0 && (\n            <Badge px={count < 9 ? '0' : '4px'} right={count < 9 ? 1 : 0}>\n              {count < 100 ? count : '99+'}\n            </Badge>\n          )}\n        </>\n      )}\n    </Button>\n  )\n})\n\nHeaderNotifications.displayName = 'HeaderNotifications'\n\nexport default HeaderNotifications\n"],"mappings":";;;;;;;;;AAMA,MAAM,QAAQ,OAAO,OAAO;;;;;;;;;;;;;;;;AAiB5B,MAAa,sBAAsB,KAAoC,OAAO,QAAQ;CACpF,MAAM,EAAE,UAAU,WAAW,QAAQ,GAAG,IAAK,GAAG,SAAS;CACzD,MAAM,EAAE,UAAU,kBAAkB,IAAI,EAAE;CAC1C,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC,CAAC;AAE5D,QACE,oBAACA;EACC,IAAG;EACH,WAAW,GAAG,2BAA2B,UAAU;EACnD,MAAM,OAAO,MAAM;EACnB,MAAM;EACN,UAAS;EACT,IAAG;EACE;EACL,MAAK;EACL,OAAM;EACN,SAAQ;EACR,GAAI,OAAO;EACX,GAAI;YAEH,YACC,4CACE,oBAACA,eAAO,QAAK,MAAK,WAAW,EAC5B,QAAQ,KACP,oBAAC;GAAM,IAAI,QAAQ,IAAI,MAAM;GAAO,OAAO,QAAQ,IAAI,IAAI;aACxD,QAAQ,MAAM,QAAQ;IACjB,IAET;GAEE;EAEX;AAEF,oBAAoB,cAAc;AAElC,kCAAe"}
+{"version":3,"file":"headerNotifications.js","names":["Button"],"sources":["../../src/header/headerNotifications.tsx"],"sourcesContent":["import Button from '../button'\nimport { styled, useStyleConfig, vui } from '../core'\nimport { cs } from '../utils'\nimport { useHeaderContext } from './context'\nimport type { HeaderNotificationsProps } from './header.types'\n\nconst Badge = styled.spanBox`\n  align-items: center;\n  background-color: energyRed.45;\n  border-radius: round;\n  color: white;\n  display: flex;\n  font-size: 12px;\n  font-weight: medium;\n  height: 20px;\n  justify-content: center;\n  position: absolute;\n  right: 1px;\n  top: 1px;\n  min-width: 20px;\n`\n\n/** Icon link to Veracity notifications engine with an optional number of new notifications. */\nexport const HeaderNotifications = vui<'a', HeaderNotificationsProps>((props, ref) => {\n  const { children, className, count = 0, url, ...rest } = props\n  const { links } = useHeaderContext() ?? {}\n  const styles = useStyleConfig('Header', useHeaderContext()).notifications\n\n  return (\n    <Button\n      as=\"a\"\n      className={cs('vui-headerNotifications', className)}\n      href={url ?? links.notifications}\n      minW={0}\n      position=\"relative\"\n      px=\"9px\"\n      ref={ref}\n      size=\"lg\"\n      title=\"Notifications\"\n      variant=\"tertiaryDark\"\n      {...styles.container}\n      {...rest}\n    >\n      {children ?? (\n        <>\n          <Button.Icon name=\"uiBell\" />\n          {count > 0 && (\n            <Badge px={count < 9 ? '0' : '4px'} right={count < 9 ? 1 : 0}>\n              {count < 100 ? count : '99+'}\n            </Badge>\n          )}\n        </>\n      )}\n    </Button>\n  )\n})\n\nHeaderNotifications.displayName = 'HeaderNotifications'\n\nexport default HeaderNotifications\n"],"mappings":";;;;;;;;;AAMA,MAAM,QAAQ,OAAO,OAAO;;;;;;;;;;;;;;;;AAiB5B,MAAa,sBAAsB,KAAoC,OAAO,QAAQ;CACpF,MAAM,EAAE,UAAU,WAAW,QAAQ,GAAG,KAAK,GAAG,SAAS;CACzD,MAAM,EAAE,UAAU,kBAAkB,IAAI,EAAE;CAC1C,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC,CAAC;AAE5D,QACE,oBAACA;EACC,IAAG;EACH,WAAW,GAAG,2BAA2B,UAAU;EACnD,MAAM,OAAO,MAAM;EACnB,MAAM;EACN,UAAS;EACT,IAAG;EACE;EACL,MAAK;EACL,OAAM;EACN,SAAQ;EACR,GAAI,OAAO;EACX,GAAI;YAEH,YACC,4CACE,oBAACA,eAAO,QAAK,MAAK,WAAW,EAC5B,QAAQ,KACP,oBAAC;GAAM,IAAI,QAAQ,IAAI,MAAM;GAAO,OAAO,QAAQ,IAAI,IAAI;aACxD,QAAQ,MAAM,QAAQ;IACjB,IAET;GAEE;EAEX;AAEF,oBAAoB,cAAc;AAElC,kCAAe"}

package/dist/header/headerServices.d.ts

@@ -1,12 +1,13 @@
 import { HeaderServicesProps } from "./header.types.js";
-import * as react_jsx_runtime4 from "react/jsx-runtime";
+import * as react_jsx_runtime8 from "react/jsx-runtime";
 
 //#region src/header/headerServices.d.ts
 /** Displays a list of services available to the user. */
-declare function HeaderServices(props: HeaderServicesProps): react_jsx_runtime4.JSX.Element;
+declare function HeaderServices(props: HeaderServicesProps): react_jsx_runtime8.JSX.Element;
 declare namespace HeaderServices {
   var displayName: string;
 }
 //#endregion
 export { HeaderServices };
+
 //# sourceMappingURL=headerServices.d.ts.map

package/dist/header/headerServices.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"headerServices.d.ts","names":[],"sources":["../../src/header/headerServices.tsx"],"sourcesContent":[],"mappings":";;;;;iBAyBgB,cAAA,QAAsB,sBAAmB,kBAAA,CAAA,GAAA,CAAA;kBAAzC,cAAA;EAAA,GAAA,CAAA,WAAA,CAAA,CAAc,MAAA"}
+{"version":3,"file":"headerServices.d.ts","names":[],"sources":["../../src/header/headerServices.tsx"],"sourcesContent":[],"mappings":";;;;;iBAyBgB,cAAA,QAAsB,sBAAmB,kBAAA,CAAA,GAAA,CAAA;kBAAzC,cAAA;EAAA,IAAA,WAAA,EAAc,MAAA"}

package/dist/header/headerServices.js

@@ -20,7 +20,7 @@ function ListContent({ links = [] }) {
 }
 /** Displays a list of services available to the user. */
 function HeaderServices(props) {
-	const { buttonProps, isApplication = false, links = [], showTopBorder = false,...rest } = props;
+	const { buttonProps, isApplication = false, links = [], showTopBorder = false, ...rest } = props;
 	const styles = useStyleConfig("Header", useHeaderContext()).services;
 	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(RenderOnScreen, {
 		minWidth: "lg",
@@ -65,5 +65,5 @@ var headerServices_default = HeaderServices;
 
 //#endregion
 export { HeaderServices, headerServices_default as default };
-globalThis.__vuiVersion__ = "3.1.2"
+globalThis.__vuiVersion__ = "4.0.0-beta.1"
 //# sourceMappingURL=headerServices.js.map

package/dist/header/headerServices.js.map

@@ -1 +1 @@
-{"version":3,"file":"headerServices.js","names":["Menu","HeaderServicesMessage","List"],"sources":["../../src/header/headerServices.tsx"],"sourcesContent":["import { RenderOnScreen, useStyleConfig } from '../core'\nimport List from '../list'\nimport Menu from '../menu'\nimport { useHeaderContext } from './context'\nimport type { HeaderServicesProps } from './header.types'\nimport HeaderServicesMessage from './headerServicesMessage'\n\n/** Supporting internal component to avoid code duplication. */\nfunction ListContent({ links = [] }: Pick<HeaderServicesProps, 'links'>) {\n  const styles = useStyleConfig('Header', useHeaderContext()).services\n\n  return (\n    <>\n      {links.length > 0 ? (\n        links.map(({ text, url }, index) => (\n          <Menu.Item isTruncated key={index} linkProps={{ href: url }} text={text} title={text} {...styles.item} />\n        ))\n      ) : (\n        <HeaderServicesMessage />\n      )}\n    </>\n  )\n}\n\n/** Displays a list of services available to the user. */\nexport function HeaderServices(props: HeaderServicesProps) {\n  const { buttonProps, isApplication = false, links = [], showTopBorder = false, ...rest } = props\n  const styles = useStyleConfig('Header', useHeaderContext()).services\n\n  const offsetX = isApplication ? 179 : 135\n\n  return (\n    <>\n      <RenderOnScreen minWidth=\"lg\">\n        <Menu isLazy={false} offset={[offsetX, 17]} placement=\"bottom-end\" size=\"lg\" {...rest}>\n          <Menu.Button\n            className=\"vui-services-trigger\"\n            icon=\"uiTh\"\n            ml={1}\n            size=\"lg\"\n            title=\"My services\"\n            {...styles.button}\n            {...buttonProps}\n          />\n\n          <Menu.List heading=\"My Services\" maxH={295} right={0} w={320} {...styles.list}>\n            <ListContent links={links} />\n          </Menu.List>\n        </Menu>\n      </RenderOnScreen>\n\n      <RenderOnScreen maxWidth=\"lg\">\n        <List\n          heading=\"My Services\"\n          {...styles.list}\n          borderTop={showTopBorder ? 1 : 0}\n          borderTopColor=\"sandstone.main\"\n          maxH={295}\n          pt={1}\n        >\n          <ListContent links={links} />\n        </List>\n      </RenderOnScreen>\n    </>\n  )\n}\n\nHeaderServices.displayName = 'HeaderServices'\n\nexport default HeaderServices\n"],"mappings":";;;;;;;;;;AAQA,SAAS,YAAY,EAAE,QAAQ,EAAE,IAAwC;CACvE,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC,CAAC;AAE5D,QACE,0CACG,MAAM,SAAS,IACd,MAAM,KAAK,EAAE,MAAM,OAAO,UACxB,oBAACA,aAAK;EAAK;EAAwB,WAAW,EAAE,MAAM,KAAK;EAAQ;EAAM,OAAO;EAAM,GAAI,OAAO;IAArE,MAA6E,CACzG,GAEF,oBAACC,kCAAwB,GAE1B;;;AAKP,SAAgB,eAAe,OAA4B;CACzD,MAAM,EAAE,aAAa,gBAAgB,OAAO,QAAQ,EAAE,EAAE,gBAAgB,MAAO,GAAG,SAAS;CAC3F,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC,CAAC;AAI5D,QACE,4CACE,oBAAC;EAAe,UAAS;YACvB,qBAACD;GAAK,QAAQ;GAAO,QAAQ,CALnB,gBAAgB,MAAM,KAKO,GAAG;GAAE,WAAU;GAAa,MAAK;GAAK,GAAI;cAC/E,oBAACA,aAAK;IACJ,WAAU;IACV,MAAK;IACL,IAAI;IACJ,MAAK;IACL,OAAM;IACN,GAAI,OAAO;IACX,GAAI;KACJ,EAEF,oBAACA,aAAK;IAAK,SAAQ;IAAc,MAAM;IAAK,OAAO;IAAG,GAAG;IAAK,GAAI,OAAO;cACvE,oBAAC,eAAmB,QAAS;KACnB;IACP;GACQ,EAEjB,oBAAC;EAAe,UAAS;YACvB,oBAACE;GACC,SAAQ;GACR,GAAI,OAAO;GACX,WAAW,gBAAgB,IAAI;GAC/B,gBAAe;GACf,MAAM;GACN,IAAI;aAEJ,oBAAC,eAAmB,QAAS;IACxB;GACQ,IAChB;;AAIP,eAAe,cAAc;AAE7B,6BAAe"}
+{"version":3,"file":"headerServices.js","names":["Menu","HeaderServicesMessage","List"],"sources":["../../src/header/headerServices.tsx"],"sourcesContent":["import { RenderOnScreen, useStyleConfig } from '../core'\nimport List from '../list'\nimport Menu from '../menu'\nimport { useHeaderContext } from './context'\nimport type { HeaderServicesProps } from './header.types'\nimport HeaderServicesMessage from './headerServicesMessage'\n\n/** Supporting internal component to avoid code duplication. */\nfunction ListContent({ links = [] }: Pick<HeaderServicesProps, 'links'>) {\n  const styles = useStyleConfig('Header', useHeaderContext()).services\n\n  return (\n    <>\n      {links.length > 0 ? (\n        links.map(({ text, url }, index) => (\n          <Menu.Item isTruncated key={index} linkProps={{ href: url }} text={text} title={text} {...styles.item} />\n        ))\n      ) : (\n        <HeaderServicesMessage />\n      )}\n    </>\n  )\n}\n\n/** Displays a list of services available to the user. */\nexport function HeaderServices(props: HeaderServicesProps) {\n  const { buttonProps, isApplication = false, links = [], showTopBorder = false, ...rest } = props\n  const styles = useStyleConfig('Header', useHeaderContext()).services\n\n  const offsetX = isApplication ? 179 : 135\n\n  return (\n    <>\n      <RenderOnScreen minWidth=\"lg\">\n        <Menu isLazy={false} offset={[offsetX, 17]} placement=\"bottom-end\" size=\"lg\" {...rest}>\n          <Menu.Button\n            className=\"vui-services-trigger\"\n            icon=\"uiTh\"\n            ml={1}\n            size=\"lg\"\n            title=\"My services\"\n            {...styles.button}\n            {...buttonProps}\n          />\n\n          <Menu.List heading=\"My Services\" maxH={295} right={0} w={320} {...styles.list}>\n            <ListContent links={links} />\n          </Menu.List>\n        </Menu>\n      </RenderOnScreen>\n\n      <RenderOnScreen maxWidth=\"lg\">\n        <List\n          heading=\"My Services\"\n          {...styles.list}\n          borderTop={showTopBorder ? 1 : 0}\n          borderTopColor=\"sandstone.main\"\n          maxH={295}\n          pt={1}\n        >\n          <ListContent links={links} />\n        </List>\n      </RenderOnScreen>\n    </>\n  )\n}\n\nHeaderServices.displayName = 'HeaderServices'\n\nexport default HeaderServices\n"],"mappings":";;;;;;;;;;AAQA,SAAS,YAAY,EAAE,QAAQ,EAAE,IAAwC;CACvE,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC,CAAC;AAE5D,QACE,0CACG,MAAM,SAAS,IACd,MAAM,KAAK,EAAE,MAAM,OAAO,UACxB,oBAACA,aAAK;EAAK;EAAwB,WAAW,EAAE,MAAM,KAAK;EAAQ;EAAM,OAAO;EAAM,GAAI,OAAO;IAArE,MAA6E,CACzG,GAEF,oBAACC,kCAAwB,GAE1B;;;AAKP,SAAgB,eAAe,OAA4B;CACzD,MAAM,EAAE,aAAa,gBAAgB,OAAO,QAAQ,EAAE,EAAE,gBAAgB,OAAO,GAAG,SAAS;CAC3F,MAAM,SAAS,eAAe,UAAU,kBAAkB,CAAC,CAAC;AAI5D,QACE,4CACE,oBAAC;EAAe,UAAS;YACvB,qBAACD;GAAK,QAAQ;GAAO,QAAQ,CALnB,gBAAgB,MAAM,KAKO,GAAG;GAAE,WAAU;GAAa,MAAK;GAAK,GAAI;cAC/E,oBAACA,aAAK;IACJ,WAAU;IACV,MAAK;IACL,IAAI;IACJ,MAAK;IACL,OAAM;IACN,GAAI,OAAO;IACX,GAAI;KACJ,EAEF,oBAACA,aAAK;IAAK,SAAQ;IAAc,MAAM;IAAK,OAAO;IAAG,GAAG;IAAK,GAAI,OAAO;cACvE,oBAAC,eAAmB,QAAS;KACnB;IACP;GACQ,EAEjB,oBAAC;EAAe,UAAS;YACvB,oBAACE;GACC,SAAQ;GACR,GAAI,OAAO;GACX,WAAW,gBAAgB,IAAI;GAC/B,gBAAe;GACf,MAAM;GACN,IAAI;aAEJ,oBAAC,eAAmB,QAAS;IACxB;GACQ,IAChB;;AAIP,eAAe,cAAc;AAE7B,6BAAe"}

package/dist/header/headerServicesMessage.d.ts

@@ -8,4 +8,5 @@ import "../index.js";
 declare const HeaderServicesMessage: VuiComponent<"p", PProps>;
 //#endregion
 export { HeaderServicesMessage };
+
 //# sourceMappingURL=headerServicesMessage.d.ts.map

package/dist/header/headerServicesMessage.js

@@ -9,7 +9,7 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 //#region src/header/headerServicesMessage.tsx
 /** Displays a message with link to Marketplace if user has no services available. */
 const HeaderServicesMessage = vui((props, ref) => {
-	const { children, className,...rest } = props;
+	const { children, className, ...rest } = props;
 	const { links } = useHeaderContext() ?? {};
 	const styles = useStyleConfig("Header", useHeaderContext());
 	return /* @__PURE__ */ jsx(p_default, {
@@ -38,5 +38,5 @@ var headerServicesMessage_default = HeaderServicesMessage;
 
 //#endregion
 export { HeaderServicesMessage, headerServicesMessage_default as default };
-globalThis.__vuiVersion__ = "3.1.2"
+globalThis.__vuiVersion__ = "4.0.0-beta.1"
 //# sourceMappingURL=headerServicesMessage.js.map