@fluentui/react-menu-grid-preview 0.1.1 → 0.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +37 -2
- package/lib/components/MenuGrid/MenuGrid.js +1 -0
- package/lib/components/MenuGrid/MenuGrid.js.map +1 -1
- package/lib/components/MenuGrid/useMenuGrid.js +8 -4
- package/lib/components/MenuGrid/useMenuGrid.js.map +1 -1
- package/lib/components/MenuGrid/useMenuGridContextValues.js +1 -0
- package/lib/components/MenuGrid/useMenuGridContextValues.js.map +1 -1
- package/lib/components/MenuGrid/useMenuGridStyles.styles.js +2 -0
- package/lib/components/MenuGrid/useMenuGridStyles.styles.js.map +1 -1
- package/lib/components/MenuGrid/useMenuGridStyles.styles.raw.js +1 -0
- package/lib/components/MenuGrid/useMenuGridStyles.styles.raw.js.map +1 -1
- package/lib/components/MenuGridCell/MenuGridCell.js +1 -0
- package/lib/components/MenuGridCell/MenuGridCell.js.map +1 -1
- package/lib/components/MenuGridCell/useMenuGridCell.js +17 -3
- package/lib/components/MenuGridCell/useMenuGridCell.js.map +1 -1
- package/lib/components/MenuGridCell/useMenuGridCellStyles.styles.js +2 -0
- package/lib/components/MenuGridCell/useMenuGridCellStyles.styles.js.map +1 -1
- package/lib/components/MenuGridCell/useMenuGridCellStyles.styles.raw.js +1 -0
- package/lib/components/MenuGridCell/useMenuGridCellStyles.styles.raw.js.map +1 -1
- package/lib/components/MenuGridGroup/MenuGridGroup.js +1 -0
- package/lib/components/MenuGridGroup/MenuGridGroup.js.map +1 -1
- package/lib/components/MenuGridGroup/useMenuGridGroupContextValues.js +1 -0
- package/lib/components/MenuGridGroup/useMenuGridGroupContextValues.js.map +1 -1
- package/lib/components/MenuGridGroupHeader/MenuGridGroupHeader.js +1 -0
- package/lib/components/MenuGridGroupHeader/MenuGridGroupHeader.js.map +1 -1
- package/lib/components/MenuGridGroupHeader/useMenuGridGroupHeader.js +1 -0
- package/lib/components/MenuGridGroupHeader/useMenuGridGroupHeader.js.map +1 -1
- package/lib/components/MenuGridItem/MenuGridItem.js +1 -0
- package/lib/components/MenuGridItem/MenuGridItem.js.map +1 -1
- package/lib/components/MenuGridItem/useMenuGridItem.js +5 -2
- package/lib/components/MenuGridItem/useMenuGridItem.js.map +1 -1
- package/lib/components/MenuGridRow/MenuGridRow.js +1 -0
- package/lib/components/MenuGridRow/MenuGridRow.js.map +1 -1
- package/lib/components/MenuGridRow/useMenuGridRow.js +5 -2
- package/lib/components/MenuGridRow/useMenuGridRow.js.map +1 -1
- package/lib/contexts/menuGridContext.js +1 -0
- package/lib/contexts/menuGridContext.js.map +1 -1
- package/lib/contexts/menuGridGroupContext.js +1 -0
- package/lib/contexts/menuGridGroupContext.js.map +1 -1
- package/lib/utils/index.js +1 -0
- package/lib/utils/index.js.map +1 -0
- package/lib/utils/useValidateNesting.js +91 -0
- package/lib/utils/useValidateNesting.js.map +1 -0
- package/lib-commonjs/components/MenuGrid/MenuGrid.js +1 -0
- package/lib-commonjs/components/MenuGrid/MenuGrid.js.map +1 -1
- package/lib-commonjs/components/MenuGrid/useMenuGrid.js +7 -3
- package/lib-commonjs/components/MenuGrid/useMenuGrid.js.map +1 -1
- package/lib-commonjs/components/MenuGrid/useMenuGridContextValues.js +1 -0
- package/lib-commonjs/components/MenuGrid/useMenuGridContextValues.js.map +1 -1
- package/lib-commonjs/components/MenuGrid/useMenuGridStyles.styles.js +1 -0
- package/lib-commonjs/components/MenuGrid/useMenuGridStyles.styles.js.map +1 -1
- package/lib-commonjs/components/MenuGrid/useMenuGridStyles.styles.raw.js +1 -0
- package/lib-commonjs/components/MenuGrid/useMenuGridStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/MenuGridCell/MenuGridCell.js +1 -0
- package/lib-commonjs/components/MenuGridCell/MenuGridCell.js.map +1 -1
- package/lib-commonjs/components/MenuGridCell/useMenuGridCell.js +16 -2
- package/lib-commonjs/components/MenuGridCell/useMenuGridCell.js.map +1 -1
- package/lib-commonjs/components/MenuGridCell/useMenuGridCellStyles.styles.js +1 -0
- package/lib-commonjs/components/MenuGridCell/useMenuGridCellStyles.styles.js.map +1 -1
- package/lib-commonjs/components/MenuGridCell/useMenuGridCellStyles.styles.raw.js +1 -0
- package/lib-commonjs/components/MenuGridCell/useMenuGridCellStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/MenuGridGroup/MenuGridGroup.js +1 -0
- package/lib-commonjs/components/MenuGridGroup/MenuGridGroup.js.map +1 -1
- package/lib-commonjs/components/MenuGridGroup/useMenuGridGroupContextValues.js +1 -0
- package/lib-commonjs/components/MenuGridGroup/useMenuGridGroupContextValues.js.map +1 -1
- package/lib-commonjs/components/MenuGridGroupHeader/MenuGridGroupHeader.js +1 -0
- package/lib-commonjs/components/MenuGridGroupHeader/MenuGridGroupHeader.js.map +1 -1
- package/lib-commonjs/components/MenuGridGroupHeader/useMenuGridGroupHeader.js +1 -0
- package/lib-commonjs/components/MenuGridGroupHeader/useMenuGridGroupHeader.js.map +1 -1
- package/lib-commonjs/components/MenuGridItem/MenuGridItem.js +1 -0
- package/lib-commonjs/components/MenuGridItem/MenuGridItem.js.map +1 -1
- package/lib-commonjs/components/MenuGridItem/useMenuGridItem.js +4 -1
- package/lib-commonjs/components/MenuGridItem/useMenuGridItem.js.map +1 -1
- package/lib-commonjs/components/MenuGridRow/MenuGridRow.js +1 -0
- package/lib-commonjs/components/MenuGridRow/MenuGridRow.js.map +1 -1
- package/lib-commonjs/components/MenuGridRow/useMenuGridRow.js +4 -1
- package/lib-commonjs/components/MenuGridRow/useMenuGridRow.js.map +1 -1
- package/lib-commonjs/contexts/menuGridContext.js +1 -0
- package/lib-commonjs/contexts/menuGridContext.js.map +1 -1
- package/lib-commonjs/contexts/menuGridGroupContext.js +1 -0
- package/lib-commonjs/contexts/menuGridGroupContext.js.map +1 -1
- package/lib-commonjs/utils/index.js +11 -0
- package/lib-commonjs/utils/index.js.map +1 -0
- package/lib-commonjs/utils/useValidateNesting.js +102 -0
- package/lib-commonjs/utils/useValidateNesting.js.map +1 -0
- package/package.json +8 -7
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,47 @@
|
|
|
1
1
|
# Change Log - @fluentui/react-menu-grid-preview
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
This log was last generated on Wed, 08 Oct 2025 12:00:20 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## [0.2.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-menu-grid-preview_v0.2.1)
|
|
8
|
+
|
|
9
|
+
Wed, 08 Oct 2025 12:00:20 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-menu-grid-preview_v0.2.0..@fluentui/react-menu-grid-preview_v0.2.1)
|
|
11
|
+
|
|
12
|
+
### Patches
|
|
13
|
+
|
|
14
|
+
- Bump @fluentui/react-menu to v9.20.1 ([PR #35294](https://github.com/microsoft/fluentui/pull/35294) by beachball)
|
|
15
|
+
- Bump @fluentui/react-table to v9.19.1 ([PR #35294](https://github.com/microsoft/fluentui/pull/35294) by beachball)
|
|
16
|
+
- Bump @fluentui/react-tabster to v9.26.7 ([PR #35294](https://github.com/microsoft/fluentui/pull/35294) by beachball)
|
|
17
|
+
- Bump @fluentui/react-jsx-runtime to v9.2.2 ([PR #35294](https://github.com/microsoft/fluentui/pull/35294) by beachball)
|
|
18
|
+
- Bump @fluentui/react-utilities to v9.25.1 ([PR #35294](https://github.com/microsoft/fluentui/pull/35294) by beachball)
|
|
19
|
+
|
|
20
|
+
## [0.2.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-menu-grid-preview_v0.2.0)
|
|
21
|
+
|
|
22
|
+
Thu, 02 Oct 2025 15:12:24 GMT
|
|
23
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-menu-grid-preview_v0.1.1..@fluentui/react-menu-grid-preview_v0.2.0)
|
|
24
|
+
|
|
25
|
+
### Minor changes
|
|
26
|
+
|
|
27
|
+
- Feat(react-menu-grid-preview): Detect invalid MenuGrid nesting ([PR #35128](https://github.com/microsoft/fluentui/pull/35128) by lingfangao@hotmail.com)
|
|
28
|
+
- Bump @fluentui/react-menu to v9.20.0 ([PR #35133](https://github.com/microsoft/fluentui/pull/35133) by beachball)
|
|
29
|
+
- Bump @fluentui/react-table to v9.19.0 ([PR #35133](https://github.com/microsoft/fluentui/pull/35133) by beachball)
|
|
30
|
+
- Bump @fluentui/react-tabster to v9.26.6 ([PR #35133](https://github.com/microsoft/fluentui/pull/35133) by beachball)
|
|
31
|
+
- Bump @fluentui/react-jsx-runtime to v9.2.1 ([PR #35133](https://github.com/microsoft/fluentui/pull/35133) by beachball)
|
|
32
|
+
- Bump @fluentui/react-shared-contexts to v9.25.2 ([PR #35133](https://github.com/microsoft/fluentui/pull/35133) by beachball)
|
|
33
|
+
- Bump @fluentui/react-utilities to v9.25.0 ([PR #35133](https://github.com/microsoft/fluentui/pull/35133) by beachball)
|
|
34
|
+
|
|
35
|
+
### Patches
|
|
36
|
+
|
|
37
|
+
- Allow navigation in MenuGrid submenu of MenuList ([PR #35223](https://github.com/microsoft/fluentui/pull/35223) by adam.samec@gmail.com)
|
|
38
|
+
- Merge onKeyDown handlers for MenuGrid component ([PR #35216](https://github.com/microsoft/fluentui/pull/35216) by adam.samec@gmail.com)
|
|
39
|
+
- feat: enforce usage of use client directive for files with client-only features ([PR #35173](https://github.com/microsoft/fluentui/pull/35173) by dmytrokirpa@microsoft.com)
|
|
40
|
+
- fix: useValidateNesting ref type React 19 issue ([PR #35221](https://github.com/microsoft/fluentui/pull/35221) by dmytrokirpa@microsoft.com)
|
|
41
|
+
|
|
7
42
|
## [0.1.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-menu-grid-preview_v0.1.1)
|
|
8
43
|
|
|
9
|
-
Mon, 08 Sep 2025 12:
|
|
44
|
+
Mon, 08 Sep 2025 12:51:06 GMT
|
|
10
45
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-menu-grid-preview_v0.1.0..@fluentui/react-menu-grid-preview_v0.1.1)
|
|
11
46
|
|
|
12
47
|
### Patches
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/MenuGrid/MenuGrid.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"sources":["../src/components/MenuGrid/MenuGrid.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useMenuGrid_unstable } from './useMenuGrid';\nimport { renderMenuGrid_unstable } from './renderMenuGrid';\nimport { useMenuGridContextValues_unstable } from './useMenuGridContextValues';\nimport { useMenuGridStyles_unstable } from './useMenuGridStyles.styles';\nimport type { MenuGridProps } from './MenuGrid.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n// import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Define a styled MenuGrid, using the `useMenuGrid_unstable` hook.\n */\nexport const MenuGrid: ForwardRefComponent<MenuGridProps> = React.forwardRef((props, ref) => {\n const state = useMenuGrid_unstable(props, ref);\n const contextValues = useMenuGridContextValues_unstable(state);\n\n useMenuGridStyles_unstable(state);\n\n // useCustomStyleHook_unstable('useMenuGridStyles_unstable')(state);\n\n return renderMenuGrid_unstable(state, contextValues);\n});\n\nMenuGrid.displayName = 'MenuGrid';\n"],"names":["React","useMenuGrid_unstable","renderMenuGrid_unstable","useMenuGridContextValues_unstable","useMenuGridStyles_unstable","MenuGrid","forwardRef","props","ref","state","contextValues","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,oBAAoB,QAAQ,gBAAgB;AACrD,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,iCAAiC,QAAQ,6BAA6B;AAC/E,SAASC,0BAA0B,QAAQ,6BAA6B;AAGxE,iFAAiF;AAEjF;;CAEC,GACD,OAAO,MAAMC,yBAA+CL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACnF,MAAMC,QAAQR,qBAAqBM,OAAOC;IAC1C,MAAME,gBAAgBP,kCAAkCM;IAExDL,2BAA2BK;IAE3B,oEAAoE;IAEpE,OAAOP,wBAAwBO,OAAOC;AACxC,GAAG;AAEHL,SAASM,WAAW,GAAG"}
|
|
@@ -1,23 +1,27 @@
|
|
|
1
|
+
'use client';
|
|
1
2
|
import * as React from 'react';
|
|
2
|
-
import { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';
|
|
3
|
+
import { useMergedRefs, useEventCallback, mergeCallbacks, getIntrinsicElementProps, slot } from '@fluentui/react-utilities';
|
|
3
4
|
import { useTableCompositeNavigation } from '@fluentui/react-table';
|
|
4
5
|
import { useMenuContext_unstable } from '@fluentui/react-menu';
|
|
6
|
+
import { useValidateNesting } from '../../utils/useValidateNesting';
|
|
5
7
|
/**
|
|
6
8
|
* Returns the props and state required to render the component
|
|
7
9
|
*/ export const useMenuGrid_unstable = (props, ref)=>{
|
|
10
|
+
const validateNestingRef = useValidateNesting('MenuGrid');
|
|
8
11
|
const triggerId = useMenuContext_unstable((context)=>context.triggerId);
|
|
9
12
|
const { tableRowTabsterAttribute, tableTabsterAttribute, onTableKeyDown } = useTableCompositeNavigation();
|
|
13
|
+
const onKeyDown = useEventCallback(mergeCallbacks(props.onKeyDown, onTableKeyDown));
|
|
10
14
|
return {
|
|
11
15
|
components: {
|
|
12
16
|
root: 'div'
|
|
13
17
|
},
|
|
14
18
|
root: slot.always(getIntrinsicElementProps('div', {
|
|
15
|
-
ref,
|
|
19
|
+
ref: useMergedRefs(ref, validateNestingRef),
|
|
16
20
|
role: 'grid',
|
|
17
21
|
'aria-labelledby': triggerId,
|
|
18
|
-
onKeyDown: onTableKeyDown,
|
|
19
22
|
...tableTabsterAttribute,
|
|
20
|
-
...props
|
|
23
|
+
...props,
|
|
24
|
+
onKeyDown
|
|
21
25
|
}), {
|
|
22
26
|
elementType: 'div'
|
|
23
27
|
}),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/MenuGrid/useMenuGrid.ts"],"sourcesContent":["
|
|
1
|
+
{"version":3,"sources":["../src/components/MenuGrid/useMenuGrid.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport {\n useMergedRefs,\n useEventCallback,\n mergeCallbacks,\n getIntrinsicElementProps,\n slot,\n} from '@fluentui/react-utilities';\n\nimport { useTableCompositeNavigation } from '@fluentui/react-table';\nimport type { MenuGridProps, MenuGridState } from './MenuGrid.types';\nimport { useMenuContext_unstable } from '@fluentui/react-menu';\nimport { useValidateNesting } from '../../utils/useValidateNesting';\n\n/**\n * Returns the props and state required to render the component\n */\nexport const useMenuGrid_unstable = (props: MenuGridProps, ref: React.Ref<HTMLDivElement>): MenuGridState => {\n const validateNestingRef = useValidateNesting('MenuGrid');\n const triggerId = useMenuContext_unstable(context => context.triggerId);\n const { tableRowTabsterAttribute, tableTabsterAttribute, onTableKeyDown } = useTableCompositeNavigation();\n const onKeyDown = useEventCallback(mergeCallbacks(props.onKeyDown, onTableKeyDown));\n\n return {\n components: {\n root: 'div',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref: useMergedRefs(ref, validateNestingRef),\n role: 'grid',\n 'aria-labelledby': triggerId,\n ...tableTabsterAttribute,\n ...props,\n onKeyDown,\n }),\n { elementType: 'div' },\n ),\n tableRowTabsterAttribute,\n };\n};\n"],"names":["React","useMergedRefs","useEventCallback","mergeCallbacks","getIntrinsicElementProps","slot","useTableCompositeNavigation","useMenuContext_unstable","useValidateNesting","useMenuGrid_unstable","props","ref","validateNestingRef","triggerId","context","tableRowTabsterAttribute","tableTabsterAttribute","onTableKeyDown","onKeyDown","components","root","always","role","elementType"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SACEC,aAAa,EACbC,gBAAgB,EAChBC,cAAc,EACdC,wBAAwB,EACxBC,IAAI,QACC,4BAA4B;AAEnC,SAASC,2BAA2B,QAAQ,wBAAwB;AAEpE,SAASC,uBAAuB,QAAQ,uBAAuB;AAC/D,SAASC,kBAAkB,QAAQ,iCAAiC;AAEpE;;CAEC,GACD,OAAO,MAAMC,uBAAuB,CAACC,OAAsBC;IACzD,MAAMC,qBAAqBJ,mBAAmB;IAC9C,MAAMK,YAAYN,wBAAwBO,CAAAA,UAAWA,QAAQD,SAAS;IACtE,MAAM,EAAEE,wBAAwB,EAAEC,qBAAqB,EAAEC,cAAc,EAAE,GAAGX;IAC5E,MAAMY,YAAYhB,iBAAiBC,eAAeO,MAAMQ,SAAS,EAAED;IAEnE,OAAO;QACLE,YAAY;YACVC,MAAM;QACR;QACAA,MAAMf,KAAKgB,MAAM,CACfjB,yBAAyB,OAAO;YAC9BO,KAAKV,cAAcU,KAAKC;YACxBU,MAAM;YACN,mBAAmBT;YACnB,GAAGG,qBAAqB;YACxB,GAAGN,KAAK;YACRQ;QACF,IACA;YAAEK,aAAa;QAAM;QAEvBR;IACF;AACF,EAAE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/MenuGrid/useMenuGridContextValues.ts"],"sourcesContent":["
|
|
1
|
+
{"version":3,"sources":["../src/components/MenuGrid/useMenuGridContextValues.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { MenuGridContextValues, MenuGridState } from './MenuGrid.types';\n\nexport function useMenuGridContextValues_unstable(state: MenuGridState): MenuGridContextValues {\n const { tableRowTabsterAttribute } = state;\n const menuGrid = React.useMemo(() => ({ tableRowTabsterAttribute }), [tableRowTabsterAttribute]);\n\n return { menuGrid };\n}\n"],"names":["React","useMenuGridContextValues_unstable","state","tableRowTabsterAttribute","menuGrid","useMemo"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAG/B,OAAO,SAASC,kCAAkCC,KAAoB;IACpE,MAAM,EAAEC,wBAAwB,EAAE,GAAGD;IACrC,MAAME,WAAWJ,MAAMK,OAAO,CAAC,IAAO,CAAA;YAAEF;QAAyB,CAAA,GAAI;QAACA;KAAyB;IAE/F,OAAO;QAAEC;IAAS;AACpB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["mergeClasses","__styles","menuGridClassNames","root","useStyles","mc9l5x","Beiy3e4","i8kkvl","Belr9w4","rmohyg","hasMenuContext","Bqenvij","d","p","useMenuGridStyles_unstable","state","styles","className"],"sources":["useMenuGridStyles.styles.js"],"sourcesContent":["
|
|
1
|
+
{"version":3,"names":["mergeClasses","__styles","menuGridClassNames","root","useStyles","mc9l5x","Beiy3e4","i8kkvl","Belr9w4","rmohyg","hasMenuContext","Bqenvij","d","p","useMenuGridStyles_unstable","state","styles","className"],"sources":["useMenuGridStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses, makeStyles } from '@griffel/react';\nexport const menuGridClassNames = {\n root: 'fui-MenuGrid'\n};\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'column',\n gap: '2px'\n },\n hasMenuContext: {\n height: '100%'\n }\n});\n/**\n * Apply styling to the Menu slots based on the state\n */ export const useMenuGridStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n state.root.className = mergeClasses(menuGridClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAASA,YAAY,EAAAC,QAAA,QAAoB,gBAAgB;AACzD,OAAO,MAAMC,kBAAkB,GAAG;EAC9BC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,gBAAGH,QAAA;EAAAE,IAAA;IAAAE,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,cAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;AAAA,CASjB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,0BAA0B,GAAIC,KAAK,IAAG;EACnD,aAAa;;EACb,MAAMC,MAAM,GAAGZ,SAAS,CAAC,CAAC;EAC1BW,KAAK,CAACZ,IAAI,CAACc,SAAS,GAAGjB,YAAY,CAACE,kBAAkB,CAACC,IAAI,EAAEa,MAAM,CAACb,IAAI,EAAEY,KAAK,CAACZ,IAAI,CAACc,SAAS,CAAC;EAC/F,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/MenuGrid/useMenuGridStyles.styles.ts"],"sourcesContent":["
|
|
1
|
+
{"version":3,"sources":["../src/components/MenuGrid/useMenuGridStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { mergeClasses, makeStyles } from '@griffel/react';\nimport type { MenuGridSlots, MenuGridState } from './MenuGrid.types';\n\nexport const menuGridClassNames: SlotClassNames<MenuGridSlots> = {\n root: 'fui-MenuGrid',\n};\n\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'column',\n gap: '2px',\n },\n hasMenuContext: {\n height: '100%',\n },\n});\n\n/**\n * Apply styling to the Menu slots based on the state\n */\nexport const useMenuGridStyles_unstable = (state: MenuGridState): MenuGridState => {\n 'use no memo';\n\n const styles = useStyles();\n state.root.className = mergeClasses(menuGridClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"names":["mergeClasses","makeStyles","menuGridClassNames","root","useStyles","display","flexDirection","gap","hasMenuContext","height","useMenuGridStyles_unstable","state","styles","className"],"mappings":"AAAA;AAGA,SAASA,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AAG1D,OAAO,MAAMC,qBAAoD;IAC/DC,MAAM;AACR,EAAE;AAEF,MAAMC,YAAYH,WAAW;IAC3BE,MAAM;QACJE,SAAS;QACTC,eAAe;QACfC,KAAK;IACP;IACAC,gBAAgB;QACdC,QAAQ;IACV;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,6BAA6B,CAACC;IACzC;IAEA,MAAMC,SAASR;IACfO,MAAMR,IAAI,CAACU,SAAS,GAAGb,aAAaE,mBAAmBC,IAAI,EAAES,OAAOT,IAAI,EAAEQ,MAAMR,IAAI,CAACU,SAAS;IAC9F,OAAOF;AACT,EAAE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/MenuGridCell/MenuGridCell.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"sources":["../src/components/MenuGridCell/MenuGridCell.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useMenuGridCell_unstable } from './useMenuGridCell';\nimport { renderMenuGridCell_unstable } from './renderMenuGridCell';\nimport type { MenuGridCellProps } from './MenuGridCell.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useMenuGridCellStyles_unstable } from './useMenuGridCellStyles.styles';\n// import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Define a MenuGridCell, using the `useMenuGridCell_unstable` hook.\n */\nexport const MenuGridCell: ForwardRefComponent<MenuGridCellProps> = React.forwardRef((props, ref) => {\n const state = useMenuGridCell_unstable(props, ref);\n\n useMenuGridCellStyles_unstable(state);\n\n // useCustomStyleHook_unstable('useMenuGridCellStyles_unstable')(state);\n\n return renderMenuGridCell_unstable(state);\n});\n\nMenuGridCell.displayName = 'MenuGridCell';\n"],"names":["React","useMenuGridCell_unstable","renderMenuGridCell_unstable","useMenuGridCellStyles_unstable","MenuGridCell","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,2BAA2B,QAAQ,uBAAuB;AAGnE,SAASC,8BAA8B,QAAQ,iCAAiC;AAChF,iFAAiF;AAEjF;;CAEC,GACD,OAAO,MAAMC,6BAAuDJ,MAAMK,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,QAAQP,yBAAyBK,OAAOC;IAE9CJ,+BAA+BK;IAE/B,wEAAwE;IAExE,OAAON,4BAA4BM;AACrC,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}
|
|
@@ -1,18 +1,32 @@
|
|
|
1
|
+
'use client';
|
|
1
2
|
import * as React from 'react';
|
|
2
|
-
import {
|
|
3
|
+
import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';
|
|
4
|
+
import { ArrowLeft, ArrowRight } from '@fluentui/keyboard-keys';
|
|
5
|
+
import { useMergedRefs, useEventCallback, mergeCallbacks, getIntrinsicElementProps, slot } from '@fluentui/react-utilities';
|
|
6
|
+
import { useValidateNesting } from '../../utils/useValidateNesting';
|
|
3
7
|
/**
|
|
4
8
|
* Given user props, returns state and render function for a MenuGridCell.
|
|
5
9
|
*/ export function useMenuGridCell_unstable(props, ref) {
|
|
6
10
|
const { visuallyHidden } = props;
|
|
11
|
+
const validateNestingRef = useValidateNesting('MenuGridCell');
|
|
12
|
+
const { dir } = useFluent();
|
|
13
|
+
const CloseArrowKey = dir === 'ltr' ? ArrowLeft : ArrowRight;
|
|
14
|
+
const onKeyDownWithPrevent = useEventCallback((event)=>{
|
|
15
|
+
if (event.key === CloseArrowKey) {
|
|
16
|
+
event.preventDefault();
|
|
17
|
+
}
|
|
18
|
+
});
|
|
19
|
+
const onKeyDown = useEventCallback(mergeCallbacks(props.onKeyDown, onKeyDownWithPrevent));
|
|
7
20
|
return {
|
|
8
21
|
visuallyHidden,
|
|
9
22
|
components: {
|
|
10
23
|
root: 'div'
|
|
11
24
|
},
|
|
12
25
|
root: slot.always(getIntrinsicElementProps('div', {
|
|
13
|
-
ref,
|
|
26
|
+
ref: useMergedRefs(ref, validateNestingRef),
|
|
14
27
|
role: 'gridcell',
|
|
15
|
-
...props
|
|
28
|
+
...props,
|
|
29
|
+
onKeyDown
|
|
16
30
|
}), {
|
|
17
31
|
elementType: 'div'
|
|
18
32
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/MenuGridCell/useMenuGridCell.ts"],"sourcesContent":["
|
|
1
|
+
{"version":3,"sources":["../src/components/MenuGridCell/useMenuGridCell.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { ArrowLeft, ArrowRight } from '@fluentui/keyboard-keys';\nimport {\n useMergedRefs,\n useEventCallback,\n mergeCallbacks,\n getIntrinsicElementProps,\n slot,\n} from '@fluentui/react-utilities';\nimport { MenuGridCellProps, MenuGridCellState } from './MenuGridCell.types';\nimport { useValidateNesting } from '../../utils/useValidateNesting';\n\n/**\n * Given user props, returns state and render function for a MenuGridCell.\n */\nexport function useMenuGridCell_unstable(props: MenuGridCellProps, ref: React.Ref<HTMLDivElement>): MenuGridCellState {\n const { visuallyHidden } = props;\n const validateNestingRef = useValidateNesting('MenuGridCell');\n const { dir } = useFluent();\n\n const CloseArrowKey = dir === 'ltr' ? ArrowLeft : ArrowRight;\n const onKeyDownWithPrevent = useEventCallback((event: React.KeyboardEvent<HTMLElement>) => {\n if (event.key === CloseArrowKey) {\n event.preventDefault();\n }\n });\n const onKeyDown = useEventCallback(mergeCallbacks(props.onKeyDown, onKeyDownWithPrevent));\n\n return {\n visuallyHidden,\n components: {\n root: 'div',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref: useMergedRefs(ref, validateNestingRef),\n role: 'gridcell',\n ...props,\n onKeyDown,\n }),\n { elementType: 'div' },\n ),\n };\n}\n"],"names":["React","useFluent_unstable","useFluent","ArrowLeft","ArrowRight","useMergedRefs","useEventCallback","mergeCallbacks","getIntrinsicElementProps","slot","useValidateNesting","useMenuGridCell_unstable","props","ref","visuallyHidden","validateNestingRef","dir","CloseArrowKey","onKeyDownWithPrevent","event","key","preventDefault","onKeyDown","components","root","always","role","elementType"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAClF,SAASC,SAAS,EAAEC,UAAU,QAAQ,0BAA0B;AAChE,SACEC,aAAa,EACbC,gBAAgB,EAChBC,cAAc,EACdC,wBAAwB,EACxBC,IAAI,QACC,4BAA4B;AAEnC,SAASC,kBAAkB,QAAQ,iCAAiC;AAEpE;;CAEC,GACD,OAAO,SAASC,yBAAyBC,KAAwB,EAAEC,GAA8B;IAC/F,MAAM,EAAEC,cAAc,EAAE,GAAGF;IAC3B,MAAMG,qBAAqBL,mBAAmB;IAC9C,MAAM,EAAEM,GAAG,EAAE,GAAGd;IAEhB,MAAMe,gBAAgBD,QAAQ,QAAQb,YAAYC;IAClD,MAAMc,uBAAuBZ,iBAAiB,CAACa;QAC7C,IAAIA,MAAMC,GAAG,KAAKH,eAAe;YAC/BE,MAAME,cAAc;QACtB;IACF;IACA,MAAMC,YAAYhB,iBAAiBC,eAAeK,MAAMU,SAAS,EAAEJ;IAEnE,OAAO;QACLJ;QACAS,YAAY;YACVC,MAAM;QACR;QACAA,MAAMf,KAAKgB,MAAM,CACfjB,yBAAyB,OAAO;YAC9BK,KAAKR,cAAcQ,KAAKE;YACxBW,MAAM;YACN,GAAGd,KAAK;YACRU;QACF,IACA;YAAEK,aAAa;QAAM;IAEzB;AACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["mergeClasses","__styles","menuGridCellClassNames","root","useRootStyles","visuallyHidden","qhf8xq","d","useMenuGridCellStyles_unstable","state","rootStyles","className"],"sources":["useMenuGridCellStyles.styles.js"],"sourcesContent":["
|
|
1
|
+
{"version":3,"names":["mergeClasses","__styles","menuGridCellClassNames","root","useRootStyles","visuallyHidden","qhf8xq","d","useMenuGridCellStyles_unstable","state","rootStyles","className"],"sources":["useMenuGridCellStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses, makeStyles } from '@griffel/react';\nexport const menuGridCellClassNames = {\n root: 'fui-MenuGridCell'\n};\nconst useRootStyles = makeStyles({\n visuallyHidden: {\n position: 'absolute'\n }\n});\nexport const useMenuGridCellStyles_unstable = (state)=>{\n 'use no memo';\n const rootStyles = useRootStyles();\n state.root.className = mergeClasses(menuGridCellClassNames.root, state.visuallyHidden && rootStyles.visuallyHidden, state.root.className);\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAASA,YAAY,EAAAC,QAAA,QAAoB,gBAAgB;AACzD,OAAO,MAAMC,sBAAsB,GAAG;EAClCC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,aAAa,gBAAGH,QAAA;EAAAI,cAAA;IAAAC,MAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAIrB,CAAC;AACF,OAAO,MAAMC,8BAA8B,GAAIC,KAAK,IAAG;EACnD,aAAa;;EACb,MAAMC,UAAU,GAAGN,aAAa,CAAC,CAAC;EAClCK,KAAK,CAACN,IAAI,CAACQ,SAAS,GAAGX,YAAY,CAACE,sBAAsB,CAACC,IAAI,EAAEM,KAAK,CAACJ,cAAc,IAAIK,UAAU,CAACL,cAAc,EAAEI,KAAK,CAACN,IAAI,CAACQ,SAAS,CAAC;EACzI,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/MenuGridCell/useMenuGridCellStyles.styles.ts"],"sourcesContent":["
|
|
1
|
+
{"version":3,"sources":["../src/components/MenuGridCell/useMenuGridCellStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { mergeClasses, makeStyles } from '@griffel/react';\nimport type { MenuGridCellSlots, MenuGridCellState } from './MenuGridCell.types';\n\nexport const menuGridCellClassNames: SlotClassNames<MenuGridCellSlots> = {\n root: 'fui-MenuGridCell',\n};\n\nconst useRootStyles = makeStyles({\n visuallyHidden: {\n position: 'absolute',\n },\n});\n\nexport const useMenuGridCellStyles_unstable = (state: MenuGridCellState): MenuGridCellState => {\n 'use no memo';\n\n const rootStyles = useRootStyles();\n state.root.className = mergeClasses(\n menuGridCellClassNames.root,\n state.visuallyHidden && rootStyles.visuallyHidden,\n state.root.className,\n );\n\n return state;\n};\n"],"names":["mergeClasses","makeStyles","menuGridCellClassNames","root","useRootStyles","visuallyHidden","position","useMenuGridCellStyles_unstable","state","rootStyles","className"],"mappings":"AAAA;AAGA,SAASA,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AAG1D,OAAO,MAAMC,yBAA4D;IACvEC,MAAM;AACR,EAAE;AAEF,MAAMC,gBAAgBH,WAAW;IAC/BI,gBAAgB;QACdC,UAAU;IACZ;AACF;AAEA,OAAO,MAAMC,iCAAiC,CAACC;IAC7C;IAEA,MAAMC,aAAaL;IACnBI,MAAML,IAAI,CAACO,SAAS,GAAGV,aACrBE,uBAAuBC,IAAI,EAC3BK,MAAMH,cAAc,IAAII,WAAWJ,cAAc,EACjDG,MAAML,IAAI,CAACO,SAAS;IAGtB,OAAOF;AACT,EAAE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/MenuGridGroup/MenuGridGroup.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"sources":["../src/components/MenuGridGroup/MenuGridGroup.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useMenuGridGroup_unstable } from './useMenuGridGroup';\nimport { renderMenuGridGroup_unstable } from './renderMenuGridGroup';\nimport { useMenuGridGroupContextValues_unstable } from './useMenuGridGroupContextValues';\nimport type { MenuGridGroupProps } from './MenuGridGroup.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useMenuGridGroupStyles_unstable } from './useMenuGridGroupStyles.styles';\n// import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Define a MenuGridGroup, using the `useMenuGridGroup_unstable` hook.\n */\nexport const MenuGridGroup: ForwardRefComponent<MenuGridGroupProps> = React.forwardRef((props, ref) => {\n const state = useMenuGridGroup_unstable(props, ref);\n const contextValues = useMenuGridGroupContextValues_unstable(state);\n\n useMenuGridGroupStyles_unstable(state);\n\n // useCustomStyleHook_unstable('useMenuGridGroupStyles_unstable')(state);\n\n return renderMenuGridGroup_unstable(state, contextValues);\n});\n\nMenuGridGroup.displayName = 'MenuGridGroup';\n"],"names":["React","useMenuGridGroup_unstable","renderMenuGridGroup_unstable","useMenuGridGroupContextValues_unstable","useMenuGridGroupStyles_unstable","MenuGridGroup","forwardRef","props","ref","state","contextValues","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,4BAA4B,QAAQ,wBAAwB;AACrE,SAASC,sCAAsC,QAAQ,kCAAkC;AAGzF,SAASC,+BAA+B,QAAQ,kCAAkC;AAClF,iFAAiF;AAEjF;;CAEC,GACD,OAAO,MAAMC,8BAAyDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IAC7F,MAAMC,QAAQR,0BAA0BM,OAAOC;IAC/C,MAAME,gBAAgBP,uCAAuCM;IAE7DL,gCAAgCK;IAEhC,yEAAyE;IAEzE,OAAOP,6BAA6BO,OAAOC;AAC7C,GAAG;AAEHL,cAAcM,WAAW,GAAG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/MenuGridGroup/useMenuGridGroupContextValues.ts"],"sourcesContent":["
|
|
1
|
+
{"version":3,"sources":["../src/components/MenuGridGroup/useMenuGridGroupContextValues.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { MenuGridGroupContextValues, MenuGridGroupState } from './MenuGridGroup.types';\n\nexport function useMenuGridGroupContextValues_unstable(state: MenuGridGroupState): MenuGridGroupContextValues {\n const { headerId } = state;\n const MenuGridGroup = React.useMemo(() => ({ headerId }), [headerId]);\n\n return { MenuGridGroup };\n}\n"],"names":["React","useMenuGridGroupContextValues_unstable","state","headerId","MenuGridGroup","useMemo"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAG/B,OAAO,SAASC,uCAAuCC,KAAyB;IAC9E,MAAM,EAAEC,QAAQ,EAAE,GAAGD;IACrB,MAAME,gBAAgBJ,MAAMK,OAAO,CAAC,IAAO,CAAA;YAAEF;QAAS,CAAA,GAAI;QAACA;KAAS;IAEpE,OAAO;QAAEC;IAAc;AACzB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/MenuGridGroupHeader/MenuGridGroupHeader.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"sources":["../src/components/MenuGridGroupHeader/MenuGridGroupHeader.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useMenuGridGroupHeader_unstable } from './useMenuGridGroupHeader';\nimport { renderMenuGridGroupHeader_unstable } from './renderMenuGridGroupHeader';\nimport type { MenuGridGroupHeaderProps } from './MenuGridGroupHeader.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useMenuGridGroupHeaderStyles_unstable } from './useMenuGridGroupHeaderStyles.styles';\n// import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Define a MenuGridGroupHeader, using the `useMenuGridGroupHeader_unstable` hook.\n */\nexport const MenuGridGroupHeader: ForwardRefComponent<MenuGridGroupHeaderProps> = React.forwardRef((props, ref) => {\n const state = useMenuGridGroupHeader_unstable(props, ref);\n\n useMenuGridGroupHeaderStyles_unstable(state);\n\n // useCustomStyleHook_unstable('useMenuGridGroupHeaderStyles_unstable')(state);\n\n return renderMenuGridGroupHeader_unstable(state);\n});\n\nMenuGridGroupHeader.displayName = 'MenuGridGroupHeader';\n"],"names":["React","useMenuGridGroupHeader_unstable","renderMenuGridGroupHeader_unstable","useMenuGridGroupHeaderStyles_unstable","MenuGridGroupHeader","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,+BAA+B,QAAQ,2BAA2B;AAC3E,SAASC,kCAAkC,QAAQ,8BAA8B;AAGjF,SAASC,qCAAqC,QAAQ,wCAAwC;AAC9F,iFAAiF;AAEjF;;CAEC,GACD,OAAO,MAAMC,oCAAqEJ,MAAMK,UAAU,CAAC,CAACC,OAAOC;IACzG,MAAMC,QAAQP,gCAAgCK,OAAOC;IAErDJ,sCAAsCK;IAEtC,+EAA+E;IAE/E,OAAON,mCAAmCM;AAC5C,GAAG;AAEHJ,oBAAoBK,WAAW,GAAG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/MenuGridGroupHeader/useMenuGridGroupHeader.ts"],"sourcesContent":["
|
|
1
|
+
{"version":3,"sources":["../src/components/MenuGridGroupHeader/useMenuGridGroupHeader.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\n\nimport { useMenuGridGroupContext_unstable } from '../../contexts/menuGridGroupContext';\nimport { MenuGridGroupHeaderProps, MenuGridGroupHeaderState } from './MenuGridGroupHeader.types';\n\n/**\n * Given user props, returns state and render function for a MenuGridGroupHeader.\n */\nexport function useMenuGridGroupHeader_unstable(\n props: MenuGridGroupHeaderProps,\n ref: React.Ref<HTMLDivElement>,\n): MenuGridGroupHeaderState {\n const { headerId: id } = useMenuGridGroupContext_unstable();\n\n return {\n components: {\n root: 'div',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref,\n role: 'presentation',\n id,\n 'aria-hidden': true,\n ...props,\n }),\n { elementType: 'div' },\n ),\n };\n}\n"],"names":["React","getIntrinsicElementProps","slot","useMenuGridGroupContext_unstable","useMenuGridGroupHeader_unstable","props","ref","headerId","id","components","root","always","role","elementType"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAE3E,SAASC,gCAAgC,QAAQ,sCAAsC;AAGvF;;CAEC,GACD,OAAO,SAASC,gCACdC,KAA+B,EAC/BC,GAA8B;IAE9B,MAAM,EAAEC,UAAUC,EAAE,EAAE,GAAGL;IAEzB,OAAO;QACLM,YAAY;YACVC,MAAM;QACR;QACAA,MAAMR,KAAKS,MAAM,CACfV,yBAAyB,OAAO;YAC9BK;YACAM,MAAM;YACNJ;YACA,eAAe;YACf,GAAGH,KAAK;QACV,IACA;YAAEQ,aAAa;QAAM;IAEzB;AACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/MenuGridItem/MenuGridItem.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"sources":["../src/components/MenuGridItem/MenuGridItem.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useMenuGridItem_unstable } from './useMenuGridItem';\nimport { renderMenuGridItem_unstable } from './renderMenuGridItem';\nimport type { MenuGridItemProps } from './MenuGridItem.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useMenuGridItemStyles_unstable } from './useMenuGridItemStyles.styles';\n// import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Define a MenuGridItem, using the `useMenuGridItem_unstable` hook.\n */\nexport const MenuGridItem: ForwardRefComponent<MenuGridItemProps> = React.forwardRef((props, ref) => {\n const state = useMenuGridItem_unstable(props, ref);\n\n useMenuGridItemStyles_unstable(state);\n\n // useCustomStyleHook_unstable('useMenuGridItemStyles_unstable')(state);\n\n return renderMenuGridItem_unstable(state);\n});\n\nMenuGridItem.displayName = 'MenuGridItem';\n"],"names":["React","useMenuGridItem_unstable","renderMenuGridItem_unstable","useMenuGridItemStyles_unstable","MenuGridItem","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,2BAA2B,QAAQ,uBAAuB;AAGnE,SAASC,8BAA8B,QAAQ,iCAAiC;AAChF,iFAAiF;AAEjF;;CAEC,GACD,OAAO,MAAMC,6BAAuDJ,MAAMK,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,QAAQP,yBAAyBK,OAAOC;IAE9CJ,+BAA+BK;IAE/B,wEAAwE;IAExE,OAAON,4BAA4BM;AACrC,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}
|
|
@@ -1,11 +1,14 @@
|
|
|
1
|
+
'use client';
|
|
1
2
|
import * as React from 'react';
|
|
2
|
-
import { slot } from '@fluentui/react-utilities';
|
|
3
|
+
import { useMergedRefs, slot } from '@fluentui/react-utilities';
|
|
3
4
|
import { MenuGridCell } from './../MenuGridCell/MenuGridCell';
|
|
4
5
|
import { MenuGridRow } from './../MenuGridRow/MenuGridRow';
|
|
6
|
+
import { useValidateNesting } from '../../utils/useValidateNesting';
|
|
5
7
|
/**
|
|
6
8
|
* Given user props, returns state and render function for a MenuGridItem.
|
|
7
9
|
*/ export function useMenuGridItem_unstable(props, ref) {
|
|
8
10
|
const { icon, content: _content, subText, firstSubAction, secondSubAction, ...rest } = props;
|
|
11
|
+
const validateNestingRef = useValidateNesting('MenuGridItem');
|
|
9
12
|
return {
|
|
10
13
|
components: {
|
|
11
14
|
root: MenuGridRow,
|
|
@@ -16,7 +19,7 @@ import { MenuGridRow } from './../MenuGridRow/MenuGridRow';
|
|
|
16
19
|
secondSubAction: MenuGridCell
|
|
17
20
|
},
|
|
18
21
|
root: slot.always({
|
|
19
|
-
ref,
|
|
22
|
+
ref: useMergedRefs(ref, validateNestingRef),
|
|
20
23
|
...rest
|
|
21
24
|
}, {
|
|
22
25
|
elementType: MenuGridRow
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/MenuGridItem/useMenuGridItem.ts"],"sourcesContent":["
|
|
1
|
+
{"version":3,"sources":["../src/components/MenuGridItem/useMenuGridItem.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useMergedRefs, slot } from '@fluentui/react-utilities';\n\nimport { MenuGridItemProps, MenuGridItemState } from './MenuGridItem.types';\nimport { MenuGridCell } from './../MenuGridCell/MenuGridCell';\nimport { MenuGridRow } from './../MenuGridRow/MenuGridRow';\nimport { useValidateNesting } from '../../utils/useValidateNesting';\n\n/**\n * Given user props, returns state and render function for a MenuGridItem.\n */\nexport function useMenuGridItem_unstable(props: MenuGridItemProps, ref: React.Ref<HTMLDivElement>): MenuGridItemState {\n const {\n icon,\n content: _content, // `content` is a slot and it's type clashes with the HTMLElement `content` attribute\n subText,\n firstSubAction,\n secondSubAction,\n ...rest\n } = props;\n const validateNestingRef = useValidateNesting('MenuGridItem');\n\n return {\n components: {\n root: MenuGridRow,\n icon: MenuGridCell,\n content: MenuGridCell,\n subText: 'span',\n firstSubAction: MenuGridCell,\n secondSubAction: MenuGridCell,\n },\n root: slot.always(\n {\n ref: useMergedRefs(ref, validateNestingRef),\n ...rest,\n },\n { elementType: MenuGridRow },\n ),\n icon: slot.optional(props.icon, { elementType: MenuGridCell }),\n content: slot.optional(props.content, {\n renderByDefault: !!props.children,\n defaultProps: { children: props.children },\n elementType: MenuGridCell,\n }),\n subText: slot.optional(props.subText, { elementType: 'span' }),\n firstSubAction: slot.optional(props.firstSubAction, { elementType: MenuGridCell }),\n secondSubAction: slot.optional(props.secondSubAction, { elementType: MenuGridCell }),\n };\n}\n"],"names":["React","useMergedRefs","slot","MenuGridCell","MenuGridRow","useValidateNesting","useMenuGridItem_unstable","props","ref","icon","content","_content","subText","firstSubAction","secondSubAction","rest","validateNestingRef","components","root","always","elementType","optional","renderByDefault","children","defaultProps"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,aAAa,EAAEC,IAAI,QAAQ,4BAA4B;AAGhE,SAASC,YAAY,QAAQ,iCAAiC;AAC9D,SAASC,WAAW,QAAQ,+BAA+B;AAC3D,SAASC,kBAAkB,QAAQ,iCAAiC;AAEpE;;CAEC,GACD,OAAO,SAASC,yBAAyBC,KAAwB,EAAEC,GAA8B;IAC/F,MAAM,EACJC,IAAI,EACJC,SAASC,QAAQ,EACjBC,OAAO,EACPC,cAAc,EACdC,eAAe,EACf,GAAGC,MACJ,GAAGR;IACJ,MAAMS,qBAAqBX,mBAAmB;IAE9C,OAAO;QACLY,YAAY;YACVC,MAAMd;YACNK,MAAMN;YACNO,SAASP;YACTS,SAAS;YACTC,gBAAgBV;YAChBW,iBAAiBX;QACnB;QACAe,MAAMhB,KAAKiB,MAAM,CACf;YACEX,KAAKP,cAAcO,KAAKQ;YACxB,GAAGD,IAAI;QACT,GACA;YAAEK,aAAahB;QAAY;QAE7BK,MAAMP,KAAKmB,QAAQ,CAACd,MAAME,IAAI,EAAE;YAAEW,aAAajB;QAAa;QAC5DO,SAASR,KAAKmB,QAAQ,CAACd,MAAMG,OAAO,EAAE;YACpCY,iBAAiB,CAAC,CAACf,MAAMgB,QAAQ;YACjCC,cAAc;gBAAED,UAAUhB,MAAMgB,QAAQ;YAAC;YACzCH,aAAajB;QACf;QACAS,SAASV,KAAKmB,QAAQ,CAACd,MAAMK,OAAO,EAAE;YAAEQ,aAAa;QAAO;QAC5DP,gBAAgBX,KAAKmB,QAAQ,CAACd,MAAMM,cAAc,EAAE;YAAEO,aAAajB;QAAa;QAChFW,iBAAiBZ,KAAKmB,QAAQ,CAACd,MAAMO,eAAe,EAAE;YAAEM,aAAajB;QAAa;IACpF;AACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/MenuGridRow/MenuGridRow.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"sources":["../src/components/MenuGridRow/MenuGridRow.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useMenuGridRow_unstable } from './useMenuGridRow';\nimport { renderMenuGridRow_unstable } from './renderMenuGridRow';\nimport type { MenuGridRowProps } from './MenuGridRow.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useMenuGridRowStyles_unstable } from './useMenuGridRowStyles.styles';\n// import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Define a MenuGridRow, using the `useMenuGridRow_unstable` hook.\n */\nexport const MenuGridRow: ForwardRefComponent<MenuGridRowProps> = React.forwardRef((props, ref) => {\n const state = useMenuGridRow_unstable(props, ref);\n\n useMenuGridRowStyles_unstable(state);\n\n // useCustomStyleHook_unstable('useMenuGridRowStyles_unstable')(state);\n\n return renderMenuGridRow_unstable(state);\n});\n\nMenuGridRow.displayName = 'MenuGridRow';\n"],"names":["React","useMenuGridRow_unstable","renderMenuGridRow_unstable","useMenuGridRowStyles_unstable","MenuGridRow","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,0BAA0B,QAAQ,sBAAsB;AAGjE,SAASC,6BAA6B,QAAQ,gCAAgC;AAC9E,iFAAiF;AAEjF;;CAEC,GACD,OAAO,MAAMC,4BAAqDJ,MAAMK,UAAU,CAAC,CAACC,OAAOC;IACzF,MAAMC,QAAQP,wBAAwBK,OAAOC;IAE7CJ,8BAA8BK;IAE9B,uEAAuE;IAEvE,OAAON,2BAA2BM;AACpC,GAAG;AAEHJ,YAAYK,WAAW,GAAG"}
|
|
@@ -1,16 +1,19 @@
|
|
|
1
|
+
'use client';
|
|
1
2
|
import * as React from 'react';
|
|
2
|
-
import { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';
|
|
3
|
+
import { useMergedRefs, getIntrinsicElementProps, slot } from '@fluentui/react-utilities';
|
|
3
4
|
import { useMenuGridContext_unstable } from '../../contexts/menuGridContext';
|
|
5
|
+
import { useValidateNesting } from '../../utils/useValidateNesting';
|
|
4
6
|
/**
|
|
5
7
|
* Given user props, returns state and render function for a MenuGridRow.
|
|
6
8
|
*/ export function useMenuGridRow_unstable(props, ref) {
|
|
9
|
+
const validateNestingRef = useValidateNesting('MenuGridRow');
|
|
7
10
|
const { tableRowTabsterAttribute } = useMenuGridContext_unstable();
|
|
8
11
|
return {
|
|
9
12
|
components: {
|
|
10
13
|
root: 'div'
|
|
11
14
|
},
|
|
12
15
|
root: slot.always(getIntrinsicElementProps('div', {
|
|
13
|
-
ref,
|
|
16
|
+
ref: useMergedRefs(ref, validateNestingRef),
|
|
14
17
|
role: 'row',
|
|
15
18
|
tabIndex: 0,
|
|
16
19
|
...tableRowTabsterAttribute,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/MenuGridRow/useMenuGridRow.ts"],"sourcesContent":["
|
|
1
|
+
{"version":3,"sources":["../src/components/MenuGridRow/useMenuGridRow.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useMergedRefs, getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\n\nimport { useMenuGridContext_unstable } from '../../contexts/menuGridContext';\nimport { MenuGridRowProps, MenuGridRowState } from './MenuGridRow.types';\nimport { useValidateNesting } from '../../utils/useValidateNesting';\n\n/**\n * Given user props, returns state and render function for a MenuGridRow.\n */\nexport function useMenuGridRow_unstable(props: MenuGridRowProps, ref: React.Ref<HTMLDivElement>): MenuGridRowState {\n const validateNestingRef = useValidateNesting('MenuGridRow');\n const { tableRowTabsterAttribute } = useMenuGridContext_unstable();\n\n return {\n components: {\n root: 'div',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref: useMergedRefs(ref, validateNestingRef),\n role: 'row',\n tabIndex: 0,\n ...tableRowTabsterAttribute,\n ...props,\n }),\n { elementType: 'div' },\n ),\n };\n}\n"],"names":["React","useMergedRefs","getIntrinsicElementProps","slot","useMenuGridContext_unstable","useValidateNesting","useMenuGridRow_unstable","props","ref","validateNestingRef","tableRowTabsterAttribute","components","root","always","role","tabIndex","elementType"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,aAAa,EAAEC,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAE1F,SAASC,2BAA2B,QAAQ,iCAAiC;AAE7E,SAASC,kBAAkB,QAAQ,iCAAiC;AAEpE;;CAEC,GACD,OAAO,SAASC,wBAAwBC,KAAuB,EAAEC,GAA8B;IAC7F,MAAMC,qBAAqBJ,mBAAmB;IAC9C,MAAM,EAAEK,wBAAwB,EAAE,GAAGN;IAErC,OAAO;QACLO,YAAY;YACVC,MAAM;QACR;QACAA,MAAMT,KAAKU,MAAM,CACfX,yBAAyB,OAAO;YAC9BM,KAAKP,cAAcO,KAAKC;YACxBK,MAAM;YACNC,UAAU;YACV,GAAGL,wBAAwB;YAC3B,GAAGH,KAAK;QACV,IACA;YAAES,aAAa;QAAM;IAEzB;AACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/contexts/menuGridContext.ts"],"sourcesContent":["
|
|
1
|
+
{"version":3,"sources":["../src/contexts/menuGridContext.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { TabsterDOMAttribute } from '@fluentui/react-tabster';\n\nexport const MenuGridContext = React.createContext<MenuGridContextValue | undefined>(\n undefined,\n) as React.Context<MenuGridContextValue>;\n\nconst menuGridContextDefaultValue: MenuGridContextValue = {\n tableRowTabsterAttribute: null,\n};\n\n/**\n * Context shared between MenuGrid and its children components\n */\nexport type MenuGridContextValue = {\n /**\n * Tabster row attributes applied to the `MenuGridRow` components\n */\n tableRowTabsterAttribute: TabsterDOMAttribute | null;\n};\n\nexport const MenuGridContextProvider = MenuGridContext.Provider;\n\nexport const useMenuGridContext_unstable = (): MenuGridContextValue =>\n React.useContext(MenuGridContext) ?? menuGridContextDefaultValue;\n"],"names":["React","MenuGridContext","createContext","undefined","menuGridContextDefaultValue","tableRowTabsterAttribute","MenuGridContextProvider","Provider","useMenuGridContext_unstable","useContext"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAG/B,OAAO,MAAMC,kBAAkBD,MAAME,aAAa,CAChDC,WACuC;AAEzC,MAAMC,8BAAoD;IACxDC,0BAA0B;AAC5B;AAYA,OAAO,MAAMC,0BAA0BL,gBAAgBM,QAAQ,CAAC;AAEhE,OAAO,MAAMC,8BAA8B;QACzCR;WAAAA,CAAAA,oBAAAA,MAAMS,UAAU,CAACR,8BAAjBD,+BAAAA,oBAAqCI;EAA4B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/contexts/menuGridGroupContext.ts"],"sourcesContent":["
|
|
1
|
+
{"version":3,"sources":["../src/contexts/menuGridGroupContext.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nconst MenuGridGroupContext = React.createContext<MenuGridGroupContextValue | undefined>(\n undefined,\n) as React.Context<MenuGridGroupContextValue>;\n\nconst MenuGridGroupContextDefaultValue: MenuGridGroupContextValue = {\n headerId: '',\n};\n\n/**\n * Context used to guarantee correct aria-relationship between row group and header\n */\nexport type MenuGridGroupContextValue = {\n /**\n * Element id applied to the `MenuGridGroupHeader` component\n */\n headerId: string;\n};\n\nexport const MenuGridGroupContextProvider = MenuGridGroupContext.Provider;\nexport const useMenuGridGroupContext_unstable = (): MenuGridGroupContextValue =>\n React.useContext(MenuGridGroupContext) ?? MenuGridGroupContextDefaultValue;\n"],"names":["React","MenuGridGroupContext","createContext","undefined","MenuGridGroupContextDefaultValue","headerId","MenuGridGroupContextProvider","Provider","useMenuGridGroupContext_unstable","useContext"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAE/B,MAAMC,uBAAuBD,MAAME,aAAa,CAC9CC;AAGF,MAAMC,mCAA8D;IAClEC,UAAU;AACZ;AAYA,OAAO,MAAMC,+BAA+BL,qBAAqBM,QAAQ,CAAC;AAC1E,OAAO,MAAMC,mCAAmC;QAC9CR;WAAAA,CAAAA,oBAAAA,MAAMS,UAAU,CAACR,mCAAjBD,+BAAAA,oBAA0CI;EAAiC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { useValidateNesting } from './useValidateNesting';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/utils/index.ts"],"sourcesContent":["export { useValidateNesting } from './useValidateNesting';\n"],"names":["useValidateNesting"],"mappings":"AAAA,SAASA,kBAAkB,QAAQ,uBAAuB"}
|