@veracity/vui 2.17.2-beta.3 → 2.18.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/cjs/footer/footer.js +3 -3
  2. package/dist/esm/footer/footer.js +3 -3
  3. package/package.json +1 -1
  4. package/src/footer/footer.tsx +3 -3
package/dist/cjs/footer/footer.js CHANGED
@@ -67,11 +67,11 @@ exports.Footer = (0, core_1.vui)((props, ref) => {
67
67
  });
68
68
  const downMd = (0, core_1.useDown)('md');
69
69
  const downLg = (0, core_1.useDown)('lg');
70
- return ((0, jsx_runtime_1.jsx)(context_1.FooterProvider, { value: context, children: (0, jsx_runtime_1.jsxs)(exports.FooterBase, Object.assign({ className: (0, utils_1.cs)('vui-footer', isApplication ? 'vui-footer-app' : '', className), px: isApplication ? '40px' : 3, py: isSlim ? (downMd ? '16px' : '9px') : 5, role: "contentinfo" }, styles.container, { ref: ref }, rest, { children: [isApplication && ((0, jsx_runtime_1.jsx)(footerContent_1.default, { alignContent: "center", alignItems: "center", maxW: "100%", children: (0, jsx_runtime_1.jsxs)(footerRow_1.default, { alignContent: "space-between", w: 1, children: [(0, jsx_runtime_1.jsx)(box_1.Box, { alignItems: "self-start", columnGap: 3, flex: { xs: '0 0 100%', sm: '0 0 100%', md: '0 0 100%', lg: '0 0 50%' }, py: { xs: 1, sm: 1, md: 1.25, lg: 1.5 }, wrap: true, children: applicationLinks === null || applicationLinks === void 0 ? void 0 : applicationLinks.map((link, index) => ((0, jsx_runtime_1.jsxs)(box_1.Box, { flex: { xs: '0 0 50%', sm: '0 0 auto' }, children: [link.items && ((0, jsx_runtime_1.jsxs)(menu_1.default, Object.assign({ isLazy: false, offset: [-16, 9], placement: "top-start", size: "lg" }, rest, { children: [(0, jsx_runtime_1.jsx)(menu_1.default.Button, Object.assign({ as: link_1.Link, className: "vui-footerLink-trigger", pt: "3px", role: "button", text: link.text, title: link.text }, styles.link, rest)), (0, jsx_runtime_1.jsx)(menu_1.default.List, Object.assign({ maxH: 400, right: 0, w: 320 }, styles.list, { children: link.items.map(({ text, url }, index) => ((0, jsx_runtime_1.jsx)(menu_1.default.Item, Object.assign({ isTruncated: true, linkProps: { href: url }, text: text, title: text }, styles.item), index))) }))] }))), !link.items && (0, jsx_runtime_1.jsx)(footerLink_1.default, Object.assign({}, link, { href: link.url }))] }, index))) }), downLg && (0, jsx_runtime_1.jsx)(divider_1.Divider, { borderColor: "sandstone.main", mb: 0.5, mt: 1, w: 1 }), (0, jsx_runtime_1.jsxs)(box_1.Box, { centerV: true, columnGap: 3, flex: { xs: '0 0 100%', sm: '0 0 100%', md: '0 0 100%', lg: '0 0 50%' }, justifyContent: { sm: 'center', lg: 'flex-end' }, py: { xs: 1, sm: 1, md: 1.25, lg: 1.5 }, wrap: true, children: [applicationStaticItems === null || applicationStaticItems === void 0 ? void 0 : applicationStaticItems.map((text, index) => ((0, jsx_runtime_1.jsx)(box_1.Box, { children: (0, jsx_runtime_1.jsx)(t_1.T, { size: "sm", children: text }) }, index))), isDNV ? ((0, jsx_runtime_1.jsx)(box_1.Box, { children: (0, jsx_runtime_1.jsxs)(t_1.T, { size: "sm", children: ["\u00A9 DNV AS ", currentYear] }) })) : ((0, jsx_runtime_1.jsx)(box_1.Box, { children: (0, jsx_runtime_1.jsxs)(t_1.T, { size: "sm", children: [(0, jsx_runtime_1.jsx)(t_1.T, { weight: "demi", children: "Veracity by DNV" }), ", DNV AS"] }) })), (0, jsx_runtime_1.jsxs)(box_1.Box, { children: [applicationSocialLinks === null || applicationSocialLinks === void 0 ? void 0 : applicationSocialLinks.map((link, index) => ((0, jsx_runtime_1.jsx)(link_1.Link, Object.assign({ "aria-label": link.text, fontWeight: "demi", href: link.url, iconLeft: (0, jsx_runtime_1.jsx)(link_1.Link.Icon, { name: `cubCircle${link.text}`, radius: "50%", size: "xs" }), isExternal: true, mr: 1, size: { _: 'sm', md: 'md' } }, styles.link), index))), (0, jsx_runtime_1.jsx)(link_1.Link, Object.assign({ fontWeight: "demi", href: linkedIn !== null && linkedIn !== void 0 ? linkedIn : footerTrademark_1.defaultLinkedInUrl, isExternal: true, size: { _: 'sm', md: 'md' } }, styles.link, { children: (0, jsx_runtime_1.jsx)(footerHeading_1.default, { fontSize: "16px", mb: 0, text: "Follow us" }) }))] })] })] }) })), !isApplication && isSlim && ((0, jsx_runtime_1.jsx)(footerContent_1.default, { alignContent: "center", alignItems: "center", maxW: { xs: 343, sm: 305, md: 720, lg: 975 }, children: (0, jsx_runtime_1.jsxs)(footerRow_1.default, { children: [slimLinks.map((link, index) => {
70
+ return ((0, jsx_runtime_1.jsx)(context_1.FooterProvider, { value: context, children: (0, jsx_runtime_1.jsxs)(exports.FooterBase, Object.assign({ className: (0, utils_1.cs)('vui-footer', isApplication ? 'vui-footer-app' : '', className), px: isApplication ? '40px' : 3, py: isSlim ? (downMd ? '16px' : '9px') : 5, role: "contentinfo" }, styles.container, { ref: ref }, rest, { children: [isApplication && ((0, jsx_runtime_1.jsx)(footerContent_1.default, { alignContent: "center", alignItems: "center", maxW: "100%", children: (0, jsx_runtime_1.jsxs)(footerRow_1.default, { alignContent: "space-between", w: 1, children: [(0, jsx_runtime_1.jsx)(box_1.Box, { alignItems: "self-start", columnGap: 3, flex: { xs: '0 0 100%', sm: '0 0 100%', md: '0 0 100%', lg: '0 0 50%' }, py: { xs: 1, sm: 1, md: 1.25, lg: 1.5 }, wrap: true, children: applicationLinks === null || applicationLinks === void 0 ? void 0 : applicationLinks.map((link, index) => ((0, jsx_runtime_1.jsxs)(box_1.Box, { flex: { xs: '0 0 50%', sm: '0 0 auto' }, children: [link.items && ((0, jsx_runtime_1.jsxs)(menu_1.default, Object.assign({ isLazy: false, offset: [-16, 9], placement: "top-start", size: "lg" }, rest, { children: [(0, jsx_runtime_1.jsx)(menu_1.default.Button, Object.assign({ as: link_1.Link, className: "vui-footerLink-trigger", pt: "3px", role: "button", text: link.text, title: link.text }, styles.link, rest)), (0, jsx_runtime_1.jsx)(menu_1.default.List, Object.assign({ maxH: 400, right: 0, w: 320 }, styles.list, { children: link.items.map(({ text, url }, index) => ((0, jsx_runtime_1.jsx)(menu_1.default.Item, Object.assign({ isTruncated: true, linkProps: { href: url }, text: text, title: text }, styles.item), index))) }))] }))), !link.items && (0, jsx_runtime_1.jsx)(footerLink_1.default, Object.assign({}, link, { href: link.url }))] }, index))) }), downLg && (0, jsx_runtime_1.jsx)(divider_1.Divider, { borderColor: "sandstone.main", mb: 0.5, mt: 1, w: 1 }), (0, jsx_runtime_1.jsxs)(box_1.Box, { centerV: true, columnGap: 3, flex: { xs: '0 0 100%', sm: '0 0 100%', md: '0 0 100%', lg: '0 0 50%' }, justifyContent: { sm: 'center', lg: 'flex-end' }, py: { xs: 1, sm: 1, md: 1.25, lg: 1.5 }, wrap: true, children: [applicationStaticItems === null || applicationStaticItems === void 0 ? void 0 : applicationStaticItems.map((text, index) => ((0, jsx_runtime_1.jsx)(box_1.Box, { children: (0, jsx_runtime_1.jsx)(t_1.T, { size: "sm", children: text }) }, index))), isDNV ? ((0, jsx_runtime_1.jsx)(box_1.Box, { children: (0, jsx_runtime_1.jsxs)(t_1.T, { size: "sm", children: ["\u00A9 DNV AS ", currentYear] }) })) : ((0, jsx_runtime_1.jsx)(box_1.Box, { children: (0, jsx_runtime_1.jsxs)(t_1.T, { size: "sm", children: [(0, jsx_runtime_1.jsx)(t_1.T, { weight: "demi", children: "Veracity by DNV" }), ", DNV AS"] }) })), (0, jsx_runtime_1.jsxs)(box_1.Box, { children: [applicationSocialLinks === null || applicationSocialLinks === void 0 ? void 0 : applicationSocialLinks.map((link, index) => ((0, jsx_runtime_1.jsx)(link_1.Link, Object.assign({ "aria-label": link.text, fontWeight: "demi", href: link.url, iconLeft: (0, jsx_runtime_1.jsx)(link_1.Link.Icon, { name: `cubCircle${link.text}`, radius: "50%", size: "xs" }), isExternal: true, mr: 1, size: { _: 'sm', md: 'md' } }, styles.link), index))), (0, jsx_runtime_1.jsx)(link_1.Link, Object.assign({ fontWeight: "demi", href: linkedIn !== null && linkedIn !== void 0 ? linkedIn : footerTrademark_1.defaultLinkedInUrl, isExternal: true, size: { _: 'sm', md: 'md' } }, styles.link, { children: (0, jsx_runtime_1.jsx)(footerHeading_1.default, { fontSize: "16px", mb: 0, text: "Follow us" }) }))] })] })] }) })), !isApplication && isSlim && ((0, jsx_runtime_1.jsx)(footerContent_1.default, { alignContent: "center", alignItems: "center", maxW: { xs: 343, sm: 305, md: 720, lg: 975 }, children: (0, jsx_runtime_1.jsxs)(footerRow_1.default, { children: [slimLinks.map(({ text, url, id }, index) => {
71
71
  /** if the screen is small drop one specific link */
72
- if (downLg && (link === null || link === void 0 ? void 0 : link.id) === 'support')
72
+ if (downLg && id === 'support')
73
73
  return;
74
- return ((0, jsx_runtime_1.jsx)(footerSlimColumn_1.default, { children: (0, jsx_runtime_1.jsx)(footerLink_1.default, Object.assign({}, link)) }, index));
74
+ return ((0, jsx_runtime_1.jsx)(footerSlimColumn_1.default, { children: (0, jsx_runtime_1.jsx)(footerLink_1.default, { href: url, text: text }) }, index));
75
75
  }), downMd && (0, jsx_runtime_1.jsx)(divider_1.Divider, { borderColor: "sandstone.main", mb: 0.5, mt: 1, w: 1 }), (0, jsx_runtime_1.jsx)(footerSlimColumn_1.default, { centerV: true, children: (0, jsx_runtime_1.jsxs)(t_1.T, { size: "xs", children: [(0, jsx_runtime_1.jsx)(t_1.T, { weight: "demi", children: "Veracity by DNV" }), ", DNV AS"] }) }), (0, jsx_runtime_1.jsx)(footerSlimColumn_1.default, { children: (0, jsx_runtime_1.jsx)(link_1.Link, Object.assign({ fontWeight: "demi", href: linkedIn !== null && linkedIn !== void 0 ? linkedIn : footerTrademark_1.defaultLinkedInUrl, iconLeft: (0, jsx_runtime_1.jsx)(link_1.Link.Icon, { mr: 1, name: "cubCircleLinkedIn", radius: "50%", size: "xs" }), isExternal: true, size: { _: 'sm', md: 'md' } }, styles.link, { children: (0, jsx_runtime_1.jsx)(footerHeading_1.default, { fontSize: "16px", mb: 0, text: "Follow us" }) })) })] }) })), !isApplication && !isSlim && ((0, jsx_runtime_1.jsxs)(footerContent_1.default, { children: [children !== null && children !== void 0 ? children : (columns && ((0, jsx_runtime_1.jsx)(footerRow_1.default, { children: columns.map((sections, index) => ((0, jsx_runtime_1.jsx)(footerColumn_1.default, { sections: sections }, index))) }))), children || columns ? (0, jsx_runtime_1.jsx)(divider_1.Divider, { borderColor: "sandstone.main", my: 4 }) : null, (0, jsx_runtime_1.jsx)(footerRow_1.default, { children: (0, jsx_runtime_1.jsx)(footerTrademark_1.FooterTrademark, { linkedIn: linkedIn }) })] }))] })) }));
76
76
  });
77
77
  exports.Footer.Column = footerColumn_1.default;
package/dist/esm/footer/footer.js CHANGED
@@ -49,11 +49,11 @@ export const Footer = vui((props, ref) => {
49
49
  });
50
50
  const downMd = useDown('md');
51
51
  const downLg = useDown('lg');
52
- return (_jsx(FooterProvider, { value: context, children: _jsxs(FooterBase, { className: cs('vui-footer', isApplication ? 'vui-footer-app' : '', className), px: isApplication ? '40px' : 3, py: isSlim ? (downMd ? '16px' : '9px') : 5, role: "contentinfo", ...styles.container, ref: ref, ...rest, children: [isApplication && (_jsx(FooterContent, { alignContent: "center", alignItems: "center", maxW: "100%", children: _jsxs(FooterRow, { alignContent: "space-between", w: 1, children: [_jsx(Box, { alignItems: "self-start", columnGap: 3, flex: { xs: '0 0 100%', sm: '0 0 100%', md: '0 0 100%', lg: '0 0 50%' }, py: { xs: 1, sm: 1, md: 1.25, lg: 1.5 }, wrap: true, children: applicationLinks?.map((link, index) => (_jsxs(Box, { flex: { xs: '0 0 50%', sm: '0 0 auto' }, children: [link.items && (_jsxs(Menu, { isLazy: false, offset: [-16, 9], placement: "top-start", size: "lg", ...rest, children: [_jsx(Menu.Button, { as: Link, className: "vui-footerLink-trigger", pt: "3px", role: "button", text: link.text, title: link.text, ...styles.link, ...rest }), _jsx(Menu.List, { maxH: 400, right: 0, w: 320, ...styles.list, children: link.items.map(({ text, url }, index) => (_jsx(Menu.Item, { isTruncated: true, linkProps: { href: url }, text: text, title: text, ...styles.item }, index))) })] })), !link.items && _jsx(FooterLink, { ...link, href: link.url })] }, index))) }), downLg && _jsx(Divider, { borderColor: "sandstone.main", mb: 0.5, mt: 1, w: 1 }), _jsxs(Box, { centerV: true, columnGap: 3, flex: { xs: '0 0 100%', sm: '0 0 100%', md: '0 0 100%', lg: '0 0 50%' }, justifyContent: { sm: 'center', lg: 'flex-end' }, py: { xs: 1, sm: 1, md: 1.25, lg: 1.5 }, wrap: true, children: [applicationStaticItems?.map((text, index) => (_jsx(Box, { children: _jsx(T, { size: "sm", children: text }) }, index))), isDNV ? (_jsx(Box, { children: _jsxs(T, { size: "sm", children: ["\u00A9 DNV AS ", currentYear] }) })) : (_jsx(Box, { children: _jsxs(T, { size: "sm", children: [_jsx(T, { weight: "demi", children: "Veracity by DNV" }), ", DNV AS"] }) })), _jsxs(Box, { children: [applicationSocialLinks?.map((link, index) => (_jsx(Link, { "aria-label": link.text, fontWeight: "demi", href: link.url, iconLeft: _jsx(Link.Icon, { name: `cubCircle${link.text}`, radius: "50%", size: "xs" }), isExternal: true, mr: 1, size: { _: 'sm', md: 'md' }, ...styles.link }, index))), _jsx(Link, { fontWeight: "demi", href: linkedIn ?? defaultLinkedInUrl, isExternal: true, size: { _: 'sm', md: 'md' }, ...styles.link, children: _jsx(FooterHeading, { fontSize: "16px", mb: 0, text: "Follow us" }) })] })] })] }) })), !isApplication && isSlim && (_jsx(FooterContent, { alignContent: "center", alignItems: "center", maxW: { xs: 343, sm: 305, md: 720, lg: 975 }, children: _jsxs(FooterRow, { children: [slimLinks.map((link, index) => {
52
+ return (_jsx(FooterProvider, { value: context, children: _jsxs(FooterBase, { className: cs('vui-footer', isApplication ? 'vui-footer-app' : '', className), px: isApplication ? '40px' : 3, py: isSlim ? (downMd ? '16px' : '9px') : 5, role: "contentinfo", ...styles.container, ref: ref, ...rest, children: [isApplication && (_jsx(FooterContent, { alignContent: "center", alignItems: "center", maxW: "100%", children: _jsxs(FooterRow, { alignContent: "space-between", w: 1, children: [_jsx(Box, { alignItems: "self-start", columnGap: 3, flex: { xs: '0 0 100%', sm: '0 0 100%', md: '0 0 100%', lg: '0 0 50%' }, py: { xs: 1, sm: 1, md: 1.25, lg: 1.5 }, wrap: true, children: applicationLinks?.map((link, index) => (_jsxs(Box, { flex: { xs: '0 0 50%', sm: '0 0 auto' }, children: [link.items && (_jsxs(Menu, { isLazy: false, offset: [-16, 9], placement: "top-start", size: "lg", ...rest, children: [_jsx(Menu.Button, { as: Link, className: "vui-footerLink-trigger", pt: "3px", role: "button", text: link.text, title: link.text, ...styles.link, ...rest }), _jsx(Menu.List, { maxH: 400, right: 0, w: 320, ...styles.list, children: link.items.map(({ text, url }, index) => (_jsx(Menu.Item, { isTruncated: true, linkProps: { href: url }, text: text, title: text, ...styles.item }, index))) })] })), !link.items && _jsx(FooterLink, { ...link, href: link.url })] }, index))) }), downLg && _jsx(Divider, { borderColor: "sandstone.main", mb: 0.5, mt: 1, w: 1 }), _jsxs(Box, { centerV: true, columnGap: 3, flex: { xs: '0 0 100%', sm: '0 0 100%', md: '0 0 100%', lg: '0 0 50%' }, justifyContent: { sm: 'center', lg: 'flex-end' }, py: { xs: 1, sm: 1, md: 1.25, lg: 1.5 }, wrap: true, children: [applicationStaticItems?.map((text, index) => (_jsx(Box, { children: _jsx(T, { size: "sm", children: text }) }, index))), isDNV ? (_jsx(Box, { children: _jsxs(T, { size: "sm", children: ["\u00A9 DNV AS ", currentYear] }) })) : (_jsx(Box, { children: _jsxs(T, { size: "sm", children: [_jsx(T, { weight: "demi", children: "Veracity by DNV" }), ", DNV AS"] }) })), _jsxs(Box, { children: [applicationSocialLinks?.map((link, index) => (_jsx(Link, { "aria-label": link.text, fontWeight: "demi", href: link.url, iconLeft: _jsx(Link.Icon, { name: `cubCircle${link.text}`, radius: "50%", size: "xs" }), isExternal: true, mr: 1, size: { _: 'sm', md: 'md' }, ...styles.link }, index))), _jsx(Link, { fontWeight: "demi", href: linkedIn ?? defaultLinkedInUrl, isExternal: true, size: { _: 'sm', md: 'md' }, ...styles.link, children: _jsx(FooterHeading, { fontSize: "16px", mb: 0, text: "Follow us" }) })] })] })] }) })), !isApplication && isSlim && (_jsx(FooterContent, { alignContent: "center", alignItems: "center", maxW: { xs: 343, sm: 305, md: 720, lg: 975 }, children: _jsxs(FooterRow, { children: [slimLinks.map(({ text, url, id }, index) => {
53
53
  /** if the screen is small drop one specific link */
54
- if (downLg && link?.id === 'support')
54
+ if (downLg && id === 'support')
55
55
  return;
56
- return (_jsx(FooterSlimColumn, { children: _jsx(FooterLink, { ...link }) }, index));
56
+ return (_jsx(FooterSlimColumn, { children: _jsx(FooterLink, { href: url, text: text }) }, index));
57
57
  }), downMd && _jsx(Divider, { borderColor: "sandstone.main", mb: 0.5, mt: 1, w: 1 }), _jsx(FooterSlimColumn, { centerV: true, children: _jsxs(T, { size: "xs", children: [_jsx(T, { weight: "demi", children: "Veracity by DNV" }), ", DNV AS"] }) }), _jsx(FooterSlimColumn, { children: _jsx(Link, { fontWeight: "demi", href: linkedIn ?? defaultLinkedInUrl, iconLeft: _jsx(Link.Icon, { mr: 1, name: "cubCircleLinkedIn", radius: "50%", size: "xs" }), isExternal: true, size: { _: 'sm', md: 'md' }, ...styles.link, children: _jsx(FooterHeading, { fontSize: "16px", mb: 0, text: "Follow us" }) }) })] }) })), !isApplication && !isSlim && (_jsxs(FooterContent, { children: [children ??
58
58
  (columns && (_jsx(FooterRow, { children: columns.map((sections, index) => (_jsx(FooterColumn, { sections: sections }, index))) }))), children || columns ? _jsx(Divider, { borderColor: "sandstone.main", my: 4 }) : null, _jsx(FooterRow, { children: _jsx(FooterTrademark, { linkedIn: linkedIn }) })] }))] }) }));
59
59
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@veracity/vui",
3
- "version": "2.17.2-beta.3",
3
+ "version": "2.18.0",
4
4
  "description": "Veracity UI is a React component library crafted for use within Veracity applications and pages. Based on Styled Components and @xstyled.",
5
5
  "module": "./dist/esm/index.js",
6
6
  "main": "./dist/cjs/index.js",
package/src/footer/footer.tsx CHANGED
@@ -185,13 +185,13 @@ export const Footer = vui<'div', FooterProps>((props, ref) => {
185
185
  {!isApplication && isSlim && (
186
186
  <FooterContent alignContent="center" alignItems="center" maxW={{ xs: 343, sm: 305, md: 720, lg: 975 }}>
187
187
  <FooterRow>
188
- {slimLinks.map((link, index) => {
188
+ {slimLinks.map(({ text, url, id }, index) => {
189
189
  /** if the screen is small drop one specific link */
190
- if (downLg && link?.id === 'support') return
190
+ if (downLg && id === 'support') return
191
191
 
192
192
  return (
193
193
  <FooterSlimColumn key={index}>
194
- <FooterLink {...link} />
194
+ <FooterLink href={url} text={text} />
195
195
  </FooterSlimColumn>
196
196
  )
197
197
  })}