@veracity/vui 2.10.0 → 2.12.0-beta.0

package/dist/esm/core/vuiProvider/globalStyle.js

@@ -2,6 +2,7 @@ import foundations from '../../theme/foundations';
 import { isObject } from '../../utils';
 import { createGlobalStyle, css } from '../styled';
 import { bounce, fadeDown, fadeIn, fadeLeft, fadeOut, fadeRight, fadeUp, pulse, spin } from './animations';
+import { noScrollClass } from './consts';
 import fontFaces from './fontFaces';
 /**
  * Provides global styles, such as:
@@ -25,6 +26,7 @@ export default createGlobalStyle `
   button,
   .vui-avatar,
   .vui-tag,
+  .vui-sidemenu-item,
   .vui-switchTrack {
     --x-ring-color: transparent;
   }
@@ -33,12 +35,18 @@ export default createGlobalStyle `
   li:focus-visible,
   .vui-avatar:focus-visible,
   .vui-tag:focus-visible,
+  .vui-sidemenu-item:focus-visible,
   .vui-switchTrack:focus-visible {
     --x-ring-color: var(--vui-colors-focusColor);
     outline: var(--vui-colors-focusColor) solid 3px;
     z-index: 1;
   }
 
+  body.${noScrollClass} {
+    overflow: hidden !important;
+    overscroll-behavior: contain;
+  }
+
   //@formatter:off
   ${p => p.globalStyle &&
     css `

package/dist/esm/core/vuiProvider/index.d.ts

@@ -1,6 +1,8 @@
 export * from './animations';
 export * from './context';
 export * from './useOfflineMode';
+export * from './useBodyScrollLock';
+export * from './consts';
 export { default as fontFaces } from './fontFaces';
 export { default as GlobalStyle } from './globalStyle';
 export { default as ResetCSS } from './resetCSS';

package/dist/esm/core/vuiProvider/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/vuiProvider/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAA;AAC5B,cAAc,WAAW,CAAA;AACzB,cAAc,kBAAkB,CAAA;AAChC,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAA;AAClD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAA;AACtD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAA;AAChD,OAAO,EAAE,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/vuiProvider/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAA;AAC5B,cAAc,WAAW,CAAA;AACzB,cAAc,kBAAkB,CAAA;AAChC,cAAc,qBAAqB,CAAA;AACnC,cAAc,UAAU,CAAA;AACxB,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAA;AAClD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAA;AACtD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAA;AAChD,OAAO,EAAE,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAA"}

package/dist/esm/core/vuiProvider/index.js

@@ -1,6 +1,8 @@
 export * from './animations';
 export * from './context';
 export * from './useOfflineMode';
+export * from './useBodyScrollLock';
+export * from './consts';
 export { default as fontFaces } from './fontFaces';
 export { default as GlobalStyle } from './globalStyle';
 export { default as ResetCSS } from './resetCSS';

package/dist/esm/core/vuiProvider/useBodyScrollLock.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+export declare const useBodyScrollLock: () => {
+    isScrollLocked: boolean;
+    setIsScrollLocked: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+    toggleIsScrollLocked: () => void;
+};
+//# sourceMappingURL=useBodyScrollLock.d.ts.map

package/dist/esm/core/vuiProvider/useBodyScrollLock.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useBodyScrollLock.d.ts","sourceRoot":"","sources":["../../../../src/core/vuiProvider/useBodyScrollLock.tsx"],"names":[],"mappings":";AAKA,eAAO,MAAM,iBAAiB;;;;CAW7B,CAAA"}

package/dist/esm/core/vuiProvider/useBodyScrollLock.js

@@ -0,0 +1,14 @@
+import { useEffect, useState } from 'react';
+import { addBodyClass, removeBodyClass } from '../../utils';
+import { noScrollClass } from './consts';
+export const useBodyScrollLock = () => {
+    const [isScrollLocked, setIsScrollLocked] = useState(false);
+    const toggleIsScrollLocked = () => setIsScrollLocked(!isScrollLocked);
+    useEffect(() => {
+        if (isScrollLocked)
+            addBodyClass(noScrollClass);
+        else
+            removeBodyClass(noScrollClass);
+    }, [isScrollLocked]);
+    return { isScrollLocked, setIsScrollLocked, toggleIsScrollLocked };
+};

package/dist/esm/core/vuiProvider/vuiProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"vuiProvider.d.ts","sourceRoot":"","sources":["../../../../src/core/vuiProvider/vuiProvider.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAc,MAAM,OAAO,CAAA;AAM7C,OAAqB,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AAGpD,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAOvC,KAAK,gBAAgB,GAAG;IACtB,8CAA8C;IAC9C,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,wDAAwD;IACxD,KAAK,CAAC,EAAE,QAAQ,CAAA;IAChB,2EAA2E;IAC3E,aAAa,CAAC,EAAE,OAAO,CAAA;CACxB,CAAA;AAED,oGAAoG;AACpG,QAAA,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,GAAG,YAAY,CAiCpD,CAAA;AAED,eAAe,WAAW,CAAA"}
+{"version":3,"file":"vuiProvider.d.ts","sourceRoot":"","sources":["../../../../src/core/vuiProvider/vuiProvider.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAc,MAAM,OAAO,CAAA;AAK7C,OAAqB,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AAGpD,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAOvC,KAAK,gBAAgB,GAAG;IACtB,8CAA8C;IAC9C,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,wDAAwD;IACxD,KAAK,CAAC,EAAE,QAAQ,CAAA;IAChB,2EAA2E;IAC3E,aAAa,CAAC,EAAE,OAAO,CAAA;CACxB,CAAA;AAED,oGAAoG;AACpG,QAAA,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,GAAG,YAAY,CAgCpD,CAAA;AAED,eAAe,WAAW,CAAA"}

package/dist/esm/core/vuiProvider/vuiProvider.js

@@ -1,6 +1,5 @@
 import React, { useReducer } from 'react';
 import { ThemeProvider } from 'styled-components';
-import ModalStyle from '../../modal/modalStyle';
 import PopoverStyle from '../../popover/popoverStyle';
 import { Portal } from '../../portal';
 import defaultTheme from '../../theme';
@@ -22,7 +21,6 @@ const VuiProvider = ({ children, globalStyle = true, resetCSS = true, theme = de
             React.createElement(React.Fragment, null,
                 resetCSS && React.createElement(ResetCSS, null),
                 React.createElement(GlobalStyle, { globalStyle: globalStyle }),
-                React.createElement(ModalStyle, null),
                 React.createElement(PopoverStyle, null),
                 children,
                 notifyOffline && React.createElement(NotifyOffline, null),

package/dist/esm/definition/definition.d.ts

@@ -0,0 +1,9 @@
+import { DefinitionProps } from './definition.types';
+/**
+ * Properties are definition lists
+ * */
+export declare const DefinitionVerticalBase: import("styled-components").StyledComponent<"dl", import("styled-components").DefaultTheme, import("..").SystemProps, never>;
+export declare const DefinitionHorizontalBase: import("styled-components").StyledComponent<"dl", import("styled-components").DefaultTheme, import("..").SystemProps, never>;
+export declare const Definition: import("../core").VuiComponent<"dl", DefinitionProps>;
+export default Definition;
+//# sourceMappingURL=definition.d.ts.map

package/dist/esm/definition/definition.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"definition.d.ts","sourceRoot":"","sources":["../../../src/definition/definition.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAA;AAGpD;;KAEK;AAEL,eAAO,MAAM,sBAAsB,8HAclC,CAAA;AAED,eAAO,MAAM,wBAAwB,8HAkCpC,CAAA;AAGD,eAAO,MAAM,UAAU,uDAiBrB,CAAA;AAEF,eAAe,UAAU,CAAA"}

package/dist/esm/definition/definition.js

@@ -0,0 +1,68 @@
+import React from 'react';
+import { styled, useStyleConfig, vui } from '../core';
+import { DefinitionContent } from './definitionContent';
+/**
+ * Properties are definition lists
+ * */
+// @formatter:off
+export const DefinitionVerticalBase = styled.dlBox `
+  display: grid;
+  gap: 1em;
+  grid-template-columns: repeat(auto-fit, minmax(10em, 20em));
+
+  .vui-definitionItemWrapper {
+    display: flex;
+    flex-direction: column;
+  }
+
+  dt,
+  dd {
+    display: inline-flex;
+  }
+`;
+export const DefinitionHorizontalBase = styled.dlBox `
+  padding: 10px;
+  display: grid;
+  gap: 0;
+
+  .vui-definitionItemWrapper {
+    display: flex;
+    flex-direction: column;
+    @media (min-width: 1024px) {
+      flex-direction: row;
+    }
+  }
+
+  dt,
+  dd {
+    display: inline-flex;
+    padding-left: 5px;
+  }
+
+  dd {
+    ::after {
+      content: '';
+    }
+    @media (min-width: 1024px) {
+      ::after {
+        content: ',';
+      }
+    }
+  }
+
+  dt {
+    width: 20%;
+    min-width: 130px;
+  }
+`;
+// @formatter:on
+export const Definition = vui((props, ref) => {
+    const { orientation = 'horizontal', ...rest } = props;
+    const styles = useStyleConfig('Definition', props);
+    return (React.createElement(React.Fragment, null,
+        orientation === 'horizontal' && (React.createElement(DefinitionHorizontalBase, { className: "vui-definition", ...styles.container, ...rest },
+            React.createElement(DefinitionContent, { ...rest }))),
+        orientation === 'vertical' && (React.createElement(DefinitionVerticalBase, { className: "vui-definition", ...styles.container, ...rest },
+            React.createElement(DefinitionContent, { ...rest })))));
+});
+export default Definition;

package/dist/esm/definition/definition.types.d.ts

@@ -0,0 +1,24 @@
+/// <reference types="react" />
+import { IconProp } from '../icon';
+import { SystemProps } from '../system';
+import { ThemingProps } from '../theme';
+export type DefinitionItemProps = SystemProps & {
+    key: string;
+    keyHasIcon?: boolean;
+    value: string | number | string[] | number[];
+    valueHasIcon?: boolean;
+};
+export type DefinitionProps = SystemProps & ThemingProps<'Definition'> & {
+    /** Socket displaying icon on the left side. */
+    iconLeft?: IconProp | JSX.Element;
+    /** Socket displaying icon on the right side. */
+    iconRight?: IconProp | JSX.Element;
+    isLabelBold?: boolean;
+    isValueBold?: boolean;
+    items?: DefinitionItemProps[];
+    /** Socket defining orientation. */
+    orientation?: 'horizontal' | 'vertical';
+    size?: 'sm' | 'md';
+    variant?: 'light' | 'dark';
+};
+//# sourceMappingURL=definition.types.d.ts.map

package/dist/esm/definition/definition.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"definition.types.d.ts","sourceRoot":"","sources":["../../../src/definition/definition.types.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAClC,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,MAAM,MAAM,mBAAmB,GAAG,WAAW,GAAG;IAC9C,GAAG,EAAE,MAAM,CAAA;IACX,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,GAAG,MAAM,EAAE,CAAA;IAC5C,YAAY,CAAC,EAAE,OAAO,CAAA;CACvB,CAAA;AACD,MAAM,MAAM,eAAe,GAAG,WAAW,GACvC,YAAY,CAAC,YAAY,CAAC,GAAG;IAC3B,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,QAAQ,GAAG,GAAG,CAAC,OAAO,CAAA;IACjC,gDAAgD;IAChD,SAAS,CAAC,EAAE,QAAQ,GAAG,GAAG,CAAC,OAAO,CAAA;IAClC,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,KAAK,CAAC,EAAE,mBAAmB,EAAE,CAAA;IAC7B,mCAAmC;IACnC,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IACvC,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAA;IAClB,OAAO,CAAC,EAAE,OAAO,GAAG,MAAM,CAAA;CAC3B,CAAA"}

package/dist/esm/definition/definitionContent.d.ts

@@ -0,0 +1,6 @@
+import { DefinitionProps } from './definition.types';
+export declare const DefinitionItemKey: import("styled-components").StyledComponent<"dt", import("styled-components").DefaultTheme, import("..").SystemProps, never>;
+export declare const DefinitionItemValue: import("styled-components").StyledComponent<"dd", import("styled-components").DefaultTheme, import("..").SystemProps, never>;
+export declare const DefinitionContent: import("../core").VuiComponent<"dl", DefinitionProps>;
+export default DefinitionContent;
+//# sourceMappingURL=definitionContent.d.ts.map

package/dist/esm/definition/definitionContent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"definitionContent.d.ts","sourceRoot":"","sources":["../../../src/definition/definitionContent.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAuB,eAAe,EAAE,MAAM,oBAAoB,CAAA;AAEzE,eAAO,MAAM,iBAAiB,8HAAiB,CAAA;AAC/C,eAAO,MAAM,mBAAmB,8HAAiB,CAAA;AAEjD,eAAO,MAAM,iBAAiB,uDA+C5B,CAAA;AAEF,eAAe,iBAAiB,CAAA"}

package/dist/esm/definition/definitionContent.js

@@ -0,0 +1,26 @@
+import React from 'react';
+import Box from '../box';
+import { styled, useStyleConfig, vui } from '../core';
+import Icon from '../icon';
+import { cs, isArray } from '../utils';
+export const DefinitionItemKey = styled.dtBox ``;
+export const DefinitionItemValue = styled.ddBox ``;
+export const DefinitionContent = vui(props => {
+    const { iconLeft, iconRight, isLabelBold, isValueBold, items } = props;
+    const styles = useStyleConfig('Definition', props);
+    return (React.createElement(React.Fragment, null, isArray(items)
+        ? items.map(({ key, value, ...props }, index) => (React.createElement(Box, { className: "vui-definitionItemWrapper", key: index },
+            React.createElement(DefinitionItemKey, { fontWeight: isLabelBold ? 'demi' : 'default', ...styles.dt },
+                props.keyHasIcon && iconLeft && (React.createElement(Icon, { className: cs('vui-definitionIcon'), name: iconLeft, ...styles.icon })),
+                key,
+                props.keyHasIcon && iconRight && (React.createElement(Icon, { className: cs('vui-definitionIcon'), name: iconRight, ...styles.icon }))),
+            isArray(value) ? (value.map((value, index) => (React.createElement(DefinitionItemValue, { fontWeight: isValueBold ? 'demi' : 'default', ...styles.dd, key: index },
+                props.valueHasIcon && iconLeft && (React.createElement(Icon, { className: cs('vui-definitionIcon'), name: iconLeft, ...styles.icon })),
+                value,
+                props.valueHasIcon && iconRight && (React.createElement(Icon, { className: cs('vui-definitionIcon'), name: iconRight, ...styles.icon })))))) : (React.createElement(DefinitionItemValue, { fontWeight: isValueBold ? 'demi' : 'default', ...styles.dd },
+                props.valueHasIcon && iconLeft && (React.createElement(Icon, { className: cs('vui-definitionIcon'), name: iconLeft, ...styles.icon })),
+                value,
+                props.valueHasIcon && iconRight && (React.createElement(Icon, { className: cs('vui-definitionIcon'), name: iconRight, ...styles.icon })))))))
+        : items));
+});
+export default DefinitionContent;

package/dist/esm/definition/index.d.ts

@@ -0,0 +1,3 @@
+export * from './definition';
+export { default } from './definition';
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/definition/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/definition/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAA;AAC5B,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAA"}

package/dist/esm/definition/index.js

@@ -0,0 +1,2 @@
+export * from './definition';
+export { default } from './definition';

package/dist/esm/definition/theme.d.ts

@@ -0,0 +1,65 @@
+declare const _default: {
+    baseStyle: {};
+    defaultProps: {
+        size: string;
+        variant: string;
+    };
+    parts: string[];
+    sizes: {
+        sm: {
+            container: {
+                fontSize: string;
+                lineHeight: string;
+            };
+            dt: {
+                fontSize: string;
+                spaceX: number;
+            };
+            dd: {
+                fontSize: string;
+                spaceX: number;
+            };
+            icon: {
+                size: string;
+                mx: number;
+                my: string;
+            };
+        };
+        md: {
+            container: {
+                fontSize: string;
+                lineHeight: string;
+            };
+            dt: {
+                fontSize: string;
+                spaceX: number;
+            };
+            dd: {
+                fontSize: string;
+                spaceX: number;
+            };
+            icon: {
+                size: string;
+                mx: number;
+                my: string;
+            };
+        };
+    };
+    variants: {
+        light: {
+            container: {
+                bg: string;
+                color: string;
+                borderColor: string;
+            };
+        };
+        dark: {
+            container: {
+                bg: string;
+                color: string;
+            };
+        };
+    };
+};
+export default _default;
+//# sourceMappingURL=theme.d.ts.map

package/dist/esm/definition/theme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/definition/theme.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkEA,wBAMC"}

package/dist/esm/definition/theme.js

@@ -0,0 +1,68 @@
+const baseStyle = {};
+const defaultProps = {
+    size: 'md',
+    variant: 'light'
+};
+const parts = ['container', 'icon', 'dt', 'dd'];
+const sizes = {
+    sm: {
+        container: {
+            fontSize: 'sm',
+            lineHeight: '22px'
+        },
+        dt: {
+            fontSize: 'sm',
+            spaceX: 4
+        },
+        dd: {
+            fontSize: 'sm',
+            spaceX: 4
+        },
+        icon: {
+            size: 'sm',
+            mx: 0.5,
+            my: 'auto'
+        }
+    },
+    md: {
+        container: {
+            fontSize: 'md',
+            lineHeight: '30px'
+        },
+        dt: {
+            fontSize: 'md',
+            spaceX: 6
+        },
+        dd: {
+            fontSize: 'md',
+            spaceX: 6
+        },
+        icon: {
+            size: 'md',
+            mx: 0.5,
+            my: 'auto'
+        }
+    }
+};
+const variants = {
+    light: {
+        container: {
+            bg: 'white',
+            color: 'sandstone.20',
+            borderColor: 'transparent'
+        }
+    },
+    dark: {
+        container: {
+            bg: 'darkBlue.main',
+            color: 'white'
+        }
+    }
+};
+export default {
+    baseStyle,
+    defaultProps,
+    parts,
+    sizes,
+    variants
+};

package/dist/esm/dialog/consts.d.ts

@@ -3,5 +3,4 @@ import { DialogStatusMapping } from './dialog.types';
 export declare const dialogStatusMapping: DialogStatusMapping;
 export declare const containerId = "vui-dynamic-container";
 export declare const modalClass = "vui-modal";
-export declare const noScrollClass = "vui-no-scroll";
 //# sourceMappingURL=consts.d.ts.map

package/dist/esm/dialog/consts.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"consts.d.ts","sourceRoot":"","sources":["../../../src/dialog/consts.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAA;AAEpD,mDAAmD;AACnD,eAAO,MAAM,mBAAmB,EAAE,mBAyBjC,CAAA;AAED,eAAO,MAAM,WAAW,0BAA0B,CAAA;AAElD,eAAO,MAAM,UAAU,cAAc,CAAA;AAErC,eAAO,MAAM,aAAa,kBAAkB,CAAA"}
+{"version":3,"file":"consts.d.ts","sourceRoot":"","sources":["../../../src/dialog/consts.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAA;AAEpD,mDAAmD;AACnD,eAAO,MAAM,mBAAmB,EAAE,mBAyBjC,CAAA;AAED,eAAO,MAAM,WAAW,0BAA0B,CAAA;AAElD,eAAO,MAAM,UAAU,cAAc,CAAA"}

package/dist/esm/dialog/consts.js

@@ -27,4 +27,3 @@ export const dialogStatusMapping = {
 };
 export const containerId = 'vui-dynamic-container';
 export const modalClass = 'vui-modal';
-export const noScrollClass = 'vui-no-scroll';

package/dist/esm/focusLock/focusLock.d.ts

@@ -0,0 +1,11 @@
+import { FC } from 'react';
+import { ChildrenProp } from '../core';
+import { FocusLockProps } from './focusLock.types';
+/**
+ * Traps the focus within the provided content.
+ *
+ * Tabbing using the keyboard will only cycle through the children and won't leave the boundary of the FocusLock wrapper.
+ */
+export declare const FocusLock: FC<FocusLockProps & ChildrenProp>;
+export default FocusLock;
+//# sourceMappingURL=focusLock.d.ts.map

package/dist/esm/focusLock/focusLock.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"focusLock.d.ts","sourceRoot":"","sources":["../../../src/focusLock/focusLock.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAe,MAAM,OAAO,CAAA;AAG9C,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AACtC,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAElD;;;;GAIG;AAEH,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,GAAG,YAAY,CAmCvD,CAAA;AAED,eAAe,SAAS,CAAA"}

package/dist/esm/{modal → focusLock}/focusLock.js

@@ -1,9 +1,9 @@
 import React, { useCallback } from 'react';
 import ReactFocusLock from 'react-focus-lock';
 /**
- * Traps the focus within the provided content. That is, tabbing with keyboard will
- * only cycle through the children and won't leave the boundary of the FocusLock.
- * This behavior enhances accessibility of the Modal component.
+ * Traps the focus within the provided content.
+ *
+ * Tabbing using the keyboard will only cycle through the children and won't leave the boundary of the FocusLock wrapper.
  */
 export const FocusLock = props => {
     const { autoFocus, children, crossFrame, finalFocusRef, initialFocusRef, isDisabled, persistentFocus, returnFocus: returnFocusProp } = props;

package/dist/esm/focusLock/focusLock.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"focusLock.types.d.ts","sourceRoot":"","sources":["../../../src/focusLock/focusLock.types.ts"],"names":[],"mappings":";AAAA,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,CAAC,OAAO,CAAC,EAAE,YAAY,GAAG,IAAI,CAAA;CACpC,CAAA;AAED,MAAM,MAAM,cAAc,GAAG;IAC3B;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,uEAAuE;IACvE,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAA;IACjD,6EAA6E;IAC7E,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAA;IACnD,+BAA+B;IAC/B,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,+DAA+D;IAC/D,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,2FAA2F;IAC3F,WAAW,CAAC,EAAE,OAAO,CAAA;CACtB,CAAA"}

package/dist/esm/focusLock/focusLock.types.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/focusLock/index.d.ts

@@ -0,0 +1,4 @@
+export * from './focusLock';
+export { default } from './focusLock';
+export * from './focusLock.types';
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/focusLock/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/focusLock/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA;AAC3B,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAA;AACrC,cAAc,mBAAmB,CAAA"}

package/dist/esm/focusLock/index.js

@@ -0,0 +1,3 @@
+export * from './focusLock';
+export { default } from './focusLock';
+export * from './focusLock.types';

package/dist/esm/footer/footer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"footer.d.ts","sourceRoot":"","sources":["../../../src/footer/footer.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAwC,YAAY,EAAE,MAAM,SAAS,CAAA;AAM5E,OAAO,EAAkB,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5D,OAAO,YAAY,MAAM,gBAAgB,CAAA;AACzC,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAC3C,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAC3C,OAAO,UAAU,MAAM,cAAc,CAAA;AACrC,OAAO,SAAS,MAAM,aAAa,CAAA;AACnC,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAK3C,eAAO,MAAM,UAAU,+HAItB,CAAA;AAGD,oGAAoG;AACpG,eAAO,MAAM,MAAM;YAwKT,mBAAmB;aAClB,oBAAoB;aACpB,oBAAoB;UACvB,iBAAiB;SAClB,gBAAgB;aACZ,oBAAoB;CAC9B,CAAA;AASD,eAAe,MAAM,CAAA"}
+{"version":3,"file":"footer.d.ts","sourceRoot":"","sources":["../../../src/footer/footer.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAwC,YAAY,EAAE,MAAM,SAAS,CAAA;AAO5E,OAAO,EAAkB,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5D,OAAO,YAAY,MAAM,gBAAgB,CAAA;AACzC,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAC3C,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAC3C,OAAO,UAAU,MAAM,cAAc,CAAA;AACrC,OAAO,SAAS,MAAM,aAAa,CAAA;AACnC,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAK3C,eAAO,MAAM,UAAU,+HAItB,CAAA;AAGD,oGAAoG;AACpG,eAAO,MAAM,MAAM;YAmMT,mBAAmB;aAClB,oBAAoB;aACpB,oBAAoB;UACvB,iBAAiB;SAClB,gBAAgB;aACZ,oBAAoB;CAC9B,CAAA;AASD,eAAe,MAAM,CAAA"}

package/dist/esm/footer/footer.js

@@ -3,6 +3,7 @@ import { Box } from '../box';
 import { styled, useDown, useStyleConfig, vui } from '../core';
 import { Divider } from '../divider';
 import { Link } from '../link';
+import Menu from '../menu';
 import { T } from '../t';
 import { cs } from '../utils';
 import { FooterProvider } from './context';
@@ -56,7 +57,10 @@ export const Footer = vui((props, ref) => {
             isApplication && (React.createElement(FooterContent, { alignContent: "center", alignItems: "center", maxW: "100%" },
                 React.createElement(FooterRow, { alignContent: "space-between", w: 1 },
                     React.createElement(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 }, applicationLinks?.map((link, index) => (React.createElement(Box, { flex: { xs: '0 0 50%', sm: '0 0 auto' }, key: index, minW: 70 },
-                        React.createElement(FooterLink, { ...link }))))),
+                        link.items && (React.createElement(Menu, { isLazy: false, offset: [-16, 9], placement: "top-start", size: "lg", ...rest },
+                            React.createElement(Menu.Button, { as: Link, className: "vui-footerLink-trigger", pt: "3px", text: link.text, title: link.text, ...styles.link, ...rest }),
+                            React.createElement(Menu.List, { maxH: 400, right: 0, w: 320, ...styles.list }, link.items.map(({ text, url }, index) => (React.createElement(Menu.Item, { isTruncated: true, key: index, linkProps: { href: url }, text: text, title: text, ...styles.item })))))),
+                        !link.items && React.createElement(FooterLink, { ...link }))))),
                     downLg && React.createElement(Divider, { borderColor: "sandstone.main", mb: 0.5, mt: 1, w: 1 }),
                     React.createElement(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 },
                         applicationStaticItems?.map((text, index) => (React.createElement(Box, { key: index },

package/dist/esm/footer/footer.types.d.ts

@@ -14,7 +14,8 @@ export type FooterLinkData = {
     /** Unique name that identifies a link in the links dictionary. */
     id?: string;
     text: string;
-    url: string;
+    url?: string;
+    items?: FooterLinkData[];
 };
 export type FooterProps = Omit<BoxProps, 'size' | 'variant'> & ThemingProps<'Footer'> & Pick<FooterTrademarkProps, 'linkedIn'> & {
     applicationLinks?: FooterLinkData[];

package/dist/esm/footer/footer.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"footer.types.d.ts","sourceRoot":"","sources":["../../../src/footer/footer.types.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AACjC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,yEAAyE;AACzE,MAAM,MAAM,gBAAgB,GAAG,iBAAiB,EAAE,CAAA;AAElD,MAAM,MAAM,iBAAiB,GAAG,QAAQ,GAAG;IACzC,4CAA4C;IAC5C,QAAQ,CAAC,EAAE,iBAAiB,EAAE,CAAA;CAC/B,CAAA;AAED,MAAM,MAAM,kBAAkB,GAAG,QAAQ,CAAA;AAEzC,MAAM,MAAM,aAAa,GAAG,IAAI,CAAC,WAAW,EAAE,MAAM,GAAG,SAAS,CAAC,CAAA;AAEjE,oDAAoD;AACpD,MAAM,MAAM,cAAc,GAAG;IAC3B,kEAAkE;IAClE,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,IAAI,EAAE,MAAM,CAAA;IACZ,GAAG,EAAE,MAAM,CAAA;CACZ,CAAA;AAED,MAAM,MAAM,WAAW,GAAG,IAAI,CAAC,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC,GAC1D,YAAY,CAAC,QAAQ,CAAC,GACtB,IAAI,CAAC,oBAAoB,EAAE,UAAU,CAAC,GAAG;IACvC,gBAAgB,CAAC,EAAE,cAAc,EAAE,CAAA;IACnC,sBAAsB,CAAC,EAAE,MAAM,EAAE,CAAA;IACjC,iDAAiD;IACjD,OAAO,CAAC,EAAE,gBAAgB,EAAE,CAAA;IAC5B,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,CAAA;AAEH,mEAAmE;AACnE,MAAM,MAAM,iBAAiB,GAAG;IAC9B,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,2CAA2C;IAC3C,KAAK,CAAC,EAAE,cAAc,EAAE,CAAA;CACzB,CAAA;AAED,MAAM,MAAM,kBAAkB,GAAG,QAAQ,GAAG;IAC1C,kDAAkD;IAClD,OAAO,CAAC,EAAE,iBAAiB,CAAC,SAAS,CAAC,GAAG,GAAG,CAAC,OAAO,CAAA;IACpD,oDAAoD;IACpD,KAAK,CAAC,EAAE,iBAAiB,CAAC,OAAO,CAAC,GAAG,GAAG,CAAC,OAAO,CAAA;CACjD,CAAA;AAED,MAAM,MAAM,oBAAoB,GAAG,QAAQ,GAAG;IAC5C,kEAAkE;IAClE,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB,CAAA"}
+{"version":3,"file":"footer.types.d.ts","sourceRoot":"","sources":["../../../src/footer/footer.types.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AACjC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,yEAAyE;AACzE,MAAM,MAAM,gBAAgB,GAAG,iBAAiB,EAAE,CAAA;AAElD,MAAM,MAAM,iBAAiB,GAAG,QAAQ,GAAG;IACzC,4CAA4C;IAC5C,QAAQ,CAAC,EAAE,iBAAiB,EAAE,CAAA;CAC/B,CAAA;AAED,MAAM,MAAM,kBAAkB,GAAG,QAAQ,CAAA;AAEzC,MAAM,MAAM,aAAa,GAAG,IAAI,CAAC,WAAW,EAAE,MAAM,GAAG,SAAS,CAAC,CAAA;AAEjE,oDAAoD;AACpD,MAAM,MAAM,cAAc,GAAG;IAC3B,kEAAkE;IAClE,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,IAAI,EAAE,MAAM,CAAA;IACZ,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,cAAc,EAAE,CAAA;CACzB,CAAA;AAED,MAAM,MAAM,WAAW,GAAG,IAAI,CAAC,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC,GAC1D,YAAY,CAAC,QAAQ,CAAC,GACtB,IAAI,CAAC,oBAAoB,EAAE,UAAU,CAAC,GAAG;IACvC,gBAAgB,CAAC,EAAE,cAAc,EAAE,CAAA;IACnC,sBAAsB,CAAC,EAAE,MAAM,EAAE,CAAA;IACjC,iDAAiD;IACjD,OAAO,CAAC,EAAE,gBAAgB,EAAE,CAAA;IAC5B,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,CAAA;AAEH,mEAAmE;AACnE,MAAM,MAAM,iBAAiB,GAAG;IAC9B,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,2CAA2C;IAC3C,KAAK,CAAC,EAAE,cAAc,EAAE,CAAA;CACzB,CAAA;AAED,MAAM,MAAM,kBAAkB,GAAG,QAAQ,GAAG;IAC1C,kDAAkD;IAClD,OAAO,CAAC,EAAE,iBAAiB,CAAC,SAAS,CAAC,GAAG,GAAG,CAAC,OAAO,CAAA;IACpD,oDAAoD;IACpD,KAAK,CAAC,EAAE,iBAAiB,CAAC,OAAO,CAAC,GAAG,GAAG,CAAC,OAAO,CAAA;CACjD,CAAA;AAED,MAAM,MAAM,oBAAoB,GAAG,QAAQ,GAAG;IAC5C,kEAAkE;IAClE,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB,CAAA"}

package/dist/esm/header/headerAccountUserInfo.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"headerAccountUserInfo.d.ts","sourceRoot":"","sources":["../../../src/header/headerAccountUserInfo.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,0BAA0B,EAAE,MAAM,uBAAuB,CAAA;AAElE,4FAA4F;AAC5F,eAAO,MAAM,qBAAqB,mEAuChC,CAAA;AAEF,eAAe,qBAAqB,CAAA"}
+{"version":3,"file":"headerAccountUserInfo.d.ts","sourceRoot":"","sources":["../../../src/header/headerAccountUserInfo.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,0BAA0B,EAAE,MAAM,uBAAuB,CAAA;AAElE,4FAA4F;AAC5F,eAAO,MAAM,qBAAqB,mEA2ChC,CAAA;AAEF,eAAe,qBAAqB,CAAA"}

package/dist/esm/header/headerAccountUserInfo.js

@@ -12,8 +12,8 @@ export const HeaderAccountUserInfo = vui((props, ref) => {
     return (React.createElement(Box, { className: cs('vui-headerAccountUserInfo', className), p: 2, pb: 1, ref: ref, spaceX: 2, ...styles.accountUserInfo, ...rest, lineHeight: isApplication ? '18px' : 'inherit', pr: isApplication ? 0 : 'inherit', textAlign: isApplication ? 'right' : 'inherit' }, children ?? (React.createElement(React.Fragment, null,
         !isApplication && (React.createElement(Avatar, { className: "vui-headerAccountUserInfoAvatar", name: displayName, size: "xl", variant: "solidDarkBlue" })),
         React.createElement(Box, { column: true, rowGap: role ? 0 : 0.5 },
-            displayName && (React.createElement(T, { fontSize: isApplication ? '12px' : 'inherit', weight: "demi" }, displayName)),
-            companyName && React.createElement(T, { fontSize: isApplication ? '12px' : 'inherit' }, companyName),
-            role && (React.createElement(T, { color: "sandstone.45", fontSize: isApplication ? '12px' : 'inherit' }, role)))))));
+            displayName && (React.createElement(T, { fontSize: isApplication ? '12px' : 'inherit', isTruncated: true, pr: 1, title: displayName, weight: "demi" }, displayName)),
+            companyName && (React.createElement(T, { fontSize: isApplication ? '12px' : 'inherit', isTruncated: true, pr: 1, title: companyName }, companyName)),
+            role && (React.createElement(T, { color: "sandstone.45", fontSize: isApplication ? '12px' : 'inherit', isTruncated: true, pr: 1, title: role }, role)))))));
 });
 export default HeaderAccountUserInfo;

package/dist/esm/header/headerLinkItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"headerLinkItem.d.ts","sourceRoot":"","sources":["../../../src/header/headerLinkItem.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAA;AAEpD,0CAA0C;AAC1C,eAAO,MAAM,cAAc,2DAyDzB,CAAA;AAEF,eAAe,cAAc,CAAA"}
+{"version":3,"file":"headerLinkItem.d.ts","sourceRoot":"","sources":["../../../src/header/headerLinkItem.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAA;AAEpD,0CAA0C;AAC1C,eAAO,MAAM,cAAc,2DA6DzB,CAAA;AAEF,eAAe,cAAc,CAAA"}

package/dist/esm/header/headerLinkItem.js

@@ -28,12 +28,16 @@ export const HeaderLinkItem = vui((props, ref) => {
     const linkMobileProps = isMobile
         ? {
             color: 'darkBlue.main',
+            hoverColor: 'darkBlue.main',
             hoverBg: 'skyBlue.90',
+            activeColor: 'darkBlue.main',
+            activeBg: 'transparent',
             activeBorderColor: 'seaBlue.main',
-            activeBorderLeftWidth: 3,
-            pt: '0'
+            activeBorderLeftWidth: 0,
+            pt: '0',
+            activePl: isActive ? '13px' : '16px'
         }
-        : { activeBorderBottomWidth: 4, pt: '0px', activePt: '4px' };
+        : { activeBorderBottomWidth: 0, pt: '0px', activePt: isActive ? '1px' : '0' };
     const itemScreenProps = isMobile ? {} : { display: 'inline-flex', fontWeight: 'medium', h: '100%' };
     return (React.createElement(List.Item, { className: cs('vui-headerLinkItem', className), iconLeft: icon, linkProps: {
             href: url,

package/dist/esm/header/headerNotifications.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"headerNotifications.d.ts","sourceRoot":"","sources":["../../../src/header/headerNotifications.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,wBAAwB,EAAE,MAAM,gBAAgB,CAAA;AAoBzD,+FAA+F;AAC/F,eAAO,MAAM,mBAAmB,+DA6B9B,CAAA;AAEF,eAAe,mBAAmB,CAAA"}
+{"version":3,"file":"headerNotifications.d.ts","sourceRoot":"","sources":["../../../src/header/headerNotifications.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,wBAAwB,EAAE,MAAM,gBAAgB,CAAA;AAoBzD,+FAA+F;AAC/F,eAAO,MAAM,mBAAmB,+DAiC9B,CAAA;AAEF,eAAe,mBAAmB,CAAA"}

package/dist/esm/header/headerNotifications.js

@@ -6,7 +6,7 @@ import { useHeaderContext } from './context';
 /*@formatter:off*/
 const Badge = styled.spanBox `
   align-items: center;
-  background-color: energyRed.main;
+  background-color: energyRed.45;
   border-radius: round;
   color: white;
   display: flex;
@@ -17,7 +17,7 @@ const Badge = styled.spanBox `
   position: absolute;
   right: 1px;
   top: 1px;
-  width: 20px;
+  min-width: 20px;
 `;
 /*@formatter:on*/
 /** Icon link to Veracity notifications engine with an optional number of new notifications. */
@@ -27,6 +27,6 @@ export const HeaderNotifications = vui((props, ref) => {
     const styles = useStyleConfig('Header', useHeaderContext()).notifications;
     return (React.createElement(Button, { as: "a", className: cs('vui-headerNotifications', className), href: url ?? links.notifications, minW: 0, position: "relative", px: "9px", ref: ref, size: "lg", title: "Notifications", variant: "tertiaryDark", ...styles.container, ...rest }, children ?? (React.createElement(React.Fragment, null,
         React.createElement(Button.Icon, { name: "falBell" }),
-        count > 0 && React.createElement(Badge, null, count < 100 ? count : '99+')))));
+        count > 0 && (React.createElement(Badge, { px: count < 9 ? '0' : '4px', right: count < 9 ? 1 : 0 }, count < 100 ? count : '99+'))))));
 });
 export default HeaderNotifications;

package/dist/esm/header/headerSignIn.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"headerSignIn.d.ts","sourceRoot":"","sources":["../../../src/header/headerSignIn.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AAElD,qDAAqD;AACrD,eAAO,MAAM,YAAY,6DAoBvB,CAAA;AAEF,eAAe,YAAY,CAAA"}
+{"version":3,"file":"headerSignIn.d.ts","sourceRoot":"","sources":["../../../src/header/headerSignIn.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AAElD,qDAAqD;AACrD,eAAO,MAAM,YAAY,6DAqBvB,CAAA;AAEF,eAAe,YAAY,CAAA"}

package/dist/esm/header/headerSignIn.js

@@ -9,6 +9,6 @@ export const HeaderSignIn = vui((props, ref) => {
     const { links } = useHeaderContext() ?? {};
     const styles = useStyleConfig('Header', useHeaderContext());
     const buttonVariant = styles?.signIn?.button?.variant ?? 'primaryDark';
-    return (React.createElement(Button, { as: "a", className: cs('vui-headerSignIn', className), href: url ?? links.signIn, ref: ref, variant: buttonVariant, ...styles.signIn, ...rest }, children ?? 'Sign in'));
+    return (React.createElement(Button, { as: "a", className: cs('vui-headerSignIn', className), href: url ?? links.signIn, ref: ref, size: "lg", variant: buttonVariant, ...styles.signIn, ...rest }, children ?? 'Sign in'));
 });
 export default HeaderSignIn;