@flipdish/ui-library 0.26.3 → 0.28.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/organisms/ApplicationHeader/applicationHeader.types.d.ts +64 -0
- package/dist/components/organisms/ApplicationHeader/applicationHeader.types.d.ts.map +1 -0
- package/dist/components/organisms/ApplicationHeader/applicationHeader.utils.cjs +15 -0
- package/dist/components/organisms/ApplicationHeader/applicationHeader.utils.cjs.map +1 -0
- package/dist/components/organisms/ApplicationHeader/applicationHeader.utils.d.ts +5 -0
- package/dist/components/organisms/ApplicationHeader/applicationHeader.utils.d.ts.map +1 -0
- package/dist/components/organisms/ApplicationHeader/applicationHeader.utils.js +12 -0
- package/dist/components/organisms/ApplicationHeader/applicationHeader.utils.js.map +1 -0
- package/dist/components/organisms/ApplicationHeader/components/avatar-button.cjs +14 -0
- package/dist/components/organisms/ApplicationHeader/components/avatar-button.cjs.map +1 -0
- package/dist/components/organisms/ApplicationHeader/components/avatar-button.d.ts +11 -0
- package/dist/components/organisms/ApplicationHeader/components/avatar-button.d.ts.map +1 -0
- package/dist/components/organisms/ApplicationHeader/components/avatar-button.js +12 -0
- package/dist/components/organisms/ApplicationHeader/components/avatar-button.js.map +1 -0
- package/dist/components/organisms/ApplicationHeader/components/header-action.cjs +12 -0
- package/dist/components/organisms/ApplicationHeader/components/header-action.cjs.map +1 -0
- package/dist/components/organisms/ApplicationHeader/components/header-action.d.ts +19 -0
- package/dist/components/organisms/ApplicationHeader/components/header-action.d.ts.map +1 -0
- package/dist/components/organisms/ApplicationHeader/components/header-action.js +10 -0
- package/dist/components/organisms/ApplicationHeader/components/header-action.js.map +1 -0
- package/dist/components/organisms/ApplicationHeader/components/menu-button.cjs +11 -0
- package/dist/components/organisms/ApplicationHeader/components/menu-button.cjs.map +1 -0
- package/dist/components/organisms/ApplicationHeader/components/menu-button.d.ts +11 -0
- package/dist/components/organisms/ApplicationHeader/components/menu-button.d.ts.map +1 -0
- package/dist/components/organisms/ApplicationHeader/components/menu-button.js +9 -0
- package/dist/components/organisms/ApplicationHeader/components/menu-button.js.map +1 -0
- package/dist/components/organisms/ApplicationHeader/components/search-trigger.cjs +19 -0
- package/dist/components/organisms/ApplicationHeader/components/search-trigger.cjs.map +1 -0
- package/dist/components/organisms/ApplicationHeader/components/search-trigger.d.ts +25 -0
- package/dist/components/organisms/ApplicationHeader/components/search-trigger.d.ts.map +1 -0
- package/dist/components/organisms/ApplicationHeader/components/search-trigger.js +17 -0
- package/dist/components/organisms/ApplicationHeader/components/search-trigger.js.map +1 -0
- package/dist/components/organisms/ApplicationHeader/index.cjs +52 -0
- package/dist/components/organisms/ApplicationHeader/index.cjs.map +1 -0
- package/dist/components/organisms/ApplicationHeader/index.d.ts +43 -0
- package/dist/components/organisms/ApplicationHeader/index.d.ts.map +1 -0
- package/dist/components/organisms/ApplicationHeader/index.js +50 -0
- package/dist/components/organisms/ApplicationHeader/index.js.map +1 -0
- package/dist/components/organisms/CommandMenu/index.cjs +1 -1
- package/dist/components/organisms/CommandMenu/index.d.ts.map +1 -1
- package/dist/components/organisms/CommandMenu/index.js +1 -1
- package/dist/components/organisms/SidebarNavigation/components/logo-link.cjs +23 -0
- package/dist/components/organisms/SidebarNavigation/components/logo-link.cjs.map +1 -0
- package/dist/components/organisms/SidebarNavigation/components/logo-link.d.ts +16 -0
- package/dist/components/organisms/SidebarNavigation/components/logo-link.d.ts.map +1 -0
- package/dist/components/organisms/SidebarNavigation/components/logo-link.js +21 -0
- package/dist/components/organisms/SidebarNavigation/components/logo-link.js.map +1 -0
- package/dist/components/organisms/SidebarNavigation/components/mobile-header.cjs +2 -2
- package/dist/components/organisms/SidebarNavigation/components/mobile-header.cjs.map +1 -1
- package/dist/components/organisms/SidebarNavigation/components/mobile-header.d.ts +7 -1
- package/dist/components/organisms/SidebarNavigation/components/mobile-header.d.ts.map +1 -1
- package/dist/components/organisms/SidebarNavigation/components/mobile-header.js +2 -2
- package/dist/components/organisms/SidebarNavigation/components/mobile-header.js.map +1 -1
- package/dist/components/organisms/SidebarNavigation/index.cjs +6 -5
- package/dist/components/organisms/SidebarNavigation/index.cjs.map +1 -1
- package/dist/components/organisms/SidebarNavigation/index.d.ts +17 -6
- package/dist/components/organisms/SidebarNavigation/index.d.ts.map +1 -1
- package/dist/components/organisms/SidebarNavigation/index.js +6 -5
- package/dist/components/organisms/SidebarNavigation/index.js.map +1 -1
- package/dist/components/organisms/SidebarNavigation/sidebarNavigation.types.d.ts +17 -0
- package/dist/components/organisms/SidebarNavigation/sidebarNavigation.types.d.ts.map +1 -1
- package/dist/native/components/organisms/ApplicationHeader/index.d.ts +12 -0
- package/dist/utilities/__internal__/hotkeysUtils/hotkeys.utils.cjs +105 -0
- package/dist/utilities/__internal__/hotkeysUtils/hotkeys.utils.cjs.map +1 -0
- package/dist/{components/organisms/CommandMenu → utilities/__internal__/hotkeysUtils}/hotkeys.utils.d.ts +10 -0
- package/dist/utilities/__internal__/hotkeysUtils/hotkeys.utils.d.ts.map +1 -0
- package/dist/utilities/__internal__/hotkeysUtils/hotkeys.utils.js +98 -0
- package/dist/utilities/__internal__/hotkeysUtils/hotkeys.utils.js.map +1 -0
- package/package.json +1 -1
- package/dist/components/organisms/CommandMenu/hotkeys.utils.cjs +0 -64
- package/dist/components/organisms/CommandMenu/hotkeys.utils.cjs.map +0 -1
- package/dist/components/organisms/CommandMenu/hotkeys.utils.d.ts.map +0 -1
- package/dist/components/organisms/CommandMenu/hotkeys.utils.js +0 -61
- package/dist/components/organisms/CommandMenu/hotkeys.utils.js.map +0 -1
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
interface ApplicationHeaderElement {
|
|
2
|
+
/** Accessible name for the control. Each element documents its English default. */
|
|
3
|
+
label?: string;
|
|
4
|
+
/** Overrides the derived `data-testid` for this element. */
|
|
5
|
+
'data-testid'?: string;
|
|
6
|
+
}
|
|
7
|
+
export interface ApplicationHeaderSearch extends ApplicationHeaderElement {
|
|
8
|
+
/** Called when the search trigger is pressed or the shortcut fires. Open your search surface (e.g. `CommandMenu`) here. */
|
|
9
|
+
onPress: () => void;
|
|
10
|
+
/**
|
|
11
|
+
* Text shown inside the trigger.
|
|
12
|
+
* @default "Search"
|
|
13
|
+
*/
|
|
14
|
+
placeholder?: string;
|
|
15
|
+
/**
|
|
16
|
+
* Keyboard shortcut in `react-hotkeys-hook` format, where `mod` is ⌘ on macOS and Ctrl
|
|
17
|
+
* elsewhere. Active from the `lg` breakpoint only. Comma-separated alternatives all fire, but the hint shows
|
|
18
|
+
* the first. Pass `null` to disable the shortcut and hide its hint.
|
|
19
|
+
* @default "mod+k"
|
|
20
|
+
*/
|
|
21
|
+
shortcut?: string | null;
|
|
22
|
+
}
|
|
23
|
+
export interface ApplicationHeaderNotifications extends ApplicationHeaderElement {
|
|
24
|
+
/** Unread count. The badge is hidden at `0` or `undefined` and reads `9+` above 9. */
|
|
25
|
+
count?: number;
|
|
26
|
+
/**
|
|
27
|
+
* Whether the notifications surface this button opens is open. Highlights the button and sets
|
|
28
|
+
* `aria-expanded`. Leave `undefined` when the button navigates instead of opening something.
|
|
29
|
+
*/
|
|
30
|
+
isOpen?: boolean;
|
|
31
|
+
/** Called when the notifications button is pressed. */
|
|
32
|
+
onPress: () => void;
|
|
33
|
+
}
|
|
34
|
+
export interface ApplicationHeaderAssistant extends ApplicationHeaderElement {
|
|
35
|
+
/**
|
|
36
|
+
* Whether the assistant surface this button opens is open. Highlights the button and sets
|
|
37
|
+
* `aria-expanded`. Leave `undefined` when the button navigates instead of opening something.
|
|
38
|
+
*/
|
|
39
|
+
isOpen?: boolean;
|
|
40
|
+
/** Called when the assistant button is pressed. */
|
|
41
|
+
onPress: () => void;
|
|
42
|
+
}
|
|
43
|
+
export interface ApplicationHeaderAvatar extends Omit<ApplicationHeaderElement, 'label'> {
|
|
44
|
+
/** Name of the entity shown (organisation, store, user). Names the button and seeds the initials fallback. */
|
|
45
|
+
name: string;
|
|
46
|
+
/** Image URL. Falls back to `initials` when omitted or when the image fails to load. */
|
|
47
|
+
src?: string;
|
|
48
|
+
/** Overrides the initials derived from `name`. */
|
|
49
|
+
initials?: string;
|
|
50
|
+
/** Accessible name for the button. Defaults to `name`. */
|
|
51
|
+
label?: string;
|
|
52
|
+
/** Called when the avatar button is pressed. */
|
|
53
|
+
onPress: () => void;
|
|
54
|
+
}
|
|
55
|
+
export interface ApplicationHeaderMenu extends ApplicationHeaderElement {
|
|
56
|
+
/** Whether the navigation drawer this button controls is open. */
|
|
57
|
+
isOpen: boolean;
|
|
58
|
+
/** Called with the next open state when the button is pressed. */
|
|
59
|
+
onOpenChange: (isOpen: boolean) => void;
|
|
60
|
+
/** ID of the drawer element, for `aria-controls`. */
|
|
61
|
+
controls?: string;
|
|
62
|
+
}
|
|
63
|
+
export {};
|
|
64
|
+
//# sourceMappingURL=applicationHeader.types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"applicationHeader.types.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/ApplicationHeader/applicationHeader.types.ts"],"names":[],"mappings":"AAAA,UAAU,wBAAwB;IAChC,mFAAmF;IACnF,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4DAA4D;IAC5D,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,uBAAwB,SAAQ,wBAAwB;IACvE,2HAA2H;IAC3H,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC1B;AAED,MAAM,WAAW,8BAA+B,SAAQ,wBAAwB;IAC9E,sFAAsF;IACtF,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,uDAAuD;IACvD,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,MAAM,WAAW,0BAA2B,SAAQ,wBAAwB;IAC1E;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,mDAAmD;IACnD,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,MAAM,WAAW,uBAAwB,SAAQ,IAAI,CAAC,wBAAwB,EAAE,OAAO,CAAC;IACtF,8GAA8G;IAC9G,IAAI,EAAE,MAAM,CAAC;IACb,wFAAwF;IACxF,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,kDAAkD;IAClD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,0DAA0D;IAC1D,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gDAAgD;IAChD,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,MAAM,WAAW,qBAAsB,SAAQ,wBAAwB;IACrE,kEAAkE;IAClE,MAAM,EAAE,OAAO,CAAC;IAChB,kEAAkE;IAClE,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC,qDAAqD;IACrD,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
const MAX_COUNT = 9;
|
|
4
|
+
/** Badge text for an unread count: `undefined` when there is nothing to show, capped at `9+`. */
|
|
5
|
+
const formatBadgeCount = (count) => {
|
|
6
|
+
if (!count || count < 0)
|
|
7
|
+
return undefined;
|
|
8
|
+
return count > MAX_COUNT ? `${MAX_COUNT}+` : String(count);
|
|
9
|
+
};
|
|
10
|
+
/** Accessible name for the notifications button, carrying the exact unread count. */
|
|
11
|
+
const getNotificationsLabel = (label, count) => (count && count > 0 ? `${label}, ${count} unread` : label);
|
|
12
|
+
|
|
13
|
+
exports.formatBadgeCount = formatBadgeCount;
|
|
14
|
+
exports.getNotificationsLabel = getNotificationsLabel;
|
|
15
|
+
//# sourceMappingURL=applicationHeader.utils.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"applicationHeader.utils.cjs","sources":["../../../../src/components/organisms/ApplicationHeader/applicationHeader.utils.ts"],"sourcesContent":[null],"names":[],"mappings":";;AAAA,MAAM,SAAS,GAAG,CAAC;AAEnB;AACO,MAAM,gBAAgB,GAAG,CAAC,KAAyB,KAAwB;AAChF,IAAA,IAAI,CAAC,KAAK,IAAI,KAAK,GAAG,CAAC;AAAE,QAAA,OAAO,SAAS;AACzC,IAAA,OAAO,KAAK,GAAG,SAAS,GAAG,CAAA,EAAG,SAAS,CAAA,CAAA,CAAG,GAAG,MAAM,CAAC,KAAK,CAAC;AAC5D;AAEA;AACO,MAAM,qBAAqB,GAAG,CAAC,KAAa,EAAE,KAAyB,MAAc,KAAK,IAAI,KAAK,GAAG,CAAC,GAAG,CAAA,EAAG,KAAK,CAAA,EAAA,EAAK,KAAK,CAAA,OAAA,CAAS,GAAG,KAAK;;;;;"}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
/** Badge text for an unread count: `undefined` when there is nothing to show, capped at `9+`. */
|
|
2
|
+
export declare const formatBadgeCount: (count: number | undefined) => string | undefined;
|
|
3
|
+
/** Accessible name for the notifications button, carrying the exact unread count. */
|
|
4
|
+
export declare const getNotificationsLabel: (label: string, count: number | undefined) => string;
|
|
5
|
+
//# sourceMappingURL=applicationHeader.utils.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"applicationHeader.utils.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/ApplicationHeader/applicationHeader.utils.ts"],"names":[],"mappings":"AAEA,iGAAiG;AACjG,eAAO,MAAM,gBAAgB,GAAI,OAAO,MAAM,GAAG,SAAS,KAAG,MAAM,GAAG,SAGrE,CAAC;AAEF,qFAAqF;AACrF,eAAO,MAAM,qBAAqB,GAAI,OAAO,MAAM,EAAE,OAAO,MAAM,GAAG,SAAS,KAAG,MAAoE,CAAC"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
const MAX_COUNT = 9;
|
|
2
|
+
/** Badge text for an unread count: `undefined` when there is nothing to show, capped at `9+`. */
|
|
3
|
+
const formatBadgeCount = (count) => {
|
|
4
|
+
if (!count || count < 0)
|
|
5
|
+
return undefined;
|
|
6
|
+
return count > MAX_COUNT ? `${MAX_COUNT}+` : String(count);
|
|
7
|
+
};
|
|
8
|
+
/** Accessible name for the notifications button, carrying the exact unread count. */
|
|
9
|
+
const getNotificationsLabel = (label, count) => (count && count > 0 ? `${label}, ${count} unread` : label);
|
|
10
|
+
|
|
11
|
+
export { formatBadgeCount, getNotificationsLabel };
|
|
12
|
+
//# sourceMappingURL=applicationHeader.utils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"applicationHeader.utils.js","sources":["../../../../src/components/organisms/ApplicationHeader/applicationHeader.utils.ts"],"sourcesContent":[null],"names":[],"mappings":"AAAA,MAAM,SAAS,GAAG,CAAC;AAEnB;AACO,MAAM,gBAAgB,GAAG,CAAC,KAAyB,KAAwB;AAChF,IAAA,IAAI,CAAC,KAAK,IAAI,KAAK,GAAG,CAAC;AAAE,QAAA,OAAO,SAAS;AACzC,IAAA,OAAO,KAAK,GAAG,SAAS,GAAG,CAAA,EAAG,SAAS,CAAA,CAAA,CAAG,GAAG,MAAM,CAAC,KAAK,CAAC;AAC5D;AAEA;AACO,MAAM,qBAAqB,GAAG,CAAC,KAAa,EAAE,KAAyB,MAAc,KAAK,IAAI,KAAK,GAAG,CAAC,GAAG,CAAA,EAAG,KAAK,CAAA,EAAA,EAAK,KAAK,CAAA,OAAA,CAAS,GAAG,KAAK;;;;"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var Avatar = require('@flipdish/ui-library/components/atoms/Avatar');
|
|
5
|
+
var Tooltip = require('@flipdish/ui-library/components/atoms/Tooltip');
|
|
6
|
+
var testIdUtils = require('@flipdish/ui-library/utilities/testIdUtils');
|
|
7
|
+
var reactAriaComponents = require('react-aria-components');
|
|
8
|
+
|
|
9
|
+
const AvatarButton = ({ name, src, initials, label, onPress, 'data-testid': dataTestId }) => (jsxRuntime.jsx(Tooltip.Tooltip, { title: label, placement: "bottom", "data-testid": testIdUtils.joinTestId(dataTestId, 'tooltip'), children: jsxRuntime.jsx(reactAriaComponents.Button, { "aria-label": label, "data-testid": dataTestId, onPress: onPress, className: "group flex size-9 shrink-0 cursor-pointer items-center justify-center rounded-md outline-focus-ring focus-visible:outline-2 focus-visible:outline-offset-2", children: jsxRuntime.jsx(Avatar.Avatar, { size: "sm", rounded: false, src: src, initials: initials ?? Avatar.getInitials(name).toUpperCase(),
|
|
10
|
+
// The design's square avatar uses a 4px radius, tighter than Avatar's unrounded default.
|
|
11
|
+
className: "rounded-sm", contentClassName: "rounded-sm", "data-testid": testIdUtils.joinTestId(dataTestId, 'image') }) }) }));
|
|
12
|
+
|
|
13
|
+
exports.AvatarButton = AvatarButton;
|
|
14
|
+
//# sourceMappingURL=avatar-button.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"avatar-button.cjs","sources":["../../../../../src/components/organisms/ApplicationHeader/components/avatar-button.tsx"],"sourcesContent":[null],"names":["_jsx","Tooltip","joinTestId","AriaButton","Avatar","getInitials"],"mappings":";;;;;;;;AAgBO,MAAM,YAAY,GAAG,CAAC,EAAE,IAAI,EAAE,GAAG,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,aAAa,EAAE,UAAU,EAAqB,MAChHA,eAACC,eAAO,EAAA,EAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAC,QAAQ,EAAA,aAAA,EAAcC,sBAAU,CAAC,UAAU,EAAE,SAAS,CAAC,EAAA,QAAA,EACtFF,cAAA,CAACG,0BAAU,EAAA,EAAA,YAAA,EACG,KAAK,EAAA,aAAA,EACJ,UAAU,EACvB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAC,4JAA4J,YAEtKH,cAAA,CAACI,aAAM,IACL,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,KAAK,EACd,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,IAAIC,kBAAW,CAAC,IAAI,CAAC,CAAC,WAAW,EAAE;;AAErD,YAAA,SAAS,EAAC,YAAY,EACtB,gBAAgB,EAAC,YAAY,EAAA,aAAA,EAChBH,sBAAU,CAAC,UAAU,EAAE,OAAO,CAAC,GAC5C,EAAA,CACS,EAAA,CACL;;;;"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
interface AvatarButtonProps {
|
|
2
|
+
name: string;
|
|
3
|
+
src?: string;
|
|
4
|
+
initials?: string;
|
|
5
|
+
label: string;
|
|
6
|
+
onPress: () => void;
|
|
7
|
+
'data-testid': string;
|
|
8
|
+
}
|
|
9
|
+
export declare const AvatarButton: ({ name, src, initials, label, onPress, "data-testid": dataTestId }: AvatarButtonProps) => import("react").JSX.Element;
|
|
10
|
+
export {};
|
|
11
|
+
//# sourceMappingURL=avatar-button.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"avatar-button.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/ApplicationHeader/components/avatar-button.tsx"],"names":[],"mappings":"AAOA,UAAU,iBAAiB;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,aAAa,EAAE,MAAM,CAAC;CACvB;AAED,eAAO,MAAM,YAAY,GAAI,oEAAoE,iBAAiB,gCAoBjH,CAAC"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Avatar, getInitials } from '@flipdish/ui-library/components/atoms/Avatar';
|
|
3
|
+
import { Tooltip } from '@flipdish/ui-library/components/atoms/Tooltip';
|
|
4
|
+
import { joinTestId } from '@flipdish/ui-library/utilities/testIdUtils';
|
|
5
|
+
import { Button } from 'react-aria-components';
|
|
6
|
+
|
|
7
|
+
const AvatarButton = ({ name, src, initials, label, onPress, 'data-testid': dataTestId }) => (jsx(Tooltip, { title: label, placement: "bottom", "data-testid": joinTestId(dataTestId, 'tooltip'), children: jsx(Button, { "aria-label": label, "data-testid": dataTestId, onPress: onPress, className: "group flex size-9 shrink-0 cursor-pointer items-center justify-center rounded-md outline-focus-ring focus-visible:outline-2 focus-visible:outline-offset-2", children: jsx(Avatar, { size: "sm", rounded: false, src: src, initials: initials ?? getInitials(name).toUpperCase(),
|
|
8
|
+
// The design's square avatar uses a 4px radius, tighter than Avatar's unrounded default.
|
|
9
|
+
className: "rounded-sm", contentClassName: "rounded-sm", "data-testid": joinTestId(dataTestId, 'image') }) }) }));
|
|
10
|
+
|
|
11
|
+
export { AvatarButton };
|
|
12
|
+
//# sourceMappingURL=avatar-button.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"avatar-button.js","sources":["../../../../../src/components/organisms/ApplicationHeader/components/avatar-button.tsx"],"sourcesContent":[null],"names":["_jsx","AriaButton"],"mappings":";;;;;;AAgBO,MAAM,YAAY,GAAG,CAAC,EAAE,IAAI,EAAE,GAAG,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,aAAa,EAAE,UAAU,EAAqB,MAChHA,IAAC,OAAO,EAAA,EAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAC,QAAQ,EAAA,aAAA,EAAc,UAAU,CAAC,UAAU,EAAE,SAAS,CAAC,EAAA,QAAA,EACtFA,GAAA,CAACC,MAAU,EAAA,EAAA,YAAA,EACG,KAAK,EAAA,aAAA,EACJ,UAAU,EACvB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAC,4JAA4J,YAEtKD,GAAA,CAAC,MAAM,IACL,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,KAAK,EACd,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,IAAI,WAAW,CAAC,IAAI,CAAC,CAAC,WAAW,EAAE;;AAErD,YAAA,SAAS,EAAC,YAAY,EACtB,gBAAgB,EAAC,YAAY,EAAA,aAAA,EAChB,UAAU,CAAC,UAAU,EAAE,OAAO,CAAC,GAC5C,EAAA,CACS,EAAA,CACL;;;;"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var Tooltip = require('@flipdish/ui-library/components/atoms/Tooltip');
|
|
5
|
+
var cx = require('@flipdish/ui-library/utilities/cx');
|
|
6
|
+
var testIdUtils = require('@flipdish/ui-library/utilities/testIdUtils');
|
|
7
|
+
var reactAriaComponents = require('react-aria-components');
|
|
8
|
+
|
|
9
|
+
const HeaderAction = ({ icon: Icon, label, tooltip, badge, isOpen, onPress, 'data-testid': dataTestId }) => (jsxRuntime.jsx(Tooltip.Tooltip, { title: tooltip, placement: "bottom", "data-testid": testIdUtils.joinTestId(dataTestId, 'tooltip'), children: jsxRuntime.jsxs(reactAriaComponents.Button, { "aria-label": label, "aria-expanded": isOpen, "data-testid": dataTestId, onPress: onPress, className: cx.cx('relative flex size-9 shrink-0 cursor-pointer items-center justify-center rounded-md text-fg-quaternary outline-focus-ring transition duration-100 ease-linear hover:bg-primary_hover hover:text-fg-quaternary_hover focus-visible:outline-2 focus-visible:outline-offset-2', isOpen && 'bg-brand-primary text-fg-brand-primary hover:bg-brand-primary hover:text-fg-brand-primary'), children: [jsxRuntime.jsx(Icon, { "aria-hidden": "true", className: "size-5 shrink-0" }), badge && (jsxRuntime.jsx("span", { "aria-hidden": "true", className: "absolute -top-px right-0 flex h-3.5 min-w-3.5 items-center justify-center rounded-full bg-fg-error-primary px-0.5 text-center text-[10px] leading-[13px] font-bold text-white", children: badge }))] }) }));
|
|
10
|
+
|
|
11
|
+
exports.HeaderAction = HeaderAction;
|
|
12
|
+
//# sourceMappingURL=header-action.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"header-action.cjs","sources":["../../../../../src/components/organisms/ApplicationHeader/components/header-action.tsx"],"sourcesContent":[null],"names":["_jsx","Tooltip","joinTestId","_jsxs","AriaButton","cx"],"mappings":";;;;;;;;MAsBa,YAAY,GAAG,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,aAAa,EAAE,UAAU,EAAqB,MAC/HA,cAAA,CAACC,eAAO,EAAA,EAAC,KAAK,EAAE,OAAO,EAAE,SAAS,EAAC,QAAQ,iBAAcC,sBAAU,CAAC,UAAU,EAAE,SAAS,CAAC,EAAA,QAAA,EACxFC,eAAA,CAACC,0BAAU,kBACG,KAAK,EAAA,eAAA,EACF,MAAM,EAAA,aAAA,EACR,UAAU,EACvB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAEC,KAAE,CACX,4QAA4Q,EAC5Q,MAAM,IAAI,2FAA2F,CACtG,EAAA,QAAA,EAAA,CAEDL,cAAA,CAAC,IAAI,EAAA,EAAA,aAAA,EAAa,MAAM,EAAC,SAAS,EAAC,iBAAiB,EAAA,CAAG,EACtD,KAAK,KACJA,cAAA,CAAA,MAAA,EAAA,EAAA,aAAA,EACc,MAAM,EAClB,SAAS,EAAC,+KAA+K,EAAA,QAAA,EAExL,KAAK,GACD,CACR,CAAA,EAAA,CACU,EAAA,CACL;;;;"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import type { FC } from 'react';
|
|
2
|
+
interface HeaderActionProps {
|
|
3
|
+
icon: FC<{
|
|
4
|
+
className?: string;
|
|
5
|
+
}>;
|
|
6
|
+
/** Accessible name, including any state such as an unread count. */
|
|
7
|
+
label: string;
|
|
8
|
+
/** Short visible name shown on hover and focus. */
|
|
9
|
+
tooltip: string;
|
|
10
|
+
/** Badge text; the badge is omitted when undefined. */
|
|
11
|
+
badge?: string;
|
|
12
|
+
/** Whether the surface this button opens is open. `undefined` means the button does not report a state. */
|
|
13
|
+
isOpen?: boolean;
|
|
14
|
+
onPress: () => void;
|
|
15
|
+
'data-testid': string;
|
|
16
|
+
}
|
|
17
|
+
export declare const HeaderAction: ({ icon: Icon, label, tooltip, badge, isOpen, onPress, "data-testid": dataTestId }: HeaderActionProps) => import("react").JSX.Element;
|
|
18
|
+
export {};
|
|
19
|
+
//# sourceMappingURL=header-action.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"header-action.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/ApplicationHeader/components/header-action.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAGhC,UAAU,iBAAiB;IACzB,IAAI,EAAE,EAAE,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IACjC,oEAAoE;IACpE,KAAK,EAAE,MAAM,CAAC;IACd,mDAAmD;IACnD,OAAO,EAAE,MAAM,CAAC;IAChB,uDAAuD;IACvD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,2GAA2G;IAC3G,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,aAAa,EAAE,MAAM,CAAC;CACvB;AAED,eAAO,MAAM,YAAY,GAAI,mFAAmF,iBAAiB,gCAuBhI,CAAC"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
+
import { Tooltip } from '@flipdish/ui-library/components/atoms/Tooltip';
|
|
3
|
+
import { cx } from '@flipdish/ui-library/utilities/cx';
|
|
4
|
+
import { joinTestId } from '@flipdish/ui-library/utilities/testIdUtils';
|
|
5
|
+
import { Button } from 'react-aria-components';
|
|
6
|
+
|
|
7
|
+
const HeaderAction = ({ icon: Icon, label, tooltip, badge, isOpen, onPress, 'data-testid': dataTestId }) => (jsx(Tooltip, { title: tooltip, placement: "bottom", "data-testid": joinTestId(dataTestId, 'tooltip'), children: jsxs(Button, { "aria-label": label, "aria-expanded": isOpen, "data-testid": dataTestId, onPress: onPress, className: cx('relative flex size-9 shrink-0 cursor-pointer items-center justify-center rounded-md text-fg-quaternary outline-focus-ring transition duration-100 ease-linear hover:bg-primary_hover hover:text-fg-quaternary_hover focus-visible:outline-2 focus-visible:outline-offset-2', isOpen && 'bg-brand-primary text-fg-brand-primary hover:bg-brand-primary hover:text-fg-brand-primary'), children: [jsx(Icon, { "aria-hidden": "true", className: "size-5 shrink-0" }), badge && (jsx("span", { "aria-hidden": "true", className: "absolute -top-px right-0 flex h-3.5 min-w-3.5 items-center justify-center rounded-full bg-fg-error-primary px-0.5 text-center text-[10px] leading-[13px] font-bold text-white", children: badge }))] }) }));
|
|
8
|
+
|
|
9
|
+
export { HeaderAction };
|
|
10
|
+
//# sourceMappingURL=header-action.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"header-action.js","sources":["../../../../../src/components/organisms/ApplicationHeader/components/header-action.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs","AriaButton"],"mappings":";;;;;;MAsBa,YAAY,GAAG,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,aAAa,EAAE,UAAU,EAAqB,MAC/HA,GAAA,CAAC,OAAO,EAAA,EAAC,KAAK,EAAE,OAAO,EAAE,SAAS,EAAC,QAAQ,iBAAc,UAAU,CAAC,UAAU,EAAE,SAAS,CAAC,EAAA,QAAA,EACxFC,IAAA,CAACC,MAAU,kBACG,KAAK,EAAA,eAAA,EACF,MAAM,EAAA,aAAA,EACR,UAAU,EACvB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,EAAE,CACX,4QAA4Q,EAC5Q,MAAM,IAAI,2FAA2F,CACtG,EAAA,QAAA,EAAA,CAEDF,GAAA,CAAC,IAAI,EAAA,EAAA,aAAA,EAAa,MAAM,EAAC,SAAS,EAAC,iBAAiB,EAAA,CAAG,EACtD,KAAK,KACJA,GAAA,CAAA,MAAA,EAAA,EAAA,aAAA,EACc,MAAM,EAClB,SAAS,EAAC,+KAA+K,EAAA,QAAA,EAExL,KAAK,GACD,CACR,CAAA,EAAA,CACU,EAAA,CACL;;;;"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var uiIcons = require('@flipdish/ui-icons');
|
|
5
|
+
var cx = require('@flipdish/ui-library/utilities/cx');
|
|
6
|
+
var reactAriaComponents = require('react-aria-components');
|
|
7
|
+
|
|
8
|
+
const MenuButton = ({ isOpen, onPress, label, controls, className, 'data-testid': dataTestId }) => (jsxRuntime.jsxs(reactAriaComponents.Button, { "aria-label": label, "aria-expanded": isOpen, "aria-controls": controls, "data-testid": dataTestId, onPress: onPress, className: cx.cx('relative flex size-9 shrink-0 cursor-pointer items-center justify-center rounded-lg bg-primary text-fg-secondary outline-focus-ring transition duration-100 ease-linear hover:bg-primary_hover hover:text-fg-secondary_hover focus-visible:outline-2 focus-visible:outline-offset-2', className), children: [jsxRuntime.jsx(uiIcons.Menu02, { "aria-hidden": "true", className: cx.cx('size-5 transition duration-200 ease-in-out', isOpen && 'opacity-0') }), jsxRuntime.jsx(uiIcons.X, { "aria-hidden": "true", className: cx.cx('absolute size-5 opacity-0 transition duration-200 ease-in-out', isOpen && 'opacity-100') })] }));
|
|
9
|
+
|
|
10
|
+
exports.MenuButton = MenuButton;
|
|
11
|
+
//# sourceMappingURL=menu-button.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"menu-button.cjs","sources":["../../../../../src/components/organisms/ApplicationHeader/components/menu-button.tsx"],"sourcesContent":[null],"names":["_jsxs","AriaButton","cx","_jsx","Menu02","CloseIcon"],"mappings":";;;;;;;AAeO,MAAM,UAAU,GAAG,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,aAAa,EAAE,UAAU,EAAmB,MACpHA,gBAACC,0BAAU,EAAA,EAAA,YAAA,EACG,KAAK,EAAA,eAAA,EACF,MAAM,EAAA,eAAA,EACN,QAAQ,iBACV,UAAU,EACvB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAEC,KAAE,CACX,qRAAqR,EACrR,SAAS,CACV,EAAA,QAAA,EAAA,CAEDC,cAAA,CAACC,cAAM,EAAA,EAAA,aAAA,EAAa,MAAM,EAAC,SAAS,EAAEF,KAAE,CAAC,4CAA4C,EAAE,MAAM,IAAI,WAAW,CAAC,EAAA,CAAI,EACjHC,eAACE,SAAS,EAAA,EAAA,aAAA,EAAa,MAAM,EAAC,SAAS,EAAEH,KAAE,CAAC,+DAA+D,EAAE,MAAM,IAAI,aAAa,CAAC,EAAA,CAAI,CAAA,EAAA,CAC9H;;;;"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
interface MenuButtonProps {
|
|
2
|
+
isOpen: boolean;
|
|
3
|
+
onPress: () => void;
|
|
4
|
+
label: string;
|
|
5
|
+
controls?: string;
|
|
6
|
+
className?: string;
|
|
7
|
+
'data-testid'?: string;
|
|
8
|
+
}
|
|
9
|
+
export declare const MenuButton: ({ isOpen, onPress, label, controls, className, "data-testid": dataTestId }: MenuButtonProps) => import("react").JSX.Element;
|
|
10
|
+
export {};
|
|
11
|
+
//# sourceMappingURL=menu-button.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"menu-button.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/ApplicationHeader/components/menu-button.tsx"],"names":[],"mappings":"AAMA,UAAU,eAAe;IACvB,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,eAAO,MAAM,UAAU,GAAI,4EAA4E,eAAe,gCAerH,CAAC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Menu02, X } from '@flipdish/ui-icons';
|
|
3
|
+
import { cx } from '@flipdish/ui-library/utilities/cx';
|
|
4
|
+
import { Button } from 'react-aria-components';
|
|
5
|
+
|
|
6
|
+
const MenuButton = ({ isOpen, onPress, label, controls, className, 'data-testid': dataTestId }) => (jsxs(Button, { "aria-label": label, "aria-expanded": isOpen, "aria-controls": controls, "data-testid": dataTestId, onPress: onPress, className: cx('relative flex size-9 shrink-0 cursor-pointer items-center justify-center rounded-lg bg-primary text-fg-secondary outline-focus-ring transition duration-100 ease-linear hover:bg-primary_hover hover:text-fg-secondary_hover focus-visible:outline-2 focus-visible:outline-offset-2', className), children: [jsx(Menu02, { "aria-hidden": "true", className: cx('size-5 transition duration-200 ease-in-out', isOpen && 'opacity-0') }), jsx(X, { "aria-hidden": "true", className: cx('absolute size-5 opacity-0 transition duration-200 ease-in-out', isOpen && 'opacity-100') })] }));
|
|
7
|
+
|
|
8
|
+
export { MenuButton };
|
|
9
|
+
//# sourceMappingURL=menu-button.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"menu-button.js","sources":["../../../../../src/components/organisms/ApplicationHeader/components/menu-button.tsx"],"sourcesContent":[null],"names":["_jsxs","AriaButton","_jsx","CloseIcon"],"mappings":";;;;;AAeO,MAAM,UAAU,GAAG,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,aAAa,EAAE,UAAU,EAAmB,MACpHA,KAACC,MAAU,EAAA,EAAA,YAAA,EACG,KAAK,EAAA,eAAA,EACF,MAAM,EAAA,eAAA,EACN,QAAQ,iBACV,UAAU,EACvB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,EAAE,CACX,qRAAqR,EACrR,SAAS,CACV,EAAA,QAAA,EAAA,CAEDC,GAAA,CAAC,MAAM,EAAA,EAAA,aAAA,EAAa,MAAM,EAAC,SAAS,EAAE,EAAE,CAAC,4CAA4C,EAAE,MAAM,IAAI,WAAW,CAAC,EAAA,CAAI,EACjHA,IAACC,CAAS,EAAA,EAAA,aAAA,EAAa,MAAM,EAAC,SAAS,EAAE,EAAE,CAAC,+DAA+D,EAAE,MAAM,IAAI,aAAa,CAAC,EAAA,CAAI,CAAA,EAAA,CAC9H;;;;"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var uiIcons = require('@flipdish/ui-icons');
|
|
5
|
+
var cx = require('@flipdish/ui-library/utilities/cx');
|
|
6
|
+
var reactAriaComponents = require('react-aria-components');
|
|
7
|
+
|
|
8
|
+
const sizes = {
|
|
9
|
+
sm: { root: 'px-3 py-2', icon: uiIcons.SearchMd, iconClassName: 'size-4', text: 'text-sm' },
|
|
10
|
+
md: { root: 'px-3 py-2', icon: uiIcons.SearchLg, iconClassName: 'size-5', text: 'text-md' },
|
|
11
|
+
};
|
|
12
|
+
/** A button dressed as a search field: it never holds a value, it only opens the consumer's search surface. */
|
|
13
|
+
const SearchTrigger = ({ size, placeholder, label, onPress, shortcutHint, className, 'data-testid': dataTestId }) => {
|
|
14
|
+
const { root, icon: Icon, iconClassName, text } = sizes[size];
|
|
15
|
+
return (jsxRuntime.jsxs(reactAriaComponents.Button, { "aria-label": label, "data-testid": dataTestId, onPress: onPress, className: cx.cx('flex cursor-pointer items-center gap-2 rounded-lg bg-primary text-left shadow-xs ring-1 ring-primary outline-focus-ring transition duration-100 ease-linear ring-inset hover:bg-primary_hover focus-visible:outline-2 focus-visible:outline-offset-2', root, className), children: [jsxRuntime.jsx(Icon, { "aria-hidden": "true", className: cx.cx('shrink-0 text-fg-quaternary', iconClassName) }), jsxRuntime.jsx("span", { className: cx.cx('min-w-0 flex-1 truncate text-placeholder', text), children: placeholder }), shortcutHint && (jsxRuntime.jsx("kbd", { className: "shrink-0 rounded-sm bg-secondary_alt px-1 py-px font-body text-xs font-medium text-tertiary ring-1 ring-secondary ring-inset", children: shortcutHint }))] }));
|
|
16
|
+
};
|
|
17
|
+
|
|
18
|
+
exports.SearchTrigger = SearchTrigger;
|
|
19
|
+
//# sourceMappingURL=search-trigger.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"search-trigger.cjs","sources":["../../../../../src/components/organisms/ApplicationHeader/components/search-trigger.tsx"],"sourcesContent":[null],"names":["SearchMd","SearchLg","_jsxs","AriaButton","cx","_jsx"],"mappings":";;;;;;;AAOA,MAAM,KAAK,GAAiH;AAC1H,IAAA,EAAE,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,IAAI,EAAEA,gBAAQ,EAAE,aAAa,EAAE,QAAQ,EAAE,IAAI,EAAE,SAAS,EAAE;AACnF,IAAA,EAAE,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,IAAI,EAAEC,gBAAQ,EAAE,aAAa,EAAE,QAAQ,EAAE,IAAI,EAAE,SAAS,EAAE;CACpF;AAeD;MACa,aAAa,GAAG,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,aAAa,EAAE,UAAU,EAAsB,KAAI;AAC7I,IAAA,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,aAAa,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC,IAAI,CAAC;AAE7D,IAAA,QACEC,eAAA,CAACC,0BAAU,EAAA,EAAA,YAAA,EACG,KAAK,EAAA,aAAA,EACJ,UAAU,EACvB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAEC,KAAE,CACX,sPAAsP,EACtP,IAAI,EACJ,SAAS,CACV,EAAA,QAAA,EAAA,CAEDC,cAAA,CAAC,IAAI,EAAA,EAAA,aAAA,EAAa,MAAM,EAAC,SAAS,EAAED,KAAE,CAAC,6BAA6B,EAAE,aAAa,CAAC,EAAA,CAAI,EACxFC,cAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAED,KAAE,CAAC,0CAA0C,EAAE,IAAI,CAAC,EAAA,QAAA,EAAG,WAAW,EAAA,CAAQ,EAC1F,YAAY,KACXC,cAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,8HAA8H,EAAA,QAAA,EAC1I,YAAY,EAAA,CACT,CACP,CAAA,EAAA,CACU;AAEjB;;;;"}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import type { FC } from 'react';
|
|
2
|
+
declare const sizes: Record<'sm' | 'md', {
|
|
3
|
+
root: string;
|
|
4
|
+
icon: FC<{
|
|
5
|
+
className?: string;
|
|
6
|
+
}>;
|
|
7
|
+
iconClassName: string;
|
|
8
|
+
text: string;
|
|
9
|
+
}>;
|
|
10
|
+
interface SearchTriggerProps {
|
|
11
|
+
/** `sm` for the desktop header, `md` for the mobile drawer. */
|
|
12
|
+
size: keyof typeof sizes;
|
|
13
|
+
placeholder: string;
|
|
14
|
+
/** Accessible name; the placeholder is presentational. */
|
|
15
|
+
label: string;
|
|
16
|
+
onPress: () => void;
|
|
17
|
+
/** Formatted shortcut shown as a key cap, e.g. `⌘K`. */
|
|
18
|
+
shortcutHint?: string;
|
|
19
|
+
className?: string;
|
|
20
|
+
'data-testid'?: string;
|
|
21
|
+
}
|
|
22
|
+
/** A button dressed as a search field: it never holds a value, it only opens the consumer's search surface. */
|
|
23
|
+
export declare const SearchTrigger: ({ size, placeholder, label, onPress, shortcutHint, className, "data-testid": dataTestId }: SearchTriggerProps) => import("react").JSX.Element;
|
|
24
|
+
export {};
|
|
25
|
+
//# sourceMappingURL=search-trigger.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"search-trigger.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/ApplicationHeader/components/search-trigger.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAGhC,QAAA,MAAM,KAAK,EAAE,MAAM,CAAC,IAAI,GAAG,IAAI,EAAE;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,EAAE,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAAC,aAAa,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAGvH,CAAC;AAEF,UAAU,kBAAkB;IAC1B,+DAA+D;IAC/D,IAAI,EAAE,MAAM,OAAO,KAAK,CAAC;IACzB,WAAW,EAAE,MAAM,CAAC;IACpB,0DAA0D;IAC1D,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,wDAAwD;IACxD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,+GAA+G;AAC/G,eAAO,MAAM,aAAa,GAAI,2FAA2F,kBAAkB,gCAuB1I,CAAC"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { SearchLg, SearchMd } from '@flipdish/ui-icons';
|
|
3
|
+
import { cx } from '@flipdish/ui-library/utilities/cx';
|
|
4
|
+
import { Button } from 'react-aria-components';
|
|
5
|
+
|
|
6
|
+
const sizes = {
|
|
7
|
+
sm: { root: 'px-3 py-2', icon: SearchMd, iconClassName: 'size-4', text: 'text-sm' },
|
|
8
|
+
md: { root: 'px-3 py-2', icon: SearchLg, iconClassName: 'size-5', text: 'text-md' },
|
|
9
|
+
};
|
|
10
|
+
/** A button dressed as a search field: it never holds a value, it only opens the consumer's search surface. */
|
|
11
|
+
const SearchTrigger = ({ size, placeholder, label, onPress, shortcutHint, className, 'data-testid': dataTestId }) => {
|
|
12
|
+
const { root, icon: Icon, iconClassName, text } = sizes[size];
|
|
13
|
+
return (jsxs(Button, { "aria-label": label, "data-testid": dataTestId, onPress: onPress, className: cx('flex cursor-pointer items-center gap-2 rounded-lg bg-primary text-left shadow-xs ring-1 ring-primary outline-focus-ring transition duration-100 ease-linear ring-inset hover:bg-primary_hover focus-visible:outline-2 focus-visible:outline-offset-2', root, className), children: [jsx(Icon, { "aria-hidden": "true", className: cx('shrink-0 text-fg-quaternary', iconClassName) }), jsx("span", { className: cx('min-w-0 flex-1 truncate text-placeholder', text), children: placeholder }), shortcutHint && (jsx("kbd", { className: "shrink-0 rounded-sm bg-secondary_alt px-1 py-px font-body text-xs font-medium text-tertiary ring-1 ring-secondary ring-inset", children: shortcutHint }))] }));
|
|
14
|
+
};
|
|
15
|
+
|
|
16
|
+
export { SearchTrigger };
|
|
17
|
+
//# sourceMappingURL=search-trigger.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"search-trigger.js","sources":["../../../../../src/components/organisms/ApplicationHeader/components/search-trigger.tsx"],"sourcesContent":[null],"names":["_jsxs","AriaButton","_jsx"],"mappings":";;;;;AAOA,MAAM,KAAK,GAAiH;AAC1H,IAAA,EAAE,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,IAAI,EAAE,QAAQ,EAAE,aAAa,EAAE,QAAQ,EAAE,IAAI,EAAE,SAAS,EAAE;AACnF,IAAA,EAAE,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,IAAI,EAAE,QAAQ,EAAE,aAAa,EAAE,QAAQ,EAAE,IAAI,EAAE,SAAS,EAAE;CACpF;AAeD;MACa,aAAa,GAAG,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,aAAa,EAAE,UAAU,EAAsB,KAAI;AAC7I,IAAA,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,aAAa,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC,IAAI,CAAC;AAE7D,IAAA,QACEA,IAAA,CAACC,MAAU,EAAA,EAAA,YAAA,EACG,KAAK,EAAA,aAAA,EACJ,UAAU,EACvB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,EAAE,CACX,sPAAsP,EACtP,IAAI,EACJ,SAAS,CACV,EAAA,QAAA,EAAA,CAEDC,GAAA,CAAC,IAAI,EAAA,EAAA,aAAA,EAAa,MAAM,EAAC,SAAS,EAAE,EAAE,CAAC,6BAA6B,EAAE,aAAa,CAAC,EAAA,CAAI,EACxFA,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,EAAE,CAAC,0CAA0C,EAAE,IAAI,CAAC,EAAA,QAAA,EAAG,WAAW,EAAA,CAAQ,EAC1F,YAAY,KACXA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,8HAA8H,EAAA,QAAA,EAC1I,YAAY,EAAA,CACT,CACP,CAAA,EAAA,CACU;AAEjB;;;;"}
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var uiIcons = require('@flipdish/ui-icons');
|
|
5
|
+
var FlipdishLogo = require('@flipdish/ui-library/components/atoms/FlipdishLogo');
|
|
6
|
+
var useBreakpoints = require('@flipdish/ui-library/hooks/useBreakpoints');
|
|
7
|
+
var cx = require('@flipdish/ui-library/utilities/cx');
|
|
8
|
+
var hrefUtils = require('@flipdish/ui-library/utilities/hrefUtils');
|
|
9
|
+
var testIdUtils = require('@flipdish/ui-library/utilities/testIdUtils');
|
|
10
|
+
var React = require('react');
|
|
11
|
+
var reactAriaComponents = require('react-aria-components');
|
|
12
|
+
var reactHotkeysHook = require('react-hotkeys-hook');
|
|
13
|
+
var hotkeys_utils = require('../../../utilities/__internal__/hotkeysUtils/hotkeys.utils.cjs');
|
|
14
|
+
var applicationHeader_utils = require('./applicationHeader.utils.cjs');
|
|
15
|
+
var avatarButton = require('./components/avatar-button.cjs');
|
|
16
|
+
var headerAction = require('./components/header-action.cjs');
|
|
17
|
+
var menuButton = require('./components/menu-button.cjs');
|
|
18
|
+
var searchTrigger = require('./components/search-trigger.cjs');
|
|
19
|
+
|
|
20
|
+
const DEFAULT_SHORTCUT = 'mod+k';
|
|
21
|
+
const subscribeToNothing = () => () => { };
|
|
22
|
+
/**
|
|
23
|
+
* App-shell top bar that sits above every page: a search trigger on desktop, and
|
|
24
|
+
* notifications, assistant and avatar actions at every width. Below `lg` the search gives
|
|
25
|
+
* way to a navigation menu toggle and the Flipdish logo. Every section is data-driven and
|
|
26
|
+
* optional — the header owns layout, labelling and the search shortcut, while the app owns
|
|
27
|
+
* what each press does. Sticks to the top of the scrolling page.
|
|
28
|
+
*
|
|
29
|
+
* @summary app-shell top bar with search, notifications, assistant and avatar
|
|
30
|
+
*/
|
|
31
|
+
const ApplicationHeader = ({ search, notifications, assistant, avatar, menu, homeHref = '/', className, 'data-testid': dataTestId, }) => {
|
|
32
|
+
const rootTestId = testIdUtils.useResolvedTestId({ testId: dataTestId, segment: 'application-header', rootName: 'application-header' });
|
|
33
|
+
const isDesktop = useBreakpoints.useBreakpoints('lg');
|
|
34
|
+
// Server snapshot is `false` so the hint hydrates consistently, then settles on the real platform.
|
|
35
|
+
const isApple = React.useSyncExternalStore(subscribeToNothing, hotkeys_utils.isApplePlatform, () => false);
|
|
36
|
+
const shortcut = search ? (search.shortcut === undefined ? DEFAULT_SHORTCUT : search.shortcut) : null;
|
|
37
|
+
const onSearchPress = search?.onPress;
|
|
38
|
+
reactHotkeysHook.useHotkeys(shortcut ?? '', () => onSearchPress?.(),
|
|
39
|
+
// The search trigger is hidden below `lg`, so the shortcut is too.
|
|
40
|
+
{ enabled: Boolean(shortcut && isDesktop), preventDefault: true, enableOnFormTags: true, enableOnContentEditable: true }, [onSearchPress]);
|
|
41
|
+
const notificationsLabel = notifications?.label ?? 'Notifications';
|
|
42
|
+
const assistantLabel = assistant?.label ?? 'Assistant';
|
|
43
|
+
const menuLabel = menu?.label ?? (menu?.isOpen ? 'Close navigation menu' : 'Open navigation menu');
|
|
44
|
+
const hasActions = Boolean(notifications || assistant || avatar);
|
|
45
|
+
const safeHomeHref = hrefUtils.safeHref(homeHref);
|
|
46
|
+
return (jsxRuntime.jsx(testIdUtils.TestIdProvider, { value: rootTestId, children: jsxRuntime.jsxs("header", { "data-testid": rootTestId, className: cx.cx('sticky top-0 z-30 flex h-14 w-full items-center gap-2 border-b border-secondary bg-primary pr-3 pl-4 lg:h-16 lg:px-6', className), children: [menu && (jsxRuntime.jsx(menuButton.MenuButton, { isOpen: menu.isOpen, onPress: () => menu.onOpenChange(!menu.isOpen), label: menuLabel, controls: menu.controls, className: "lg:hidden", "data-testid": menu['data-testid'] ?? testIdUtils.joinTestId(rootTestId, 'menu') })), jsxRuntime.jsx("div", { className: "flex min-w-0 flex-1 items-center lg:hidden", children: safeHomeHref === undefined ? (
|
|
47
|
+
// A rejected `homeHref` leaves a plain logo: no link role, nothing to activate.
|
|
48
|
+
jsxRuntime.jsx(FlipdishLogo.FlipdishLogo, { size: "sm", "data-testid": testIdUtils.joinTestId(rootTestId, 'logo') })) : (jsxRuntime.jsx(reactAriaComponents.Link, { href: safeHomeHref, "aria-label": "Go to homepage", "data-testid": testIdUtils.joinTestId(rootTestId, 'logo'), className: "rounded-xs outline-focus-ring focus-visible:outline-2 focus-visible:outline-offset-2", children: jsxRuntime.jsx(FlipdishLogo.FlipdishLogo, { size: "sm", "aria-hidden": "true" }) })) }), search && (jsxRuntime.jsx(searchTrigger.SearchTrigger, { size: "sm", placeholder: search.placeholder ?? 'Search', label: search.label ?? 'Search', onPress: search.onPress, shortcutHint: shortcut ? hotkeys_utils.formatHotkeyHint(shortcut, isApple) : undefined, className: "w-80 max-lg:hidden", "data-testid": search['data-testid'] ?? testIdUtils.joinTestId(rootTestId, 'search') })), hasActions && (jsxRuntime.jsxs("div", { className: "flex shrink-0 items-center gap-2 lg:ml-auto", children: [notifications && (jsxRuntime.jsx(headerAction.HeaderAction, { icon: uiIcons.Bell01, label: applicationHeader_utils.getNotificationsLabel(notificationsLabel, notifications.count), tooltip: notificationsLabel, badge: applicationHeader_utils.formatBadgeCount(notifications.count), isOpen: notifications.isOpen, onPress: notifications.onPress, "data-testid": notifications['data-testid'] ?? testIdUtils.joinTestId(rootTestId, 'notifications') })), assistant && (jsxRuntime.jsx(headerAction.HeaderAction, { icon: uiIcons.Stars01, label: assistantLabel, tooltip: assistantLabel, isOpen: assistant.isOpen, onPress: assistant.onPress, "data-testid": assistant['data-testid'] ?? testIdUtils.joinTestId(rootTestId, 'assistant') })), avatar && (jsxRuntime.jsx(avatarButton.AvatarButton, { name: avatar.name, src: avatar.src, initials: avatar.initials, label: avatar.label ?? avatar.name, onPress: avatar.onPress, "data-testid": avatar['data-testid'] ?? testIdUtils.joinTestId(rootTestId, 'avatar') }))] }))] }) }));
|
|
49
|
+
};
|
|
50
|
+
|
|
51
|
+
exports.ApplicationHeader = ApplicationHeader;
|
|
52
|
+
//# sourceMappingURL=index.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../../../../src/components/organisms/ApplicationHeader/index.tsx"],"sourcesContent":[null],"names":["useResolvedTestId","useBreakpoints","useSyncExternalStore","isApplePlatform","useHotkeys","safeHref","_jsx","TestIdProvider","_jsxs","cx","MenuButton","joinTestId","FlipdishLogo","AriaLink","SearchTrigger","formatHotkeyHint","HeaderAction","Bell01","getNotificationsLabel","formatBadgeCount","Stars01","AvatarButton"],"mappings":"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"}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import type { ApplicationHeaderAssistant, ApplicationHeaderAvatar, ApplicationHeaderMenu, ApplicationHeaderNotifications, ApplicationHeaderSearch } from './applicationHeader.types';
|
|
2
|
+
export type { ApplicationHeaderAssistant, ApplicationHeaderAvatar, ApplicationHeaderMenu, ApplicationHeaderNotifications, ApplicationHeaderSearch, } from './applicationHeader.types';
|
|
3
|
+
export interface ApplicationHeaderProps {
|
|
4
|
+
/**
|
|
5
|
+
* Search trigger, shown from `lg`. It is a button dressed as a search field — pressing it (or its
|
|
6
|
+
* shortcut) calls `onPress` so the app can open its own search surface. Omit to hide.
|
|
7
|
+
*/
|
|
8
|
+
search?: ApplicationHeaderSearch;
|
|
9
|
+
/** Notifications button with an unread badge. Omit to hide. */
|
|
10
|
+
notifications?: ApplicationHeaderNotifications;
|
|
11
|
+
/** AI assistant button. Omit to hide. */
|
|
12
|
+
assistant?: ApplicationHeaderAssistant;
|
|
13
|
+
/** Avatar button for the current organisation, store or user. Omit to hide. */
|
|
14
|
+
avatar?: ApplicationHeaderAvatar;
|
|
15
|
+
/**
|
|
16
|
+
* Navigation menu toggle, shown below `lg`. Share its state with
|
|
17
|
+
* `SidebarNavigation`'s `mobileMenuOpen` / `onMobileMenuOpenChange`. Omit to hide.
|
|
18
|
+
*/
|
|
19
|
+
menu?: ApplicationHeaderMenu;
|
|
20
|
+
/**
|
|
21
|
+
* Destination of the logo link shown below `lg`.
|
|
22
|
+
* @default "/"
|
|
23
|
+
*/
|
|
24
|
+
homeHref?: string;
|
|
25
|
+
/** Extra classes merged onto the root `<header>`. */
|
|
26
|
+
className?: string;
|
|
27
|
+
/**
|
|
28
|
+
* Overrides the root `data-testid`. Defaults to `fd-application-header`. Child
|
|
29
|
+
* elements derive their testids from this prefix (e.g. `<root>--search`).
|
|
30
|
+
*/
|
|
31
|
+
'data-testid'?: string;
|
|
32
|
+
}
|
|
33
|
+
/**
|
|
34
|
+
* App-shell top bar that sits above every page: a search trigger on desktop, and
|
|
35
|
+
* notifications, assistant and avatar actions at every width. Below `lg` the search gives
|
|
36
|
+
* way to a navigation menu toggle and the Flipdish logo. Every section is data-driven and
|
|
37
|
+
* optional — the header owns layout, labelling and the search shortcut, while the app owns
|
|
38
|
+
* what each press does. Sticks to the top of the scrolling page.
|
|
39
|
+
*
|
|
40
|
+
* @summary app-shell top bar with search, notifications, assistant and avatar
|
|
41
|
+
*/
|
|
42
|
+
export declare const ApplicationHeader: ({ search, notifications, assistant, avatar, menu, homeHref, className, "data-testid": dataTestId, }: ApplicationHeaderProps) => import("react").JSX.Element;
|
|
43
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/ApplicationHeader/index.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EACV,0BAA0B,EAC1B,uBAAuB,EACvB,qBAAqB,EACrB,8BAA8B,EAC9B,uBAAuB,EACxB,MAAM,2BAA2B,CAAC;AAOnC,YAAY,EACV,0BAA0B,EAC1B,uBAAuB,EACvB,qBAAqB,EACrB,8BAA8B,EAC9B,uBAAuB,GACxB,MAAM,2BAA2B,CAAC;AAMnC,MAAM,WAAW,sBAAsB;IACrC;;;OAGG;IACH,MAAM,CAAC,EAAE,uBAAuB,CAAC;IACjC,+DAA+D;IAC/D,aAAa,CAAC,EAAE,8BAA8B,CAAC;IAC/C,yCAAyC;IACzC,SAAS,CAAC,EAAE,0BAA0B,CAAC;IACvC,+EAA+E;IAC/E,MAAM,CAAC,EAAE,uBAAuB,CAAC;IACjC;;;OAGG;IACH,IAAI,CAAC,EAAE,qBAAqB,CAAC;IAC7B;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qDAAqD;IACrD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;;;;;;GAQG;AACH,eAAO,MAAM,iBAAiB,GAAI,qGAS/B,sBAAsB,gCA+GxB,CAAC"}
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
+
import { Bell01, Stars01 } from '@flipdish/ui-icons';
|
|
3
|
+
import { FlipdishLogo } from '@flipdish/ui-library/components/atoms/FlipdishLogo';
|
|
4
|
+
import { useBreakpoints } from '@flipdish/ui-library/hooks/useBreakpoints';
|
|
5
|
+
import { cx } from '@flipdish/ui-library/utilities/cx';
|
|
6
|
+
import { safeHref } from '@flipdish/ui-library/utilities/hrefUtils';
|
|
7
|
+
import { useResolvedTestId, TestIdProvider, joinTestId } from '@flipdish/ui-library/utilities/testIdUtils';
|
|
8
|
+
import { useSyncExternalStore } from 'react';
|
|
9
|
+
import { Link } from 'react-aria-components';
|
|
10
|
+
import { useHotkeys } from 'react-hotkeys-hook';
|
|
11
|
+
import { isApplePlatform, formatHotkeyHint } from '../../../utilities/__internal__/hotkeysUtils/hotkeys.utils.js';
|
|
12
|
+
import { formatBadgeCount, getNotificationsLabel } from './applicationHeader.utils.js';
|
|
13
|
+
import { AvatarButton } from './components/avatar-button.js';
|
|
14
|
+
import { HeaderAction } from './components/header-action.js';
|
|
15
|
+
import { MenuButton } from './components/menu-button.js';
|
|
16
|
+
import { SearchTrigger } from './components/search-trigger.js';
|
|
17
|
+
|
|
18
|
+
const DEFAULT_SHORTCUT = 'mod+k';
|
|
19
|
+
const subscribeToNothing = () => () => { };
|
|
20
|
+
/**
|
|
21
|
+
* App-shell top bar that sits above every page: a search trigger on desktop, and
|
|
22
|
+
* notifications, assistant and avatar actions at every width. Below `lg` the search gives
|
|
23
|
+
* way to a navigation menu toggle and the Flipdish logo. Every section is data-driven and
|
|
24
|
+
* optional — the header owns layout, labelling and the search shortcut, while the app owns
|
|
25
|
+
* what each press does. Sticks to the top of the scrolling page.
|
|
26
|
+
*
|
|
27
|
+
* @summary app-shell top bar with search, notifications, assistant and avatar
|
|
28
|
+
*/
|
|
29
|
+
const ApplicationHeader = ({ search, notifications, assistant, avatar, menu, homeHref = '/', className, 'data-testid': dataTestId, }) => {
|
|
30
|
+
const rootTestId = useResolvedTestId({ testId: dataTestId, segment: 'application-header', rootName: 'application-header' });
|
|
31
|
+
const isDesktop = useBreakpoints('lg');
|
|
32
|
+
// Server snapshot is `false` so the hint hydrates consistently, then settles on the real platform.
|
|
33
|
+
const isApple = useSyncExternalStore(subscribeToNothing, isApplePlatform, () => false);
|
|
34
|
+
const shortcut = search ? (search.shortcut === undefined ? DEFAULT_SHORTCUT : search.shortcut) : null;
|
|
35
|
+
const onSearchPress = search?.onPress;
|
|
36
|
+
useHotkeys(shortcut ?? '', () => onSearchPress?.(),
|
|
37
|
+
// The search trigger is hidden below `lg`, so the shortcut is too.
|
|
38
|
+
{ enabled: Boolean(shortcut && isDesktop), preventDefault: true, enableOnFormTags: true, enableOnContentEditable: true }, [onSearchPress]);
|
|
39
|
+
const notificationsLabel = notifications?.label ?? 'Notifications';
|
|
40
|
+
const assistantLabel = assistant?.label ?? 'Assistant';
|
|
41
|
+
const menuLabel = menu?.label ?? (menu?.isOpen ? 'Close navigation menu' : 'Open navigation menu');
|
|
42
|
+
const hasActions = Boolean(notifications || assistant || avatar);
|
|
43
|
+
const safeHomeHref = safeHref(homeHref);
|
|
44
|
+
return (jsx(TestIdProvider, { value: rootTestId, children: jsxs("header", { "data-testid": rootTestId, className: cx('sticky top-0 z-30 flex h-14 w-full items-center gap-2 border-b border-secondary bg-primary pr-3 pl-4 lg:h-16 lg:px-6', className), children: [menu && (jsx(MenuButton, { isOpen: menu.isOpen, onPress: () => menu.onOpenChange(!menu.isOpen), label: menuLabel, controls: menu.controls, className: "lg:hidden", "data-testid": menu['data-testid'] ?? joinTestId(rootTestId, 'menu') })), jsx("div", { className: "flex min-w-0 flex-1 items-center lg:hidden", children: safeHomeHref === undefined ? (
|
|
45
|
+
// A rejected `homeHref` leaves a plain logo: no link role, nothing to activate.
|
|
46
|
+
jsx(FlipdishLogo, { size: "sm", "data-testid": joinTestId(rootTestId, 'logo') })) : (jsx(Link, { href: safeHomeHref, "aria-label": "Go to homepage", "data-testid": joinTestId(rootTestId, 'logo'), className: "rounded-xs outline-focus-ring focus-visible:outline-2 focus-visible:outline-offset-2", children: jsx(FlipdishLogo, { size: "sm", "aria-hidden": "true" }) })) }), search && (jsx(SearchTrigger, { size: "sm", placeholder: search.placeholder ?? 'Search', label: search.label ?? 'Search', onPress: search.onPress, shortcutHint: shortcut ? formatHotkeyHint(shortcut, isApple) : undefined, className: "w-80 max-lg:hidden", "data-testid": search['data-testid'] ?? joinTestId(rootTestId, 'search') })), hasActions && (jsxs("div", { className: "flex shrink-0 items-center gap-2 lg:ml-auto", children: [notifications && (jsx(HeaderAction, { icon: Bell01, label: getNotificationsLabel(notificationsLabel, notifications.count), tooltip: notificationsLabel, badge: formatBadgeCount(notifications.count), isOpen: notifications.isOpen, onPress: notifications.onPress, "data-testid": notifications['data-testid'] ?? joinTestId(rootTestId, 'notifications') })), assistant && (jsx(HeaderAction, { icon: Stars01, label: assistantLabel, tooltip: assistantLabel, isOpen: assistant.isOpen, onPress: assistant.onPress, "data-testid": assistant['data-testid'] ?? joinTestId(rootTestId, 'assistant') })), avatar && (jsx(AvatarButton, { name: avatar.name, src: avatar.src, initials: avatar.initials, label: avatar.label ?? avatar.name, onPress: avatar.onPress, "data-testid": avatar['data-testid'] ?? joinTestId(rootTestId, 'avatar') }))] }))] }) }));
|
|
47
|
+
};
|
|
48
|
+
|
|
49
|
+
export { ApplicationHeader };
|
|
50
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/components/organisms/ApplicationHeader/index.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs","AriaLink"],"mappings":"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"}
|
|
@@ -7,12 +7,12 @@ var React = require('react');
|
|
|
7
7
|
var reactAriaComponents = require('react-aria-components');
|
|
8
8
|
var reactHotkeysHook = require('react-hotkeys-hook');
|
|
9
9
|
var children_utils = require('../../../utilities/__internal__/childrenUtils/children.utils.cjs');
|
|
10
|
+
var hotkeys_utils = require('../../../utilities/__internal__/hotkeysUtils/hotkeys.utils.cjs');
|
|
10
11
|
var commandMenu_utils = require('./commandMenu.utils.cjs');
|
|
11
12
|
var commandInput = require('./components/command-input.cjs');
|
|
12
13
|
var commandMenuFooter = require('./components/command-menu-footer.cjs');
|
|
13
14
|
var commandMenuHeader = require('./components/command-menu-header.cjs');
|
|
14
15
|
var commandMenuItem = require('./components/command-menu-item.cjs');
|
|
15
|
-
var hotkeys_utils = require('./hotkeys.utils.cjs');
|
|
16
16
|
|
|
17
17
|
const CommandMenuContext = React.createContext({
|
|
18
18
|
hasFooter: false,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/CommandMenu/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9D,OAAO,KAAK,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,GAAG,EAAE,YAAY,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAC9I,OAAO,EAEL,UAAU,IAAI,cAAc,EAE5B,aAAa,IAAI,iBAAiB,EAOnC,MAAM,uBAAuB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/CommandMenu/index.tsx"],"names":[],"mappings":"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"}
|