@flipdish/ui-library 0.9.0 → 0.9.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/atoms/Avatar/components/avatar-add-button.cjs +16 -0
- package/dist/components/atoms/Avatar/components/avatar-add-button.cjs.map +1 -0
- package/dist/components/atoms/Avatar/components/avatar-add-button.js +14 -0
- package/dist/components/atoms/Avatar/components/avatar-add-button.js.map +1 -0
- package/dist/components/atoms/Avatar/components/avatar-label-group.cjs +17 -0
- package/dist/components/atoms/Avatar/components/avatar-label-group.cjs.map +1 -0
- package/dist/components/atoms/Avatar/components/avatar-label-group.js +15 -0
- package/dist/components/atoms/Avatar/components/avatar-label-group.js.map +1 -0
- package/dist/components/atoms/Avatar/index.cjs +4 -0
- package/dist/components/atoms/Avatar/index.cjs.map +1 -1
- package/dist/components/atoms/Avatar/index.d.ts +2 -0
- package/dist/components/atoms/Avatar/index.d.ts.map +1 -1
- package/dist/components/atoms/Avatar/index.js +2 -0
- package/dist/components/atoms/Avatar/index.js.map +1 -1
- package/dist/components/atoms/Badge/index.cjs.map +1 -1
- package/dist/components/atoms/Badge/index.d.ts +1 -1
- package/dist/components/atoms/Badge/index.d.ts.map +1 -1
- package/dist/components/atoms/Badge/index.js.map +1 -1
- package/dist/components/molecules/MultiSelect/index.cjs +2 -5
- package/dist/components/molecules/MultiSelect/index.cjs.map +1 -1
- package/dist/components/molecules/MultiSelect/index.d.ts +1 -1
- package/dist/components/molecules/MultiSelect/index.d.ts.map +1 -1
- package/dist/components/molecules/MultiSelect/index.js +1 -1
- package/dist/components/molecules/Select/components/multi-select.cjs +60 -0
- package/dist/components/molecules/Select/components/multi-select.cjs.map +1 -0
- package/dist/components/molecules/Select/components/multi-select.d.ts +2 -2
- package/dist/components/molecules/Select/components/multi-select.d.ts.map +1 -1
- package/dist/components/molecules/Select/components/multi-select.js +58 -0
- package/dist/components/molecules/Select/components/multi-select.js.map +1 -0
- package/dist/components/organisms/ActivityFeed/index.d.ts +1 -1
- package/dist/components/organisms/ActivityFeed/index.d.ts.map +1 -1
- package/dist/components/organisms/Calendar/index.cjs +2 -3
- package/dist/components/organisms/Calendar/index.cjs.map +1 -1
- package/dist/components/organisms/Calendar/index.d.ts.map +1 -1
- package/dist/components/organisms/Calendar/index.js +2 -3
- package/dist/components/organisms/Calendar/index.js.map +1 -1
- package/dist/components/organisms/ColorPicker/components/input-cell.cjs +18 -0
- package/dist/components/organisms/ColorPicker/components/input-cell.cjs.map +1 -0
- package/dist/components/organisms/ColorPicker/components/input-cell.d.ts +8 -0
- package/dist/components/organisms/ColorPicker/components/input-cell.d.ts.map +1 -0
- package/dist/components/organisms/ColorPicker/components/input-cell.js +16 -0
- package/dist/components/organisms/ColorPicker/components/input-cell.js.map +1 -0
- package/dist/components/organisms/ColorPicker/index.cjs +6 -16
- package/dist/components/organisms/ColorPicker/index.cjs.map +1 -1
- package/dist/components/organisms/ColorPicker/index.d.ts +12 -20
- package/dist/components/organisms/ColorPicker/index.d.ts.map +1 -1
- package/dist/components/organisms/ColorPicker/index.js +2 -11
- package/dist/components/organisms/ColorPicker/index.js.map +1 -1
- package/dist/components/organisms/DatePicker/components/input-date.cjs +1 -2
- package/dist/components/organisms/DatePicker/components/input-date.cjs.map +1 -1
- package/dist/components/organisms/DatePicker/components/input-date.d.ts.map +1 -1
- package/dist/components/organisms/DatePicker/components/input-date.js +1 -2
- package/dist/components/organisms/DatePicker/components/input-date.js.map +1 -1
- package/dist/components/organisms/DatePicker/components/range-calendar.cjs +1 -1
- package/dist/components/organisms/DatePicker/components/range-calendar.d.ts.map +1 -1
- package/dist/components/organisms/DatePicker/components/range-calendar.js +1 -1
- package/dist/components/organisms/GradientPicker/index.cjs +5 -5
- package/dist/components/organisms/GradientPicker/index.cjs.map +1 -1
- package/dist/components/organisms/GradientPicker/index.d.ts.map +1 -1
- package/dist/components/organisms/GradientPicker/index.js +2 -2
- package/dist/components/organisms/HeaderNavigation/components/nav-account-card.cjs +3 -3
- package/dist/components/organisms/HeaderNavigation/components/nav-account-card.cjs.map +1 -1
- package/dist/components/organisms/HeaderNavigation/components/nav-account-card.js +1 -1
- package/dist/components/organisms/SidebarNavigation/components/nav-account-card.cjs +1 -2
- package/dist/components/organisms/SidebarNavigation/components/nav-account-card.cjs.map +1 -1
- package/dist/components/organisms/SidebarNavigation/components/nav-account-card.d.ts.map +1 -1
- package/dist/components/organisms/SidebarNavigation/components/nav-account-card.js +1 -2
- package/dist/components/organisms/SidebarNavigation/components/nav-account-card.js.map +1 -1
- package/dist/components/organisms/SidebarNavigation/components/nav-button.cjs +5 -2
- package/dist/components/organisms/SidebarNavigation/components/nav-button.cjs.map +1 -1
- package/dist/components/organisms/SidebarNavigation/components/nav-button.d.ts +4 -2
- package/dist/components/organisms/SidebarNavigation/components/nav-button.d.ts.map +1 -1
- package/dist/components/organisms/SidebarNavigation/components/nav-button.js +6 -3
- package/dist/components/organisms/SidebarNavigation/components/nav-button.js.map +1 -1
- package/dist/components/organisms/SidebarNavigation/components/nav-item.cjs +12 -7
- package/dist/components/organisms/SidebarNavigation/components/nav-item.cjs.map +1 -1
- package/dist/components/organisms/SidebarNavigation/components/nav-item.d.ts +6 -2
- package/dist/components/organisms/SidebarNavigation/components/nav-item.d.ts.map +1 -1
- package/dist/components/organisms/SidebarNavigation/components/nav-item.js +13 -8
- package/dist/components/organisms/SidebarNavigation/components/nav-item.js.map +1 -1
- package/dist/components/organisms/SidebarNavigation/components/nav-list.cjs +3 -3
- package/dist/components/organisms/SidebarNavigation/components/nav-list.cjs.map +1 -1
- package/dist/components/organisms/SidebarNavigation/components/nav-list.d.ts +3 -1
- package/dist/components/organisms/SidebarNavigation/components/nav-list.d.ts.map +1 -1
- package/dist/components/organisms/SidebarNavigation/components/nav-list.js +3 -3
- package/dist/components/organisms/SidebarNavigation/components/nav-list.js.map +1 -1
- package/dist/components/organisms/SidebarNavigation/hooks/use-dual-tier-keyboard.cjs +56 -0
- package/dist/components/organisms/SidebarNavigation/hooks/use-dual-tier-keyboard.cjs.map +1 -0
- package/dist/components/organisms/SidebarNavigation/hooks/use-dual-tier-keyboard.d.ts +24 -0
- package/dist/components/organisms/SidebarNavigation/hooks/use-dual-tier-keyboard.d.ts.map +1 -0
- package/dist/components/organisms/SidebarNavigation/hooks/use-dual-tier-keyboard.js +54 -0
- package/dist/components/organisms/SidebarNavigation/hooks/use-dual-tier-keyboard.js.map +1 -0
- package/dist/components/organisms/SidebarNavigation/index.cjs +49 -67
- package/dist/components/organisms/SidebarNavigation/index.cjs.map +1 -1
- package/dist/components/organisms/SidebarNavigation/index.d.ts +4 -3
- package/dist/components/organisms/SidebarNavigation/index.d.ts.map +1 -1
- package/dist/components/organisms/SidebarNavigation/index.js +50 -68
- package/dist/components/organisms/SidebarNavigation/index.js.map +1 -1
- package/dist/components/organisms/TextEditor/index.cjs +3 -4
- package/dist/components/organisms/TextEditor/index.cjs.map +1 -1
- package/dist/components/organisms/TextEditor/index.d.ts +1 -1
- package/dist/components/organisms/TextEditor/index.d.ts.map +1 -1
- package/dist/components/organisms/TextEditor/index.js +1 -2
- package/dist/components/organisms/TextEditor/index.js.map +1 -1
- package/dist/hooks/useBreakpoints/index.cjs.map +1 -1
- package/dist/hooks/useBreakpoints/index.d.ts.map +1 -1
- package/dist/hooks/useBreakpoints/index.js.map +1 -1
- package/dist/hooks/useClipboard/index.cjs.map +1 -1
- package/dist/hooks/useClipboard/index.d.ts.map +1 -1
- package/dist/hooks/useClipboard/index.js.map +1 -1
- package/dist/hooks/useResizeObserver/index.cjs.map +1 -1
- package/dist/hooks/useResizeObserver/index.d.ts.map +1 -1
- package/dist/hooks/useResizeObserver/index.js.map +1 -1
- package/dist/providers/RouteProvider/index.cjs.map +1 -1
- package/dist/providers/RouteProvider/index.d.ts.map +1 -1
- package/dist/providers/RouteProvider/index.js.map +1 -1
- package/dist/providers/ThemeProvider/index.cjs.map +1 -1
- package/dist/providers/ThemeProvider/index.d.ts.map +1 -1
- package/dist/providers/ThemeProvider/index.js.map +1 -1
- package/dist/providers/UIProvider/index.cjs.map +1 -1
- package/dist/providers/UIProvider/index.d.ts.map +1 -1
- package/dist/providers/UIProvider/index.js.map +1 -1
- package/package.json +4 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nav-account-card.cjs","sources":["../../../../../src/components/organisms/SidebarNavigation/components/nav-account-card.tsx"],"sourcesContent":[null],"names":["cx","_jsx","_jsxs","AriaDialog","useRef","useBreakpoint","AriaDialogTrigger","AriaButton","Avatar","AriaPopover","AvatarLabelGroup","ChevronSelectorVertical"],"mappings":"
|
|
1
|
+
{"version":3,"file":"nav-account-card.cjs","sources":["../../../../../src/components/organisms/SidebarNavigation/components/nav-account-card.tsx"],"sourcesContent":[null],"names":["cx","_jsx","_jsxs","AriaDialog","useRef","useBreakpoint","AriaDialogTrigger","AriaButton","Avatar","AriaPopover","AvatarLabelGroup","ChevronSelectorVertical"],"mappings":";;;;;;;;;;AAgDA,MAAM,iBAAiB,GAAG,CAAC,EAAE,UAAU,EAAE,SAAS,EAA+C,KAC/FA,KAAE,CACA,uDAAuD,EACvD,UAAU;AACR,IAAA,+JAA+J,EACjK,SAAS;AACP,IAAA,6JAA6J,CAChK;AAEH,MAAM,sBAAsB,GAAG,CAAC,EAC9B,IAAI,EAAE,IAAI,EACV,KAAK,EACL,QAAQ,EACR,GAAG,WAAW,EAKqB,MACnCC,8BAAY,WAAW,EAAE,SAAS,EAAED,KAAE,CAAC,8DAA8D,EAAE,WAAW,CAAC,SAAS,CAAC,EAAA,QAAA,EAC3HE,eAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAEF,KAAE,CACX,iGAAiG,EACjG,iGAAiG,CAClG,EAAA,QAAA,EAAA,CAEDE,eAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,uFAAuF,EAAA,QAAA,EAAA,CACnG,IAAI,IAAID,cAAA,CAAC,IAAI,EAAA,EAAC,SAAS,EAAC,qEAAqE,EAAA,CAAG,EAAA,GAAA,EAAG,KAAK,IACrG,EACL,QAAQ,KACPA,wBAAK,SAAS,EAAC,sGAAsG,EAAA,QAAA,EAAE,QAAQ,EAAA,CAAO,CACvI,CAAA,EAAA,CACG,EAAA,CACC,CACV;AAEM,MAAM,cAAc,GAAG,CAAC,EAC7B,SAAS,EACT,SAAS,GAAG,EAAE,EACd,eAAe,GAAG,EAAE,EACpB,GAAG,WAAW,EAKf,MACCC,eAAA,CAACC,0BAAU,OAAK,WAAW,EAAE,SAAS,EAAEH,KAAE,CAAC,mFAAmF,EAAE,SAAS,CAAC,aACvI,SAAS,CAAC,MAAM,GAAG,CAAC,KACnBC,cAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,6CAA6C,EAAA,QAAA,EAC1DA,cAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,8BAA8B,EAAA,QAAA,EAC1C,SAAS,CAAC,GAAG,CAAC,CAAC,IAAI,MAClBA,cAAA,CAAC,sBAAsB,IAAkB,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,OAAO,EAAE,IAAI,CAAC,OAAO,EAAA,EAA9F,IAAI,CAAC,KAAK,CAAwF,CAChI,CAAC,GACE,EAAA,CACF,CACP,EAEA,eAAe,CAAC,MAAM,GAAG,CAAC,KACzBA,cAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,aAAa,YACzB,eAAe,CAAC,GAAG,CAAC,CAAC,IAAI,MACxBA,eAAC,sBAAsB,EAAA,EAAkB,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,OAAO,EAAE,IAAI,CAAC,OAAO,EAAA,EAA9F,IAAI,CAAC,KAAK,CAAwF,CAChI,CAAC,GACE,CACP,CAAA,EAAA,CACU;MAGF,cAAc,GAAG,CAAC,EAC7B,gBAAgB,EAChB,OAAO,EACP,aAAa,EACb,SAAS,EACT,eAAe,EACf,OAAO,GAAG,MAAM,GAiBjB,KAAI;AACH,IAAA,MAAM,UAAU,GAAGG,YAAM,CAAiB,IAAI,CAAC;AAC/C,IAAA,MAAM,SAAS,GAAGC,4BAAa,CAAC,IAAI,CAAC;AAErC,IAAA,MAAM,IAAI,GAAGJ,cAAA,CAAC,cAAc,EAAA,EAAC,SAAS,EAAE,SAAS,EAAE,eAAe,EAAE,eAAe,GAAI;AAEvF,IAAA,IAAI,OAAO,KAAK,QAAQ,EAAE;AACxB,QAAA,QACEC,eAAA,CAACI,iCAAiB,eAChBL,cAAA,CAACM,0BAAU,IACT,SAAS,EAAE,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,KAClCP,KAAE,CAAC,yCAAyC,EAAE,CAAC,SAAS,IAAI,SAAS,KAAK,+CAA+C,CAAC,EAAA,QAAA,EAG5HC,cAAA,CAACO,aAAM,EAAA,EAAC,MAAM,QAAC,MAAM,EAAE,OAAO,CAAC,MAAM,EAAE,GAAG,EAAE,OAAO,CAAC,MAAM,EAAE,IAAI,EAAC,IAAI,EAAC,GAAG,EAAE,OAAO,CAAC,IAAI,EAAE,OAAO,EAAE,aAAa,GAAI,EAAA,CACxG,EACbP,eAACQ,2BAAW,EAAA,EAAC,SAAS,EAAE,gBAAgB,IAAI,cAAc,EAAE,MAAM,EAAE,CAAC,EAAE,WAAW,EAAE,CAAC,EAAE,SAAS,EAAE,iBAAiB,EAAA,QAAA,EAChH,IAAI,EAAA,CACO,CAAA,EAAA,CACI;IAExB;IAEA,QACEP,yBAAK,GAAG,EAAE,UAAU,EAAE,SAAS,EAAC,6FAA6F,EAAA,QAAA,EAAA,CAC3HD,cAAA,CAACS,uBAAgB,EAAA,EACf,IAAI,EAAC,IAAI,EACT,GAAG,EAAE,OAAO,CAAC,MAAM,EACnB,KAAK,EAAE,OAAO,CAAC,IAAI,EACnB,QAAQ,EAAE,OAAO,CAAC,KAAK,EACvB,MAAM,EAAE,OAAO,CAAC,MAAM,EACtB,OAAO,EAAE,aAAa,EAAA,CACtB,EAEFR,eAAA,CAACI,iCAAiB,EAAA,EAAA,QAAA,EAAA,CAChBL,cAAA,CAACM,0BAAU,EAAA,EAAC,SAAS,EAAC,0UAA0U,EAAA,QAAA,EAC9VN,eAACU,+BAAuB,EAAA,EAAC,SAAS,EAAC,iCAAiC,EAAA,CAAG,GAC5D,EACbV,cAAA,CAACQ,2BAAW,EAAA,EACV,SAAS,EAAE,gBAAgB,KAAK,SAAS,GAAG,cAAc,GAAG,WAAW,CAAC,EACzE,UAAU,EAAE,UAAU,EACtB,MAAM,EAAE,CAAC,EACT,SAAS,EAAE,iBAAiB,EAAA,QAAA,EAE3B,IAAI,EAAA,CACO,CAAA,EAAA,CACI,CAAA,EAAA,CAChB;AAEV;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nav-account-card.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/SidebarNavigation/components/nav-account-card.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"nav-account-card.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/SidebarNavigation/components/nav-account-card.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,EAAE,EAAkB,MAAM,OAAO,CAAC;AAEhD,OAAO,KAAK,EAAE,WAAW,IAAI,eAAe,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAGvF,MAAM,MAAM,cAAc,GAAG;IAC3B,yCAAyC;IACzC,EAAE,EAAE,MAAM,CAAC;IACX,kCAAkC;IAClC,IAAI,EAAE,MAAM,CAAC;IACb,2CAA2C;IAC3C,KAAK,EAAE,MAAM,CAAC;IACd,wBAAwB;IACxB,MAAM,EAAE,MAAM,CAAC;IACf,0EAA0E;IAC1E,MAAM,EAAE,QAAQ,GAAG,SAAS,CAAC;CAC9B,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG;IACnC,oCAAoC;IACpC,KAAK,EAAE,MAAM,CAAC;IACd,iCAAiC;IACjC,IAAI,CAAC,EAAE,EAAE,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAClC,yCAAyC;IACzC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qBAAqB;IACrB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAEF;;;GAGG;AACH,MAAM,MAAM,cAAc,GAAG;IAC3B,0CAA0C;IAC1C,OAAO,EAAE,cAAc,CAAC;IACxB,uEAAuE;IACvE,SAAS,CAAC,EAAE,sBAAsB,EAAE,CAAC;IACrC,gDAAgD;IAChD,eAAe,CAAC,EAAE,sBAAsB,EAAE,CAAC;CAC5C,CAAC;AAsCF,eAAO,MAAM,cAAc,GAAI,2DAK5B,eAAe,GAAG;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,sBAAsB,EAAE,CAAC;IACrC,eAAe,CAAC,EAAE,sBAAsB,EAAE,CAAC;CAC5C,gCAoBA,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,oFAO5B;IACD,gBAAgB,CAAC,EAAE,SAAS,CAAC;IAC7B,8BAA8B;IAC9B,OAAO,EAAE,cAAc,CAAC;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,uEAAuE;IACvE,SAAS,CAAC,EAAE,sBAAsB,EAAE,CAAC;IACrC,gDAAgD;IAChD,eAAe,CAAC,EAAE,sBAAsB,EAAE,CAAC;IAC3C;;;;;OAKG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAC;CAC7B,gCAiDA,CAAC"}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
2
|
import { ChevronSelectorVertical } from '@flipdish/ui-icons';
|
|
3
|
-
import { Avatar } from '@flipdish/ui-library/components/atoms/Avatar';
|
|
4
|
-
import { AvatarLabelGroup } from '@flipdish/ui-library/components/atoms/Avatar/components/avatar-label-group';
|
|
3
|
+
import { Avatar, AvatarLabelGroup } from '@flipdish/ui-library/components/atoms/Avatar';
|
|
5
4
|
import { useBreakpoint } from '@flipdish/ui-library/hooks/useBreakpoints';
|
|
6
5
|
import { cx } from '@flipdish/ui-library/utilities/cx';
|
|
7
6
|
import { useRef } from 'react';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nav-account-card.js","sources":["../../../../../src/components/organisms/SidebarNavigation/components/nav-account-card.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs","AriaDialog","AriaDialogTrigger","AriaButton","AriaPopover"],"mappings":"
|
|
1
|
+
{"version":3,"file":"nav-account-card.js","sources":["../../../../../src/components/organisms/SidebarNavigation/components/nav-account-card.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs","AriaDialog","AriaDialogTrigger","AriaButton","AriaPopover"],"mappings":"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"}
|
|
@@ -5,9 +5,12 @@ var Tooltip = require('@flipdish/ui-library/components/atoms/Tooltip');
|
|
|
5
5
|
var cx = require('@flipdish/ui-library/utilities/cx');
|
|
6
6
|
var reactAriaComponents = require('react-aria-components');
|
|
7
7
|
|
|
8
|
-
const NavButton = ({ current, label, href, icon: Icon, className, tooltipPlacement = 'right', onClick, children, 'aria-expanded': ariaExpanded, 'aria-controls': ariaControls, }) => {
|
|
8
|
+
const NavButton = ({ current, selected, label, href, icon: Icon, className, tooltipPlacement = 'right', onClick, children, 'aria-expanded': ariaExpanded, 'aria-controls': ariaControls, }) => {
|
|
9
9
|
const iconOnly = !children;
|
|
10
|
-
|
|
10
|
+
// `current` means "this is the current page" (→ aria-current); `selected` is the
|
|
11
|
+
// brand-highlight state (open/selected section), which may differ from the page.
|
|
12
|
+
const isSelected = selected ?? current;
|
|
13
|
+
return (jsxRuntime.jsx(Tooltip.Tooltip, { isDisabled: !label, title: label, placement: tooltipPlacement, children: jsxRuntime.jsxs(reactAriaComponents.Link, { href: href, "aria-label": label, "aria-current": current ? 'page' : undefined, "aria-expanded": ariaExpanded, "aria-controls": ariaControls, onClick: onClick, className: cx.cx('group/item relative flex w-full cursor-pointer items-center justify-center gap-1 rounded-md bg-transparent outline-focus-ring transition duration-100 ease-linear select-none hover:bg-secondary_hover focus-visible:z-10 focus-visible:outline-2 focus-visible:outline-offset-2', isSelected && 'bg-brand-primary hover:bg-brand-primary', iconOnly ? 'size-9' : 'px-2 py-1.5', className), children: [Icon && (jsxRuntime.jsx(Icon, { "aria-hidden": "true", className: cx.cx('size-5 shrink-0 text-fg-quaternary transition-inherit-all group-hover/item:text-fg-quaternary_hover', isSelected && 'text-fg-brand-primary group-hover/item:text-fg-brand-primary') })), children && (jsxRuntime.jsx("span", { className: cx.cx('px-0.5 text-sm font-semibold transition duration-100 ease-linear group-hover/item:text-secondary_hover', isSelected && 'text-brand-secondary'), children: children }))] }) }));
|
|
11
14
|
};
|
|
12
15
|
|
|
13
16
|
exports.NavButton = NavButton;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nav-button.cjs","sources":["../../../../../src/components/organisms/SidebarNavigation/components/nav-button.tsx"],"sourcesContent":[null],"names":["_jsx","Tooltip","
|
|
1
|
+
{"version":3,"file":"nav-button.cjs","sources":["../../../../../src/components/organisms/SidebarNavigation/components/nav-button.tsx"],"sourcesContent":[null],"names":["_jsx","Tooltip","_jsxs","AriaLink","cx"],"mappings":";;;;;;;AAkCO,MAAM,SAAS,GAAG,CAAC,EACxB,OAAO,EACP,QAAQ,EACR,KAAK,EACL,IAAI,EACJ,IAAI,EAAE,IAAI,EACV,SAAS,EACT,gBAAgB,GAAG,OAAO,EAC1B,OAAO,EACP,QAAQ,EACR,eAAe,EAAE,YAAY,EAC7B,eAAe,EAAE,YAAY,GACd,KAAI;AACnB,IAAA,MAAM,QAAQ,GAAG,CAAC,QAAQ;;;AAG1B,IAAA,MAAM,UAAU,GAAG,QAAQ,IAAI,OAAO;IAEtC,QACEA,cAAA,CAACC,eAAO,EAAA,EAAC,UAAU,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,gBAAgB,EAAA,QAAA,EACpEC,eAAA,CAACC,wBAAQ,IACP,IAAI,EAAE,IAAI,EAAA,YAAA,EACE,KAAK,EAAA,cAAA,EACH,OAAO,GAAG,MAAM,GAAG,SAAS,EAAA,eAAA,EAC3B,YAAY,EAAA,eAAA,EACZ,YAAY,EAC3B,OAAO,EAAE,OAAO,EAChB,SAAS,EAAEC,KAAE,CACX,kRAAkR,EAClR,UAAU,IAAI,yCAAyC,EACvD,QAAQ,GAAG,QAAQ,GAAG,aAAa,EACnC,SAAS,CACV,EAAA,QAAA,EAAA,CAEA,IAAI,KACHJ,cAAA,CAAC,IAAI,EAAA,EAAA,aAAA,EACS,MAAM,EAClB,SAAS,EAAEI,KAAE,CACX,qGAAqG,EACrG,UAAU,IAAI,8DAA8D,CAC7E,EAAA,CACD,CACH,EAEA,QAAQ,KACPJ,cAAA,CAAA,MAAA,EAAA,EACE,SAAS,EAAEI,KAAE,CACX,wGAAwG,EACxG,UAAU,IAAI,sBAAsB,CACrC,EAAA,QAAA,EAEA,QAAQ,EAAA,CACJ,CACR,CAAA,EAAA,CACQ,EAAA,CACH;AAEd;;;;"}
|
|
@@ -10,8 +10,10 @@ interface NavButtonProps {
|
|
|
10
10
|
icon?: FC<{
|
|
11
11
|
className?: string;
|
|
12
12
|
}>;
|
|
13
|
-
/** Whether the button is
|
|
13
|
+
/** Whether the button is the current page — drives `aria-current="page"`. */
|
|
14
14
|
current?: boolean;
|
|
15
|
+
/** Whether the item is the selected/open section — drives brand styling without implying it is the current page. Defaults to `current`. */
|
|
16
|
+
selected?: boolean;
|
|
15
17
|
/** Handler for click events. */
|
|
16
18
|
onClick?: MouseEventHandler;
|
|
17
19
|
/** Additional CSS classes to apply to the button. */
|
|
@@ -25,6 +27,6 @@ interface NavButtonProps {
|
|
|
25
27
|
/** Content to display. */
|
|
26
28
|
children?: ReactNode;
|
|
27
29
|
}
|
|
28
|
-
export declare const NavButton: ({ current, label, href, icon: Icon, className, tooltipPlacement, onClick, children, "aria-expanded": ariaExpanded, "aria-controls": ariaControls, }: NavButtonProps) => import("react").JSX.Element;
|
|
30
|
+
export declare const NavButton: ({ current, selected, label, href, icon: Icon, className, tooltipPlacement, onClick, children, "aria-expanded": ariaExpanded, "aria-controls": ariaControls, }: NavButtonProps) => import("react").JSX.Element;
|
|
29
31
|
export {};
|
|
30
32
|
//# sourceMappingURL=nav-button.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nav-button.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/SidebarNavigation/components/nav-button.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,EAAE,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAG9D,UAAU,cAAc;IACtB,gDAAgD;IAChD,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,qDAAqD;IACrD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,iCAAiC;IACjC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iCAAiC;IACjC,IAAI,CAAC,EAAE,EAAE,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAClC,
|
|
1
|
+
{"version":3,"file":"nav-button.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/SidebarNavigation/components/nav-button.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,EAAE,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAG9D,UAAU,cAAc;IACtB,gDAAgD;IAChD,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,qDAAqD;IACrD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,iCAAiC;IACjC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iCAAiC;IACjC,IAAI,CAAC,EAAE,EAAE,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAClC,6EAA6E;IAC7E,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,2IAA2I;IAC3I,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,gCAAgC;IAChC,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,qDAAqD;IACrD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gCAAgC;IAChC,gBAAgB,CAAC,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IACvD,0FAA0F;IAC1F,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,kFAAkF;IAClF,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,0BAA0B;IAC1B,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,eAAO,MAAM,SAAS,GAAI,+JAYvB,cAAc,gCA6ChB,CAAC"}
|
|
@@ -1,11 +1,14 @@
|
|
|
1
1
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
2
|
import { Tooltip } from '@flipdish/ui-library/components/atoms/Tooltip';
|
|
3
3
|
import { cx } from '@flipdish/ui-library/utilities/cx';
|
|
4
|
-
import {
|
|
4
|
+
import { Link } from 'react-aria-components';
|
|
5
5
|
|
|
6
|
-
const NavButton = ({ current, label, href, icon: Icon, className, tooltipPlacement = 'right', onClick, children, 'aria-expanded': ariaExpanded, 'aria-controls': ariaControls, }) => {
|
|
6
|
+
const NavButton = ({ current, selected, label, href, icon: Icon, className, tooltipPlacement = 'right', onClick, children, 'aria-expanded': ariaExpanded, 'aria-controls': ariaControls, }) => {
|
|
7
7
|
const iconOnly = !children;
|
|
8
|
-
|
|
8
|
+
// `current` means "this is the current page" (→ aria-current); `selected` is the
|
|
9
|
+
// brand-highlight state (open/selected section), which may differ from the page.
|
|
10
|
+
const isSelected = selected ?? current;
|
|
11
|
+
return (jsx(Tooltip, { isDisabled: !label, title: label, placement: tooltipPlacement, children: jsxs(Link, { href: href, "aria-label": label, "aria-current": current ? 'page' : undefined, "aria-expanded": ariaExpanded, "aria-controls": ariaControls, onClick: onClick, className: cx('group/item relative flex w-full cursor-pointer items-center justify-center gap-1 rounded-md bg-transparent outline-focus-ring transition duration-100 ease-linear select-none hover:bg-secondary_hover focus-visible:z-10 focus-visible:outline-2 focus-visible:outline-offset-2', isSelected && 'bg-brand-primary hover:bg-brand-primary', iconOnly ? 'size-9' : 'px-2 py-1.5', className), children: [Icon && (jsx(Icon, { "aria-hidden": "true", className: cx('size-5 shrink-0 text-fg-quaternary transition-inherit-all group-hover/item:text-fg-quaternary_hover', isSelected && 'text-fg-brand-primary group-hover/item:text-fg-brand-primary') })), children && (jsx("span", { className: cx('px-0.5 text-sm font-semibold transition duration-100 ease-linear group-hover/item:text-secondary_hover', isSelected && 'text-brand-secondary'), children: children }))] }) }));
|
|
9
12
|
};
|
|
10
13
|
|
|
11
14
|
export { NavButton };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nav-button.js","sources":["../../../../../src/components/organisms/SidebarNavigation/components/nav-button.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs"],"mappings":";;;;;
|
|
1
|
+
{"version":3,"file":"nav-button.js","sources":["../../../../../src/components/organisms/SidebarNavigation/components/nav-button.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs","AriaLink"],"mappings":";;;;;AAkCO,MAAM,SAAS,GAAG,CAAC,EACxB,OAAO,EACP,QAAQ,EACR,KAAK,EACL,IAAI,EACJ,IAAI,EAAE,IAAI,EACV,SAAS,EACT,gBAAgB,GAAG,OAAO,EAC1B,OAAO,EACP,QAAQ,EACR,eAAe,EAAE,YAAY,EAC7B,eAAe,EAAE,YAAY,GACd,KAAI;AACnB,IAAA,MAAM,QAAQ,GAAG,CAAC,QAAQ;;;AAG1B,IAAA,MAAM,UAAU,GAAG,QAAQ,IAAI,OAAO;IAEtC,QACEA,GAAA,CAAC,OAAO,EAAA,EAAC,UAAU,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,gBAAgB,EAAA,QAAA,EACpEC,IAAA,CAACC,IAAQ,IACP,IAAI,EAAE,IAAI,EAAA,YAAA,EACE,KAAK,EAAA,cAAA,EACH,OAAO,GAAG,MAAM,GAAG,SAAS,EAAA,eAAA,EAC3B,YAAY,EAAA,eAAA,EACZ,YAAY,EAC3B,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,EAAE,CACX,kRAAkR,EAClR,UAAU,IAAI,yCAAyC,EACvD,QAAQ,GAAG,QAAQ,GAAG,aAAa,EACnC,SAAS,CACV,EAAA,QAAA,EAAA,CAEA,IAAI,KACHF,GAAA,CAAC,IAAI,EAAA,EAAA,aAAA,EACS,MAAM,EAClB,SAAS,EAAE,EAAE,CACX,qGAAqG,EACrG,UAAU,IAAI,8DAA8D,CAC7E,EAAA,CACD,CACH,EAEA,QAAQ,KACPA,GAAA,CAAA,MAAA,EAAA,EACE,SAAS,EAAE,EAAE,CACX,wGAAwG,EACxG,UAAU,IAAI,sBAAsB,CACrC,EAAA,QAAA,EAEA,QAAQ,EAAA,CACJ,CACR,CAAA,EAAA,CACQ,EAAA,CACH;AAEd;;;;"}
|
|
@@ -16,21 +16,26 @@ const styles = cx.sortCx({
|
|
|
16
16
|
rootSelected: 'bg-brand-primary hover:bg-brand-primary',
|
|
17
17
|
});
|
|
18
18
|
const StatusDot = ({ status }) => (jsxRuntime.jsx("span", { "aria-hidden": "true", className: cx.cx('mr-2 size-2 shrink-0 rounded-full', status === 'online' ? 'bg-success-solid' : 'bg-fg-quaternary') }));
|
|
19
|
-
const NavItemBase = ({ current, type, badge, href, icon: Icon, children, truncate = true, status, onClick, 'aria-expanded': ariaExpanded, 'aria-controls': ariaControls, }) => {
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
const
|
|
19
|
+
const NavItemBase = ({ current, selected, type, badge, href, icon: Icon, children, truncate = true, status, onClick, hasSubmenu, 'aria-expanded': ariaExpanded, 'aria-controls': ariaControls, }) => {
|
|
20
|
+
// `current` means "this is the current page" (→ aria-current); `selected` is the
|
|
21
|
+
// brand-highlight state (open/selected section), which may differ from the page.
|
|
22
|
+
const isSelected = selected ?? current;
|
|
23
|
+
const iconElement = Icon && (jsxRuntime.jsx(Icon, { "aria-hidden": "true", className: cx.cx('mr-2 size-5 shrink-0 text-fg-quaternary transition-inherit-all group-hover/item:text-fg-quaternary_hover', isSelected && 'text-fg-brand-primary group-hover/item:text-fg-brand-primary') }));
|
|
24
|
+
const badgeElement = badge && (typeof badge === 'string' || typeof badge === 'number') ? (jsxRuntime.jsx(Badge.Badge, { className: "ml-3", color: isSelected ? 'brand' : 'gray', type: "pill-color", size: "sm", children: badge })) : (badge);
|
|
25
|
+
const labelElement = (jsxRuntime.jsx("span", { className: cx.cx('flex-1 text-sm font-semibold text-secondary transition-inherit-all group-hover/item:text-secondary_hover', truncate && 'truncate', isSelected && 'text-brand-secondary group-hover/item:text-brand-secondary'), children: children }));
|
|
23
26
|
const isExternal = href?.startsWith('http');
|
|
24
27
|
const externalIcon = isExternal && jsxRuntime.jsx(uiIcons.Share04, { className: "size-4 stroke-[2.5px] text-fg-quaternary" });
|
|
28
|
+
// A trailing chevron on a section parent signals it has a revealable sub-navigation tier.
|
|
29
|
+
const submenuChevron = hasSubmenu && (jsxRuntime.jsx(uiIcons.ChevronRight, { "aria-hidden": "true", className: cx.cx('ml-3 size-4 shrink-0 stroke-[2.5px] text-fg-quaternary', isSelected && 'text-fg-brand-primary') }));
|
|
25
30
|
if (type === 'collapsible') {
|
|
26
31
|
return (
|
|
27
32
|
// biome-ignore lint/a11y/noStaticElementInteractions: This is a summary element
|
|
28
|
-
jsxRuntime.jsxs("summary", { className: cx.cx('p-2', styles.root,
|
|
33
|
+
jsxRuntime.jsxs("summary", { className: cx.cx('p-2', styles.root, isSelected && styles.rootSelected), onClick: onClick, children: [status && jsxRuntime.jsx(StatusDot, { status: status }), iconElement, labelElement, badgeElement, jsxRuntime.jsx(uiIcons.ChevronDown, { "aria-hidden": "true", className: "ml-3 size-4 shrink-0 stroke-[2.5px] text-fg-quaternary in-open:-scale-y-100" })] }));
|
|
29
34
|
}
|
|
30
35
|
if (type === 'collapsible-child') {
|
|
31
|
-
return (jsxRuntime.jsxs(reactAriaComponents.Link, { href: href, target: isExternal ? '_blank' : '_self', rel: "noopener noreferrer", className: cx.cx('py-2 pr-3 pl-10', styles.root,
|
|
36
|
+
return (jsxRuntime.jsxs(reactAriaComponents.Link, { href: href, target: isExternal ? '_blank' : '_self', rel: "noopener noreferrer", className: cx.cx('py-2 pr-3 pl-10', styles.root, isSelected && styles.rootSelected), onClick: onClick, "aria-current": current ? 'page' : undefined, children: [labelElement, externalIcon, badgeElement] }));
|
|
32
37
|
}
|
|
33
|
-
return (jsxRuntime.jsxs(reactAriaComponents.Link, { href: href, target: isExternal ? '_blank' : '_self', rel: "noopener noreferrer", className: cx.cx('group/item p-2', styles.root,
|
|
38
|
+
return (jsxRuntime.jsxs(reactAriaComponents.Link, { href: href, target: isExternal ? '_blank' : '_self', rel: "noopener noreferrer", className: cx.cx('group/item p-2', styles.root, isSelected && styles.rootSelected), onClick: onClick, "aria-current": current ? 'page' : undefined, "aria-expanded": ariaExpanded, "aria-controls": ariaControls, children: [status && jsxRuntime.jsx(StatusDot, { status: status }), iconElement, labelElement, externalIcon, badgeElement, submenuChevron] }));
|
|
34
39
|
};
|
|
35
40
|
|
|
36
41
|
exports.NavItemBase = NavItemBase;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nav-item.cjs","sources":["../../../../../src/components/organisms/SidebarNavigation/components/nav-item.tsx"],"sourcesContent":[null],"names":["sortCx","_jsx","cx","Badge","Share04","_jsxs","ChevronDown","AriaLink"],"mappings":";;;;;;;;AAQA;;;;AAIG;AACH,MAAM,MAAM,GAAGA,SAAM,CAAC;AACpB,IAAA,IAAI,EAAE,qQAAqQ;AAC3Q,IAAA,YAAY,EAAE,yCAAyC;AACxD,CAAA,CAAC;
|
|
1
|
+
{"version":3,"file":"nav-item.cjs","sources":["../../../../../src/components/organisms/SidebarNavigation/components/nav-item.tsx"],"sourcesContent":[null],"names":["sortCx","_jsx","cx","Badge","Share04","ChevronRight","_jsxs","ChevronDown","AriaLink"],"mappings":"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"}
|
|
@@ -12,14 +12,18 @@ interface NavItemBaseProps {
|
|
|
12
12
|
icon?: FC<HTMLAttributes<HTMLOrSVGElement>>;
|
|
13
13
|
/** Badge to display. */
|
|
14
14
|
badge?: ReactNode;
|
|
15
|
-
/** Whether the nav item is
|
|
15
|
+
/** Whether the nav item is the current page — drives `aria-current="page"`. */
|
|
16
16
|
current?: boolean;
|
|
17
|
+
/** Whether the item is the selected/open section — drives brand styling without implying it is the current page. Defaults to `current`. */
|
|
18
|
+
selected?: boolean;
|
|
17
19
|
/** Whether to truncate the label text. */
|
|
18
20
|
truncate?: boolean;
|
|
19
21
|
/** Optional leading status dot rendered before the icon. */
|
|
20
22
|
status?: NavItemStatus;
|
|
21
23
|
/** Handler for click events. */
|
|
22
24
|
onClick?: MouseEventHandler;
|
|
25
|
+
/** Whether this item is a section parent — renders a trailing chevron signalling a revealable sub-navigation tier. */
|
|
26
|
+
hasSubmenu?: boolean;
|
|
23
27
|
/** Disclosure state when the item triggers a revealed region (e.g. a sub-nav panel). */
|
|
24
28
|
'aria-expanded'?: boolean;
|
|
25
29
|
/** ID of the region this item controls when it acts as a disclosure trigger. */
|
|
@@ -27,6 +31,6 @@ interface NavItemBaseProps {
|
|
|
27
31
|
/** Content to display. */
|
|
28
32
|
children?: ReactNode;
|
|
29
33
|
}
|
|
30
|
-
export declare const NavItemBase: ({ current, type, badge, href, icon: Icon, children, truncate, status, onClick, "aria-expanded": ariaExpanded, "aria-controls": ariaControls, }: NavItemBaseProps) => import("react").JSX.Element;
|
|
34
|
+
export declare const NavItemBase: ({ current, selected, type, badge, href, icon: Icon, children, truncate, status, onClick, hasSubmenu, "aria-expanded": ariaExpanded, "aria-controls": ariaControls, }: NavItemBaseProps) => import("react").JSX.Element;
|
|
31
35
|
export {};
|
|
32
36
|
//# sourceMappingURL=nav-item.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nav-item.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/SidebarNavigation/components/nav-item.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,EAAE,EAAE,cAAc,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAa9E,kEAAkE;AAClE,MAAM,MAAM,aAAa,GAAG,QAAQ,GAAG,SAAS,CAAC;AAEjD,UAAU,gBAAgB;IACxB,gDAAgD;IAChD,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,uDAAuD;IACvD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,4BAA4B;IAC5B,IAAI,EAAE,MAAM,GAAG,aAAa,GAAG,mBAAmB,CAAC;IACnD,iCAAiC;IACjC,IAAI,CAAC,EAAE,EAAE,CAAC,cAAc,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAC5C,wBAAwB;IACxB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB
|
|
1
|
+
{"version":3,"file":"nav-item.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/SidebarNavigation/components/nav-item.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,EAAE,EAAE,cAAc,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAa9E,kEAAkE;AAClE,MAAM,MAAM,aAAa,GAAG,QAAQ,GAAG,SAAS,CAAC;AAEjD,UAAU,gBAAgB;IACxB,gDAAgD;IAChD,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,uDAAuD;IACvD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,4BAA4B;IAC5B,IAAI,EAAE,MAAM,GAAG,aAAa,GAAG,mBAAmB,CAAC;IACnD,iCAAiC;IACjC,IAAI,CAAC,EAAE,EAAE,CAAC,cAAc,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAC5C,wBAAwB;IACxB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,+EAA+E;IAC/E,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,2IAA2I;IAC3I,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,0CAA0C;IAC1C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,4DAA4D;IAC5D,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB,gCAAgC;IAChC,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,sHAAsH;IACtH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,wFAAwF;IACxF,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,gFAAgF;IAChF,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,0BAA0B;IAC1B,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAMD,eAAO,MAAM,WAAW,GAAI,sKAczB,gBAAgB,gCAgGlB,CAAC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
-
import { Share04, ChevronDown } from '@flipdish/ui-icons';
|
|
2
|
+
import { Share04, ChevronRight, ChevronDown } from '@flipdish/ui-icons';
|
|
3
3
|
import { Badge } from '@flipdish/ui-library/components/atoms/Badge';
|
|
4
4
|
import { sortCx, cx } from '@flipdish/ui-library/utilities/cx';
|
|
5
5
|
import { Link } from 'react-aria-components';
|
|
@@ -14,21 +14,26 @@ const styles = sortCx({
|
|
|
14
14
|
rootSelected: 'bg-brand-primary hover:bg-brand-primary',
|
|
15
15
|
});
|
|
16
16
|
const StatusDot = ({ status }) => (jsx("span", { "aria-hidden": "true", className: cx('mr-2 size-2 shrink-0 rounded-full', status === 'online' ? 'bg-success-solid' : 'bg-fg-quaternary') }));
|
|
17
|
-
const NavItemBase = ({ current, type, badge, href, icon: Icon, children, truncate = true, status, onClick, 'aria-expanded': ariaExpanded, 'aria-controls': ariaControls, }) => {
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
const
|
|
17
|
+
const NavItemBase = ({ current, selected, type, badge, href, icon: Icon, children, truncate = true, status, onClick, hasSubmenu, 'aria-expanded': ariaExpanded, 'aria-controls': ariaControls, }) => {
|
|
18
|
+
// `current` means "this is the current page" (→ aria-current); `selected` is the
|
|
19
|
+
// brand-highlight state (open/selected section), which may differ from the page.
|
|
20
|
+
const isSelected = selected ?? current;
|
|
21
|
+
const iconElement = Icon && (jsx(Icon, { "aria-hidden": "true", className: cx('mr-2 size-5 shrink-0 text-fg-quaternary transition-inherit-all group-hover/item:text-fg-quaternary_hover', isSelected && 'text-fg-brand-primary group-hover/item:text-fg-brand-primary') }));
|
|
22
|
+
const badgeElement = badge && (typeof badge === 'string' || typeof badge === 'number') ? (jsx(Badge, { className: "ml-3", color: isSelected ? 'brand' : 'gray', type: "pill-color", size: "sm", children: badge })) : (badge);
|
|
23
|
+
const labelElement = (jsx("span", { className: cx('flex-1 text-sm font-semibold text-secondary transition-inherit-all group-hover/item:text-secondary_hover', truncate && 'truncate', isSelected && 'text-brand-secondary group-hover/item:text-brand-secondary'), children: children }));
|
|
21
24
|
const isExternal = href?.startsWith('http');
|
|
22
25
|
const externalIcon = isExternal && jsx(Share04, { className: "size-4 stroke-[2.5px] text-fg-quaternary" });
|
|
26
|
+
// A trailing chevron on a section parent signals it has a revealable sub-navigation tier.
|
|
27
|
+
const submenuChevron = hasSubmenu && (jsx(ChevronRight, { "aria-hidden": "true", className: cx('ml-3 size-4 shrink-0 stroke-[2.5px] text-fg-quaternary', isSelected && 'text-fg-brand-primary') }));
|
|
23
28
|
if (type === 'collapsible') {
|
|
24
29
|
return (
|
|
25
30
|
// biome-ignore lint/a11y/noStaticElementInteractions: This is a summary element
|
|
26
|
-
jsxs("summary", { className: cx('p-2', styles.root,
|
|
31
|
+
jsxs("summary", { className: cx('p-2', styles.root, isSelected && styles.rootSelected), onClick: onClick, children: [status && jsx(StatusDot, { status: status }), iconElement, labelElement, badgeElement, jsx(ChevronDown, { "aria-hidden": "true", className: "ml-3 size-4 shrink-0 stroke-[2.5px] text-fg-quaternary in-open:-scale-y-100" })] }));
|
|
27
32
|
}
|
|
28
33
|
if (type === 'collapsible-child') {
|
|
29
|
-
return (jsxs(Link, { href: href, target: isExternal ? '_blank' : '_self', rel: "noopener noreferrer", className: cx('py-2 pr-3 pl-10', styles.root,
|
|
34
|
+
return (jsxs(Link, { href: href, target: isExternal ? '_blank' : '_self', rel: "noopener noreferrer", className: cx('py-2 pr-3 pl-10', styles.root, isSelected && styles.rootSelected), onClick: onClick, "aria-current": current ? 'page' : undefined, children: [labelElement, externalIcon, badgeElement] }));
|
|
30
35
|
}
|
|
31
|
-
return (jsxs(Link, { href: href, target: isExternal ? '_blank' : '_self', rel: "noopener noreferrer", className: cx('group/item p-2', styles.root,
|
|
36
|
+
return (jsxs(Link, { href: href, target: isExternal ? '_blank' : '_self', rel: "noopener noreferrer", className: cx('group/item p-2', styles.root, isSelected && styles.rootSelected), onClick: onClick, "aria-current": current ? 'page' : undefined, "aria-expanded": ariaExpanded, "aria-controls": ariaControls, children: [status && jsx(StatusDot, { status: status }), iconElement, labelElement, externalIcon, badgeElement, submenuChevron] }));
|
|
32
37
|
};
|
|
33
38
|
|
|
34
39
|
export { NavItemBase };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nav-item.js","sources":["../../../../../src/components/organisms/SidebarNavigation/components/nav-item.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs","AriaLink"],"mappings":";;;;;;AAQA;;;;AAIG;AACH,MAAM,MAAM,GAAG,MAAM,CAAC;AACpB,IAAA,IAAI,EAAE,qQAAqQ;AAC3Q,IAAA,YAAY,EAAE,yCAAyC;AACxD,CAAA,CAAC;
|
|
1
|
+
{"version":3,"file":"nav-item.js","sources":["../../../../../src/components/organisms/SidebarNavigation/components/nav-item.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs","AriaLink"],"mappings":"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"}
|
|
@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
|
4
4
|
var cx = require('@flipdish/ui-library/utilities/cx');
|
|
5
5
|
var navItem = require('./nav-item.cjs');
|
|
6
6
|
|
|
7
|
-
const NavList = ({ activeUrl, items, className }) => {
|
|
7
|
+
const NavList = ({ activeUrl, items, className, onNavigate }) => {
|
|
8
8
|
const activeItem = items.find((item) => item.href === activeUrl || item.items?.some((subItem) => subItem.href === activeUrl));
|
|
9
9
|
return (jsxRuntime.jsx("ul", { className: cx.cx('flex flex-col px-4 pt-5', className), children: items.map((item, index) => {
|
|
10
10
|
if (item.divider) {
|
|
@@ -13,9 +13,9 @@ const NavList = ({ activeUrl, items, className }) => {
|
|
|
13
13
|
jsxRuntime.jsx("li", { className: "w-full px-0.5 py-2", children: jsxRuntime.jsx("hr", { className: "h-px w-full border-none bg-border-secondary" }) }, index));
|
|
14
14
|
}
|
|
15
15
|
if (item.items?.length) {
|
|
16
|
-
return (jsxRuntime.jsxs("details", { open: activeItem?.href === item.href, className: "appearance-none py-0.25", children: [jsxRuntime.jsx(navItem.NavItemBase, { href: item.href, badge: item.badge, icon: item.icon, type: "collapsible", children: item.label }), jsxRuntime.jsx("dd", { children: jsxRuntime.jsx("ul", { className: "pb-1", children: item.items.map((childItem) => (jsxRuntime.jsx("li", { className: "py-0.25", children: jsxRuntime.jsx(navItem.NavItemBase, { href: childItem.href, badge: childItem.badge, type: "collapsible-child", current: activeUrl === childItem.href, children: childItem.label }) }, childItem.label))) }) })] }, item.label));
|
|
16
|
+
return (jsxRuntime.jsxs("details", { open: activeItem?.href === item.href, className: "appearance-none py-0.25", children: [jsxRuntime.jsx(navItem.NavItemBase, { href: item.href, badge: item.badge, icon: item.icon, type: "collapsible", children: item.label }), jsxRuntime.jsx("dd", { children: jsxRuntime.jsx("ul", { className: "pb-1", children: item.items.map((childItem) => (jsxRuntime.jsx("li", { className: "py-0.25", children: jsxRuntime.jsx(navItem.NavItemBase, { href: childItem.href, badge: childItem.badge, type: "collapsible-child", current: activeUrl === childItem.href, onClick: onNavigate, children: childItem.label }) }, childItem.label))) }) })] }, item.label));
|
|
17
17
|
}
|
|
18
|
-
return (jsxRuntime.jsx("li", { className: "py-px", children: jsxRuntime.jsx(navItem.NavItemBase, { type: "link", badge: item.badge, icon: item.icon, href: item.href, current: activeUrl === item.href, children: item.label }) }, item.label));
|
|
18
|
+
return (jsxRuntime.jsx("li", { className: "py-px", children: jsxRuntime.jsx(navItem.NavItemBase, { type: "link", badge: item.badge, icon: item.icon, href: item.href, current: activeUrl === item.href, onClick: onNavigate, children: item.label }) }, item.label));
|
|
19
19
|
}) }));
|
|
20
20
|
};
|
|
21
21
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nav-list.cjs","sources":["../../../../../src/components/organisms/SidebarNavigation/components/nav-list.tsx"],"sourcesContent":[null],"names":["_jsx","cx","_jsxs","NavItemBase"],"mappings":";;;;;;
|
|
1
|
+
{"version":3,"file":"nav-list.cjs","sources":["../../../../../src/components/organisms/SidebarNavigation/components/nav-list.tsx"],"sourcesContent":[null],"names":["_jsx","cx","_jsxs","NavItemBase"],"mappings":";;;;;;AAiBO,MAAM,OAAO,GAAG,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE,UAAU,EAAgB,KAAI;AACnF,IAAA,MAAM,UAAU,GAAG,KAAK,CAAC,IAAI,CAC3B,CAAC,IAAI,KAAK,IAAI,CAAC,IAAI,KAAK,SAAS,IAAI,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC,OAAqC,KAAK,OAAO,CAAC,IAAI,KAAK,SAAS,CAAC,CAC7H;IAED,QACEA,uBAAI,SAAS,EAAEC,KAAE,CAAC,yBAAyB,EAAE,SAAS,CAAC,YACpD,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,KAAI;AACzB,YAAA,IAAI,IAAI,CAAC,OAAO,EAAE;gBAChB;;AAEE,gBAAAD,cAAA,CAAA,IAAA,EAAA,EAAgB,SAAS,EAAC,oBAAoB,EAAA,QAAA,EAC5CA,cAAA,CAAA,IAAA,EAAA,EAAI,SAAS,EAAC,6CAA6C,EAAA,CAAG,EAAA,EADvD,KAAK,CAET;YAET;AAEA,YAAA,IAAI,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE;gBACtB,QACEE,eAAA,CAAA,SAAA,EAAA,EAA0B,IAAI,EAAE,UAAU,EAAE,IAAI,KAAK,IAAI,CAAC,IAAI,EAAE,SAAS,EAAC,yBAAyB,EAAA,QAAA,EAAA,CACjGF,cAAA,CAACG,mBAAW,EAAA,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAC,aAAa,EAAA,QAAA,EACjF,IAAI,CAAC,KAAK,EAAA,CACC,EAEdH,cAAA,CAAA,IAAA,EAAA,EAAA,QAAA,EACEA,cAAA,CAAA,IAAA,EAAA,EAAI,SAAS,EAAC,MAAM,EAAA,QAAA,EACjB,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,SAAsB,MACrCA,cAAA,CAAA,IAAA,EAAA,EAA0B,SAAS,EAAC,SAAS,EAAA,QAAA,EAC3CA,cAAA,CAACG,mBAAW,EAAA,EACV,IAAI,EAAE,SAAS,CAAC,IAAI,EACpB,KAAK,EAAE,SAAS,CAAC,KAAK,EACtB,IAAI,EAAC,mBAAmB,EACxB,OAAO,EAAE,SAAS,KAAK,SAAS,CAAC,IAAI,EACrC,OAAO,EAAE,UAAU,EAAA,QAAA,EAElB,SAAS,CAAC,KAAK,EAAA,CACJ,EAAA,EATP,SAAS,CAAC,KAAK,CAUnB,CACN,CAAC,EAAA,CACC,EAAA,CACF,CAAA,EAAA,EArBO,IAAI,CAAC,KAAK,CAsBd;YAEd;YAEA,QACEH,cAAA,CAAA,IAAA,EAAA,EAAqB,SAAS,EAAC,OAAO,YACpCA,cAAA,CAACG,mBAAW,EAAA,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,SAAS,KAAK,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,UAAU,EAAA,QAAA,EAChI,IAAI,CAAC,KAAK,EAAA,CACC,EAAA,EAHP,IAAI,CAAC,KAAK,CAId;QAET,CAAC,CAAC,EAAA,CACC;AAET;;;;"}
|
|
@@ -6,7 +6,9 @@ interface NavListProps {
|
|
|
6
6
|
className?: string;
|
|
7
7
|
/** List of items to display. */
|
|
8
8
|
items: (NavItemType | NavItemDividerType)[];
|
|
9
|
+
/** Called when a destination link is activated — used to close the mobile drawer on navigation. */
|
|
10
|
+
onNavigate?: () => void;
|
|
9
11
|
}
|
|
10
|
-
export declare const NavList: ({ activeUrl, items, className }: NavListProps) => import("react").JSX.Element;
|
|
12
|
+
export declare const NavList: ({ activeUrl, items, className, onNavigate }: NavListProps) => import("react").JSX.Element;
|
|
11
13
|
export {};
|
|
12
14
|
//# sourceMappingURL=nav-list.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nav-list.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/SidebarNavigation/components/nav-list.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,kBAAkB,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAGlF,UAAU,YAAY;IACpB,wCAAwC;IACxC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mDAAmD;IACnD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gCAAgC;IAChC,KAAK,EAAE,CAAC,WAAW,GAAG,kBAAkB,CAAC,EAAE,CAAC;
|
|
1
|
+
{"version":3,"file":"nav-list.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/SidebarNavigation/components/nav-list.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,kBAAkB,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAGlF,UAAU,YAAY;IACpB,wCAAwC;IACxC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mDAAmD;IACnD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gCAAgC;IAChC,KAAK,EAAE,CAAC,WAAW,GAAG,kBAAkB,CAAC,EAAE,CAAC;IAC5C,mGAAmG;IACnG,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAED,eAAO,MAAM,OAAO,GAAI,6CAA6C,YAAY,gCAuDhF,CAAC"}
|
|
@@ -2,7 +2,7 @@ import { jsx, jsxs } from 'react/jsx-runtime';
|
|
|
2
2
|
import { cx } from '@flipdish/ui-library/utilities/cx';
|
|
3
3
|
import { NavItemBase } from './nav-item.js';
|
|
4
4
|
|
|
5
|
-
const NavList = ({ activeUrl, items, className }) => {
|
|
5
|
+
const NavList = ({ activeUrl, items, className, onNavigate }) => {
|
|
6
6
|
const activeItem = items.find((item) => item.href === activeUrl || item.items?.some((subItem) => subItem.href === activeUrl));
|
|
7
7
|
return (jsx("ul", { className: cx('flex flex-col px-4 pt-5', className), children: items.map((item, index) => {
|
|
8
8
|
if (item.divider) {
|
|
@@ -11,9 +11,9 @@ const NavList = ({ activeUrl, items, className }) => {
|
|
|
11
11
|
jsx("li", { className: "w-full px-0.5 py-2", children: jsx("hr", { className: "h-px w-full border-none bg-border-secondary" }) }, index));
|
|
12
12
|
}
|
|
13
13
|
if (item.items?.length) {
|
|
14
|
-
return (jsxs("details", { open: activeItem?.href === item.href, className: "appearance-none py-0.25", children: [jsx(NavItemBase, { href: item.href, badge: item.badge, icon: item.icon, type: "collapsible", children: item.label }), jsx("dd", { children: jsx("ul", { className: "pb-1", children: item.items.map((childItem) => (jsx("li", { className: "py-0.25", children: jsx(NavItemBase, { href: childItem.href, badge: childItem.badge, type: "collapsible-child", current: activeUrl === childItem.href, children: childItem.label }) }, childItem.label))) }) })] }, item.label));
|
|
14
|
+
return (jsxs("details", { open: activeItem?.href === item.href, className: "appearance-none py-0.25", children: [jsx(NavItemBase, { href: item.href, badge: item.badge, icon: item.icon, type: "collapsible", children: item.label }), jsx("dd", { children: jsx("ul", { className: "pb-1", children: item.items.map((childItem) => (jsx("li", { className: "py-0.25", children: jsx(NavItemBase, { href: childItem.href, badge: childItem.badge, type: "collapsible-child", current: activeUrl === childItem.href, onClick: onNavigate, children: childItem.label }) }, childItem.label))) }) })] }, item.label));
|
|
15
15
|
}
|
|
16
|
-
return (jsx("li", { className: "py-px", children: jsx(NavItemBase, { type: "link", badge: item.badge, icon: item.icon, href: item.href, current: activeUrl === item.href, children: item.label }) }, item.label));
|
|
16
|
+
return (jsx("li", { className: "py-px", children: jsx(NavItemBase, { type: "link", badge: item.badge, icon: item.icon, href: item.href, current: activeUrl === item.href, onClick: onNavigate, children: item.label }) }, item.label));
|
|
17
17
|
}) }));
|
|
18
18
|
};
|
|
19
19
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nav-list.js","sources":["../../../../../src/components/organisms/SidebarNavigation/components/nav-list.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs"],"mappings":";;;;
|
|
1
|
+
{"version":3,"file":"nav-list.js","sources":["../../../../../src/components/organisms/SidebarNavigation/components/nav-list.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs"],"mappings":";;;;AAiBO,MAAM,OAAO,GAAG,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE,UAAU,EAAgB,KAAI;AACnF,IAAA,MAAM,UAAU,GAAG,KAAK,CAAC,IAAI,CAC3B,CAAC,IAAI,KAAK,IAAI,CAAC,IAAI,KAAK,SAAS,IAAI,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC,OAAqC,KAAK,OAAO,CAAC,IAAI,KAAK,SAAS,CAAC,CAC7H;IAED,QACEA,YAAI,SAAS,EAAE,EAAE,CAAC,yBAAyB,EAAE,SAAS,CAAC,YACpD,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,KAAI;AACzB,YAAA,IAAI,IAAI,CAAC,OAAO,EAAE;gBAChB;;AAEE,gBAAAA,GAAA,CAAA,IAAA,EAAA,EAAgB,SAAS,EAAC,oBAAoB,EAAA,QAAA,EAC5CA,GAAA,CAAA,IAAA,EAAA,EAAI,SAAS,EAAC,6CAA6C,EAAA,CAAG,EAAA,EADvD,KAAK,CAET;YAET;AAEA,YAAA,IAAI,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE;gBACtB,QACEC,IAAA,CAAA,SAAA,EAAA,EAA0B,IAAI,EAAE,UAAU,EAAE,IAAI,KAAK,IAAI,CAAC,IAAI,EAAE,SAAS,EAAC,yBAAyB,EAAA,QAAA,EAAA,CACjGD,GAAA,CAAC,WAAW,EAAA,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAC,aAAa,EAAA,QAAA,EACjF,IAAI,CAAC,KAAK,EAAA,CACC,EAEdA,GAAA,CAAA,IAAA,EAAA,EAAA,QAAA,EACEA,GAAA,CAAA,IAAA,EAAA,EAAI,SAAS,EAAC,MAAM,EAAA,QAAA,EACjB,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,SAAsB,MACrCA,GAAA,CAAA,IAAA,EAAA,EAA0B,SAAS,EAAC,SAAS,EAAA,QAAA,EAC3CA,GAAA,CAAC,WAAW,EAAA,EACV,IAAI,EAAE,SAAS,CAAC,IAAI,EACpB,KAAK,EAAE,SAAS,CAAC,KAAK,EACtB,IAAI,EAAC,mBAAmB,EACxB,OAAO,EAAE,SAAS,KAAK,SAAS,CAAC,IAAI,EACrC,OAAO,EAAE,UAAU,EAAA,QAAA,EAElB,SAAS,CAAC,KAAK,EAAA,CACJ,EAAA,EATP,SAAS,CAAC,KAAK,CAUnB,CACN,CAAC,EAAA,CACC,EAAA,CACF,CAAA,EAAA,EArBO,IAAI,CAAC,KAAK,CAsBd;YAEd;YAEA,QACEA,GAAA,CAAA,IAAA,EAAA,EAAqB,SAAS,EAAC,OAAO,YACpCA,GAAA,CAAC,WAAW,EAAA,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,SAAS,KAAK,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,UAAU,EAAA,QAAA,EAChI,IAAI,CAAC,KAAK,EAAA,CACC,EAAA,EAHP,IAAI,CAAC,KAAK,CAId;QAET,CAAC,CAAC,EAAA,CACC;AAET;;;;"}
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var React = require('react');
|
|
4
|
+
|
|
5
|
+
/**
|
|
6
|
+
* Keyboard access to the dual-tier sub-navigation. The panel is otherwise reachable
|
|
7
|
+
* only by hover or by tabbing past every primary item, so `ArrowRight` on a parent
|
|
8
|
+
* jumps focus straight into its panel and `ArrowLeft`/`Escape` returns focus to the
|
|
9
|
+
* parent that opened it.
|
|
10
|
+
*/
|
|
11
|
+
const useDualTierKeyboard = ({ isPanelVisible, currentLabel, onSelectSection, onReveal }) => {
|
|
12
|
+
const panelRef = React.useRef(null);
|
|
13
|
+
// The primary item that opened the panel, so ArrowLeft/Escape can restore focus.
|
|
14
|
+
const triggerRef = React.useRef(null);
|
|
15
|
+
// Set when a keyboard action should move focus into the panel once it renders.
|
|
16
|
+
const focusPanelOnOpen = React.useRef(false);
|
|
17
|
+
const focusFirstPanelItem = () => panelRef.current?.querySelector('a, button')?.focus();
|
|
18
|
+
// Move focus into the panel once it has rendered (or swapped section) after a
|
|
19
|
+
// keyboard-triggered open.
|
|
20
|
+
// biome-ignore lint/correctness/useExhaustiveDependencies: focusFirstPanelItem only reads the stable panelRef
|
|
21
|
+
React.useEffect(() => {
|
|
22
|
+
if (isPanelVisible && focusPanelOnOpen.current) {
|
|
23
|
+
focusPanelOnOpen.current = false;
|
|
24
|
+
focusFirstPanelItem();
|
|
25
|
+
}
|
|
26
|
+
}, [isPanelVisible, currentLabel]);
|
|
27
|
+
/**
|
|
28
|
+
* `ArrowRight` on a parent selects its section, reveals the panel, and moves focus
|
|
29
|
+
* into it — or focuses it immediately when it is already the open section.
|
|
30
|
+
*/
|
|
31
|
+
const handleTriggerKeyDown = (label, hasChildren) => (event) => {
|
|
32
|
+
if (event.key !== 'ArrowRight' || !hasChildren)
|
|
33
|
+
return;
|
|
34
|
+
event.preventDefault();
|
|
35
|
+
triggerRef.current = event.currentTarget.querySelector('a, button');
|
|
36
|
+
if (isPanelVisible && currentLabel === label) {
|
|
37
|
+
focusFirstPanelItem();
|
|
38
|
+
}
|
|
39
|
+
else {
|
|
40
|
+
focusPanelOnOpen.current = true;
|
|
41
|
+
onSelectSection(label);
|
|
42
|
+
onReveal();
|
|
43
|
+
}
|
|
44
|
+
};
|
|
45
|
+
/** `ArrowLeft`/`Escape` inside the panel returns focus to the parent that opened it. */
|
|
46
|
+
const handlePanelKeyDown = (event) => {
|
|
47
|
+
if (event.key !== 'ArrowLeft' && event.key !== 'Escape')
|
|
48
|
+
return;
|
|
49
|
+
event.preventDefault();
|
|
50
|
+
triggerRef.current?.focus();
|
|
51
|
+
};
|
|
52
|
+
return { panelRef, handleTriggerKeyDown, handlePanelKeyDown };
|
|
53
|
+
};
|
|
54
|
+
|
|
55
|
+
exports.useDualTierKeyboard = useDualTierKeyboard;
|
|
56
|
+
//# sourceMappingURL=use-dual-tier-keyboard.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-dual-tier-keyboard.cjs","sources":["../../../../../src/components/organisms/SidebarNavigation/hooks/use-dual-tier-keyboard.ts"],"sourcesContent":[null],"names":["useRef","useEffect"],"mappings":";;;;AAgBA;;;;;AAKG;AACI,MAAM,mBAAmB,GAAG,CAAC,EAAE,cAAc,EAAE,YAAY,EAAE,eAAe,EAAE,QAAQ,EAA2B,KAAI;AAC1H,IAAA,MAAM,QAAQ,GAAGA,YAAM,CAAiB,IAAI,CAAC;;AAE7C,IAAA,MAAM,UAAU,GAAGA,YAAM,CAAqB,IAAI,CAAC;;AAEnD,IAAA,MAAM,gBAAgB,GAAGA,YAAM,CAAC,KAAK,CAAC;AAEtC,IAAA,MAAM,mBAAmB,GAAG,MAAM,QAAQ,CAAC,OAAO,EAAE,aAAa,CAAc,WAAW,CAAC,EAAE,KAAK,EAAE;;;;IAKpGC,eAAS,CAAC,MAAK;AACb,QAAA,IAAI,cAAc,IAAI,gBAAgB,CAAC,OAAO,EAAE;AAC9C,YAAA,gBAAgB,CAAC,OAAO,GAAG,KAAK;AAChC,YAAA,mBAAmB,EAAE;QACvB;AACF,IAAA,CAAC,EAAE,CAAC,cAAc,EAAE,YAAY,CAAC,CAAC;AAElC;;;AAGG;AACH,IAAA,MAAM,oBAAoB,GAAG,CAAC,KAAa,EAAE,WAAoB,KAAK,CAAC,KAAmC,KAAI;AAC5G,QAAA,IAAI,KAAK,CAAC,GAAG,KAAK,YAAY,IAAI,CAAC,WAAW;YAAE;QAChD,KAAK,CAAC,cAAc,EAAE;QACtB,UAAU,CAAC,OAAO,GAAG,KAAK,CAAC,aAAa,CAAC,aAAa,CAAc,WAAW,CAAC;AAChF,QAAA,IAAI,cAAc,IAAI,YAAY,KAAK,KAAK,EAAE;AAC5C,YAAA,mBAAmB,EAAE;QACvB;aAAO;AACL,YAAA,gBAAgB,CAAC,OAAO,GAAG,IAAI;YAC/B,eAAe,CAAC,KAAK,CAAC;AACtB,YAAA,QAAQ,EAAE;QACZ;AACF,IAAA,CAAC;;AAGD,IAAA,MAAM,kBAAkB,GAAG,CAAC,KAAoC,KAAI;QAClE,IAAI,KAAK,CAAC,GAAG,KAAK,WAAW,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ;YAAE;QACzD,KAAK,CAAC,cAAc,EAAE;AACtB,QAAA,UAAU,CAAC,OAAO,EAAE,KAAK,EAAE;AAC7B,IAAA,CAAC;AAED,IAAA,OAAO,EAAE,QAAQ,EAAE,oBAAoB,EAAE,kBAAkB,EAAE;AAC/D;;;;"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import type { KeyboardEvent } from 'react';
|
|
2
|
+
interface DualTierKeyboardOptions {
|
|
3
|
+
/** Whether the secondary sub-navigation panel is currently visible. */
|
|
4
|
+
isPanelVisible: boolean;
|
|
5
|
+
/** Label of the section whose children the panel currently shows. */
|
|
6
|
+
currentLabel: string | undefined;
|
|
7
|
+
/** Select a section as the current one (which reveals its children in the panel). */
|
|
8
|
+
onSelectSection: (label: string) => void;
|
|
9
|
+
/** Mark the panel as revealed because focus has moved within the sidebar. */
|
|
10
|
+
onReveal: () => void;
|
|
11
|
+
}
|
|
12
|
+
/**
|
|
13
|
+
* Keyboard access to the dual-tier sub-navigation. The panel is otherwise reachable
|
|
14
|
+
* only by hover or by tabbing past every primary item, so `ArrowRight` on a parent
|
|
15
|
+
* jumps focus straight into its panel and `ArrowLeft`/`Escape` returns focus to the
|
|
16
|
+
* parent that opened it.
|
|
17
|
+
*/
|
|
18
|
+
export declare const useDualTierKeyboard: ({ isPanelVisible, currentLabel, onSelectSection, onReveal }: DualTierKeyboardOptions) => {
|
|
19
|
+
panelRef: import("react").RefObject<HTMLDivElement | null>;
|
|
20
|
+
handleTriggerKeyDown: (label: string, hasChildren: boolean) => (event: KeyboardEvent<HTMLLIElement>) => void;
|
|
21
|
+
handlePanelKeyDown: (event: KeyboardEvent<HTMLDivElement>) => void;
|
|
22
|
+
};
|
|
23
|
+
export {};
|
|
24
|
+
//# sourceMappingURL=use-dual-tier-keyboard.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-dual-tier-keyboard.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/SidebarNavigation/hooks/use-dual-tier-keyboard.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAG3C,UAAU,uBAAuB;IAC/B,uEAAuE;IACvE,cAAc,EAAE,OAAO,CAAC;IACxB,qEAAqE;IACrE,YAAY,EAAE,MAAM,GAAG,SAAS,CAAC;IACjC,qFAAqF;IACrF,eAAe,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,6EAA6E;IAC7E,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB;AAED;;;;;GAKG;AACH,eAAO,MAAM,mBAAmB,GAAI,6DAA6D,uBAAuB;;kCAuBjF,MAAM,eAAe,OAAO,MAAM,OAAO,aAAa,CAAC,aAAa,CAAC;gCAcvE,aAAa,CAAC,cAAc,CAAC;CAOjE,CAAC"}
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
import { useRef, useEffect } from 'react';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Keyboard access to the dual-tier sub-navigation. The panel is otherwise reachable
|
|
5
|
+
* only by hover or by tabbing past every primary item, so `ArrowRight` on a parent
|
|
6
|
+
* jumps focus straight into its panel and `ArrowLeft`/`Escape` returns focus to the
|
|
7
|
+
* parent that opened it.
|
|
8
|
+
*/
|
|
9
|
+
const useDualTierKeyboard = ({ isPanelVisible, currentLabel, onSelectSection, onReveal }) => {
|
|
10
|
+
const panelRef = useRef(null);
|
|
11
|
+
// The primary item that opened the panel, so ArrowLeft/Escape can restore focus.
|
|
12
|
+
const triggerRef = useRef(null);
|
|
13
|
+
// Set when a keyboard action should move focus into the panel once it renders.
|
|
14
|
+
const focusPanelOnOpen = useRef(false);
|
|
15
|
+
const focusFirstPanelItem = () => panelRef.current?.querySelector('a, button')?.focus();
|
|
16
|
+
// Move focus into the panel once it has rendered (or swapped section) after a
|
|
17
|
+
// keyboard-triggered open.
|
|
18
|
+
// biome-ignore lint/correctness/useExhaustiveDependencies: focusFirstPanelItem only reads the stable panelRef
|
|
19
|
+
useEffect(() => {
|
|
20
|
+
if (isPanelVisible && focusPanelOnOpen.current) {
|
|
21
|
+
focusPanelOnOpen.current = false;
|
|
22
|
+
focusFirstPanelItem();
|
|
23
|
+
}
|
|
24
|
+
}, [isPanelVisible, currentLabel]);
|
|
25
|
+
/**
|
|
26
|
+
* `ArrowRight` on a parent selects its section, reveals the panel, and moves focus
|
|
27
|
+
* into it — or focuses it immediately when it is already the open section.
|
|
28
|
+
*/
|
|
29
|
+
const handleTriggerKeyDown = (label, hasChildren) => (event) => {
|
|
30
|
+
if (event.key !== 'ArrowRight' || !hasChildren)
|
|
31
|
+
return;
|
|
32
|
+
event.preventDefault();
|
|
33
|
+
triggerRef.current = event.currentTarget.querySelector('a, button');
|
|
34
|
+
if (isPanelVisible && currentLabel === label) {
|
|
35
|
+
focusFirstPanelItem();
|
|
36
|
+
}
|
|
37
|
+
else {
|
|
38
|
+
focusPanelOnOpen.current = true;
|
|
39
|
+
onSelectSection(label);
|
|
40
|
+
onReveal();
|
|
41
|
+
}
|
|
42
|
+
};
|
|
43
|
+
/** `ArrowLeft`/`Escape` inside the panel returns focus to the parent that opened it. */
|
|
44
|
+
const handlePanelKeyDown = (event) => {
|
|
45
|
+
if (event.key !== 'ArrowLeft' && event.key !== 'Escape')
|
|
46
|
+
return;
|
|
47
|
+
event.preventDefault();
|
|
48
|
+
triggerRef.current?.focus();
|
|
49
|
+
};
|
|
50
|
+
return { panelRef, handleTriggerKeyDown, handlePanelKeyDown };
|
|
51
|
+
};
|
|
52
|
+
|
|
53
|
+
export { useDualTierKeyboard };
|
|
54
|
+
//# sourceMappingURL=use-dual-tier-keyboard.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-dual-tier-keyboard.js","sources":["../../../../../src/components/organisms/SidebarNavigation/hooks/use-dual-tier-keyboard.ts"],"sourcesContent":[null],"names":[],"mappings":";;AAgBA;;;;;AAKG;AACI,MAAM,mBAAmB,GAAG,CAAC,EAAE,cAAc,EAAE,YAAY,EAAE,eAAe,EAAE,QAAQ,EAA2B,KAAI;AAC1H,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAiB,IAAI,CAAC;;AAE7C,IAAA,MAAM,UAAU,GAAG,MAAM,CAAqB,IAAI,CAAC;;AAEnD,IAAA,MAAM,gBAAgB,GAAG,MAAM,CAAC,KAAK,CAAC;AAEtC,IAAA,MAAM,mBAAmB,GAAG,MAAM,QAAQ,CAAC,OAAO,EAAE,aAAa,CAAc,WAAW,CAAC,EAAE,KAAK,EAAE;;;;IAKpG,SAAS,CAAC,MAAK;AACb,QAAA,IAAI,cAAc,IAAI,gBAAgB,CAAC,OAAO,EAAE;AAC9C,YAAA,gBAAgB,CAAC,OAAO,GAAG,KAAK;AAChC,YAAA,mBAAmB,EAAE;QACvB;AACF,IAAA,CAAC,EAAE,CAAC,cAAc,EAAE,YAAY,CAAC,CAAC;AAElC;;;AAGG;AACH,IAAA,MAAM,oBAAoB,GAAG,CAAC,KAAa,EAAE,WAAoB,KAAK,CAAC,KAAmC,KAAI;AAC5G,QAAA,IAAI,KAAK,CAAC,GAAG,KAAK,YAAY,IAAI,CAAC,WAAW;YAAE;QAChD,KAAK,CAAC,cAAc,EAAE;QACtB,UAAU,CAAC,OAAO,GAAG,KAAK,CAAC,aAAa,CAAC,aAAa,CAAc,WAAW,CAAC;AAChF,QAAA,IAAI,cAAc,IAAI,YAAY,KAAK,KAAK,EAAE;AAC5C,YAAA,mBAAmB,EAAE;QACvB;aAAO;AACL,YAAA,gBAAgB,CAAC,OAAO,GAAG,IAAI;YAC/B,eAAe,CAAC,KAAK,CAAC;AACtB,YAAA,QAAQ,EAAE;QACZ;AACF,IAAA,CAAC;;AAGD,IAAA,MAAM,kBAAkB,GAAG,CAAC,KAAoC,KAAI;QAClE,IAAI,KAAK,CAAC,GAAG,KAAK,WAAW,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ;YAAE;QACzD,KAAK,CAAC,cAAc,EAAE;AACtB,QAAA,UAAU,CAAC,OAAO,EAAE,KAAK,EAAE;AAC7B,IAAA,CAAC;AAED,IAAA,OAAO,EAAE,QAAQ,EAAE,oBAAoB,EAAE,kBAAkB,EAAE;AAC/D;;;;"}
|