@veracity/vui 2.13.0 → 2.13.1

package/src/footer/footer.tsx

@@ -30,11 +30,13 @@ export const FooterBase = styled.divBox`
 export const Footer = vui<'div', FooterProps>((props, ref) => {
   const {
     applicationLinks,
+    applicationSocialLinks = [],
     applicationStaticItems = [],
     children,
     className,
     columns,
     isApplication = false,
+    isDNV = false,
     linkedIn,
     size,
     variant,
@@ -144,11 +146,34 @@ export const Footer = vui<'div', FooterProps>((props, ref) => {
                     <T size="sm">{text}</T>
                   </Box>
                 ))}
+
+                {isDNV ? (
+                  <Box>
+                    <T size="sm">@ DNV AS 2021</T>
+                  </Box>
+                ) : (
+                  <Box>
+                    <T size="sm">
+                      <T weight="demi">Veracity by DNV</T>, DNV AS
+                    </T>
+                  </Box>
+                )}
                 <Box>
+                  {applicationSocialLinks?.map((link, index) => (
+                    <Link
+                      fontWeight="demi"
+                      href={link.url}
+                      iconLeft={<Link.Icon name={`cubCircle${link.text}`} radius="50%" size="xs" />}
+                      isExternal
+                      key={index}
+                      mr={1}
+                      size={{ _: 'sm', md: 'md' }}
+                      {...styles.link}
+                    ></Link>
+                  ))}
                   <Link
                     fontWeight="demi"
                     href={linkedIn ?? defaultLinkedInUrl}
-                    iconLeft={<Link.Icon mr={1} name="cubCircleLinkedIn" radius="50%" size="xs" />}
                     isExternal
                     size={{ _: 'sm', md: 'md' }}
                     {...styles.link}
@@ -179,10 +204,7 @@ export const Footer = vui<'div', FooterProps>((props, ref) => {
 
               <FooterSlimColumn centerV>
                 <T size="xs">
-                  <T size="xs" weight="demi">
-                    Veracity by DNV
-                  </T>
-                  , DNV AS
+                  <T weight="demi">Veracity by DNV</T>, DNV AS
                 </T>
               </FooterSlimColumn>
               <FooterSlimColumn>
@@ -237,5 +259,6 @@ Footer.Heading = FooterHeading
 Footer.Link = FooterLink
 Footer.Row = FooterRow
 Footer.Section = FooterSection
+Footer.displayName = 'Footer'
 
 export default Footer

package/src/footer/footer.types.ts

@@ -26,13 +26,17 @@ export type FooterProps = Omit<BoxProps, 'size' | 'variant'> &
   ThemingProps<'Footer'> &
   Pick<FooterTrademarkProps, 'linkedIn'> & {
     applicationLinks?: FooterLinkData[]
+    applicationSocialLinks?: FooterLinkData[]
     applicationStaticItems?: string[]
     /** Data defining content of multiple columns. */
     columns?: FooterColumnData[]
     isApplication?: boolean
     isSlim?: boolean
+    isDNV?: boolean
   }
 
+export type ApplicationFooterProps = Omit<FooterProps, 'isApplication' | 'isSlim'> & {}
+
 /** Section consists of multiple links with text (label) and url */
 export type FooterSectionData = {
   heading?: string

package/src/footer/footerColumn.tsx

@@ -29,4 +29,5 @@ const FooterColumn = vui<'div', FooterColumnProps>((props, ref) => {
   )
 })
 
+FooterColumn.displayName = 'FooterColumn'
 export default FooterColumn

package/src/footer/footerContent.tsx

@@ -26,4 +26,5 @@ export const FooterContent = vui<'div', FooterContentProps>((props, ref) => {
   )
 })
 
+FooterContent.displayName = 'FooterContent'
 export default FooterContent

package/src/footer/footerHeading.tsx

@@ -23,4 +23,5 @@ export const FooterHeading = vui<'h5', HeadingProps>((props, ref) => {
   )
 })
 
+FooterHeading.displayName = 'FooterHeading'
 export default FooterHeading

package/src/footer/footerLink.tsx

@@ -23,4 +23,5 @@ export const FooterLink = vui<'a', LinkProps>((props, ref) => {
   )
 })
 
+FooterLink.displayName = 'FooterLink'
 export default FooterLink

package/src/footer/footerRow.tsx

@@ -13,4 +13,5 @@ const FooterRow = vui<'div', BoxProps>((props, ref) => {
   return <Box className={cs('vui-footerRow', className)} m={-1.5} ref={ref} wrap {...styles.row} {...rest} />
 })
 
+FooterRow.displayName = 'FooterRow'
 export default FooterRow

package/src/footer/footerSection.tsx

@@ -33,4 +33,5 @@ export const FooterSection = vui<'div', FooterSectionProps>((props, ref) => {
   )
 })
 
+FooterSection.displayName = 'FooterSection'
 export default FooterSection

package/src/footer/footerSlimColumn.tsx

@@ -27,4 +27,6 @@ const FooterSlimColumn = vui<'div', BoxProps>((props, ref) => {
   )
 })
 
+FooterSlimColumn.displayName = 'FooterSlimColumn'
+
 export default FooterSlimColumn

package/src/footer/footerTrademark.tsx

@@ -43,4 +43,5 @@ export const FooterTrademark = vui<'div', FooterTrademarkProps>((props, ref) =>
   )
 })
 
+FooterTrademark.displayName = 'FooterTrademark'
 export default FooterTrademark

package/src/footer/index.ts

@@ -8,3 +8,4 @@ export * from './footerLink'
 export * from './footerRow'
 export * from './footerSection'
 export * from './helpers'
+export * from './applicationFooter'

package/src/grid/grid.tsx

@@ -16,4 +16,5 @@ export const Grid = vui<'span', GridProps>((props, ref) => {
   return <GridBase className={cs('vui-grid', className)} ref={ref} {...styles} {...rest} />
 })
 
+Grid.displayName = 'Grid'
 export default Grid

package/src/header/header.tsx

@@ -113,5 +113,5 @@ Header.Notifications = HeaderNotifications
 Header.Services = HeaderServices
 Header.ServicesMessage = HeaderServicesMessage
 Header.SignIn = HeaderSignIn
-
+Header.displayName = 'Header'
 export default Header

package/src/header/headerAccount.tsx

@@ -68,4 +68,6 @@ export function HeaderAccount(props: HeaderAccountProps) {
   )
 }
 
+HeaderAccount.displayName = 'HeaderAccount'
+
 export default HeaderAccount

package/src/header/headerAccountUserInfo.tsx

@@ -54,4 +54,6 @@ export const HeaderAccountUserInfo = vui<'div', HeaderAccountUserInfoProps>((pro
   )
 })
 
+HeaderAccountUserInfo.displayName = 'HeaderAccountUserInfo'
+
 export default HeaderAccountUserInfo

package/src/header/headerApplicationName.tsx

@@ -44,4 +44,6 @@ export const HeaderApplicationName = vui<'div', HeadingProps>((props, ref) => {
   )
 })
 
+HeaderApplicationName.displayName = 'HeaderApplicationName'
+
 export default HeaderApplicationName

package/src/header/headerContent.tsx

@@ -26,4 +26,6 @@ export const HeaderContent = vui<'div', HeaderContentProps>((props, ref) => {
   )
 })
 
+HeaderContent.displayName = 'HeaderContent'
+
 export default HeaderContent

package/src/header/headerCreateAccount.tsx

@@ -43,4 +43,6 @@ export const HeaderCreateAccount = vui<'div', HeaderCreateAccountProps>((props,
   )
 })
 
+HeaderCreateAccount.displayName = 'HeaderCreateAccount'
+
 export default HeaderCreateAccount

package/src/header/headerDivider.tsx

@@ -23,4 +23,5 @@ export const HeaderDivider = vui<'hr', DividerProps>((props, ref) => {
   )
 })
 
+HeaderDivider.displayName = 'HeaderDivider'
 export default HeaderDivider

package/src/header/headerLinkItem.tsx

@@ -70,4 +70,5 @@ export const HeaderLinkItem = vui<'li', HeaderLinkItemProps>((props, ref) => {
   )
 })
 
+HeaderLinkItem.displayName = 'HeaderLinkItem'
 export default HeaderLinkItem

package/src/header/headerLogo.tsx

@@ -21,4 +21,6 @@ export const HeaderLogo = vui<'div', LogoProps>((props, ref) => {
   )
 })
 
+HeaderLogo.displayName = 'HeaderLogo'
+
 export default HeaderLogo

package/src/header/headerMainLinks.tsx

@@ -34,4 +34,6 @@ export const HeaderMainLinks = vui<'ul', HeaderMainLinksProps>((props, ref) => {
   )
 })
 
+HeaderMainLinks.displayName = 'HeaderMainLinks'
+
 export default HeaderMainLinks

package/src/header/headerMobileContent.tsx

@@ -32,4 +32,5 @@ export const HeaderMobileContent = vui<'div', BoxProps>((props, ref) => {
   ) : null
 })
 
+HeaderMobileContent.displayName = 'HeaderMobileContent'
 export default HeaderMobileContent

package/src/header/headerMobileToggle.tsx

@@ -29,4 +29,6 @@ export const HeaderMobileToggle = vui<'button', ButtonProps>((props, ref) => {
   )
 })
 
+HeaderMobileToggle.displayName = 'HeaderMobileToggle'
+
 export default HeaderMobileToggle

package/src/header/headerNotifications.tsx

@@ -60,4 +60,6 @@ export const HeaderNotifications = vui<'a', HeaderNotificationsProps>((props, re
   )
 })
 
+HeaderNotifications.displayName = 'HeaderNotifications'
+
 export default HeaderNotifications

package/src/header/headerServices.tsx

@@ -65,4 +65,6 @@ export function HeaderServices(props: HeaderServicesProps) {
   )
 }
 
+HeaderServices.displayName = 'HeaderServices'
+
 export default HeaderServices

package/src/header/headerServicesMessage.tsx

@@ -35,4 +35,6 @@ export const HeaderServicesMessage = vui<'p', PProps>((props, ref) => {
   )
 })
 
+HeaderServicesMessage.displayName = 'HeaderServicesMessage'
+
 export default HeaderServicesMessage

package/src/header/headerSignIn.tsx

@@ -30,4 +30,5 @@ export const HeaderSignIn = vui<'button', HeaderSignInProps>((props, ref) => {
   )
 })
 
+HeaderSignIn.displayName = 'HeaderSignIn'
 export default HeaderSignIn

package/src/header/headerSupport.tsx

@@ -73,4 +73,6 @@ export function HeaderSupport(props: HeaderSupportProps) {
   )
 }
 
+HeaderSupport.displayName = 'HeaderSupport'
+
 export default HeaderSupport

package/src/header/loggedInHeader.tsx

@@ -166,4 +166,6 @@ export const LoggedInHeader = vui<'div', LoggedInHeaderProps>((props, ref) => {
   )
 })
 
+LoggedInHeader.displayName = 'LoggedInHeader'
+
 export default LoggedInHeader

package/src/header/loggedOutHeader.tsx

@@ -49,4 +49,6 @@ export const LoggedOutHeader = vui<'div', LoggedOutHeaderProps>((props, ref) =>
   )
 })
 
+LoggedOutHeader.displayName = 'LoggedOutHeader'
+
 export default LoggedOutHeader

package/src/heading/heading.tsx

@@ -47,4 +47,5 @@ export const Heading = vui<'h2', HeadingProps>((props, ref) => {
   )
 })
 
+Heading.displayName = 'Heading'
 export default Heading

package/src/icon/icon.tsx

@@ -41,4 +41,5 @@ export const Icon = vui<'svg', IconProps>((props, ref) => {
   )
 })
 
+Icon.displayName = 'Icon'
 export default Icon

package/src/image/image.tsx

@@ -27,4 +27,5 @@ export const Image = vui<'img', ImageProps>((props, ref) => {
   )
 })
 
+Image.displayName = 'Image'
 export default Image

package/src/input/helpText.tsx

@@ -33,4 +33,5 @@ export const HelpText = vui<'div', HelpTextProps>((props, ref) => {
   )
 })
 
+HelpText.displayName = 'HelpText'
 export default HelpText

package/src/input/input.tsx

@@ -190,5 +190,6 @@ export const Input = vui<'div', InputProps>((props, ref) => {
 Input.Icon = InputIcon
 Input.Input = InputInput
 Input.HelpText = HelpText
+Input.displayName = 'Input'
 
 export default Input

package/src/input/inputIcon.tsx

@@ -18,4 +18,6 @@ export const InputIcon = vui<'svg', IconProps>((props, ref) => {
   return <Icon className={cs('vui-inputIcon', className)} color={color} ref={ref} {...styles.icon} {...rest} />
 })
 
+InputIcon.displayName = 'InputIcon'
+
 export default InputIcon

package/src/input/inputInput.tsx

@@ -46,4 +46,6 @@ export const InputInput = vui<'input', InputInputProps>((props, ref) => {
   )
 })
 
+InputInput.displayName = 'InputInput'
+
 export default InputInput

package/src/link/link.tsx

@@ -76,5 +76,5 @@ export const Link = vui<'a', LinkProps>((props, ref) => {
 
 Link.Icon = LinkIcon
 Link.Text = LinkText
-
+Link.displayName = 'Link'
 export default Link

package/src/link/linkIcon.tsx

@@ -13,4 +13,6 @@ export const LinkIcon = vui<'svg', IconProps>((props, ref) => {
   return <Icon className={cs('vui-linkIcon', className)} ref={ref} {...styles.icon} {...rest} />
 })
 
+LinkIcon.displayName = 'LinkIcon'
+
 export default LinkIcon

package/src/link/linkText.tsx

@@ -22,4 +22,5 @@ export const LinkText = vui<'span', TProps>((props, ref) => {
   )
 })
 
+LinkText.displayName = 'LinkText'
 export default LinkText

package/src/list/list.tsx

@@ -44,5 +44,5 @@ List.Heading = ListHeading
 List.Icon = ListIcon
 List.Item = ListItem
 List.Text = ListText
-
+List.displayName = 'List'
 export default List

package/src/list/listDivider.tsx

@@ -17,4 +17,5 @@ export const ListDivider = vui<'hr', DividerProps>((props, ref) => {
   )
 })
 
+ListDivider.displayName = 'ListDivider'
 export default ListDivider

package/src/list/listHeading.tsx

@@ -28,4 +28,5 @@ export const ListHeading = vui<'li', TProps>((props, ref) => {
   )
 })
 
+ListHeading.displayName = 'ListHeading'
 export default ListHeading

package/src/list/listIcon.tsx

@@ -13,4 +13,5 @@ export const ListIcon = vui<'svg', IconProps>((props, ref) => {
   return <Icon className={cs('vui-listIcon', className)} ref={ref} {...styles.icon} {...rest} />
 })
 
+ListIcon.displayName = 'ListIcon'
 export default ListIcon

package/src/list/listItem.tsx

@@ -125,4 +125,5 @@ export const ListItem = vui<'li', ListItemProps>((props, ref) => {
   )
 })
 
+ListItem.displayName = 'ListItem'
 export default ListItem

package/src/list/listText.tsx

@@ -22,4 +22,5 @@ export const ListText = vui<'span', TProps>((props, ref) => {
   )
 })
 
+ListText.displayName = 'ListText'
 export default ListText

package/src/logo/Logo.tsx

@@ -36,4 +36,6 @@ export const Logo = vui<'div', LogoProps>((props, ref) => {
   )
 })
 
+Logo.displayName = 'Logo'
+
 export default Logo

package/src/menu/menu.tsx

@@ -24,5 +24,6 @@ export function Menu(props: MenuProps) {
 Menu.Button = MenuButton
 Menu.Item = MenuItem
 Menu.List = MenuList
+Menu.displayName = 'Menu'
 
 export default Menu

package/src/menu/menuButton.tsx

@@ -22,4 +22,6 @@ export const MenuButton = vui<'button', ButtonProps>((props, ref) => {
   )
 })
 
+MenuButton.displayName = 'MenuButton'
+
 export default MenuButton

package/src/menu/menuItem.tsx

@@ -30,4 +30,5 @@ export const MenuItem = vui<'li', ListItemProps>((props, ref) => {
   )
 })
 
+MenuItem.displayName = 'MenuItem'
 export default MenuItem

package/src/message/message.tsx

@@ -27,4 +27,6 @@ export const Message = vui<'span', MessageProps>((props, ref) => {
   )
 })
 
+Message.displayName = 'Message'
+
 export default Message

package/src/modal/modal.tsx

@@ -117,5 +117,6 @@ export const Modal = vui<'div', ModalProps>((props, ref) => {
 
 Modal.Backdrop = ModalBackdrop
 Modal.Content = ModalContent
+Modal.displayName = 'Modal'
 
 export default Modal

package/src/modal/modalBackdrop.tsx

@@ -32,4 +32,6 @@ export const ModalBackdrop = vui<'div', ModalBackdropProps>((props, ref) => {
   )
 })
 
+ModalBackdrop.displayName = 'ModalBackdrop'
+
 export default ModalBackdrop

package/src/modal/modalContent.tsx

@@ -30,4 +30,6 @@ export const ModalContent = vui<'div', ModalContentProps>((props, ref) => {
   )
 })
 
+ModalContent.displayName = 'ModalContent'
+
 export default ModalContent

package/src/notification/notification.tsx

@@ -82,5 +82,6 @@ Notification.Button = NotificationButton
 Notification.Icon = NotificationIcon
 Notification.Text = NotificationText
 Notification.Title = NotificationTitle
+Notification.displayName = 'Notification'
 
 export default Notification

package/src/notification/notificationButton.tsx

@@ -31,4 +31,5 @@ export const NotificationButton = vui<'button', ButtonProps>((props, ref) => {
   )
 })
 
+NotificationButton.displayName = 'NotificationButton'
 export default NotificationButton

package/src/notification/notificationIcon.tsx

@@ -32,4 +32,6 @@ export const NotificationIcon = vui<'svg', IconProps>((props, ref) => {
   )
 })
 
+NotificationIcon.displayName = 'NotificationIcon'
+
 export default NotificationIcon

package/src/notification/notificationText.tsx

@@ -25,4 +25,5 @@ export const NotificationText = vui<'p', TProps>((props, ref) => {
   )
 })
 
+NotificationText.displayName = 'NotificationText'
 export default NotificationText

package/src/notification/notificationTitle.tsx

@@ -15,4 +15,5 @@ export const NotificationTitle = vui<'span', TProps>((props, ref) => {
   )
 })
 
+NotificationTitle.displayName = 'NotificationTitle'
 export default NotificationTitle

package/src/p/p.tsx

@@ -27,4 +27,5 @@ export const P = vui<'p', PProps>((props, ref) => {
   )
 })
 
+P.displayName = 'P'
 export default P

package/src/pagination/pagination.tsx

@@ -84,5 +84,6 @@ Pagination.GoToPage = PaginationGoToPage
 Pagination.Navigation = PaginationNavigation
 Pagination.PrevNext = PaginationPrevNext
 Pagination.Results = PaginationResults
+Pagination.displayName = 'Pagination'
 
 export default Pagination

package/src/pagination/paginationButton.tsx

@@ -34,4 +34,6 @@ export const PaginationButton = vui<'button', PaginationButtonProps>((props, ref
   )
 })
 
+PaginationButton.displayName = 'PaginationButton'
+
 export default PaginationButton

package/src/pagination/paginationEllipsis.tsx

@@ -24,4 +24,5 @@ export const PaginationEllipsis = vui<'span', BoxProps>((props, ref) => {
   )
 })
 
+PaginationEllipsis.displayName = 'PaginationEllipsis'
 export default PaginationEllipsis

package/src/pagination/paginationGoToPage.tsx

@@ -40,4 +40,6 @@ export const PaginationGoToPage = vui<'div', BoxProps>((props, ref) => {
   )
 })
 
+PaginationGoToPage.displayName = 'PaginationGoToPage'
+
 export default PaginationGoToPage

package/src/pagination/paginationNavigation.tsx

@@ -32,4 +32,6 @@ export const PaginationNavigation = vui<'div', BoxProps>((props, ref) => {
   )
 })
 
+PaginationNavigation.displayName = 'PaginationNavigation'
+
 export default PaginationNavigation

package/src/pagination/paginationPrevNext.tsx

@@ -34,4 +34,6 @@ export const PaginationPrevNext = vui<'button', PaginationPrevNextProps>((props,
   )
 })
 
+PaginationPrevNext.displayName = 'PaginationPrevNext'
+
 export default PaginationPrevNext

package/src/pagination/paginationResults.tsx

@@ -18,4 +18,6 @@ export const PaginationResults = vui<'span', TProps>((props, ref) => {
   )
 })
 
+PaginationResults.displayName = 'PaginationResults'
+
 export default PaginationResults

package/src/panel/panel.tsx

@@ -16,4 +16,6 @@ export const Panel = vui<'div', PanelProps>((props, ref) => {
   return <Box bg="white" className={cs('vui-panel', className)} p={2} ref={ref} {...styles} {...rest} />
 })
 
+Panel.displayName = 'Panel'
+
 export default Panel

package/src/popover/popover.tsx

@@ -22,3 +22,4 @@ export default function Popover(props: PopoverProps) {
 
 Popover.Content = PopoverContent
 Popover.Trigger = PopoverTrigger
+Popover.displayName = 'Popover'

package/src/popover/popoverContent.tsx

@@ -35,4 +35,6 @@ export const PopoverContent = vui<'div', PopoverContentProps>((props, ref) => {
   )
 })
 
+PopoverContent.displayName = 'PopoverContent'
+
 export default PopoverContent

package/src/popover/popoverTrigger.tsx

@@ -36,4 +36,6 @@ export const PopoverTrigger = vui<'button', PopoverTriggerProps>((props, ref) =>
   )
 })
 
+PopoverTrigger.displayName = 'PopoverTrigger'
+
 export default PopoverTrigger

package/src/portal/portal.tsx

@@ -20,4 +20,6 @@ export const Portal: FC<PortalProps & ChildrenProp> = props => {
   return mountNode ? createPortal(children, mountNode) : <>{mountNode}</>
 }
 
+Portal.displayName = 'Portal'
+
 export default Portal