@veracity/vui 2.6.0 → 2.6.2

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 (31) hide show
  1. package/dist/cjs/dialog/dialog.js +1 -1
  2. package/dist/cjs/header/headerAccount.js +1 -1
  3. package/dist/cjs/header/headerAccountUserInfo.js +1 -1
  4. package/dist/cjs/input/inputInput.js +1 -1
  5. package/dist/cjs/modal/modalBackdrop.js +1 -1
  6. package/dist/cjs/theme/defaultTheme.d.ts +1 -0
  7. package/dist/cjs/theme/defaultTheme.d.ts.map +1 -1
  8. package/dist/cjs/theme/foundations/index.d.ts +1 -0
  9. package/dist/cjs/theme/foundations/index.d.ts.map +1 -1
  10. package/dist/cjs/theme/foundations/shadows.d.ts +1 -0
  11. package/dist/cjs/theme/foundations/shadows.d.ts.map +1 -1
  12. package/dist/cjs/theme/foundations/shadows.js +3 -1
  13. package/dist/esm/dialog/dialog.js +1 -1
  14. package/dist/esm/header/headerAccount.js +1 -1
  15. package/dist/esm/header/headerAccountUserInfo.js +1 -1
  16. package/dist/esm/input/inputInput.js +1 -1
  17. package/dist/esm/modal/modalBackdrop.js +1 -1
  18. package/dist/esm/theme/defaultTheme.d.ts +1 -0
  19. package/dist/esm/theme/defaultTheme.d.ts.map +1 -1
  20. package/dist/esm/theme/foundations/index.d.ts +1 -0
  21. package/dist/esm/theme/foundations/index.d.ts.map +1 -1
  22. package/dist/esm/theme/foundations/shadows.d.ts +1 -0
  23. package/dist/esm/theme/foundations/shadows.d.ts.map +1 -1
  24. package/dist/esm/theme/foundations/shadows.js +3 -1
  25. package/package.json +1 -1
  26. package/src/dialog/dialog.tsx +1 -1
  27. package/src/header/headerAccount.tsx +1 -1
  28. package/src/header/headerAccountUserInfo.tsx +1 -1
  29. package/src/input/inputInput.tsx +1 -1
  30. package/src/modal/modalBackdrop.tsx +1 -1
  31. package/src/theme/foundations/shadows.ts +3 -1
@@ -54,7 +54,7 @@ const dialogTitle_1 = __importDefault(require("./dialogTitle"));
54
54
  exports.DialogBase = core_1.styled.divBox `
55
55
  background-color: white;
56
56
  border-radius: 1px;
57
- box-shadow: 4;
57
+ box-shadow: modal;
58
58
  display: flex;
59
59
  flex-direction: column;
60
60
  margin: 16px;
@@ -60,7 +60,7 @@ function HeaderAccount(props) {
60
60
  : { maxH: 360, py: 1, minW: 320, w: 'auto' };
61
61
  const name = (0, utils_1.isObject)(userInfo) ? userInfo.displayName : '';
62
62
  return (react_1.default.createElement(popover_1.default, Object.assign({ isLazy: false, offset: [0, 8], options: popoverOptions, placement: "bottom-end" }, rest),
63
- react_1.default.createElement(popover_1.default.Trigger, Object.assign({ as: avatar_1.default, className: "vui-headerAccountTrigger", isInteractive: true, ml: 2, name: name, title: "Account", variant: "solid" }, styles.trigger, triggerProps)),
63
+ react_1.default.createElement(popover_1.default.Trigger, Object.assign({ as: avatar_1.default, className: "vui-headerAccountTrigger", isInteractive: true, ml: 2, name: name, title: "Account", variant: "solidDarkBlue" }, styles.trigger, triggerProps)),
64
64
  react_1.default.createElement(popover_1.default.Content, Object.assign({ className: "vui-headerAccountContent", column: true }, styles.content, contentScreenProps, contentProps),
65
65
  (0, utils_1.isJsx)(userInfo) ? userInfo : userInfo && react_1.default.createElement(headerAccountUserInfo_1.default, Object.assign({}, userInfo)),
66
66
  (0, utils_1.isJsx)(sections)
@@ -27,7 +27,7 @@ exports.HeaderAccountUserInfo = (0, core_1.vui)((props, ref) => {
27
27
  const { children, className, companyName, displayName } = props, rest = __rest(props, ["children", "className", "companyName", "displayName"]);
28
28
  const styles = (0, core_1.useStyleConfig)('Header', (0, context_1.useHeaderContext)());
29
29
  return (react_1.default.createElement(box_1.default, Object.assign({ className: (0, utils_1.cs)('vui-headerAccountUserInfo', className), p: 2, pb: 1, ref: ref, spaceX: 2 }, styles.accountUserInfo, rest), children !== null && children !== void 0 ? children : (react_1.default.createElement(react_1.default.Fragment, null,
30
- react_1.default.createElement(avatar_1.default, { className: "vui-headerAccountUserInfoAvatar", name: displayName, size: "lg" }),
30
+ react_1.default.createElement(avatar_1.default, { className: "vui-headerAccountUserInfoAvatar", name: displayName, size: "lg", variant: "solidDarkBlue" }),
31
31
  react_1.default.createElement(box_1.default, { column: true },
32
32
  displayName && (react_1.default.createElement(t_1.default, { mb: 0.5, weight: "demi" }, displayName)),
33
33
  companyName && react_1.default.createElement(t_1.default, null, companyName))))));
@@ -44,6 +44,6 @@ exports.InputInput = (0, core_1.vui)((props, ref) => {
44
44
  const aliasedProps = (0, utils_1.filterUndefined)({
45
45
  'aria-disabled': mergedProps.disabled
46
46
  });
47
- return (react_1.default.createElement(exports.InputInputBase, Object.assign({ autoComplete: false, className: (0, utils_1.cs)('vui-inputInput', className), ref: ref }, styles.input, aliasedProps, rest)));
47
+ return (react_1.default.createElement(exports.InputInputBase, Object.assign({ autoComplete: "false", className: (0, utils_1.cs)('vui-inputInput', className), ref: ref }, styles.input, aliasedProps, rest)));
48
48
  });
49
49
  exports.default = exports.InputInput;
@@ -20,7 +20,7 @@ const core_1 = require("../core");
20
20
  const theme_1 = require("../theme");
21
21
  const utils_1 = require("../utils");
22
22
  const context_1 = require("./context");
23
- const { h, s, l } = (0, utils_1.parseHSL)(theme_1.colors.seaBlue.main);
23
+ const { h, s, l } = (0, utils_1.parseHSL)(theme_1.colors.sandstone[5]);
24
24
  const rgba = (0, utils_1.HSLToRGBA)(h, s, l, 0.6);
25
25
  exports.ModalBackdropBase = core_1.styled.divBox `
26
26
  background-color: ${rgba};
@@ -485,6 +485,7 @@ declare const defaultTheme: {
485
485
  l2: string;
486
486
  l3: string;
487
487
  l4: string;
488
+ modal: string;
488
489
  };
489
490
  sizes: {};
490
491
  spaces: {};
@@ -1 +1 @@
1
- {"version":3,"file":"defaultTheme.d.ts","sourceRoot":"","sources":["../../../src/theme/defaultTheme.ts"],"names":[],"mappings":"AAGA,QAAA,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAGjB,CAAA;AAED,eAAe,YAAY,CAAA"}
1
+ {"version":3,"file":"defaultTheme.d.ts","sourceRoot":"","sources":["../../../src/theme/defaultTheme.ts"],"names":[],"mappings":"AAGA,QAAA,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAGjB,CAAA;AAED,eAAe,YAAY,CAAA"}
@@ -485,6 +485,7 @@ declare const _default: {
485
485
  l2: string;
486
486
  l3: string;
487
487
  l4: string;
488
+ modal: string;
488
489
  };
489
490
  sizes: {};
490
491
  spaces: {};
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/theme/foundations/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBA,wBAqBC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/theme/foundations/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBA,wBAqBC"}
@@ -16,6 +16,7 @@ declare const _default: {
16
16
  l2: string;
17
17
  l3: string;
18
18
  l4: string;
19
+ modal: string;
19
20
  };
20
21
  export default _default;
21
22
  //# sourceMappingURL=shadows.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"shadows.d.ts","sourceRoot":"","sources":["../../../../src/theme/foundations/shadows.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAMA,wBAkBC"}
1
+ {"version":3,"file":"shadows.d.ts","sourceRoot":"","sources":["../../../../src/theme/foundations/shadows.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;AAOA,wBAmBC"}
@@ -4,6 +4,7 @@ const utils_1 = require("../../utils");
4
4
  const colors_1 = require("./colors");
5
5
  const greyLight = (0, utils_1.hexToRGBA)(colors_1.grey[80], 0.4);
6
6
  const greyDark = (0, utils_1.hexToRGBA)(colors_1.grey[80], 0.6);
7
+ const modal = (0, utils_1.hexToRGBA)('#000000', 0.15);
7
8
  exports.default = {
8
9
  '0': `0 0 0 0 #fff`,
9
10
  '1': `0 2px 5px 0 ${greyLight}`,
@@ -21,5 +22,6 @@ exports.default = {
21
22
  l1: `-2px 0 5px 0 ${greyLight}`,
22
23
  l2: `-4px 0 12px 0 ${greyLight}`,
23
24
  l3: `-7px 0 20px 0 ${greyDark}`,
24
- l4: `-12px 0 30px 0 ${greyDark}`
25
+ l4: `-12px 0 30px 0 ${greyDark}`,
26
+ modal: `0 12px 30px 0 ${modal}`
25
27
  };
@@ -14,7 +14,7 @@ import DialogTitle from './dialogTitle';
14
14
  export const DialogBase = styled.divBox `
15
15
  background-color: white;
16
16
  border-radius: 1px;
17
- box-shadow: 4;
17
+ box-shadow: modal;
18
18
  display: flex;
19
19
  flex-direction: column;
20
20
  margin: 16px;
@@ -20,7 +20,7 @@ export function HeaderAccount(props) {
20
20
  : { maxH: 360, py: 1, minW: 320, w: 'auto' };
21
21
  const name = isObject(userInfo) ? userInfo.displayName : '';
22
22
  return (React.createElement(Popover, { isLazy: false, offset: [0, 8], options: popoverOptions, placement: "bottom-end", ...rest },
23
- React.createElement(Popover.Trigger, { as: Avatar, className: "vui-headerAccountTrigger", isInteractive: true, ml: 2, name: name, title: "Account", variant: "solid", ...styles.trigger, ...triggerProps }),
23
+ React.createElement(Popover.Trigger, { as: Avatar, className: "vui-headerAccountTrigger", isInteractive: true, ml: 2, name: name, title: "Account", variant: "solidDarkBlue", ...styles.trigger, ...triggerProps }),
24
24
  React.createElement(Popover.Content, { className: "vui-headerAccountContent", column: true, ...styles.content, ...contentScreenProps, ...contentProps },
25
25
  isJsx(userInfo) ? userInfo : userInfo && React.createElement(HeaderAccountUserInfo, { ...userInfo }),
26
26
  isJsx(sections)
@@ -10,7 +10,7 @@ export const HeaderAccountUserInfo = vui((props, ref) => {
10
10
  const { children, className, companyName, displayName, ...rest } = props;
11
11
  const styles = useStyleConfig('Header', useHeaderContext());
12
12
  return (React.createElement(Box, { className: cs('vui-headerAccountUserInfo', className), p: 2, pb: 1, ref: ref, spaceX: 2, ...styles.accountUserInfo, ...rest }, children ?? (React.createElement(React.Fragment, null,
13
- React.createElement(Avatar, { className: "vui-headerAccountUserInfoAvatar", name: displayName, size: "lg" }),
13
+ React.createElement(Avatar, { className: "vui-headerAccountUserInfoAvatar", name: displayName, size: "lg", variant: "solidDarkBlue" }),
14
14
  React.createElement(Box, { column: true },
15
15
  displayName && (React.createElement(T, { mb: 0.5, weight: "demi" }, displayName)),
16
16
  companyName && React.createElement(T, null, companyName))))));
@@ -27,6 +27,6 @@ export const InputInput = vui((props, ref) => {
27
27
  const aliasedProps = filterUndefined({
28
28
  'aria-disabled': mergedProps.disabled
29
29
  });
30
- return (React.createElement(InputInputBase, { autoComplete: false, className: cs('vui-inputInput', className), ref: ref, ...styles.input, ...aliasedProps, ...rest }));
30
+ return (React.createElement(InputInputBase, { autoComplete: "false", className: cs('vui-inputInput', className), ref: ref, ...styles.input, ...aliasedProps, ...rest }));
31
31
  });
32
32
  export default InputInput;
@@ -3,7 +3,7 @@ import { styled, useStyleConfig, vui } from '../core';
3
3
  import { colors } from '../theme';
4
4
  import { cs, HSLToRGBA, parseHSL } from '../utils';
5
5
  import { useModalContext } from './context';
6
- const { h, s, l } = parseHSL(colors.seaBlue.main);
6
+ const { h, s, l } = parseHSL(colors.sandstone[5]);
7
7
  const rgba = HSLToRGBA(h, s, l, 0.6);
8
8
  export const ModalBackdropBase = styled.divBox `
9
9
  background-color: ${rgba};
@@ -485,6 +485,7 @@ declare const defaultTheme: {
485
485
  l2: string;
486
486
  l3: string;
487
487
  l4: string;
488
+ modal: string;
488
489
  };
489
490
  sizes: {};
490
491
  spaces: {};
@@ -1 +1 @@
1
- {"version":3,"file":"defaultTheme.d.ts","sourceRoot":"","sources":["../../../src/theme/defaultTheme.ts"],"names":[],"mappings":"AAGA,QAAA,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAGjB,CAAA;AAED,eAAe,YAAY,CAAA"}
1
+ {"version":3,"file":"defaultTheme.d.ts","sourceRoot":"","sources":["../../../src/theme/defaultTheme.ts"],"names":[],"mappings":"AAGA,QAAA,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAGjB,CAAA;AAED,eAAe,YAAY,CAAA"}
@@ -485,6 +485,7 @@ declare const _default: {
485
485
  l2: string;
486
486
  l3: string;
487
487
  l4: string;
488
+ modal: string;
488
489
  };
489
490
  sizes: {};
490
491
  spaces: {};
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/theme/foundations/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBA,wBAqBC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/theme/foundations/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBA,wBAqBC"}
@@ -16,6 +16,7 @@ declare const _default: {
16
16
  l2: string;
17
17
  l3: string;
18
18
  l4: string;
19
+ modal: string;
19
20
  };
20
21
  export default _default;
21
22
  //# sourceMappingURL=shadows.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"shadows.d.ts","sourceRoot":"","sources":["../../../../src/theme/foundations/shadows.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAMA,wBAkBC"}
1
+ {"version":3,"file":"shadows.d.ts","sourceRoot":"","sources":["../../../../src/theme/foundations/shadows.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;AAOA,wBAmBC"}
@@ -2,6 +2,7 @@ import { hexToRGBA } from '../../utils';
2
2
  import { grey } from './colors';
3
3
  const greyLight = hexToRGBA(grey[80], 0.4);
4
4
  const greyDark = hexToRGBA(grey[80], 0.6);
5
+ const modal = hexToRGBA('#000000', 0.15);
5
6
  export default {
6
7
  '0': `0 0 0 0 #fff`,
7
8
  '1': `0 2px 5px 0 ${greyLight}`,
@@ -19,5 +20,6 @@ export default {
19
20
  l1: `-2px 0 5px 0 ${greyLight}`,
20
21
  l2: `-4px 0 12px 0 ${greyLight}`,
21
22
  l3: `-7px 0 20px 0 ${greyDark}`,
22
- l4: `-12px 0 30px 0 ${greyDark}`
23
+ l4: `-12px 0 30px 0 ${greyDark}`,
24
+ modal: `0 12px 30px 0 ${modal}`
23
25
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@veracity/vui",
3
- "version": "2.6.0",
3
+ "version": "2.6.2",
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",
@@ -17,7 +17,7 @@ import DialogTitle from './dialogTitle'
17
17
  export const DialogBase = styled.divBox`
18
18
  background-color: white;
19
19
  border-radius: 1px;
20
- box-shadow: 4;
20
+ box-shadow: modal;
21
21
  display: flex;
22
22
  flex-direction: column;
23
23
  margin: 16px;
@@ -36,7 +36,7 @@ export function HeaderAccount(props: HeaderAccountProps) {
36
36
  ml={2}
37
37
  name={name}
38
38
  title="Account"
39
- variant="solid"
39
+ variant="solidDarkBlue"
40
40
  {...styles.trigger}
41
41
  {...triggerProps}
42
42
  />
@@ -25,7 +25,7 @@ export const HeaderAccountUserInfo = vui<'div', HeaderAccountUserInfoProps>((pro
25
25
  >
26
26
  {children ?? (
27
27
  <>
28
- <Avatar className="vui-headerAccountUserInfoAvatar" name={displayName} size="lg" />
28
+ <Avatar className="vui-headerAccountUserInfoAvatar" name={displayName} size="lg" variant="solidDarkBlue" />
29
29
  <Box column>
30
30
  {displayName && (
31
31
  <T mb={0.5} weight="demi">
@@ -35,7 +35,7 @@ export const InputInput = vui<'input', InputInputProps>((props, ref) => {
35
35
 
36
36
  return (
37
37
  <InputInputBase
38
- autoComplete={false}
38
+ autoComplete="false"
39
39
  className={cs('vui-inputInput', className)}
40
40
  ref={ref}
41
41
  {...styles.input}
@@ -6,7 +6,7 @@ import { cs, HSLToRGBA, parseHSL } from '../utils'
6
6
  import { useModalContext } from './context'
7
7
  import { ModalBackdropProps } from './modal.types'
8
8
 
9
- const { h, s, l } = parseHSL(colors.seaBlue.main)
9
+ const { h, s, l } = parseHSL(colors.sandstone[5])
10
10
  const rgba = HSLToRGBA(h, s, l, 0.6)
11
11
 
12
12
  export const ModalBackdropBase = styled.divBox`
@@ -3,6 +3,7 @@ import { grey } from './colors'
3
3
 
4
4
  const greyLight = hexToRGBA(grey[80], 0.4)
5
5
  const greyDark = hexToRGBA(grey[80], 0.6)
6
+ const modal = hexToRGBA('#000000', 0.15)
6
7
 
7
8
  export default {
8
9
  '0': `0 0 0 0 #fff`,
@@ -21,5 +22,6 @@ export default {
21
22
  l1: `-2px 0 5px 0 ${greyLight}`,
22
23
  l2: `-4px 0 12px 0 ${greyLight}`,
23
24
  l3: `-7px 0 20px 0 ${greyDark}`,
24
- l4: `-12px 0 30px 0 ${greyDark}`
25
+ l4: `-12px 0 30px 0 ${greyDark}`,
26
+ modal: `0 12px 30px 0 ${modal}`
25
27
  }