@veracity/vui 2.14.8-beta.1 → 2.15.1

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 (38) hide show
  1. package/dist/cjs/header/header.types.d.ts +9 -4
  2. package/dist/cjs/header/header.types.d.ts.map +1 -1
  3. package/dist/cjs/header/loggedInHeader.d.ts.map +1 -1
  4. package/dist/cjs/header/loggedInHeader.js +44 -41
  5. package/dist/cjs/header/loggedOutHeader.d.ts.map +1 -1
  6. package/dist/cjs/header/loggedOutHeader.js +17 -3
  7. package/dist/cjs/input/consts.d.ts +6 -0
  8. package/dist/cjs/input/consts.d.ts.map +1 -1
  9. package/dist/cjs/input/consts.js +7 -1
  10. package/dist/cjs/input/input.d.ts.map +1 -1
  11. package/dist/cjs/input/input.js +1 -1
  12. package/dist/cjs/menu/menu.types.d.ts +5 -1
  13. package/dist/cjs/menu/menu.types.d.ts.map +1 -1
  14. package/dist/cjs/menu/menuList.d.ts.map +1 -1
  15. package/dist/cjs/menu/menuList.js +6 -1
  16. package/dist/esm/header/header.types.d.ts +9 -4
  17. package/dist/esm/header/header.types.d.ts.map +1 -1
  18. package/dist/esm/header/loggedInHeader.d.ts.map +1 -1
  19. package/dist/esm/header/loggedInHeader.js +38 -35
  20. package/dist/esm/header/loggedOutHeader.d.ts.map +1 -1
  21. package/dist/esm/header/loggedOutHeader.js +18 -4
  22. package/dist/esm/input/consts.d.ts +6 -0
  23. package/dist/esm/input/consts.d.ts.map +1 -1
  24. package/dist/esm/input/consts.js +6 -0
  25. package/dist/esm/input/input.d.ts.map +1 -1
  26. package/dist/esm/input/input.js +2 -2
  27. package/dist/esm/menu/menu.types.d.ts +5 -1
  28. package/dist/esm/menu/menu.types.d.ts.map +1 -1
  29. package/dist/esm/menu/menuList.d.ts.map +1 -1
  30. package/dist/esm/menu/menuList.js +6 -1
  31. package/package.json +1 -1
  32. package/src/header/header.types.ts +31 -25
  33. package/src/header/loggedInHeader.tsx +115 -93
  34. package/src/header/loggedOutHeader.tsx +39 -4
  35. package/src/input/consts.ts +7 -0
  36. package/src/input/input.tsx +9 -2
  37. package/src/menu/menu.types.ts +5 -1
  38. package/src/menu/menuList.tsx +15 -1
package/dist/cjs/header/header.types.d.ts CHANGED
@@ -69,12 +69,12 @@ export type HeaderServicesProps = MenuProps & HeaderServicesData & {
69
69
  showTopBorder?: boolean;
70
70
  };
71
71
  export type HeaderSupportProps = MenuProps & HeaderServicesData & {};
72
- export type HeaderSignInData = {
72
+ export type HeaderButtonData = {
73
73
  /** Provides href to the button link. */
74
74
  url?: string;
75
75
  };
76
- export type HeaderSignInProps = ButtonProps & HeaderSignInData;
77
- export type LoggedInHeaderProps = HeaderProps & {
76
+ export type HeaderSignInProps = ButtonProps & HeaderButtonData;
77
+ export type LoggedInHeaderProps = HeaderProps & HeaderButtonData & {
78
78
  /** Socket for account popover icon on the right side. */
79
79
  account?: HeaderAccountData | JSX.Element;
80
80
  supportLinks?: HeaderServicesData;
@@ -82,6 +82,7 @@ export type LoggedInHeaderProps = HeaderProps & {
82
82
  applicationName?: string;
83
83
  applicationUrl?: string;
84
84
  isApplication?: boolean;
85
+ isCleanLayout?: boolean;
85
86
  isSticky?: boolean;
86
87
  /** Socket for logo on the left side. */
87
88
  logo?: LogoData | JSX.Element;
@@ -99,6 +100,10 @@ export type LoggedInHeaderProps = HeaderProps & {
99
100
  showMainLinks?: boolean;
100
101
  };
101
102
  export type LoggedOutHeaderProps = HeaderProps & {
103
+ /** Socket for the app name on the left side. */
104
+ applicationName?: string;
105
+ applicationUrl?: string;
106
+ isApplication?: boolean;
102
107
  /** Socket for create account prompt on the right side. */
103
108
  createAccount?: HeaderCreateAccountData | JSX.Element;
104
109
  isSticky?: boolean;
@@ -107,6 +112,6 @@ export type LoggedOutHeaderProps = HeaderProps & {
107
112
  /** Socket for links in the middle-right section. */
108
113
  mainLinks?: HeaderLinkData[] | JSX.Element;
109
114
  /** Socket for sign in button on the right side. */
110
- signIn?: HeaderSignInData | JSX.Element;
115
+ signIn?: HeaderButtonData | JSX.Element;
111
116
  };
112
117
  //# sourceMappingURL=header.types.d.ts.map
package/dist/cjs/header/header.types.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"header.types.d.ts","sourceRoot":"","sources":["../../../src/header/header.types.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"header.types.d.ts","sourceRoot":"","sources":["../../../src/header/header.types.ts"],"names":[],"mappings":"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"}
package/dist/cjs/header/loggedInHeader.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"loggedInHeader.d.ts","sourceRoot":"","sources":["../../../src/header/loggedInHeader.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAkB,mBAAmB,EAAE,MAAM,gBAAgB,CAAA;AAIpE,uHAAuH;AACvH,eAAO,MAAM,cAAc,4DA4JzB,CAAA;AAIF,eAAe,cAAc,CAAA"}
1
+ {"version":3,"file":"loggedInHeader.d.ts","sourceRoot":"","sources":["../../../src/header/loggedInHeader.tsx"],"names":[],"mappings":"AASA,OAAO,EAAkB,mBAAmB,EAAE,MAAM,gBAAgB,CAAA;AAIpE,uHAAuH;AACvH,eAAO,MAAM,cAAc,4DAiLzB,CAAA;AAIF,eAAe,cAAc,CAAA"}
package/dist/cjs/header/loggedInHeader.js CHANGED
@@ -17,6 +17,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
17
17
  exports.LoggedInHeader = void 0;
18
18
  const react_1 = __importDefault(require("react"));
19
19
  const box_1 = __importDefault(require("../box"));
20
+ const button_1 = __importDefault(require("../button"));
20
21
  const core_1 = require("../core");
21
22
  const list_1 = __importDefault(require("../list"));
22
23
  const utils_1 = require("../utils");
@@ -26,7 +27,7 @@ const headerAccountUserInfo_1 = __importDefault(require("./headerAccountUserInfo
26
27
  const headerServicesMessage_1 = __importDefault(require("./headerServicesMessage"));
27
28
  /** Displays Header content appropriate for logged-in users, such as services, notifications or account information. */
28
29
  exports.LoggedInHeader = (0, core_1.vui)((props, ref) => {
29
- const { account, supportLinks, applicationName, applicationUrl, children, className, isApplication = false, logo, mainLinks, services, showAltUserInfo = true, showMainLinks = isApplication ? false : true, showServices = true, notifications } = props, rest = __rest(props, ["account", "supportLinks", "applicationName", "applicationUrl", "children", "className", "isApplication", "logo", "mainLinks", "services", "showAltUserInfo", "showMainLinks", "showServices", "notifications"]);
30
+ const { account, supportLinks, applicationName, applicationUrl, children, className, isApplication = false, isCleanLayout = false, logo, mainLinks, services, showAltUserInfo = true, showMainLinks = isApplication ? false : true, showServices = true, notifications, url } = props, rest = __rest(props, ["account", "supportLinks", "applicationName", "applicationUrl", "children", "className", "isApplication", "isCleanLayout", "logo", "mainLinks", "services", "showAltUserInfo", "showMainLinks", "showServices", "notifications", "url"]);
30
31
  if (isApplication) {
31
32
  if (!applicationName) {
32
33
  console.error('Header: isApplication is true but applicationName is not set.');
@@ -38,7 +39,7 @@ exports.LoggedInHeader = (0, core_1.vui)((props, ref) => {
38
39
  const servicesLinks = (0, utils_1.isJsx)(services) ? [] : (services === null || services === void 0 ? void 0 : services.links) || [];
39
40
  const styles = (0, core_1.useStyleConfig)('Header', (0, context_1.useHeaderContext)());
40
41
  const localTextColor = (rest === null || rest === void 0 ? void 0 : rest.variant) === 'dark' ? 'white' : 'darkBlue.main';
41
- return (react_1.default.createElement(header_1.default, Object.assign({ className: (0, utils_1.cs)('vui-loggedInHeader', isApplication ? 'vui-loggedInAppHeader' : '', className), mb: isApplication && isSmallScreen ? '41px' : 'inherited', ref: ref }, rest),
42
+ return (react_1.default.createElement(header_1.default, Object.assign({ className: (0, utils_1.cs)('vui-loggedInHeader', isApplication ? 'vui-loggedInAppHeader' : undefined, className), mb: isApplication && isSmallScreen ? '41px' : 'inherited', ref: ref }, rest),
42
43
  react_1.default.createElement(header_1.default.Content, null,
43
44
  (!isApplication || !isLessThanMD) && react_1.default.createElement(react_1.default.Fragment, null,
44
45
  " ",
@@ -49,46 +50,48 @@ exports.LoggedInHeader = (0, core_1.vui)((props, ref) => {
49
50
  react_1.default.createElement(header_1.default.ApplicationName, { color: localTextColor, title: applicationName, url: applicationUrl || '/' }))),
50
51
  !isApplication && react_1.default.createElement(core_1.RenderOnScreen, { minWidth: "lg" }, children),
51
52
  react_1.default.createElement(box_1.default, { ml: "auto" }),
52
- isApplication && (react_1.default.createElement(react_1.default.Fragment, null,
53
- react_1.default.createElement(core_1.RenderOnScreen, { minWidth: "lg" },
54
- showMainLinks && mainLinks !== undefined && (react_1.default.createElement(react_1.default.Fragment, null,
55
- (0, utils_1.isJsx)(mainLinks) ? mainLinks : react_1.default.createElement(header_1.default.MainLinks, { links: mainLinks }),
56
- react_1.default.createElement(header_1.default.Divider, { mx: 1 }))),
57
- !showMainLinks && mainLinks && (react_1.default.createElement(react_1.default.Fragment, null,
58
- react_1.default.createElement(header_1.default.MobileToggle, { ml: 0 }),
59
- react_1.default.createElement(header_1.default.MobileContent, null,
60
- react_1.default.createElement(react_1.default.Fragment, null,
61
- (0, utils_1.isJsx)(mainLinks) ? (mainLinks) : (react_1.default.createElement(box_1.default, { column: true, w: 1 },
62
- react_1.default.createElement(list_1.default, { py: 1 }, mainLinks === null || mainLinks === void 0 ? void 0 : mainLinks.map((_a, index) => {
63
- var { icon, url } = _a, rest = __rest(_a, ["icon", "url"]);
64
- return (react_1.default.createElement(list_1.default.Item, Object.assign({ iconLeft: icon, key: index, linkProps: { href: url } }, rest)));
65
- })))),
66
- !showServices && servicesLinks && (react_1.default.createElement(box_1.default, { column: true, w: 1 },
67
- react_1.default.createElement(list_1.default, Object.assign({ className: "vui-headerHiddenServicesLargeScreen", heading: "My Services", maxH: 295, right: 0, w: 320 }, styles.services.list, { borderTop: 1, borderTopColor: "sandstone.main", pt: 1 }), servicesLinks.length > 0 ? (servicesLinks === null || servicesLinks === void 0 ? void 0 : servicesLinks.map((_a, index) => {
68
- var { url } = _a, rest = __rest(_a, ["url"]);
69
- return (react_1.default.createElement(list_1.default.Item, Object.assign({ key: index, linkProps: { href: url } }, rest)));
70
- })) : (react_1.default.createElement(headerServicesMessage_1.default, null))))))))),
71
- showServices && services && (react_1.default.createElement(react_1.default.Fragment, null, (0, utils_1.isJsx)(services) ? services : react_1.default.createElement(header_1.default.Services, Object.assign({ isApplication: isApplication }, services))))),
72
- react_1.default.createElement(header_1.default.Support, Object.assign({}, supportLinks)))),
73
- !isApplication && (react_1.default.createElement(core_1.RenderOnScreen, { minWidth: "lg" },
74
- (0, utils_1.isJsx)(mainLinks) ? mainLinks : react_1.default.createElement(header_1.default.MainLinks, { links: mainLinks }),
75
- mainLinks !== undefined && react_1.default.createElement(header_1.default.Divider, { mx: 1 }),
76
- (0, utils_1.isJsx)(services) ? services : react_1.default.createElement(header_1.default.Services, Object.assign({}, services)))),
77
- (0, utils_1.isJsx)(notifications) ? notifications : react_1.default.createElement(header_1.default.Notifications, Object.assign({}, notifications)),
78
- !showMainLinks &&
79
- showAltUserInfo &&
80
- ((0, utils_1.isJsx)(userInfo) ? (userInfo) : (react_1.default.createElement(react_1.default.Fragment, null,
81
- react_1.default.createElement(header_1.default.Divider, { ml: 2 }),
82
- react_1.default.createElement(headerAccountUserInfo_1.default, Object.assign({ className: "vui-altUserInfo", color: localTextColor, isApplication: true }, userInfo))))),
83
- (0, utils_1.isJsx)(account) ? account : react_1.default.createElement(header_1.default.Account, Object.assign({}, account)),
84
- react_1.default.createElement(core_1.RenderOnScreen, { maxWidth: "lg" },
85
- isApplication && react_1.default.createElement(header_1.default.Divider, { ml: 1 }),
86
- !isApplication && (account !== undefined || notifications !== undefined) && react_1.default.createElement(header_1.default.Divider, { ml: 1 }),
87
- react_1.default.createElement(header_1.default.MobileToggle, null),
88
- react_1.default.createElement(header_1.default.MobileContent, null,
89
- !isApplication && children,
53
+ isCleanLayout ? (react_1.default.createElement(react_1.default.Fragment, null, !!url && (react_1.default.createElement(box_1.default, null,
54
+ react_1.default.createElement(button_1.default, { as: "a", className: (0, utils_1.cs)('vui-headerSignOut'), href: url, size: "lg", variant: "secondaryDark" }, "Sign out"))))) : (react_1.default.createElement(react_1.default.Fragment, null,
55
+ isApplication && (react_1.default.createElement(react_1.default.Fragment, null,
56
+ react_1.default.createElement(core_1.RenderOnScreen, { minWidth: "lg" },
57
+ showMainLinks && mainLinks !== undefined && (react_1.default.createElement(react_1.default.Fragment, null,
58
+ (0, utils_1.isJsx)(mainLinks) ? mainLinks : react_1.default.createElement(header_1.default.MainLinks, { links: mainLinks }),
59
+ react_1.default.createElement(header_1.default.Divider, { mx: 1 }))),
60
+ !showMainLinks && mainLinks && (react_1.default.createElement(react_1.default.Fragment, null,
61
+ react_1.default.createElement(header_1.default.MobileToggle, { ml: 0 }),
62
+ react_1.default.createElement(header_1.default.MobileContent, null,
63
+ react_1.default.createElement(react_1.default.Fragment, null,
64
+ (0, utils_1.isJsx)(mainLinks) ? (mainLinks) : (react_1.default.createElement(box_1.default, { column: true, w: 1 },
65
+ react_1.default.createElement(list_1.default, { py: 1 }, mainLinks === null || mainLinks === void 0 ? void 0 : mainLinks.map((_a, index) => {
66
+ var { icon, url } = _a, rest = __rest(_a, ["icon", "url"]);
67
+ return (react_1.default.createElement(list_1.default.Item, Object.assign({ iconLeft: icon, key: index, linkProps: { href: url } }, rest)));
68
+ })))),
69
+ !showServices && servicesLinks && (react_1.default.createElement(box_1.default, { column: true, w: 1 },
70
+ react_1.default.createElement(list_1.default, Object.assign({ className: "vui-headerHiddenServicesLargeScreen", heading: "My Services", maxH: 295, right: 0, w: 320 }, styles.services.list, { borderTop: 1, borderTopColor: "sandstone.main", pt: 1 }), servicesLinks.length > 0 ? (servicesLinks === null || servicesLinks === void 0 ? void 0 : servicesLinks.map((_a, index) => {
71
+ var { url } = _a, rest = __rest(_a, ["url"]);
72
+ return (react_1.default.createElement(list_1.default.Item, Object.assign({ key: index, linkProps: { href: url } }, rest)));
73
+ })) : (react_1.default.createElement(headerServicesMessage_1.default, null))))))))),
74
+ showServices && services && (react_1.default.createElement(react_1.default.Fragment, null, (0, utils_1.isJsx)(services) ? services : react_1.default.createElement(header_1.default.Services, Object.assign({ isApplication: isApplication }, services))))),
75
+ react_1.default.createElement(header_1.default.Support, Object.assign({}, supportLinks)))),
76
+ !isApplication && (react_1.default.createElement(core_1.RenderOnScreen, { minWidth: "lg" },
90
77
  (0, utils_1.isJsx)(mainLinks) ? mainLinks : react_1.default.createElement(header_1.default.MainLinks, { links: mainLinks }),
91
- (0, utils_1.isJsx)(services) ? services : react_1.default.createElement(header_1.default.Services, Object.assign({}, services, { showTopBorder: mainLinks ? true : false })))))));
78
+ mainLinks !== undefined && react_1.default.createElement(header_1.default.Divider, { mx: 1 }),
79
+ (0, utils_1.isJsx)(services) ? services : react_1.default.createElement(header_1.default.Services, Object.assign({}, services)))),
80
+ (0, utils_1.isJsx)(notifications) ? notifications : react_1.default.createElement(header_1.default.Notifications, Object.assign({}, notifications)),
81
+ !showMainLinks &&
82
+ showAltUserInfo &&
83
+ ((0, utils_1.isJsx)(userInfo) ? (userInfo) : (react_1.default.createElement(react_1.default.Fragment, null,
84
+ react_1.default.createElement(header_1.default.Divider, { ml: 2 }),
85
+ react_1.default.createElement(headerAccountUserInfo_1.default, Object.assign({ className: "vui-altUserInfo", color: localTextColor, isApplication: true }, userInfo))))),
86
+ (0, utils_1.isJsx)(account) ? account : react_1.default.createElement(header_1.default.Account, Object.assign({}, account)),
87
+ react_1.default.createElement(core_1.RenderOnScreen, { maxWidth: "lg" },
88
+ isApplication && react_1.default.createElement(header_1.default.Divider, { ml: 1 }),
89
+ !isApplication && (account !== undefined || notifications !== undefined) && react_1.default.createElement(header_1.default.Divider, { ml: 1 }),
90
+ react_1.default.createElement(header_1.default.MobileToggle, null),
91
+ react_1.default.createElement(header_1.default.MobileContent, null,
92
+ !isApplication && children,
93
+ (0, utils_1.isJsx)(mainLinks) ? mainLinks : react_1.default.createElement(header_1.default.MainLinks, { links: mainLinks }),
94
+ (0, utils_1.isJsx)(services) ? (services) : (react_1.default.createElement(header_1.default.Services, Object.assign({}, services, { showTopBorder: mainLinks ? true : false }))))))))));
92
95
  });
93
96
  exports.LoggedInHeader.displayName = 'LoggedInHeader';
94
97
  exports.default = exports.LoggedInHeader;
package/dist/cjs/header/loggedOutHeader.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"loggedOutHeader.d.ts","sourceRoot":"","sources":["../../../src/header/loggedOutHeader.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAA;AAErD,iHAAiH;AACjH,eAAO,MAAM,eAAe,6DAwC1B,CAAA;AAIF,eAAe,eAAe,CAAA"}
1
+ {"version":3,"file":"loggedOutHeader.d.ts","sourceRoot":"","sources":["../../../src/header/loggedOutHeader.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAA;AAErD,iHAAiH;AACjH,eAAO,MAAM,eAAe,6DA2E1B,CAAA;AAIF,eAAe,eAAe,CAAA"}
package/dist/cjs/header/loggedOutHeader.js CHANGED
@@ -22,10 +22,24 @@ const utils_1 = require("../utils");
22
22
  const header_1 = __importDefault(require("./header"));
23
23
  /** Displays Header content appropriate for logged out users, such as sign in button or create account prompt. */
24
24
  exports.LoggedOutHeader = (0, core_1.vui)((props, ref) => {
25
- const { children, className, createAccount, logo, mainLinks, signIn } = props, rest = __rest(props, ["children", "className", "createAccount", "logo", "mainLinks", "signIn"]);
26
- return (react_1.default.createElement(header_1.default, Object.assign({ className: (0, utils_1.cs)('vui-loggedOutHeader', className), ref: ref }, rest),
25
+ const { applicationName, applicationUrl, children, className, isApplication = false, createAccount, logo, mainLinks, signIn } = props, rest = __rest(props, ["applicationName", "applicationUrl", "children", "className", "isApplication", "createAccount", "logo", "mainLinks", "signIn"]);
26
+ if (isApplication) {
27
+ if (!applicationName) {
28
+ console.error('Header: isApplication is true but applicationName is not set.');
29
+ }
30
+ }
31
+ const isSmallScreen = (0, core_1.useDown)('md');
32
+ const isLessThanMD = (0, core_1.useDown)('sm');
33
+ const localTextColor = (rest === null || rest === void 0 ? void 0 : rest.variant) === 'dark' ? 'white' : 'darkBlue.main';
34
+ return (react_1.default.createElement(header_1.default, Object.assign({ className: (0, utils_1.cs)('vui-loggedOutHeader', isApplication ? 'vui-loggedOutAppHeader' : undefined, className), mb: isApplication && isSmallScreen ? '41px' : 'inherited', ref: ref }, rest),
27
35
  react_1.default.createElement(header_1.default.Content, null,
28
- (0, utils_1.isJsx)(logo) ? logo : react_1.default.createElement(header_1.default.Logo, Object.assign({}, logo)),
36
+ (!isApplication || !isLessThanMD) && react_1.default.createElement(react_1.default.Fragment, null,
37
+ " ",
38
+ (0, utils_1.isJsx)(logo) ? logo : react_1.default.createElement(header_1.default.Logo, Object.assign({}, logo))),
39
+ isApplication && (react_1.default.createElement(react_1.default.Fragment, null,
40
+ react_1.default.createElement(core_1.RenderOnScreen, { minWidth: "sm" },
41
+ react_1.default.createElement(header_1.default.Divider, { mr: 2 })),
42
+ react_1.default.createElement(header_1.default.ApplicationName, { color: localTextColor, title: applicationName, url: applicationUrl || '/' }))),
29
43
  react_1.default.createElement(core_1.RenderOnScreen, { minWidth: "lg" }, children),
30
44
  react_1.default.createElement(box_1.default, { ml: "auto" }),
31
45
  react_1.default.createElement(core_1.RenderOnScreen, { minWidth: "lg" },
package/dist/cjs/input/consts.d.ts CHANGED
@@ -23,4 +23,10 @@ export declare const displayValueOnlyTextSize: {
23
23
  lg: string;
24
24
  xl: string;
25
25
  };
26
+ export declare const clearIconSize: {
27
+ sm: string;
28
+ md: string;
29
+ lg: string;
30
+ xl: string;
31
+ };
26
32
  //# sourceMappingURL=consts.d.ts.map
package/dist/cjs/input/consts.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"consts.d.ts","sourceRoot":"","sources":["../../../src/input/consts.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAA;AAEjD,eAAO,MAAM,WAAW;;;;;;;;;;;CAWvB,CAAA;AAED,eAAO,MAAM,UAAU;;;;CAItB,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,iBAuB/B,CAAA;AAED,eAAO,MAAM,wBAAwB;;;;;CAKpC,CAAA"}
1
+ {"version":3,"file":"consts.d.ts","sourceRoot":"","sources":["../../../src/input/consts.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAA;AAEjD,eAAO,MAAM,WAAW;;;;;;;;;;;CAWvB,CAAA;AAED,eAAO,MAAM,UAAU;;;;CAItB,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,iBAuB/B,CAAA;AAED,eAAO,MAAM,wBAAwB;;;;;CAKpC,CAAA;AAED,eAAO,MAAM,aAAa;;;;;CAKzB,CAAA"}
package/dist/cjs/input/consts.js CHANGED
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.displayValueOnlyTextSize = exports.inputStateMapping = exports.stateIcons = exports.inputColors = void 0;
3
+ exports.clearIconSize = exports.displayValueOnlyTextSize = exports.inputStateMapping = exports.stateIcons = exports.inputColors = void 0;
4
4
  exports.inputColors = {
5
5
  border: 'sandstone.60',
6
6
  placeholder: 'sandstone.55',
@@ -48,3 +48,9 @@ exports.displayValueOnlyTextSize = {
48
48
  lg: 'md',
49
49
  xl: 'lg'
50
50
  };
51
+ exports.clearIconSize = {
52
+ sm: 'sm',
53
+ md: 'sm',
54
+ lg: 'sm',
55
+ xl: 'md'
56
+ };
package/dist/cjs/input/input.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../src/input/input.tsx"],"names":[],"mappings":"AAGA,OAAO,EAA+B,YAAY,EAAE,MAAM,SAAS,CAAA;AAOnE,OAAO,QAAQ,MAAM,YAAY,CAAA;AACjC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC1C,OAAO,SAAS,MAAM,aAAa,CAAA;AACnC,OAAO,UAAU,MAAM,cAAc,CAAA;AAErC,eAAO,MAAM,SAAS,+HAmBrB,CAAA;AAED;;;;GAIG;AACH,eAAO,MAAM,KAAK;UAgKV,gBAAgB;WACf,iBAAiB;cACd,eAAe;CAC1B,CAAA;AAOD,eAAe,KAAK,CAAA"}
1
+ {"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../src/input/input.tsx"],"names":[],"mappings":"AAGA,OAAO,EAA+B,YAAY,EAAE,MAAM,SAAS,CAAA;AAOnE,OAAO,QAAQ,MAAM,YAAY,CAAA;AACjC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC1C,OAAO,SAAS,MAAM,aAAa,CAAA;AACnC,OAAO,UAAU,MAAM,cAAc,CAAA;AAErC,eAAO,MAAM,SAAS,+HAmBrB,CAAA;AAED;;;;GAIG;AACH,eAAO,MAAM,KAAK;UAuKV,gBAAgB;WACf,iBAAiB;cACd,eAAe;CAC1B,CAAA;AAOD,eAAe,KAAK,CAAA"}
package/dist/cjs/input/input.js CHANGED
@@ -138,7 +138,7 @@ exports.Input = (0, core_1.vui)((props, ref) => {
138
138
  (0, utils_1.isString)(iconRight) ? react_1.default.createElement(inputIcon_1.default, { mr: 1, name: iconRight }) : iconRight,
139
139
  itemRight,
140
140
  state && react_1.default.createElement(inputIcon_1.default, Object.assign({ mr: 1 }, (_b = states[state]) === null || _b === void 0 ? void 0 : _b.iconProps)),
141
- allowClear && (react_1.default.createElement(button_1.IconButton, { disabled: !valueInternal, icon: "falTimes", onClick: onClear, size: size, title: "Clear" })),
141
+ allowClear && (react_1.default.createElement(button_1.IconButton, { disabled: !valueInternal, icon: "falTimes", mr: 0.5, onClick: onClear, size: consts_1.clearIconSize[size], title: "Clear" })),
142
142
  showCount && (react_1.default.createElement(t_1.T, { className: "vui-inputCount", color: maxLength && count > maxLength ? consts_1.inputColors.error : consts_1.inputColors.helpText, position: "absolute", right: 0, size: "sm", top: "calc(100% + 1px)" },
143
143
  count,
144
144
  " ",
package/dist/cjs/menu/menu.types.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { RefObject } from 'react';
1
+ import { ReactNode, RefObject } from 'react';
2
2
  import { ListProps } from '../list';
3
3
  import { PopoverContentProps, PopoverProps } from '../popover';
4
4
  import { ThemingProps } from '../theme';
@@ -7,6 +7,10 @@ export type MenuListProps = ListProps & {
7
7
  contentProps?: PopoverContentProps;
8
8
  /** Ref passed to the inner PopoverContent. */
9
9
  contentRef?: RefObject<HTMLDivElement>;
10
+ /** Custom content displayed at the bottom of the panel */
11
+ slotBottom?: ReactNode;
12
+ /** Custom content displayed at the top of the panel */
13
+ slotTop?: ReactNode;
10
14
  };
11
15
  export type MenuProps = ThemingProps<'Menu'> & PopoverProps & {
12
16
  /** Content closes when clicking on a list item. */
package/dist/cjs/menu/menu.types.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"menu.types.d.ts","sourceRoot":"","sources":["../../../src/menu/menu.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AACnC,OAAO,EAAE,mBAAmB,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAC9D,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG;IACtC,uDAAuD;IACvD,YAAY,CAAC,EAAE,mBAAmB,CAAA;IAClC,8CAA8C;IAC9C,UAAU,CAAC,EAAE,SAAS,CAAC,cAAc,CAAC,CAAA;CACvC,CAAA;AAED,MAAM,MAAM,SAAS,GAAG,YAAY,CAAC,MAAM,CAAC,GAC1C,YAAY,GAAG;IACb,mDAAmD;IACnD,aAAa,CAAC,EAAE,OAAO,CAAA;CACxB,CAAA"}
1
+ {"version":3,"file":"menu.types.d.ts","sourceRoot":"","sources":["../../../src/menu/menu.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAE5C,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AACnC,OAAO,EAAE,mBAAmB,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAC9D,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG;IACtC,uDAAuD;IACvD,YAAY,CAAC,EAAE,mBAAmB,CAAA;IAClC,8CAA8C;IAC9C,UAAU,CAAC,EAAE,SAAS,CAAC,cAAc,CAAC,CAAA;IACtC,0DAA0D;IAC1D,UAAU,CAAC,EAAE,SAAS,CAAA;IACtB,uDAAuD;IACvD,OAAO,CAAC,EAAE,SAAS,CAAA;CACpB,CAAA;AAED,MAAM,MAAM,SAAS,GAAG,YAAY,CAAC,MAAM,CAAC,GAC1C,YAAY,GAAG;IACb,mDAAmD;IACnD,aAAa,CAAC,EAAE,OAAO,CAAA;CACxB,CAAA"}
package/dist/cjs/menu/menuList.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"menuList.d.ts","sourceRoot":"","sources":["../../../src/menu/menuList.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAuB,YAAY,EAAE,MAAM,SAAS,CAAA;AAC3D,OAAO,IAAI,MAAM,SAAS,CAAA;AAI1B,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAA;AAE5C,kEAAkE;AAClE,eAAO,MAAM,QAAQ;aAUV,OAAO,KAAK,OAAO;aACnB,OAAO,KAAK,OAAO;UACtB,OAAO,KAAK,IAAI;UAChB,OAAO,KAAK,IAAI;UAChB,OAAO,SAAS;CACvB,CAAA;AAQD,eAAe,QAAQ,CAAA"}
1
+ {"version":3,"file":"menuList.d.ts","sourceRoot":"","sources":["../../../src/menu/menuList.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAuB,YAAY,EAAE,MAAM,SAAS,CAAA;AAC3D,OAAO,IAAI,MAAM,SAAS,CAAA;AAI1B,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAA;AAE5C,kEAAkE;AAClE,eAAO,MAAM,QAAQ;aAuBV,OAAO,KAAK,OAAO;aACnB,OAAO,KAAK,OAAO;UACtB,OAAO,KAAK,IAAI;UAChB,OAAO,KAAK,IAAI;UAChB,OAAO,SAAS;CACvB,CAAA;AAQD,eAAe,QAAQ,CAAA"}
package/dist/cjs/menu/menuList.js CHANGED
@@ -16,6 +16,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
16
16
  Object.defineProperty(exports, "__esModule", { value: true });
17
17
  exports.MenuList = void 0;
18
18
  const react_1 = __importDefault(require("react"));
19
+ const box_1 = require("../box");
19
20
  const core_1 = require("../core");
20
21
  const list_1 = __importDefault(require("../list"));
21
22
  const popover_1 = require("../popover");
@@ -24,9 +25,13 @@ const context_1 = require("./context");
24
25
  /** Displays a list of menu items in a popover content element. */
25
26
  exports.MenuList = (0, core_1.vui)((props, ref) => {
26
27
  const { className, contentProps, contentRef } = props, rest = __rest(props, ["className", "contentProps", "contentRef"]);
28
+ const { slotTop, slotBottom } = props;
27
29
  const styles = (0, core_1.useStyleConfig)('Menu', (0, context_1.useMenuContext)());
28
30
  return (react_1.default.createElement(popover_1.PopoverContent, Object.assign({ borderRadius: 0, ref: contentRef }, contentProps),
29
- react_1.default.createElement(list_1.default, Object.assign({ className: (0, utils_1.cs)('vui-menuList', className), py: 1, ref: ref, w: "100%" }, styles.list, rest, { maxH: 295 }))));
31
+ react_1.default.createElement(box_1.Box, { flexDirection: "column" },
32
+ slotTop,
33
+ react_1.default.createElement(list_1.default, Object.assign({ className: (0, utils_1.cs)('vui-menuList', className), py: 1, ref: ref, w: "100%" }, styles.list, rest, { maxH: 295 })),
34
+ slotBottom)));
30
35
  });
31
36
  exports.MenuList.Divider = list_1.default.Divider;
32
37
  exports.MenuList.Heading = list_1.default.Heading;
package/dist/esm/header/header.types.d.ts CHANGED
@@ -69,12 +69,12 @@ export type HeaderServicesProps = MenuProps & HeaderServicesData & {
69
69
  showTopBorder?: boolean;
70
70
  };
71
71
  export type HeaderSupportProps = MenuProps & HeaderServicesData & {};
72
- export type HeaderSignInData = {
72
+ export type HeaderButtonData = {
73
73
  /** Provides href to the button link. */
74
74
  url?: string;
75
75
  };
76
- export type HeaderSignInProps = ButtonProps & HeaderSignInData;
77
- export type LoggedInHeaderProps = HeaderProps & {
76
+ export type HeaderSignInProps = ButtonProps & HeaderButtonData;
77
+ export type LoggedInHeaderProps = HeaderProps & HeaderButtonData & {
78
78
  /** Socket for account popover icon on the right side. */
79
79
  account?: HeaderAccountData | JSX.Element;
80
80
  supportLinks?: HeaderServicesData;
@@ -82,6 +82,7 @@ export type LoggedInHeaderProps = HeaderProps & {
82
82
  applicationName?: string;
83
83
  applicationUrl?: string;
84
84
  isApplication?: boolean;
85
+ isCleanLayout?: boolean;
85
86
  isSticky?: boolean;
86
87
  /** Socket for logo on the left side. */
87
88
  logo?: LogoData | JSX.Element;
@@ -99,6 +100,10 @@ export type LoggedInHeaderProps = HeaderProps & {
99
100
  showMainLinks?: boolean;
100
101
  };
101
102
  export type LoggedOutHeaderProps = HeaderProps & {
103
+ /** Socket for the app name on the left side. */
104
+ applicationName?: string;
105
+ applicationUrl?: string;
106
+ isApplication?: boolean;
102
107
  /** Socket for create account prompt on the right side. */
103
108
  createAccount?: HeaderCreateAccountData | JSX.Element;
104
109
  isSticky?: boolean;
@@ -107,6 +112,6 @@ export type LoggedOutHeaderProps = HeaderProps & {
107
112
  /** Socket for links in the middle-right section. */
108
113
  mainLinks?: HeaderLinkData[] | JSX.Element;
109
114
  /** Socket for sign in button on the right side. */
110
- signIn?: HeaderSignInData | JSX.Element;
115
+ signIn?: HeaderButtonData | JSX.Element;
111
116
  };
112
117
  //# sourceMappingURL=header.types.d.ts.map
package/dist/esm/header/header.types.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"header.types.d.ts","sourceRoot":"","sources":["../../../src/header/header.types.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"header.types.d.ts","sourceRoot":"","sources":["../../../src/header/header.types.ts"],"names":[],"mappings":"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"}
package/dist/esm/header/loggedInHeader.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"loggedInHeader.d.ts","sourceRoot":"","sources":["../../../src/header/loggedInHeader.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAkB,mBAAmB,EAAE,MAAM,gBAAgB,CAAA;AAIpE,uHAAuH;AACvH,eAAO,MAAM,cAAc,4DA4JzB,CAAA;AAIF,eAAe,cAAc,CAAA"}
1
+ {"version":3,"file":"loggedInHeader.d.ts","sourceRoot":"","sources":["../../../src/header/loggedInHeader.tsx"],"names":[],"mappings":"AASA,OAAO,EAAkB,mBAAmB,EAAE,MAAM,gBAAgB,CAAA;AAIpE,uHAAuH;AACvH,eAAO,MAAM,cAAc,4DAiLzB,CAAA;AAIF,eAAe,cAAc,CAAA"}
package/dist/esm/header/loggedInHeader.js CHANGED
@@ -1,5 +1,6 @@
1
1
  import React from 'react';
2
2
  import Box from '../box';
3
+ import Button from '../button';
3
4
  import { RenderOnScreen, useDown, useStyleConfig, vui } from '../core';
4
5
  import List from '../list';
5
6
  import { cs, isJsx } from '../utils';
@@ -9,7 +10,7 @@ import HeaderAccountUserInfo from './headerAccountUserInfo';
9
10
  import HeaderServicesMessage from './headerServicesMessage';
10
11
  /** Displays Header content appropriate for logged-in users, such as services, notifications or account information. */
11
12
  export const LoggedInHeader = vui((props, ref) => {
12
- const { account, supportLinks, applicationName, applicationUrl, children, className, isApplication = false, logo, mainLinks, services, showAltUserInfo = true, showMainLinks = isApplication ? false : true, showServices = true, notifications, ...rest } = props;
13
+ const { account, supportLinks, applicationName, applicationUrl, children, className, isApplication = false, isCleanLayout = false, logo, mainLinks, services, showAltUserInfo = true, showMainLinks = isApplication ? false : true, showServices = true, notifications, url, ...rest } = props;
13
14
  if (isApplication) {
14
15
  if (!applicationName) {
15
16
  console.error('Header: isApplication is true but applicationName is not set.');
@@ -21,7 +22,7 @@ export const LoggedInHeader = vui((props, ref) => {
21
22
  const servicesLinks = isJsx(services) ? [] : services?.links || [];
22
23
  const styles = useStyleConfig('Header', useHeaderContext());
23
24
  const localTextColor = rest?.variant === 'dark' ? 'white' : 'darkBlue.main';
24
- return (React.createElement(Header, { className: cs('vui-loggedInHeader', isApplication ? 'vui-loggedInAppHeader' : '', className), mb: isApplication && isSmallScreen ? '41px' : 'inherited', ref: ref, ...rest },
25
+ return (React.createElement(Header, { className: cs('vui-loggedInHeader', isApplication ? 'vui-loggedInAppHeader' : undefined, className), mb: isApplication && isSmallScreen ? '41px' : 'inherited', ref: ref, ...rest },
25
26
  React.createElement(Header.Content, null,
26
27
  (!isApplication || !isLessThanMD) && React.createElement(React.Fragment, null,
27
28
  " ",
@@ -32,40 +33,42 @@ export const LoggedInHeader = vui((props, ref) => {
32
33
  React.createElement(Header.ApplicationName, { color: localTextColor, title: applicationName, url: applicationUrl || '/' }))),
33
34
  !isApplication && React.createElement(RenderOnScreen, { minWidth: "lg" }, children),
34
35
  React.createElement(Box, { ml: "auto" }),
35
- isApplication && (React.createElement(React.Fragment, null,
36
- React.createElement(RenderOnScreen, { minWidth: "lg" },
37
- showMainLinks && mainLinks !== undefined && (React.createElement(React.Fragment, null,
38
- isJsx(mainLinks) ? mainLinks : React.createElement(Header.MainLinks, { links: mainLinks }),
39
- React.createElement(Header.Divider, { mx: 1 }))),
40
- !showMainLinks && mainLinks && (React.createElement(React.Fragment, null,
41
- React.createElement(Header.MobileToggle, { ml: 0 }),
42
- React.createElement(Header.MobileContent, null,
43
- React.createElement(React.Fragment, null,
44
- isJsx(mainLinks) ? (mainLinks) : (React.createElement(Box, { column: true, w: 1 },
45
- React.createElement(List, { py: 1 }, mainLinks?.map(({ icon, url, ...rest }, index) => (React.createElement(List.Item, { iconLeft: icon, key: index, linkProps: { href: url }, ...rest })))))),
46
- !showServices && servicesLinks && (React.createElement(Box, { column: true, w: 1 },
47
- React.createElement(List, { className: "vui-headerHiddenServicesLargeScreen", heading: "My Services", maxH: 295, right: 0, w: 320, ...styles.services.list, borderTop: 1, borderTopColor: "sandstone.main", pt: 1 }, servicesLinks.length > 0 ? (servicesLinks?.map(({ url, ...rest }, index) => (React.createElement(List.Item, { key: index, linkProps: { href: url }, ...rest })))) : (React.createElement(HeaderServicesMessage, null))))))))),
48
- showServices && services && (React.createElement(React.Fragment, null, isJsx(services) ? services : React.createElement(Header.Services, { isApplication: isApplication, ...services })))),
49
- React.createElement(Header.Support, { ...supportLinks }))),
50
- !isApplication && (React.createElement(RenderOnScreen, { minWidth: "lg" },
51
- isJsx(mainLinks) ? mainLinks : React.createElement(Header.MainLinks, { links: mainLinks }),
52
- mainLinks !== undefined && React.createElement(Header.Divider, { mx: 1 }),
53
- isJsx(services) ? services : React.createElement(Header.Services, { ...services }))),
54
- isJsx(notifications) ? notifications : React.createElement(Header.Notifications, { ...notifications }),
55
- !showMainLinks &&
56
- showAltUserInfo &&
57
- (isJsx(userInfo) ? (userInfo) : (React.createElement(React.Fragment, null,
58
- React.createElement(Header.Divider, { ml: 2 }),
59
- React.createElement(HeaderAccountUserInfo, { className: "vui-altUserInfo", color: localTextColor, isApplication: true, ...userInfo })))),
60
- isJsx(account) ? account : React.createElement(Header.Account, { ...account }),
61
- React.createElement(RenderOnScreen, { maxWidth: "lg" },
62
- isApplication && React.createElement(Header.Divider, { ml: 1 }),
63
- !isApplication && (account !== undefined || notifications !== undefined) && React.createElement(Header.Divider, { ml: 1 }),
64
- React.createElement(Header.MobileToggle, null),
65
- React.createElement(Header.MobileContent, null,
66
- !isApplication && children,
36
+ isCleanLayout ? (React.createElement(React.Fragment, null, !!url && (React.createElement(Box, null,
37
+ React.createElement(Button, { as: "a", className: cs('vui-headerSignOut'), href: url, size: "lg", variant: "secondaryDark" }, "Sign out"))))) : (React.createElement(React.Fragment, null,
38
+ isApplication && (React.createElement(React.Fragment, null,
39
+ React.createElement(RenderOnScreen, { minWidth: "lg" },
40
+ showMainLinks && mainLinks !== undefined && (React.createElement(React.Fragment, null,
41
+ isJsx(mainLinks) ? mainLinks : React.createElement(Header.MainLinks, { links: mainLinks }),
42
+ React.createElement(Header.Divider, { mx: 1 }))),
43
+ !showMainLinks && mainLinks && (React.createElement(React.Fragment, null,
44
+ React.createElement(Header.MobileToggle, { ml: 0 }),
45
+ React.createElement(Header.MobileContent, null,
46
+ React.createElement(React.Fragment, null,
47
+ isJsx(mainLinks) ? (mainLinks) : (React.createElement(Box, { column: true, w: 1 },
48
+ React.createElement(List, { py: 1 }, mainLinks?.map(({ icon, url, ...rest }, index) => (React.createElement(List.Item, { iconLeft: icon, key: index, linkProps: { href: url }, ...rest })))))),
49
+ !showServices && servicesLinks && (React.createElement(Box, { column: true, w: 1 },
50
+ React.createElement(List, { className: "vui-headerHiddenServicesLargeScreen", heading: "My Services", maxH: 295, right: 0, w: 320, ...styles.services.list, borderTop: 1, borderTopColor: "sandstone.main", pt: 1 }, servicesLinks.length > 0 ? (servicesLinks?.map(({ url, ...rest }, index) => (React.createElement(List.Item, { key: index, linkProps: { href: url }, ...rest })))) : (React.createElement(HeaderServicesMessage, null))))))))),
51
+ showServices && services && (React.createElement(React.Fragment, null, isJsx(services) ? services : React.createElement(Header.Services, { isApplication: isApplication, ...services })))),
52
+ React.createElement(Header.Support, { ...supportLinks }))),
53
+ !isApplication && (React.createElement(RenderOnScreen, { minWidth: "lg" },
67
54
  isJsx(mainLinks) ? mainLinks : React.createElement(Header.MainLinks, { links: mainLinks }),
68
- isJsx(services) ? services : React.createElement(Header.Services, { ...services, showTopBorder: mainLinks ? true : false }))))));
55
+ mainLinks !== undefined && React.createElement(Header.Divider, { mx: 1 }),
56
+ isJsx(services) ? services : React.createElement(Header.Services, { ...services }))),
57
+ isJsx(notifications) ? notifications : React.createElement(Header.Notifications, { ...notifications }),
58
+ !showMainLinks &&
59
+ showAltUserInfo &&
60
+ (isJsx(userInfo) ? (userInfo) : (React.createElement(React.Fragment, null,
61
+ React.createElement(Header.Divider, { ml: 2 }),
62
+ React.createElement(HeaderAccountUserInfo, { className: "vui-altUserInfo", color: localTextColor, isApplication: true, ...userInfo })))),
63
+ isJsx(account) ? account : React.createElement(Header.Account, { ...account }),
64
+ React.createElement(RenderOnScreen, { maxWidth: "lg" },
65
+ isApplication && React.createElement(Header.Divider, { ml: 1 }),
66
+ !isApplication && (account !== undefined || notifications !== undefined) && React.createElement(Header.Divider, { ml: 1 }),
67
+ React.createElement(Header.MobileToggle, null),
68
+ React.createElement(Header.MobileContent, null,
69
+ !isApplication && children,
70
+ isJsx(mainLinks) ? mainLinks : React.createElement(Header.MainLinks, { links: mainLinks }),
71
+ isJsx(services) ? (services) : (React.createElement(Header.Services, { ...services, showTopBorder: mainLinks ? true : false })))))))));
69
72
  });
70
73
  LoggedInHeader.displayName = 'LoggedInHeader';
71
74
  export default LoggedInHeader;
package/dist/esm/header/loggedOutHeader.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"loggedOutHeader.d.ts","sourceRoot":"","sources":["../../../src/header/loggedOutHeader.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAA;AAErD,iHAAiH;AACjH,eAAO,MAAM,eAAe,6DAwC1B,CAAA;AAIF,eAAe,eAAe,CAAA"}
1
+ {"version":3,"file":"loggedOutHeader.d.ts","sourceRoot":"","sources":["../../../src/header/loggedOutHeader.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAA;AAErD,iHAAiH;AACjH,eAAO,MAAM,eAAe,6DA2E1B,CAAA;AAIF,eAAe,eAAe,CAAA"}
package/dist/esm/header/loggedOutHeader.js CHANGED
@@ -1,14 +1,28 @@
1
1
  import React from 'react';
2
2
  import Box from '../box';
3
- import { RenderOnScreen, vui } from '../core';
3
+ import { RenderOnScreen, useDown, vui } from '../core';
4
4
  import { cs, isJsx } from '../utils';
5
5
  import Header from './header';
6
6
  /** Displays Header content appropriate for logged out users, such as sign in button or create account prompt. */
7
7
  export const LoggedOutHeader = vui((props, ref) => {
8
- const { children, className, createAccount, logo, mainLinks, signIn, ...rest } = props;
9
- return (React.createElement(Header, { className: cs('vui-loggedOutHeader', className), ref: ref, ...rest },
8
+ const { applicationName, applicationUrl, children, className, isApplication = false, createAccount, logo, mainLinks, signIn, ...rest } = props;
9
+ if (isApplication) {
10
+ if (!applicationName) {
11
+ console.error('Header: isApplication is true but applicationName is not set.');
12
+ }
13
+ }
14
+ const isSmallScreen = useDown('md');
15
+ const isLessThanMD = useDown('sm');
16
+ const localTextColor = rest?.variant === 'dark' ? 'white' : 'darkBlue.main';
17
+ return (React.createElement(Header, { className: cs('vui-loggedOutHeader', isApplication ? 'vui-loggedOutAppHeader' : undefined, className), mb: isApplication && isSmallScreen ? '41px' : 'inherited', ref: ref, ...rest },
10
18
  React.createElement(Header.Content, null,
11
- isJsx(logo) ? logo : React.createElement(Header.Logo, { ...logo }),
19
+ (!isApplication || !isLessThanMD) && React.createElement(React.Fragment, null,
20
+ " ",
21
+ isJsx(logo) ? logo : React.createElement(Header.Logo, { ...logo })),
22
+ isApplication && (React.createElement(React.Fragment, null,
23
+ React.createElement(RenderOnScreen, { minWidth: "sm" },
24
+ React.createElement(Header.Divider, { mr: 2 })),
25
+ React.createElement(Header.ApplicationName, { color: localTextColor, title: applicationName, url: applicationUrl || '/' }))),
12
26
  React.createElement(RenderOnScreen, { minWidth: "lg" }, children),
13
27
  React.createElement(Box, { ml: "auto" }),
14
28
  React.createElement(RenderOnScreen, { minWidth: "lg" },
package/dist/esm/input/consts.d.ts CHANGED
@@ -23,4 +23,10 @@ export declare const displayValueOnlyTextSize: {
23
23
  lg: string;
24
24
  xl: string;
25
25
  };
26
+ export declare const clearIconSize: {
27
+ sm: string;
28
+ md: string;
29
+ lg: string;
30
+ xl: string;
31
+ };
26
32
  //# sourceMappingURL=consts.d.ts.map
package/dist/esm/input/consts.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"consts.d.ts","sourceRoot":"","sources":["../../../src/input/consts.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAA;AAEjD,eAAO,MAAM,WAAW;;;;;;;;;;;CAWvB,CAAA;AAED,eAAO,MAAM,UAAU;;;;CAItB,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,iBAuB/B,CAAA;AAED,eAAO,MAAM,wBAAwB;;;;;CAKpC,CAAA"}
1
+ {"version":3,"file":"consts.d.ts","sourceRoot":"","sources":["../../../src/input/consts.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAA;AAEjD,eAAO,MAAM,WAAW;;;;;;;;;;;CAWvB,CAAA;AAED,eAAO,MAAM,UAAU;;;;CAItB,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,iBAuB/B,CAAA;AAED,eAAO,MAAM,wBAAwB;;;;;CAKpC,CAAA;AAED,eAAO,MAAM,aAAa;;;;;CAKzB,CAAA"}
package/dist/esm/input/consts.js CHANGED
@@ -45,3 +45,9 @@ export const displayValueOnlyTextSize = {
45
45
  lg: 'md',
46
46
  xl: 'lg'
47
47
  };
48
+ export const clearIconSize = {
49
+ sm: 'sm',
50
+ md: 'sm',
51
+ lg: 'sm',
52
+ xl: 'md'
53
+ };
package/dist/esm/input/input.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../src/input/input.tsx"],"names":[],"mappings":"AAGA,OAAO,EAA+B,YAAY,EAAE,MAAM,SAAS,CAAA;AAOnE,OAAO,QAAQ,MAAM,YAAY,CAAA;AACjC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC1C,OAAO,SAAS,MAAM,aAAa,CAAA;AACnC,OAAO,UAAU,MAAM,cAAc,CAAA;AAErC,eAAO,MAAM,SAAS,+HAmBrB,CAAA;AAED;;;;GAIG;AACH,eAAO,MAAM,KAAK;UAgKV,gBAAgB;WACf,iBAAiB;cACd,eAAe;CAC1B,CAAA;AAOD,eAAe,KAAK,CAAA"}
1
+ {"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../src/input/input.tsx"],"names":[],"mappings":"AAGA,OAAO,EAA+B,YAAY,EAAE,MAAM,SAAS,CAAA;AAOnE,OAAO,QAAQ,MAAM,YAAY,CAAA;AACjC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC1C,OAAO,SAAS,MAAM,aAAa,CAAA;AACnC,OAAO,UAAU,MAAM,cAAc,CAAA;AAErC,eAAO,MAAM,SAAS,+HAmBrB,CAAA;AAED;;;;GAIG;AACH,eAAO,MAAM,KAAK;UAuKV,gBAAgB;WACf,iBAAiB;cACd,eAAe;CAC1B,CAAA;AAOD,eAAe,KAAK,CAAA"}
package/dist/esm/input/input.js CHANGED
@@ -4,7 +4,7 @@ import { styled, useStyleConfig, vui } from '../core';
4
4
  import { T } from '../t';
5
5
  import { cs, filterUndefined, isString } from '../utils';
6
6
  import AutoCompletePopover from './autoCompletePopover';
7
- import { displayValueOnlyTextSize, inputColors, inputStateMapping } from './consts';
7
+ import { clearIconSize, displayValueOnlyTextSize, inputColors, inputStateMapping } from './consts';
8
8
  import { InputProvider } from './context';
9
9
  import { getInitialCount } from './helpers';
10
10
  import HelpText from './helpText';
@@ -97,7 +97,7 @@ export const Input = vui((props, ref) => {
97
97
  isString(iconRight) ? React.createElement(InputIcon, { mr: 1, name: iconRight }) : iconRight,
98
98
  itemRight,
99
99
  state && React.createElement(InputIcon, { mr: 1, ...states[state]?.iconProps }),
100
- allowClear && (React.createElement(IconButton, { disabled: !valueInternal, icon: "falTimes", onClick: onClear, size: size, title: "Clear" })),
100
+ allowClear && (React.createElement(IconButton, { disabled: !valueInternal, icon: "falTimes", mr: 0.5, onClick: onClear, size: clearIconSize[size], title: "Clear" })),
101
101
  showCount && (React.createElement(T, { className: "vui-inputCount", color: maxLength && count > maxLength ? inputColors.error : inputColors.helpText, position: "absolute", right: 0, size: "sm", top: "calc(100% + 1px)" },
102
102
  count,
103
103
  " ",
package/dist/esm/menu/menu.types.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { RefObject } from 'react';
1
+ import { ReactNode, RefObject } from 'react';
2
2
  import { ListProps } from '../list';
3
3
  import { PopoverContentProps, PopoverProps } from '../popover';
4
4
  import { ThemingProps } from '../theme';
@@ -7,6 +7,10 @@ export type MenuListProps = ListProps & {
7
7
  contentProps?: PopoverContentProps;
8
8
  /** Ref passed to the inner PopoverContent. */
9
9
  contentRef?: RefObject<HTMLDivElement>;
10
+ /** Custom content displayed at the bottom of the panel */
11
+ slotBottom?: ReactNode;
12
+ /** Custom content displayed at the top of the panel */
13
+ slotTop?: ReactNode;
10
14
  };
11
15
  export type MenuProps = ThemingProps<'Menu'> & PopoverProps & {
12
16
  /** Content closes when clicking on a list item. */
package/dist/esm/menu/menu.types.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"menu.types.d.ts","sourceRoot":"","sources":["../../../src/menu/menu.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AACnC,OAAO,EAAE,mBAAmB,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAC9D,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG;IACtC,uDAAuD;IACvD,YAAY,CAAC,EAAE,mBAAmB,CAAA;IAClC,8CAA8C;IAC9C,UAAU,CAAC,EAAE,SAAS,CAAC,cAAc,CAAC,CAAA;CACvC,CAAA;AAED,MAAM,MAAM,SAAS,GAAG,YAAY,CAAC,MAAM,CAAC,GAC1C,YAAY,GAAG;IACb,mDAAmD;IACnD,aAAa,CAAC,EAAE,OAAO,CAAA;CACxB,CAAA"}
1
+ {"version":3,"file":"menu.types.d.ts","sourceRoot":"","sources":["../../../src/menu/menu.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAE5C,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AACnC,OAAO,EAAE,mBAAmB,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAC9D,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG;IACtC,uDAAuD;IACvD,YAAY,CAAC,EAAE,mBAAmB,CAAA;IAClC,8CAA8C;IAC9C,UAAU,CAAC,EAAE,SAAS,CAAC,cAAc,CAAC,CAAA;IACtC,0DAA0D;IAC1D,UAAU,CAAC,EAAE,SAAS,CAAA;IACtB,uDAAuD;IACvD,OAAO,CAAC,EAAE,SAAS,CAAA;CACpB,CAAA;AAED,MAAM,MAAM,SAAS,GAAG,YAAY,CAAC,MAAM,CAAC,GAC1C,YAAY,GAAG;IACb,mDAAmD;IACnD,aAAa,CAAC,EAAE,OAAO,CAAA;CACxB,CAAA"}
package/dist/esm/menu/menuList.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"menuList.d.ts","sourceRoot":"","sources":["../../../src/menu/menuList.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAuB,YAAY,EAAE,MAAM,SAAS,CAAA;AAC3D,OAAO,IAAI,MAAM,SAAS,CAAA;AAI1B,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAA;AAE5C,kEAAkE;AAClE,eAAO,MAAM,QAAQ;aAUV,OAAO,KAAK,OAAO;aACnB,OAAO,KAAK,OAAO;UACtB,OAAO,KAAK,IAAI;UAChB,OAAO,KAAK,IAAI;UAChB,OAAO,SAAS;CACvB,CAAA;AAQD,eAAe,QAAQ,CAAA"}
1
+ {"version":3,"file":"menuList.d.ts","sourceRoot":"","sources":["../../../src/menu/menuList.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAuB,YAAY,EAAE,MAAM,SAAS,CAAA;AAC3D,OAAO,IAAI,MAAM,SAAS,CAAA;AAI1B,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAA;AAE5C,kEAAkE;AAClE,eAAO,MAAM,QAAQ;aAuBV,OAAO,KAAK,OAAO;aACnB,OAAO,KAAK,OAAO;UACtB,OAAO,KAAK,IAAI;UAChB,OAAO,KAAK,IAAI;UAChB,OAAO,SAAS;CACvB,CAAA;AAQD,eAAe,QAAQ,CAAA"}
package/dist/esm/menu/menuList.js CHANGED
@@ -1,4 +1,5 @@
1
1
  import React from 'react';
2
+ import { Box } from '../box';
2
3
  import { useStyleConfig, vui } from '../core';
3
4
  import List from '../list';
4
5
  import { PopoverContent } from '../popover';
@@ -7,9 +8,13 @@ import { useMenuContext } from './context';
7
8
  /** Displays a list of menu items in a popover content element. */
8
9
  export const MenuList = vui((props, ref) => {
9
10
  const { className, contentProps, contentRef, ...rest } = props;
11
+ const { slotTop, slotBottom } = props;
10
12
  const styles = useStyleConfig('Menu', useMenuContext());
11
13
  return (React.createElement(PopoverContent, { borderRadius: 0, ref: contentRef, ...contentProps },
12
- React.createElement(List, { className: cs('vui-menuList', className), py: 1, ref: ref, w: "100%", ...styles.list, ...rest, maxH: 295 })));
14
+ React.createElement(Box, { flexDirection: "column" },
15
+ slotTop,
16
+ React.createElement(List, { className: cs('vui-menuList', className), py: 1, ref: ref, w: "100%", ...styles.list, ...rest, maxH: 295 }),
17
+ slotBottom)));
13
18
  });
14
19
  MenuList.Divider = List.Divider;
15
20
  MenuList.Heading = List.Heading;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@veracity/vui",
3
- "version": "2.14.8-beta.1",
3
+ "version": "2.15.1",
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/header/header.types.ts CHANGED
@@ -86,39 +86,45 @@ export type HeaderServicesProps = MenuProps &
86
86
 
87
87
  export type HeaderSupportProps = MenuProps & HeaderServicesData & {}
88
88
 
89
- export type HeaderSignInData = {
89
+ export type HeaderButtonData = {
90
90
  /** Provides href to the button link. */
91
91
  url?: string
92
92
  }
93
93
 
94
- export type HeaderSignInProps = ButtonProps & HeaderSignInData
94
+ export type HeaderSignInProps = ButtonProps & HeaderButtonData
95
95
 
96
- export type LoggedInHeaderProps = HeaderProps & {
97
- /** Socket for account popover icon on the right side. */
98
- account?: HeaderAccountData | JSX.Element
99
- supportLinks?: HeaderServicesData
96
+ export type LoggedInHeaderProps = HeaderProps &
97
+ HeaderButtonData & {
98
+ /** Socket for account popover icon on the right side. */
99
+ account?: HeaderAccountData | JSX.Element
100
+ supportLinks?: HeaderServicesData
101
+ /** Socket for the app name on the left side. */
102
+ applicationName?: string
103
+ applicationUrl?: string
104
+ isApplication?: boolean
105
+ isCleanLayout?: boolean
106
+ isSticky?: boolean
107
+ /** Socket for logo on the left side. */
108
+ logo?: LogoData | JSX.Element
109
+ /** Socket for main links in the middle-right. */
110
+ mainLinks?: HeaderLinkData[] | JSX.Element
111
+ /** Socket for notifications icon on the right side. */
112
+ notifications?: HeaderNotificationsData | JSX.Element
113
+ /** Socket for services menu icon on the right side. */
114
+ services?: HeaderServicesData | JSX.Element
115
+ /** Socket for showing the 'alternative' user Info with role (alternative: 3 lines, role. default: 2 lines, no role); introduced for APP; by default it is true. */
116
+ showAltUserInfo?: boolean
117
+ /** Socket for showing the services trigger up front; introduced for APP; by default it is displayed. */
118
+ showServices?: boolean
119
+ /** Socket for showing the main Links up front in case of APP. by default they are folded into the hamburger menu. */
120
+ showMainLinks?: boolean
121
+ }
122
+
123
+ export type LoggedOutHeaderProps = HeaderProps & {
100
124
  /** Socket for the app name on the left side. */
101
125
  applicationName?: string
102
126
  applicationUrl?: string
103
127
  isApplication?: boolean
104
- isSticky?: boolean
105
- /** Socket for logo on the left side. */
106
- logo?: LogoData | JSX.Element
107
- /** Socket for main links in the middle-right. */
108
- mainLinks?: HeaderLinkData[] | JSX.Element
109
- /** Socket for notifications icon on the right side. */
110
- notifications?: HeaderNotificationsData | JSX.Element
111
- /** Socket for services menu icon on the right side. */
112
- services?: HeaderServicesData | JSX.Element
113
- /** Socket for showing the 'alternative' user Info with role (alternative: 3 lines, role. default: 2 lines, no role); introduced for APP; by default it is true. */
114
- showAltUserInfo?: boolean
115
- /** Socket for showing the services trigger up front; introduced for APP; by default it is displayed. */
116
- showServices?: boolean
117
- /** Socket for showing the main Links up front in case of APP. by default they are folded into the hamburger menu. */
118
- showMainLinks?: boolean
119
- }
120
-
121
- export type LoggedOutHeaderProps = HeaderProps & {
122
128
  /** Socket for create account prompt on the right side. */
123
129
  createAccount?: HeaderCreateAccountData | JSX.Element
124
130
  isSticky?: boolean
@@ -127,5 +133,5 @@ export type LoggedOutHeaderProps = HeaderProps & {
127
133
  /** Socket for links in the middle-right section. */
128
134
  mainLinks?: HeaderLinkData[] | JSX.Element
129
135
  /** Socket for sign in button on the right side. */
130
- signIn?: HeaderSignInData | JSX.Element
136
+ signIn?: HeaderButtonData | JSX.Element
131
137
  }
package/src/header/loggedInHeader.tsx CHANGED
@@ -1,6 +1,7 @@
1
1
  import React from 'react'
2
2
 
3
3
  import Box from '../box'
4
+ import Button from '../button'
4
5
  import { RenderOnScreen, useDown, useStyleConfig, vui } from '../core'
5
6
  import List from '../list'
6
7
  import { cs, isJsx } from '../utils'
@@ -20,6 +21,7 @@ export const LoggedInHeader = vui<'div', LoggedInHeaderProps>((props, ref) => {
20
21
  children,
21
22
  className,
22
23
  isApplication = false,
24
+ isCleanLayout = false,
23
25
  logo,
24
26
  mainLinks,
25
27
  services,
@@ -27,6 +29,7 @@ export const LoggedInHeader = vui<'div', LoggedInHeaderProps>((props, ref) => {
27
29
  showMainLinks = isApplication ? false : true,
28
30
  showServices = true,
29
31
  notifications,
32
+ url,
30
33
  ...rest
31
34
  } = props
32
35
 
@@ -47,7 +50,7 @@ export const LoggedInHeader = vui<'div', LoggedInHeaderProps>((props, ref) => {
47
50
 
48
51
  return (
49
52
  <Header
50
- className={cs('vui-loggedInHeader', isApplication ? 'vui-loggedInAppHeader' : '', className)}
53
+ className={cs('vui-loggedInHeader', isApplication ? 'vui-loggedInAppHeader' : undefined, className)}
51
54
  mb={isApplication && isSmallScreen ? '41px' : 'inherited'}
52
55
  ref={ref}
53
56
  {...rest}
@@ -64,106 +67,125 @@ export const LoggedInHeader = vui<'div', LoggedInHeaderProps>((props, ref) => {
64
67
  )}
65
68
  {!isApplication && <RenderOnScreen minWidth="lg">{children}</RenderOnScreen>}
66
69
  <Box ml="auto" />
67
- {isApplication && (
70
+ {isCleanLayout ? (
68
71
  <>
69
- <RenderOnScreen minWidth="lg">
70
- {showMainLinks && mainLinks !== undefined && (
71
- <>
72
- {isJsx(mainLinks) ? mainLinks : <Header.MainLinks links={mainLinks} />}
73
- <Header.Divider mx={1} />
74
- </>
75
- )}
72
+ {!!url && (
73
+ <Box>
74
+ <Button as="a" className={cs('vui-headerSignOut')} href={url} size="lg" variant="secondaryDark">
75
+ Sign out
76
+ </Button>
77
+ </Box>
78
+ )}
79
+ </>
80
+ ) : (
81
+ <>
82
+ {isApplication && (
83
+ <>
84
+ <RenderOnScreen minWidth="lg">
85
+ {showMainLinks && mainLinks !== undefined && (
86
+ <>
87
+ {isJsx(mainLinks) ? mainLinks : <Header.MainLinks links={mainLinks} />}
88
+ <Header.Divider mx={1} />
89
+ </>
90
+ )}
76
91
 
77
- {/* the main-links are folded into the hamburger menu by default */}
78
- {!showMainLinks && mainLinks && (
79
- <>
80
- <Header.MobileToggle ml={0} />
81
- <Header.MobileContent>
92
+ {/* the main-links are folded into the hamburger menu by default */}
93
+ {!showMainLinks && mainLinks && (
82
94
  <>
83
- {isJsx(mainLinks) ? (
84
- mainLinks
85
- ) : (
86
- <Box column w={1}>
87
- <List py={1}>
88
- {mainLinks?.map(({ icon, url, ...rest }, index) => (
89
- <List.Item iconLeft={icon} key={index} linkProps={{ href: url }} {...rest} />
90
- ))}
91
- </List>
92
- </Box>
93
- )}
94
-
95
- {!showServices && servicesLinks && (
96
- <Box column w={1}>
97
- <List
98
- className="vui-headerHiddenServicesLargeScreen"
99
- heading="My Services"
100
- maxH={295}
101
- right={0}
102
- w={320}
103
- {...styles.services.list}
104
- borderTop={1}
105
- borderTopColor="sandstone.main"
106
- pt={1}
107
- >
108
- {servicesLinks.length > 0 ? (
109
- servicesLinks?.map(({ url, ...rest }, index: number) => (
110
- <List.Item key={index} linkProps={{ href: url }} {...rest} />
111
- ))
112
- ) : (
113
- <HeaderServicesMessage />
114
- )}
115
- </List>
116
- </Box>
117
- )}
95
+ <Header.MobileToggle ml={0} />
96
+ <Header.MobileContent>
97
+ <>
98
+ {isJsx(mainLinks) ? (
99
+ mainLinks
100
+ ) : (
101
+ <Box column w={1}>
102
+ <List py={1}>
103
+ {mainLinks?.map(({ icon, url, ...rest }, index) => (
104
+ <List.Item iconLeft={icon} key={index} linkProps={{ href: url }} {...rest} />
105
+ ))}
106
+ </List>
107
+ </Box>
108
+ )}
109
+
110
+ {!showServices && servicesLinks && (
111
+ <Box column w={1}>
112
+ <List
113
+ className="vui-headerHiddenServicesLargeScreen"
114
+ heading="My Services"
115
+ maxH={295}
116
+ right={0}
117
+ w={320}
118
+ {...styles.services.list}
119
+ borderTop={1}
120
+ borderTopColor="sandstone.main"
121
+ pt={1}
122
+ >
123
+ {servicesLinks.length > 0 ? (
124
+ servicesLinks?.map(({ url, ...rest }, index: number) => (
125
+ <List.Item key={index} linkProps={{ href: url }} {...rest} />
126
+ ))
127
+ ) : (
128
+ <HeaderServicesMessage />
129
+ )}
130
+ </List>
131
+ </Box>
132
+ )}
133
+ </>
134
+ </Header.MobileContent>
118
135
  </>
119
- </Header.MobileContent>
136
+ )}
137
+ {showServices && services && (
138
+ <>{isJsx(services) ? services : <Header.Services isApplication={isApplication} {...services} />}</>
139
+ )}
140
+ </RenderOnScreen>
141
+
142
+ <Header.Support {...supportLinks} />
143
+ </>
144
+ )}
145
+ {!isApplication && (
146
+ <RenderOnScreen minWidth="lg">
147
+ {isJsx(mainLinks) ? mainLinks : <Header.MainLinks links={mainLinks} />}
148
+
149
+ {mainLinks !== undefined && <Header.Divider mx={1} />}
150
+
151
+ {isJsx(services) ? services : <Header.Services {...services} />}
152
+ </RenderOnScreen>
153
+ )}
154
+ {isJsx(notifications) ? notifications : <Header.Notifications {...notifications} />}
155
+ {!showMainLinks &&
156
+ showAltUserInfo &&
157
+ (isJsx(userInfo) ? (
158
+ userInfo
159
+ ) : (
160
+ <>
161
+ <Header.Divider ml={2} />
162
+ <HeaderAccountUserInfo
163
+ className="vui-altUserInfo"
164
+ color={localTextColor}
165
+ isApplication
166
+ {...userInfo}
167
+ />
120
168
  </>
121
- )}
122
- {showServices && services && (
123
- <>{isJsx(services) ? services : <Header.Services isApplication={isApplication} {...services} />}</>
124
- )}
169
+ ))}
170
+ {isJsx(account) ? account : <Header.Account {...account} />}
171
+ <RenderOnScreen maxWidth="lg">
172
+ {isApplication && <Header.Divider ml={1} />}
173
+ {!isApplication && (account !== undefined || notifications !== undefined) && <Header.Divider ml={1} />}
174
+
175
+ <Header.MobileToggle />
176
+
177
+ <Header.MobileContent>
178
+ {!isApplication && children}
179
+ {isJsx(mainLinks) ? mainLinks : <Header.MainLinks links={mainLinks} />}
180
+ {isJsx(services) ? (
181
+ services
182
+ ) : (
183
+ <Header.Services {...services} showTopBorder={mainLinks ? true : false} />
184
+ )}
185
+ </Header.MobileContent>
125
186
  </RenderOnScreen>
126
-
127
- <Header.Support {...supportLinks} />
128
187
  </>
129
188
  )}
130
- {!isApplication && (
131
- <RenderOnScreen minWidth="lg">
132
- {isJsx(mainLinks) ? mainLinks : <Header.MainLinks links={mainLinks} />}
133
-
134
- {mainLinks !== undefined && <Header.Divider mx={1} />}
135
-
136
- {isJsx(services) ? services : <Header.Services {...services} />}
137
- </RenderOnScreen>
138
- )}
139
- {isJsx(notifications) ? notifications : <Header.Notifications {...notifications} />}
140
-
141
- {!showMainLinks &&
142
- showAltUserInfo &&
143
- (isJsx(userInfo) ? (
144
- userInfo
145
- ) : (
146
- <>
147
- <Header.Divider ml={2} />
148
- <HeaderAccountUserInfo className="vui-altUserInfo" color={localTextColor} isApplication {...userInfo} />
149
- </>
150
- ))}
151
-
152
- {isJsx(account) ? account : <Header.Account {...account} />}
153
- <RenderOnScreen maxWidth="lg">
154
- {isApplication && <Header.Divider ml={1} />}
155
- {!isApplication && (account !== undefined || notifications !== undefined) && <Header.Divider ml={1} />}
156
-
157
- <Header.MobileToggle />
158
-
159
- <Header.MobileContent>
160
- {!isApplication && children}
161
-
162
- {isJsx(mainLinks) ? mainLinks : <Header.MainLinks links={mainLinks} />}
163
-
164
- {isJsx(services) ? services : <Header.Services {...services} showTopBorder={mainLinks ? true : false} />}
165
- </Header.MobileContent>
166
- </RenderOnScreen>
167
189
  </Header.Content>
168
190
  </Header>
169
191
  )
package/src/header/loggedOutHeader.tsx CHANGED
@@ -1,19 +1,54 @@
1
1
  import React from 'react'
2
2
 
3
3
  import Box from '../box'
4
- import { RenderOnScreen, vui } from '../core'
4
+ import { RenderOnScreen, useDown, vui } from '../core'
5
5
  import { cs, isJsx } from '../utils'
6
6
  import Header from './header'
7
7
  import { LoggedOutHeaderProps } from './header.types'
8
8
 
9
9
  /** Displays Header content appropriate for logged out users, such as sign in button or create account prompt. */
10
10
  export const LoggedOutHeader = vui<'div', LoggedOutHeaderProps>((props, ref) => {
11
- const { children, className, createAccount, logo, mainLinks, signIn, ...rest } = props
11
+ const {
12
+ applicationName,
13
+ applicationUrl,
14
+ children,
15
+ className,
16
+ isApplication = false,
17
+ createAccount,
18
+ logo,
19
+ mainLinks,
20
+ signIn,
21
+ ...rest
22
+ } = props
23
+
24
+ if (isApplication) {
25
+ if (!applicationName) {
26
+ console.error('Header: isApplication is true but applicationName is not set.')
27
+ }
28
+ }
29
+
30
+ const isSmallScreen = useDown('md')
31
+ const isLessThanMD = useDown('sm')
32
+
33
+ const localTextColor = rest?.variant === 'dark' ? 'white' : 'darkBlue.main'
12
34
 
13
35
  return (
14
- <Header className={cs('vui-loggedOutHeader', className)} ref={ref} {...rest}>
36
+ <Header
37
+ className={cs('vui-loggedOutHeader', isApplication ? 'vui-loggedOutAppHeader' : undefined, className)}
38
+ mb={isApplication && isSmallScreen ? '41px' : 'inherited'}
39
+ ref={ref}
40
+ {...rest}
41
+ >
15
42
  <Header.Content>
16
- {isJsx(logo) ? logo : <Header.Logo {...logo} />}
43
+ {(!isApplication || !isLessThanMD) && <> {isJsx(logo) ? logo : <Header.Logo {...logo} />}</>}
44
+ {isApplication && (
45
+ <>
46
+ <RenderOnScreen minWidth="sm">
47
+ <Header.Divider mr={2} />
48
+ </RenderOnScreen>
49
+ <Header.ApplicationName color={localTextColor} title={applicationName} url={applicationUrl || '/'} />
50
+ </>
51
+ )}
17
52
 
18
53
  <RenderOnScreen minWidth="lg">{children}</RenderOnScreen>
19
54
 
package/src/input/consts.ts CHANGED
@@ -50,3 +50,10 @@ export const displayValueOnlyTextSize = {
50
50
  lg: 'md',
51
51
  xl: 'lg'
52
52
  }
53
+
54
+ export const clearIconSize = {
55
+ sm: 'sm',
56
+ md: 'sm',
57
+ lg: 'sm',
58
+ xl: 'md'
59
+ }
package/src/input/input.tsx CHANGED
@@ -5,7 +5,7 @@ import { styled, useStyleConfig, vui, VuiComponent } from '../core'
5
5
  import { T } from '../t'
6
6
  import { ChangeEvent, cs, filterUndefined, isString } from '../utils'
7
7
  import AutoCompletePopover from './autoCompletePopover'
8
- import { displayValueOnlyTextSize, inputColors, inputStateMapping } from './consts'
8
+ import { clearIconSize, displayValueOnlyTextSize, inputColors, inputStateMapping } from './consts'
9
9
  import { InputProvider } from './context'
10
10
  import { getInitialCount } from './helpers'
11
11
  import HelpText from './helpText'
@@ -176,7 +176,14 @@ export const Input = vui<'div', InputProps>((props, ref) => {
176
176
  {itemRight}
177
177
  {state && <InputIcon mr={1} {...states[state]?.iconProps} />}
178
178
  {allowClear && (
179
- <IconButton disabled={!valueInternal} icon="falTimes" onClick={onClear} size={size} title="Clear" />
179
+ <IconButton
180
+ disabled={!valueInternal}
181
+ icon="falTimes"
182
+ mr={0.5}
183
+ onClick={onClear}
184
+ size={clearIconSize[size] as 'md' | 'sm' | 'lg'}
185
+ title="Clear"
186
+ />
180
187
  )}
181
188
  {showCount && (
182
189
  <T
package/src/menu/menu.types.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { RefObject } from 'react'
1
+ import { ReactNode, RefObject } from 'react'
2
2
 
3
3
  import { ListProps } from '../list'
4
4
  import { PopoverContentProps, PopoverProps } from '../popover'
@@ -9,6 +9,10 @@ export type MenuListProps = ListProps & {
9
9
  contentProps?: PopoverContentProps
10
10
  /** Ref passed to the inner PopoverContent. */
11
11
  contentRef?: RefObject<HTMLDivElement>
12
+ /** Custom content displayed at the bottom of the panel */
13
+ slotBottom?: ReactNode
14
+ /** Custom content displayed at the top of the panel */
15
+ slotTop?: ReactNode
12
16
  }
13
17
 
14
18
  export type MenuProps = ThemingProps<'Menu'> &
package/src/menu/menuList.tsx CHANGED
@@ -1,5 +1,6 @@
1
1
  import React from 'react'
2
2
 
3
+ import { Box } from '../box'
3
4
  import { useStyleConfig, vui, VuiComponent } from '../core'
4
5
  import List from '../list'
5
6
  import { PopoverContent } from '../popover'
@@ -10,11 +11,24 @@ import { MenuListProps } from './menu.types'
10
11
  /** Displays a list of menu items in a popover content element. */
11
12
  export const MenuList = vui<'ul', MenuListProps>((props, ref) => {
12
13
  const { className, contentProps, contentRef, ...rest } = props
14
+ const { slotTop, slotBottom } = props
13
15
  const styles = useStyleConfig('Menu', useMenuContext())
14
16
 
15
17
  return (
16
18
  <PopoverContent borderRadius={0} ref={contentRef} {...contentProps}>
17
- <List className={cs('vui-menuList', className)} py={1} ref={ref} w="100%" {...styles.list} {...rest} maxH={295} />
19
+ <Box flexDirection="column">
20
+ {slotTop}
21
+ <List
22
+ className={cs('vui-menuList', className)}
23
+ py={1}
24
+ ref={ref}
25
+ w="100%"
26
+ {...styles.list}
27
+ {...rest}
28
+ maxH={295}
29
+ />
30
+ {slotBottom}
31
+ </Box>
18
32
  </PopoverContent>
19
33
  )
20
34
  }) as VuiComponent<'ul', MenuListProps> & {