@fluentui/react-table 9.10.1 → 9.10.3

package/lib/components/TableRow/useTableRowStyles.styles.js

@@ -39,9 +39,6 @@ const useStyles = /*#__PURE__*/__styles({
     B6xbmo0: ["fxmnebo", "f1witrsb"],
     dm238s: ["f1witrsb", "fxmnebo"]
   },
-  noAppearanceFocusWithin: {
-    Bm5rygw: "f13cic75"
-  },
   rootInteractive: {
     ecr2s2: "f1wfn5kd",
     lj723h: "f1g4hkjv",
@@ -121,7 +118,7 @@ const useStyles = /*#__PURE__*/__styles({
   },
   none: {}
 }, {
-  d: [".f19n0e5{color:var(--colorNeutralForeground1);}", ".f1ewtqcl{box-sizing:border-box;}", ".f1jazu75[data-fui-focus-within]:focus-within .fui-TableSelectionCell{opacity:1;}", ".f1xeqee6[data-fui-focus-within]:focus-within .fui-TableCellActions{opacity:1;}", ".fz36nt7[data-fui-focus-visible]{outline-width:2px;}", ".f9znhxp[data-fui-focus-visible]{outline-style:solid;}", ".fqrak0z[data-fui-focus-visible]{outline-color:var(--colorStrokeFocus2);}", ".f1o2ludy[data-fui-focus-visible]{border-bottom-right-radius:var(--borderRadiusMedium);}", ".f1kjnpwc[data-fui-focus-visible]{border-bottom-left-radius:var(--borderRadiusMedium);}", ".fxmnebo[data-fui-focus-visible]{border-top-right-radius:var(--borderRadiusMedium);}", ".f1witrsb[data-fui-focus-visible]{border-top-left-radius:var(--borderRadiusMedium);}", ".f13cic75[data-fui-focus-within]:focus-within{background-color:var(--colorSubtleBackgroundHover);}", ".f1vxd6vx{border-bottom-width:var(--strokeWidthThin);}", ".fg706s2{border-bottom-style:solid;}", ".frpde29{border-bottom-color:var(--colorNeutralStroke2);}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".f16xkysk{background-color:var(--colorBrandBackground2);}", ".f1bh3yvw{border-top-color:var(--colorTransparentStrokeInteractive);}", ".fmi79ni{border-right-color:var(--colorTransparentStrokeInteractive);}", ".f11fozsx{border-left-color:var(--colorTransparentStrokeInteractive);}", ".fnzw4c6{border-bottom-color:var(--colorTransparentStrokeInteractive);}", ".fq5gl1p{background-color:var(--colorSubtleBackgroundSelected);}", ".f1cgsbmv{color:var(--colorNeutralForeground1Hover);}", ".frmsihh{border-top-color:var(--colorNeutralStrokeOnBrand);}", ".frttxa5{border-right-color:var(--colorNeutralStrokeOnBrand);}", ".f11o2r7f{border-left-color:var(--colorNeutralStrokeOnBrand);}", ".fem5et0{border-bottom-color:var(--colorNeutralStrokeOnBrand);}"],
+  d: [".f19n0e5{color:var(--colorNeutralForeground1);}", ".f1ewtqcl{box-sizing:border-box;}", ".f1jazu75[data-fui-focus-within]:focus-within .fui-TableSelectionCell{opacity:1;}", ".f1xeqee6[data-fui-focus-within]:focus-within .fui-TableCellActions{opacity:1;}", ".fz36nt7[data-fui-focus-visible]{outline-width:2px;}", ".f9znhxp[data-fui-focus-visible]{outline-style:solid;}", ".fqrak0z[data-fui-focus-visible]{outline-color:var(--colorStrokeFocus2);}", ".f1o2ludy[data-fui-focus-visible]{border-bottom-right-radius:var(--borderRadiusMedium);}", ".f1kjnpwc[data-fui-focus-visible]{border-bottom-left-radius:var(--borderRadiusMedium);}", ".fxmnebo[data-fui-focus-visible]{border-top-right-radius:var(--borderRadiusMedium);}", ".f1witrsb[data-fui-focus-visible]{border-top-left-radius:var(--borderRadiusMedium);}", ".f1vxd6vx{border-bottom-width:var(--strokeWidthThin);}", ".fg706s2{border-bottom-style:solid;}", ".frpde29{border-bottom-color:var(--colorNeutralStroke2);}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".f16xkysk{background-color:var(--colorBrandBackground2);}", ".f1bh3yvw{border-top-color:var(--colorTransparentStrokeInteractive);}", ".fmi79ni{border-right-color:var(--colorTransparentStrokeInteractive);}", ".f11fozsx{border-left-color:var(--colorTransparentStrokeInteractive);}", ".fnzw4c6{border-bottom-color:var(--colorTransparentStrokeInteractive);}", ".fq5gl1p{background-color:var(--colorSubtleBackgroundSelected);}", ".f1cgsbmv{color:var(--colorNeutralForeground1Hover);}", ".frmsihh{border-top-color:var(--colorNeutralStrokeOnBrand);}", ".frttxa5{border-right-color:var(--colorNeutralStrokeOnBrand);}", ".f11o2r7f{border-left-color:var(--colorNeutralStrokeOnBrand);}", ".fem5et0{border-bottom-color:var(--colorNeutralStrokeOnBrand);}"],
   a: [".f1wfn5kd:active{background-color:var(--colorSubtleBackgroundPressed);}", ".f1g4hkjv:active{color:var(--colorNeutralForeground1Pressed);}", ".f15ngxrw:active .fui-TableCellActions{opacity:1;}", ".fjbbrdp:active .fui-TableSelectionCell{opacity:1;}", ".ftepret:active{background-color:var(--colorBrandBackgroundInvertedSelected);}", ".fa9o754:active{background-color:var(--colorSubtleBackgroundSelected);}"],
   h: [".f1t94bn6:hover{background-color:var(--colorSubtleBackgroundHover);}", ".feu1g3u:hover{color:var(--colorNeutralForeground1Hover);}", ".f1uorfem:hover .fui-TableCellActions{opacity:1;}", ".fw60kww:hover .fui-TableSelectionCell{opacity:1;}", ".f1uqaxdt:hover{background-color:var(--colorSubtleBackgroundSelected);}"],
   m: [["@media (forced-colors: active){.fqlf3fd{border-top-width:2px;}}", {
@@ -161,7 +158,7 @@ export const useTableRowStyles_unstable = state => {
     table: useTableLayoutStyles(),
     flex: useFlexLayoutStyles()
   };
-  state.root.className = mergeClasses(tableRowClassNames.root, styles.root, !state.isHeaderRow && styles.rootInteractive, styles[state.size], state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, styles[state.appearance], state.appearance === 'none' && !state.isHeaderRow && styles.noAppearanceFocusWithin, state.root.className);
+  state.root.className = mergeClasses(tableRowClassNames.root, styles.root, !state.isHeaderRow && styles.rootInteractive, styles[state.size], state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, styles[state.appearance], state.root.className);
   return state;
 };
 //# sourceMappingURL=useTableRowStyles.styles.js.map

package/lib/components/TableRow/useTableRowStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["__styles","mergeClasses","shorthands","tokens","tableCellActionsClassNames","tableSelectionCellClassNames","createCustomFocusIndicatorStyle","tableRowClassName","tableRowClassNames","root","useTableLayoutStyles","mc9l5x","d","useFlexLayoutStyles","Bt984gj","useStyles","sj55zd","B7ck84d","Bconypa","B6guboy","Bn4voq9","g9k6zt","Bfpq7zp","kdpuga","Bw81rd7","B6xbmo0","dm238s","noAppearanceFocusWithin","Bm5rygw","rootInteractive","ecr2s2","lj723h","B43xm9u","i921ia","Jwef8y","Bi91k9c","Bpt6rm4","ff6mpl","medium","Bn0qgzm","oivjwe","B9xav0g","small","Be2twd7","brand","De3pzq","g2u3we","h3c5rm","zhjwy3","gwxt9v","v3aym","Bc736ss","Bk6ri7n","Bk5ld8o","c4eypz","felo30","Eshu5l","Bjwas2f","Bn1d65q","Bxeuatn","n51gp8","Beo2b4z","h6lo6r","Btyw6ap","w1pwid","Brwvgy3","yadkgm","neutral","none","a","h","m","useTableRowStyles_unstable","state","styles","layoutStyles","table","flex","className","isHeaderRow","size","noNativeElements","appearance"],"sources":["useTableRowStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { tableCellActionsClassNames } from '../TableCellActions/useTableCellActionsStyles.styles';\nimport { tableSelectionCellClassNames } from '../TableSelectionCell/useTableSelectionCellStyles.styles';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nexport const tableRowClassName = 'fui-TableRow';\nexport const tableRowClassNames = {\n    root: tableRowClassName\n};\nconst useTableLayoutStyles = makeStyles({\n    root: {\n        display: 'table-row'\n    }\n});\nconst useFlexLayoutStyles = makeStyles({\n    root: {\n        display: 'flex',\n        alignItems: 'center'\n    }\n});\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n    root: {\n        color: tokens.colorNeutralForeground1,\n        boxSizing: 'border-box',\n        ...createCustomFocusIndicatorStyle({\n            [`& .${tableSelectionCellClassNames.root}`]: {\n                opacity: 1\n            },\n            [`& .${tableCellActionsClassNames.root}`]: {\n                opacity: 1\n            }\n        }, {\n            selector: 'focus-within'\n        }),\n        ...createCustomFocusIndicatorStyle({\n            ...shorthands.outline('2px', 'solid', tokens.colorStrokeFocus2),\n            ...shorthands.borderRadius(tokens.borderRadiusMedium)\n        }, {\n            selector: 'focus'\n        })\n    },\n    // When focus is within the row the background colour\n    // should be the same as hover, except when there is a brand\n    // or neutral appearance applied on the row\n    noAppearanceFocusWithin: {\n        ...createCustomFocusIndicatorStyle({\n            backgroundColor: tokens.colorSubtleBackgroundHover\n        }, {\n            selector: 'focus-within'\n        })\n    },\n    rootInteractive: {\n        ':active': {\n            backgroundColor: tokens.colorSubtleBackgroundPressed,\n            color: tokens.colorNeutralForeground1Pressed,\n            [`& .${tableCellActionsClassNames.root}`]: {\n                opacity: 1\n            },\n            [`& .${tableSelectionCellClassNames.root}`]: {\n                opacity: 1\n            }\n        },\n        ':hover': {\n            backgroundColor: tokens.colorSubtleBackgroundHover,\n            color: tokens.colorNeutralForeground1Hover,\n            [`& .${tableCellActionsClassNames.root}`]: {\n                opacity: 1\n            },\n            [`& .${tableSelectionCellClassNames.root}`]: {\n                opacity: 1\n            }\n        }\n    },\n    medium: {\n        ...shorthands.borderBottom(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke2)\n    },\n    small: {\n        ...shorthands.borderBottom(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke2)\n    },\n    'extra-small': {\n        fontSize: tokens.fontSizeBase200\n    },\n    brand: {\n        backgroundColor: tokens.colorBrandBackground2,\n        ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive),\n        ':active': {\n            backgroundColor: tokens.colorBrandBackgroundInvertedSelected\n        },\n        '@media(forced-colors: active)': {\n            ...shorthands.border('2px', 'solid', 'transparent'),\n            ...shorthands.borderRadius(tokens.borderRadiusMedium),\n            boxSizing: 'border-box',\n            ':focus-visible': {\n                outlineOffset: '-4px'\n            }\n        }\n    },\n    neutral: {\n        '@media(forced-colors: active)': {\n            ...shorthands.border('2px', 'solid', 'transparent'),\n            ...shorthands.borderRadius(tokens.borderRadiusMedium),\n            boxSizing: 'border-box',\n            ':focus-visible': {\n                outlineOffset: '-4px'\n            }\n        },\n        backgroundColor: tokens.colorSubtleBackgroundSelected,\n        color: tokens.colorNeutralForeground1Hover,\n        ':hover': {\n            backgroundColor: tokens.colorSubtleBackgroundSelected\n        },\n        ':active': {\n            backgroundColor: tokens.colorSubtleBackgroundSelected\n        },\n        ...shorthands.borderColor(tokens.colorNeutralStrokeOnBrand)\n    },\n    none: {}\n});\n/**\n * Apply styling to the TableRow slots based on the state\n */ export const useTableRowStyles_unstable = (state)=>{\n    const styles = useStyles();\n    const layoutStyles = {\n        table: useTableLayoutStyles(),\n        flex: useFlexLayoutStyles()\n    };\n    state.root.className = mergeClasses(tableRowClassNames.root, styles.root, !state.isHeaderRow && styles.rootInteractive, styles[state.size], state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, styles[state.appearance], state.appearance === 'none' && !state.isHeaderRow && styles.noAppearanceFocusWithin, state.root.className);\n    return state;\n};\n"],"mappings":"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"}
+{"version":3,"names":["__styles","mergeClasses","shorthands","tokens","tableCellActionsClassNames","tableSelectionCellClassNames","createCustomFocusIndicatorStyle","tableRowClassName","tableRowClassNames","root","useTableLayoutStyles","mc9l5x","d","useFlexLayoutStyles","Bt984gj","useStyles","sj55zd","B7ck84d","Bconypa","B6guboy","Bn4voq9","g9k6zt","Bfpq7zp","kdpuga","Bw81rd7","B6xbmo0","dm238s","rootInteractive","ecr2s2","lj723h","B43xm9u","i921ia","Jwef8y","Bi91k9c","Bpt6rm4","ff6mpl","medium","Bn0qgzm","oivjwe","B9xav0g","small","Be2twd7","brand","De3pzq","g2u3we","h3c5rm","zhjwy3","gwxt9v","v3aym","Bc736ss","Bk6ri7n","Bk5ld8o","c4eypz","felo30","Eshu5l","Bjwas2f","Bn1d65q","Bxeuatn","n51gp8","Beo2b4z","h6lo6r","Btyw6ap","w1pwid","Brwvgy3","yadkgm","neutral","none","a","h","m","useTableRowStyles_unstable","state","styles","layoutStyles","table","flex","className","isHeaderRow","size","noNativeElements","appearance"],"sources":["useTableRowStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { tableCellActionsClassNames } from '../TableCellActions/useTableCellActionsStyles.styles';\nimport { tableSelectionCellClassNames } from '../TableSelectionCell/useTableSelectionCellStyles.styles';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nexport const tableRowClassName = 'fui-TableRow';\nexport const tableRowClassNames = {\n    root: tableRowClassName\n};\nconst useTableLayoutStyles = makeStyles({\n    root: {\n        display: 'table-row'\n    }\n});\nconst useFlexLayoutStyles = makeStyles({\n    root: {\n        display: 'flex',\n        alignItems: 'center'\n    }\n});\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n    root: {\n        color: tokens.colorNeutralForeground1,\n        boxSizing: 'border-box',\n        ...createCustomFocusIndicatorStyle({\n            [`& .${tableSelectionCellClassNames.root}`]: {\n                opacity: 1\n            },\n            [`& .${tableCellActionsClassNames.root}`]: {\n                opacity: 1\n            }\n        }, {\n            selector: 'focus-within'\n        }),\n        ...createCustomFocusIndicatorStyle({\n            ...shorthands.outline('2px', 'solid', tokens.colorStrokeFocus2),\n            ...shorthands.borderRadius(tokens.borderRadiusMedium)\n        }, {\n            selector: 'focus'\n        })\n    },\n    rootInteractive: {\n        ':active': {\n            backgroundColor: tokens.colorSubtleBackgroundPressed,\n            color: tokens.colorNeutralForeground1Pressed,\n            [`& .${tableCellActionsClassNames.root}`]: {\n                opacity: 1\n            },\n            [`& .${tableSelectionCellClassNames.root}`]: {\n                opacity: 1\n            }\n        },\n        ':hover': {\n            backgroundColor: tokens.colorSubtleBackgroundHover,\n            color: tokens.colorNeutralForeground1Hover,\n            [`& .${tableCellActionsClassNames.root}`]: {\n                opacity: 1\n            },\n            [`& .${tableSelectionCellClassNames.root}`]: {\n                opacity: 1\n            }\n        }\n    },\n    medium: {\n        ...shorthands.borderBottom(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke2)\n    },\n    small: {\n        ...shorthands.borderBottom(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke2)\n    },\n    'extra-small': {\n        fontSize: tokens.fontSizeBase200\n    },\n    brand: {\n        backgroundColor: tokens.colorBrandBackground2,\n        ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive),\n        ':active': {\n            backgroundColor: tokens.colorBrandBackgroundInvertedSelected\n        },\n        '@media(forced-colors: active)': {\n            ...shorthands.border('2px', 'solid', 'transparent'),\n            ...shorthands.borderRadius(tokens.borderRadiusMedium),\n            boxSizing: 'border-box',\n            ':focus-visible': {\n                outlineOffset: '-4px'\n            }\n        }\n    },\n    neutral: {\n        '@media(forced-colors: active)': {\n            ...shorthands.border('2px', 'solid', 'transparent'),\n            ...shorthands.borderRadius(tokens.borderRadiusMedium),\n            boxSizing: 'border-box',\n            ':focus-visible': {\n                outlineOffset: '-4px'\n            }\n        },\n        backgroundColor: tokens.colorSubtleBackgroundSelected,\n        color: tokens.colorNeutralForeground1Hover,\n        ':hover': {\n            backgroundColor: tokens.colorSubtleBackgroundSelected\n        },\n        ':active': {\n            backgroundColor: tokens.colorSubtleBackgroundSelected\n        },\n        ...shorthands.borderColor(tokens.colorNeutralStrokeOnBrand)\n    },\n    none: {}\n});\n/**\n * Apply styling to the TableRow slots based on the state\n */ export const useTableRowStyles_unstable = (state)=>{\n    const styles = useStyles();\n    const layoutStyles = {\n        table: useTableLayoutStyles(),\n        flex: useFlexLayoutStyles()\n    };\n    state.root.className = mergeClasses(tableRowClassNames.root, styles.root, !state.isHeaderRow && styles.rootInteractive, styles[state.size], state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, styles[state.appearance], state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AACrE,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,0BAA0B,QAAQ,sDAAsD;AACjG,SAASC,4BAA4B,QAAQ,0DAA0D;AACvG,SAASC,+BAA+B,QAAQ,yBAAyB;AACzE,OAAO,MAAMC,iBAAiB,GAAG,cAAc;AAC/C,OAAO,MAAMC,kBAAkB,GAAG;EAC9BC,IAAI,EAAEF;AACV,CAAC;AACD,MAAMG,oBAAoB,gBAAGV,QAAA;EAAAS,IAAA;IAAAE,MAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAI5B,CAAC;AACF,MAAMC,mBAAmB,gBAAGb,QAAA;EAAAS,IAAA;IAAAE,MAAA;IAAAG,OAAA;EAAA;AAAA;EAAAF,CAAA;AAAA,CAK3B,CAAC;AACF;AACA;AACA;AAAI,MAAMG,SAAS,gBAAGf,QAAA;EAAAS,IAAA;IAAAO,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,eAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;EAAAC,KAAA;IAAAH,OAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;EAAA;IAAAE,OAAA;EAAA;EAAAC,KAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAN,OAAA;IAAAO,MAAA;IAAAlB,MAAA;IAAAmB,MAAA;IAAAC,KAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,OAAA;IAAAlB,MAAA;IAAAC,KAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAArB,MAAA;IAAA3B,MAAA;IAAAgB,MAAA;IAAAJ,MAAA;IAAAgB,MAAA;IAAAC,MAAA;IAAAN,OAAA;IAAAO,MAAA;EAAA;EAAAoB,IAAA;AAAA;EAAAtD,CAAA;EAAAuD,CAAA;EAAAC,CAAA;EAAAC,CAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;AAAA,CAuFrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,0BAA0B,GAAIC,KAAK,IAAG;EACnD,MAAMC,MAAM,GAAGzD,SAAS,CAAC,CAAC;EAC1B,MAAM0D,YAAY,GAAG;IACjBC,KAAK,EAAEhE,oBAAoB,CAAC,CAAC;IAC7BiE,IAAI,EAAE9D,mBAAmB,CAAC;EAC9B,CAAC;EACD0D,KAAK,CAAC9D,IAAI,CAACmE,SAAS,GAAG3E,YAAY,CAACO,kBAAkB,CAACC,IAAI,EAAE+D,MAAM,CAAC/D,IAAI,EAAE,CAAC8D,KAAK,CAACM,WAAW,IAAIL,MAAM,CAAC7C,eAAe,EAAE6C,MAAM,CAACD,KAAK,CAACO,IAAI,CAAC,EAAEP,KAAK,CAACQ,gBAAgB,GAAGN,YAAY,CAACE,IAAI,CAAClE,IAAI,GAAGgE,YAAY,CAACC,KAAK,CAACjE,IAAI,EAAE+D,MAAM,CAACD,KAAK,CAACS,UAAU,CAAC,EAAET,KAAK,CAAC9D,IAAI,CAACmE,SAAS,CAAC;EACtQ,OAAOL,KAAK;AAChB,CAAC"}

package/lib/hooks/useMeasureElement.js

@@ -25,11 +25,10 @@ import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts
         // cleanup previous container
         if (container.current) {
             resizeObserver.unobserve(container.current);
-            container.current.remove();
         }
-        if (el) {
-            container.current = targetDocument.createElement('div');
-            el.insertAdjacentElement('beforebegin', container.current);
+        container.current = undefined;
+        if (el === null || el === void 0 ? void 0 : el.parentElement) {
+            container.current = el.parentElement;
             resizeObserver.observe(container.current);
             handleResize();
         }

package/lib/hooks/useMeasureElement.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useMeasureElement.ts"],"sourcesContent":["import { canUseDOM } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\n\n/**\n * Provides a way of reporting element width.\n * Returns\n * `width` - current element width (0 by default),\n * `measureElementRef` - a ref function to be passed as `ref` to the element you want to measure\n */\nexport function useMeasureElement<TElement extends HTMLElement = HTMLElement>() {\n  const [width, setWidth] = React.useState(0);\n  const container = React.useRef<HTMLElement | undefined>(undefined);\n\n  const { targetDocument } = useFluent();\n\n  // the handler for resize observer\n  const handleResize = React.useCallback(() => {\n    const containerWidth = container.current?.getBoundingClientRect().width;\n    setWidth(containerWidth || 0);\n  }, []);\n\n  // Keep the reference of ResizeObserver in the state, as it should live through renders\n  const [resizeObserver] = React.useState(canUseDOM() ? new ResizeObserver(handleResize) : undefined);\n  const measureElementRef = React.useCallback(\n    (el: TElement | null) => {\n      if (!targetDocument || !resizeObserver) {\n        return;\n      }\n\n      // cleanup previous container\n      if (container.current) {\n        resizeObserver.unobserve(container.current);\n        container.current.remove();\n      }\n\n      if (el) {\n        container.current = targetDocument.createElement('div');\n        el.insertAdjacentElement('beforebegin', container.current);\n        resizeObserver.observe(container.current);\n        handleResize();\n      }\n    },\n    [targetDocument, resizeObserver, handleResize],\n  );\n\n  React.useEffect(() => {\n    return () => resizeObserver?.disconnect();\n  }, [resizeObserver]);\n\n  return { width, measureElementRef };\n}\n"],"names":["canUseDOM","React","useFluent_unstable","useFluent","useMeasureElement","width","setWidth","useState","container","useRef","undefined","targetDocument","handleResize","useCallback","containerWidth","current","getBoundingClientRect","resizeObserver","ResizeObserver","measureElementRef","el","unobserve","remove","createElement","insertAdjacentElement","observe","useEffect","disconnect"],"mappings":"AAAA,SAASA,SAAS,QAAQ,4BAA4B;AACtD,YAAYC,WAAW,QAAQ;AAC/B,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAElF;;;;;CAKC,GACD,OAAO,SAASC;IACd,MAAM,CAACC,OAAOC,SAAS,GAAGL,MAAMM,QAAQ,CAAC;IACzC,MAAMC,YAAYP,MAAMQ,MAAM,CAA0BC;IAExD,MAAM,EAAEC,cAAc,EAAE,GAAGR;IAE3B,kCAAkC;IAClC,MAAMS,eAAeX,MAAMY,WAAW,CAAC;YACdL;QAAvB,MAAMM,kBAAiBN,qBAAAA,UAAUO,OAAO,cAAjBP,yCAAAA,mBAAmBQ,qBAAqB,GAAGX,KAAK;QACvEC,SAASQ,kBAAkB;IAC7B,GAAG,EAAE;IAEL,uFAAuF;IACvF,MAAM,CAACG,eAAe,GAAGhB,MAAMM,QAAQ,CAACP,cAAc,IAAIkB,eAAeN,gBAAgBF;IACzF,MAAMS,oBAAoBlB,MAAMY,WAAW,CACzC,CAACO;QACC,IAAI,CAACT,kBAAkB,CAACM,gBAAgB;YACtC;QACF;QAEA,6BAA6B;QAC7B,IAAIT,UAAUO,OAAO,EAAE;YACrBE,eAAeI,SAAS,CAACb,UAAUO,OAAO;YAC1CP,UAAUO,OAAO,CAACO,MAAM;QAC1B;QAEA,IAAIF,IAAI;YACNZ,UAAUO,OAAO,GAAGJ,eAAeY,aAAa,CAAC;YACjDH,GAAGI,qBAAqB,CAAC,eAAehB,UAAUO,OAAO;YACzDE,eAAeQ,OAAO,CAACjB,UAAUO,OAAO;YACxCH;QACF;IACF,GACA;QAACD;QAAgBM;QAAgBL;KAAa;IAGhDX,MAAMyB,SAAS,CAAC;QACd,OAAO,IAAMT,2BAAAA,qCAAAA,eAAgBU,UAAU;IACzC,GAAG;QAACV;KAAe;IAEnB,OAAO;QAAEZ;QAAOc;IAAkB;AACpC"}
+{"version":3,"sources":["useMeasureElement.ts"],"sourcesContent":["import { canUseDOM } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\n\n/**\n * Provides a way of reporting element width.\n * Returns\n * `width` - current element width (0 by default),\n * `measureElementRef` - a ref function to be passed as `ref` to the element you want to measure\n */\nexport function useMeasureElement<TElement extends HTMLElement = HTMLElement>() {\n  const [width, setWidth] = React.useState(0);\n  const container = React.useRef<HTMLElement | undefined>(undefined);\n\n  const { targetDocument } = useFluent();\n\n  // the handler for resize observer\n  const handleResize = React.useCallback(() => {\n    const containerWidth = container.current?.getBoundingClientRect().width;\n    setWidth(containerWidth || 0);\n  }, []);\n\n  // Keep the reference of ResizeObserver in the state, as it should live through renders\n  const [resizeObserver] = React.useState(canUseDOM() ? new ResizeObserver(handleResize) : undefined);\n  const measureElementRef = React.useCallback(\n    (el: TElement | null) => {\n      if (!targetDocument || !resizeObserver) {\n        return;\n      }\n\n      // cleanup previous container\n      if (container.current) {\n        resizeObserver.unobserve(container.current);\n      }\n\n      container.current = undefined;\n      if (el?.parentElement) {\n        container.current = el.parentElement;\n        resizeObserver.observe(container.current);\n        handleResize();\n      }\n    },\n    [targetDocument, resizeObserver, handleResize],\n  );\n\n  React.useEffect(() => {\n    return () => resizeObserver?.disconnect();\n  }, [resizeObserver]);\n\n  return { width, measureElementRef };\n}\n"],"names":["canUseDOM","React","useFluent_unstable","useFluent","useMeasureElement","width","setWidth","useState","container","useRef","undefined","targetDocument","handleResize","useCallback","containerWidth","current","getBoundingClientRect","resizeObserver","ResizeObserver","measureElementRef","el","unobserve","parentElement","observe","useEffect","disconnect"],"mappings":"AAAA,SAASA,SAAS,QAAQ,4BAA4B;AACtD,YAAYC,WAAW,QAAQ;AAC/B,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAElF;;;;;CAKC,GACD,OAAO,SAASC;IACd,MAAM,CAACC,OAAOC,SAAS,GAAGL,MAAMM,QAAQ,CAAC;IACzC,MAAMC,YAAYP,MAAMQ,MAAM,CAA0BC;IAExD,MAAM,EAAEC,cAAc,EAAE,GAAGR;IAE3B,kCAAkC;IAClC,MAAMS,eAAeX,MAAMY,WAAW,CAAC;YACdL;QAAvB,MAAMM,kBAAiBN,qBAAAA,UAAUO,OAAO,cAAjBP,yCAAAA,mBAAmBQ,qBAAqB,GAAGX,KAAK;QACvEC,SAASQ,kBAAkB;IAC7B,GAAG,EAAE;IAEL,uFAAuF;IACvF,MAAM,CAACG,eAAe,GAAGhB,MAAMM,QAAQ,CAACP,cAAc,IAAIkB,eAAeN,gBAAgBF;IACzF,MAAMS,oBAAoBlB,MAAMY,WAAW,CACzC,CAACO;QACC,IAAI,CAACT,kBAAkB,CAACM,gBAAgB;YACtC;QACF;QAEA,6BAA6B;QAC7B,IAAIT,UAAUO,OAAO,EAAE;YACrBE,eAAeI,SAAS,CAACb,UAAUO,OAAO;QAC5C;QAEAP,UAAUO,OAAO,GAAGL;QACpB,IAAIU,eAAAA,yBAAAA,GAAIE,aAAa,EAAE;YACrBd,UAAUO,OAAO,GAAGK,GAAGE,aAAa;YACpCL,eAAeM,OAAO,CAACf,UAAUO,OAAO;YACxCH;QACF;IACF,GACA;QAACD;QAAgBM;QAAgBL;KAAa;IAGhDX,MAAMuB,SAAS,CAAC;QACd,OAAO,IAAMP,2BAAAA,qCAAAA,eAAgBQ,UAAU;IACzC,GAAG;QAACR;KAAe;IAEnB,OAAO;QAAEZ;QAAOc;IAAkB;AACpC"}

package/lib-commonjs/components/Table/useTable.js

@@ -19,8 +19,11 @@ const useTable_unstable = (props, ref)=>{
         components: {
             root: rootComponent
         },
-        root: _reactutilities.slot.always((0, _reactutilities.getNativeElementProps)(rootComponent, {
-            ref,
+        root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)(rootComponent, {
+            // FIXME:
+            // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`
+            // but since it would be a breaking change to fix it, we are casting ref to it's proper type
+            ref: ref,
             role: rootComponent === 'div' ? 'table' : undefined,
             ...props
         }), {

package/lib-commonjs/components/Table/useTable.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useTable.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\n/**\n * Create the state required to render Table.\n *\n * The returned state can be modified with hooks such as useTableStyles_unstable,\n * before being passed to renderTable_unstable.\n *\n * @param props - props from this instance of Table\n * @param ref - reference to root HTMLElement of Table\n */ export const useTable_unstable = (props, ref)=>{\n    var _props_as;\n    const rootComponent = ((_props_as = props.as) !== null && _props_as !== void 0 ? _props_as : props.noNativeElements) ? 'div' : 'table';\n    var _props_size, _props_noNativeElements, _props_sortable;\n    return {\n        components: {\n            root: rootComponent\n        },\n        root: slot.always(getNativeElementProps(rootComponent, {\n            ref,\n            role: rootComponent === 'div' ? 'table' : undefined,\n            ...props\n        }), {\n            elementType: rootComponent\n        }),\n        size: (_props_size = props.size) !== null && _props_size !== void 0 ? _props_size : 'medium',\n        noNativeElements: (_props_noNativeElements = props.noNativeElements) !== null && _props_noNativeElements !== void 0 ? _props_noNativeElements : false,\n        sortable: (_props_sortable = props.sortable) !== null && _props_sortable !== void 0 ? _props_sortable : false\n    };\n};\n"],"names":["useTable_unstable","props","ref","_props_as","rootComponent","as","noNativeElements","_props_size","_props_noNativeElements","_props_sortable","components","root","slot","always","getNativeElementProps","role","undefined","elementType","size","sortable"],"mappings":";;;;+BAUiBA;;;eAAAA;;;;iEAVM;gCACqB;AASjC,MAAMA,oBAAoB,CAACC,OAAOC;IACzC,IAAIC;IACJ,MAAMC,gBAAgB,AAAC,CAAA,AAACD,CAAAA,YAAYF,MAAMI,EAAE,AAAD,MAAO,QAAQF,cAAc,KAAK,IAAIA,YAAYF,MAAMK,gBAAgB,AAAD,IAAK,QAAQ;IAC/H,IAAIC,aAAaC,yBAAyBC;IAC1C,OAAO;QACHC,YAAY;YACRC,MAAMP;QACV;QACAO,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAACV,eAAe;YACnDF;YACAa,MAAMX,kBAAkB,QAAQ,UAAUY;YAC1C,GAAGf,KAAK;QACZ,IAAI;YACAgB,aAAab;QACjB;QACAc,MAAM,AAACX,CAAAA,cAAcN,MAAMiB,IAAI,AAAD,MAAO,QAAQX,gBAAgB,KAAK,IAAIA,cAAc;QACpFD,kBAAkB,AAACE,CAAAA,0BAA0BP,MAAMK,gBAAgB,AAAD,MAAO,QAAQE,4BAA4B,KAAK,IAAIA,0BAA0B;QAChJW,UAAU,AAACV,CAAAA,kBAAkBR,MAAMkB,QAAQ,AAAD,MAAO,QAAQV,oBAAoB,KAAK,IAAIA,kBAAkB;IAC5G;AACJ"}
+{"version":3,"sources":["useTable.js"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\n/**\n * Create the state required to render Table.\n *\n * The returned state can be modified with hooks such as useTableStyles_unstable,\n * before being passed to renderTable_unstable.\n *\n * @param props - props from this instance of Table\n * @param ref - reference to root HTMLElement of Table\n */ export const useTable_unstable = (props, ref)=>{\n    var _props_as;\n    const rootComponent = ((_props_as = props.as) !== null && _props_as !== void 0 ? _props_as : props.noNativeElements) ? 'div' : 'table';\n    var _props_size, _props_noNativeElements, _props_sortable;\n    return {\n        components: {\n            root: rootComponent\n        },\n        root: slot.always(getIntrinsicElementProps(rootComponent, {\n            // FIXME:\n            // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n            // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n            ref: ref,\n            role: rootComponent === 'div' ? 'table' : undefined,\n            ...props\n        }), {\n            elementType: rootComponent\n        }),\n        size: (_props_size = props.size) !== null && _props_size !== void 0 ? _props_size : 'medium',\n        noNativeElements: (_props_noNativeElements = props.noNativeElements) !== null && _props_noNativeElements !== void 0 ? _props_noNativeElements : false,\n        sortable: (_props_sortable = props.sortable) !== null && _props_sortable !== void 0 ? _props_sortable : false\n    };\n};\n"],"names":["useTable_unstable","props","ref","_props_as","rootComponent","as","noNativeElements","_props_size","_props_noNativeElements","_props_sortable","components","root","slot","always","getIntrinsicElementProps","role","undefined","elementType","size","sortable"],"mappings":";;;;+BAUiBA;;;eAAAA;;;;iEAVM;gCACwB;AASpC,MAAMA,oBAAoB,CAACC,OAAOC;IACzC,IAAIC;IACJ,MAAMC,gBAAgB,AAAC,CAAA,AAACD,CAAAA,YAAYF,MAAMI,EAAE,AAAD,MAAO,QAAQF,cAAc,KAAK,IAAIA,YAAYF,MAAMK,gBAAgB,AAAD,IAAK,QAAQ;IAC/H,IAAIC,aAAaC,yBAAyBC;IAC1C,OAAO;QACHC,YAAY;YACRC,MAAMP;QACV;QACAO,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,wCAAwB,EAACV,eAAe;YACtD,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FF,KAAKA;YACLa,MAAMX,kBAAkB,QAAQ,UAAUY;YAC1C,GAAGf,KAAK;QACZ,IAAI;YACAgB,aAAab;QACjB;QACAc,MAAM,AAACX,CAAAA,cAAcN,MAAMiB,IAAI,AAAD,MAAO,QAAQX,gBAAgB,KAAK,IAAIA,cAAc;QACpFD,kBAAkB,AAACE,CAAAA,0BAA0BP,MAAMK,gBAAgB,AAAD,MAAO,QAAQE,4BAA4B,KAAK,IAAIA,0BAA0B;QAChJW,UAAU,AAACV,CAAAA,kBAAkBR,MAAMkB,QAAQ,AAAD,MAAO,QAAQV,oBAAoB,KAAK,IAAIA,kBAAkB;IAC5G;AACJ"}

package/lib-commonjs/components/TableBody/useTableBody.js

@@ -20,8 +20,11 @@ const useTableBody_unstable = (props, ref)=>{
         components: {
             root: rootComponent
         },
-        root: _reactutilities.slot.always((0, _reactutilities.getNativeElementProps)(rootComponent, {
-            ref,
+        root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)(rootComponent, {
+            // FIXME:
+            // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`
+            // but since it would be a breaking change to fix it, we are casting ref to it's proper type
+            ref: ref,
             role: rootComponent === 'div' ? 'rowgroup' : undefined,
             ...props
         }), {

package/lib-commonjs/components/TableBody/useTableBody.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useTableBody.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\nimport { useTableContext } from '../../contexts/tableContext';\n/**\n * Create the state required to render TableBody.\n *\n * The returned state can be modified with hooks such as useTableBodyStyles_unstable,\n * before being passed to renderTableBody_unstable.\n *\n * @param props - props from this instance of TableBody\n * @param ref - reference to root HTMLElement of TableBody\n */ export const useTableBody_unstable = (props, ref)=>{\n    const { noNativeElements } = useTableContext();\n    var _props_as;\n    const rootComponent = ((_props_as = props.as) !== null && _props_as !== void 0 ? _props_as : noNativeElements) ? 'div' : 'tbody';\n    return {\n        components: {\n            root: rootComponent\n        },\n        root: slot.always(getNativeElementProps(rootComponent, {\n            ref,\n            role: rootComponent === 'div' ? 'rowgroup' : undefined,\n            ...props\n        }), {\n            elementType: rootComponent\n        }),\n        noNativeElements\n    };\n};\n"],"names":["useTableBody_unstable","props","ref","noNativeElements","useTableContext","_props_as","rootComponent","as","components","root","slot","always","getNativeElementProps","role","undefined","elementType"],"mappings":";;;;+BAWiBA;;;eAAAA;;;;iEAXM;gCACqB;8BACZ;AASrB,MAAMA,wBAAwB,CAACC,OAAOC;IAC7C,MAAM,EAAEC,gBAAgB,EAAE,GAAGC,IAAAA,6BAAe;IAC5C,IAAIC;IACJ,MAAMC,gBAAgB,AAAC,CAAA,AAACD,CAAAA,YAAYJ,MAAMM,EAAE,AAAD,MAAO,QAAQF,cAAc,KAAK,IAAIA,YAAYF,gBAAe,IAAK,QAAQ;IACzH,OAAO;QACHK,YAAY;YACRC,MAAMH;QACV;QACAG,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAACN,eAAe;YACnDJ;YACAW,MAAMP,kBAAkB,QAAQ,aAAaQ;YAC7C,GAAGb,KAAK;QACZ,IAAI;YACAc,aAAaT;QACjB;QACAH;IACJ;AACJ"}
+{"version":3,"sources":["useTableBody.js"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { useTableContext } from '../../contexts/tableContext';\n/**\n * Create the state required to render TableBody.\n *\n * The returned state can be modified with hooks such as useTableBodyStyles_unstable,\n * before being passed to renderTableBody_unstable.\n *\n * @param props - props from this instance of TableBody\n * @param ref - reference to root HTMLElement of TableBody\n */ export const useTableBody_unstable = (props, ref)=>{\n    const { noNativeElements } = useTableContext();\n    var _props_as;\n    const rootComponent = ((_props_as = props.as) !== null && _props_as !== void 0 ? _props_as : noNativeElements) ? 'div' : 'tbody';\n    return {\n        components: {\n            root: rootComponent\n        },\n        root: slot.always(getIntrinsicElementProps(rootComponent, {\n            // FIXME:\n            // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n            // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n            ref: ref,\n            role: rootComponent === 'div' ? 'rowgroup' : undefined,\n            ...props\n        }), {\n            elementType: rootComponent\n        }),\n        noNativeElements\n    };\n};\n"],"names":["useTableBody_unstable","props","ref","noNativeElements","useTableContext","_props_as","rootComponent","as","components","root","slot","always","getIntrinsicElementProps","role","undefined","elementType"],"mappings":";;;;+BAWiBA;;;eAAAA;;;;iEAXM;gCACwB;8BACf;AASrB,MAAMA,wBAAwB,CAACC,OAAOC;IAC7C,MAAM,EAAEC,gBAAgB,EAAE,GAAGC,IAAAA,6BAAe;IAC5C,IAAIC;IACJ,MAAMC,gBAAgB,AAAC,CAAA,AAACD,CAAAA,YAAYJ,MAAMM,EAAE,AAAD,MAAO,QAAQF,cAAc,KAAK,IAAIA,YAAYF,gBAAe,IAAK,QAAQ;IACzH,OAAO;QACHK,YAAY;YACRC,MAAMH;QACV;QACAG,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,wCAAwB,EAACN,eAAe;YACtD,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FJ,KAAKA;YACLW,MAAMP,kBAAkB,QAAQ,aAAaQ;YAC7C,GAAGb,KAAK;QACZ,IAAI;YACAc,aAAaT;QACjB;QACAH;IACJ;AACJ"}

package/lib-commonjs/components/TableCell/useTableCell.js

@@ -20,8 +20,11 @@ const useTableCell_unstable = (props, ref)=>{
         components: {
             root: rootComponent
         },
-        root: _reactutilities.slot.always((0, _reactutilities.getNativeElementProps)(rootComponent, {
-            ref,
+        root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)(rootComponent, {
+            // FIXME:
+            // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`
+            // but since it would be a breaking change to fix it, we are casting ref to it's proper type
+            ref: ref,
             role: rootComponent === 'div' ? 'cell' : undefined,
             ...props
         }), {

package/lib-commonjs/components/TableCell/useTableCell.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useTableCell.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\nimport { useTableContext } from '../../contexts/tableContext';\n/**\n * Create the state required to render TableCell.\n *\n * The returned state can be modified with hooks such as useTableCellStyles_unstable,\n * before being passed to renderTableCell_unstable.\n *\n * @param props - props from this instance of TableCell\n * @param ref - reference to root HTMLElement of TableCell\n */ export const useTableCell_unstable = (props, ref)=>{\n    const { noNativeElements, size } = useTableContext();\n    var _props_as;\n    const rootComponent = ((_props_as = props.as) !== null && _props_as !== void 0 ? _props_as : noNativeElements) ? 'div' : 'td';\n    return {\n        components: {\n            root: rootComponent\n        },\n        root: slot.always(getNativeElementProps(rootComponent, {\n            ref,\n            role: rootComponent === 'div' ? 'cell' : undefined,\n            ...props\n        }), {\n            elementType: rootComponent\n        }),\n        noNativeElements,\n        size\n    };\n};\n"],"names":["useTableCell_unstable","props","ref","noNativeElements","size","useTableContext","_props_as","rootComponent","as","components","root","slot","always","getNativeElementProps","role","undefined","elementType"],"mappings":";;;;+BAWiBA;;;eAAAA;;;;iEAXM;gCACqB;8BACZ;AASrB,MAAMA,wBAAwB,CAACC,OAAOC;IAC7C,MAAM,EAAEC,gBAAgB,EAAEC,IAAI,EAAE,GAAGC,IAAAA,6BAAe;IAClD,IAAIC;IACJ,MAAMC,gBAAgB,AAAC,CAAA,AAACD,CAAAA,YAAYL,MAAMO,EAAE,AAAD,MAAO,QAAQF,cAAc,KAAK,IAAIA,YAAYH,gBAAe,IAAK,QAAQ;IACzH,OAAO;QACHM,YAAY;YACRC,MAAMH;QACV;QACAG,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAACN,eAAe;YACnDL;YACAY,MAAMP,kBAAkB,QAAQ,SAASQ;YACzC,GAAGd,KAAK;QACZ,IAAI;YACAe,aAAaT;QACjB;QACAJ;QACAC;IACJ;AACJ"}
+{"version":3,"sources":["useTableCell.js"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { useTableContext } from '../../contexts/tableContext';\n/**\n * Create the state required to render TableCell.\n *\n * The returned state can be modified with hooks such as useTableCellStyles_unstable,\n * before being passed to renderTableCell_unstable.\n *\n * @param props - props from this instance of TableCell\n * @param ref - reference to root HTMLElement of TableCell\n */ export const useTableCell_unstable = (props, ref)=>{\n    const { noNativeElements, size } = useTableContext();\n    var _props_as;\n    const rootComponent = ((_props_as = props.as) !== null && _props_as !== void 0 ? _props_as : noNativeElements) ? 'div' : 'td';\n    return {\n        components: {\n            root: rootComponent\n        },\n        root: slot.always(getIntrinsicElementProps(rootComponent, {\n            // FIXME:\n            // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n            // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n            ref: ref,\n            role: rootComponent === 'div' ? 'cell' : undefined,\n            ...props\n        }), {\n            elementType: rootComponent\n        }),\n        noNativeElements,\n        size\n    };\n};\n"],"names":["useTableCell_unstable","props","ref","noNativeElements","size","useTableContext","_props_as","rootComponent","as","components","root","slot","always","getIntrinsicElementProps","role","undefined","elementType"],"mappings":";;;;+BAWiBA;;;eAAAA;;;;iEAXM;gCACwB;8BACf;AASrB,MAAMA,wBAAwB,CAACC,OAAOC;IAC7C,MAAM,EAAEC,gBAAgB,EAAEC,IAAI,EAAE,GAAGC,IAAAA,6BAAe;IAClD,IAAIC;IACJ,MAAMC,gBAAgB,AAAC,CAAA,AAACD,CAAAA,YAAYL,MAAMO,EAAE,AAAD,MAAO,QAAQF,cAAc,KAAK,IAAIA,YAAYH,gBAAe,IAAK,QAAQ;IACzH,OAAO;QACHM,YAAY;YACRC,MAAMH;QACV;QACAG,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,wCAAwB,EAACN,eAAe;YACtD,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FL,KAAKA;YACLY,MAAMP,kBAAkB,QAAQ,SAASQ;YACzC,GAAGd,KAAK;QACZ,IAAI;YACAe,aAAaT;QACjB;QACAJ;QACAC;IACJ;AACJ"}

package/lib-commonjs/components/TableCell/useTableCellStyles.styles.js

@@ -82,7 +82,6 @@ const useFlexLayoutStyles = /*#__PURE__*/ (0, _react.__styles)({
  * Styles for the root slot
  */ const useStyles = /*#__PURE__*/ (0, _react.__styles)({
     root: {
-        De3pzq: "f1u2r49w",
         qhf8xq: "f10pi13n",
         z8tnut: "f1nbblvp",
         z189sj: [
@@ -116,7 +115,6 @@ const useFlexLayoutStyles = /*#__PURE__*/ (0, _react.__styles)({
     }
 }, {
     d: [
-        ".f1u2r49w{background-color:inherit;}",
         ".f10pi13n{position:relative;}",
         ".f1nbblvp{padding-top:0px;}",
         ".f1vdfbxk{padding-right:var(--spacingHorizontalS);}",

package/lib-commonjs/components/TableCell/useTableCellStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useTableCellStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nexport const tableCellClassName = 'fui-TableCell';\nexport const tableCellClassNames = {\n  root: tableCellClassName\n};\nconst useTableLayoutStyles = /*#__PURE__*/__styles({\n  root: {\n    mc9l5x: \"f15pt5es\",\n    ha4doy: \"fmrv4ls\"\n  },\n  medium: {\n    Bqenvij: \"f1ft4266\"\n  },\n  small: {\n    Bqenvij: \"fbsu25e\"\n  },\n  \"extra-small\": {\n    Bqenvij: \"frvgh55\"\n  }\n}, {\n  d: [\".f15pt5es{display:table-cell;}\", \".fmrv4ls{vertical-align:middle;}\", \".f1ft4266{height:44px;}\", \".fbsu25e{height:34px;}\", \".frvgh55{height:24px;}\"]\n});\nconst useFlexLayoutStyles = /*#__PURE__*/__styles({\n  root: {\n    mc9l5x: \"f22iagw\",\n    Bf4jedk: \"f10tiqix\",\n    Bt984gj: \"f122n59\",\n    Bh6795r: \"fqerorx\",\n    Bnnss6s: \"f1neuvcm\",\n    xawz: \"fkjuxzh\"\n  },\n  medium: {\n    sshi5w: \"f5pgtk9\"\n  },\n  small: {\n    sshi5w: \"fcep9tg\"\n  },\n  \"extra-small\": {\n    sshi5w: \"f1pha7fy\"\n  }\n}, {\n  d: [\".f22iagw{display:flex;}\", \".f10tiqix{min-width:0px;}\", \".f122n59{align-items:center;}\", \".fqerorx{flex-grow:1;}\", \".f1neuvcm{flex-shrink:1;}\", \".fkjuxzh{flex-basis:0px;}\", \".f5pgtk9{min-height:44px;}\", \".fcep9tg{min-height:34px;}\", \".f1pha7fy{min-height:24px;}\"]\n});\n/**\n * Styles for the root slot\n */\nconst useStyles = /*#__PURE__*/__styles({\n  root: {\n    De3pzq: \"f1u2r49w\",\n    qhf8xq: \"f10pi13n\",\n    z8tnut: \"f1nbblvp\",\n    z189sj: [\"f1vdfbxk\", \"f1f5gg8d\"],\n    Byoj8tv: \"f1ov4xf1\",\n    uwmqm3: [\"f1f5gg8d\", \"f1vdfbxk\"],\n    Bn4voq9: \"fz36nt7\",\n    g9k6zt: \"f9znhxp\",\n    Bfpq7zp: \"fqrak0z\",\n    kdpuga: [\"f1o2ludy\", \"f1kjnpwc\"],\n    Bw81rd7: [\"f1kjnpwc\", \"f1o2ludy\"],\n    B6xbmo0: [\"fxmnebo\", \"f1witrsb\"],\n    dm238s: [\"f1witrsb\", \"fxmnebo\"]\n  }\n}, {\n  d: [\".f1u2r49w{background-color:inherit;}\", \".f10pi13n{position:relative;}\", \".f1nbblvp{padding-top:0px;}\", \".f1vdfbxk{padding-right:var(--spacingHorizontalS);}\", \".f1f5gg8d{padding-left:var(--spacingHorizontalS);}\", \".f1ov4xf1{padding-bottom:0px;}\", \".fz36nt7[data-fui-focus-visible]{outline-width:2px;}\", \".f9znhxp[data-fui-focus-visible]{outline-style:solid;}\", \".fqrak0z[data-fui-focus-visible]{outline-color:var(--colorStrokeFocus2);}\", \".f1o2ludy[data-fui-focus-visible]{border-bottom-right-radius:var(--borderRadiusMedium);}\", \".f1kjnpwc[data-fui-focus-visible]{border-bottom-left-radius:var(--borderRadiusMedium);}\", \".fxmnebo[data-fui-focus-visible]{border-top-right-radius:var(--borderRadiusMedium);}\", \".f1witrsb[data-fui-focus-visible]{border-top-left-radius:var(--borderRadiusMedium);}\"]\n});\n/**\n * Apply styling to the TableCell slots based on the state\n */\nexport const useTableCellStyles_unstable = state => {\n  const styles = useStyles();\n  const layoutStyles = {\n    table: useTableLayoutStyles(),\n    flex: useFlexLayoutStyles()\n  };\n  state.root.className = mergeClasses(tableCellClassNames.root, styles.root, state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, state.noNativeElements ? layoutStyles.flex[state.size] : layoutStyles.table[state.size], state.root.className);\n  return state;\n};\n//# sourceMappingURL=useTableCellStyles.styles.js.map"],"names":["tableCellClassName","tableCellClassNames","useTableCellStyles_unstable","root","useTableLayoutStyles","__styles","mc9l5x","ha4doy","medium","Bqenvij","small","d","useFlexLayoutStyles","Bf4jedk","Bt984gj","Bh6795r","Bnnss6s","xawz","sshi5w","useStyles","De3pzq","qhf8xq","z8tnut","z189sj","Byoj8tv","uwmqm3","Bn4voq9","g9k6zt","Bfpq7zp","kdpuga","Bw81rd7","B6xbmo0","dm238s","state","styles","layoutStyles","table","flex","className","mergeClasses","noNativeElements","size"],"mappings":";;;;;;;;;;;IAGaA,kBAAkB;eAAlBA;;IACAC,mBAAmB;eAAnBA;;IAkEAC,2BAA2B;eAA3BA;;;uBAtEsC;AAG5C,MAAMF,qBAAqB;AAC3B,MAAMC,sBAAsB;IACjCE,MAAMH;AACR;AACA,MAAMI,uBAAuB,WAAW,GAAEC,IAAAA,eAAQ,EAAC;IACjDF,MAAM;QACJG,QAAQ;QACRC,QAAQ;IACV;IACAC,QAAQ;QACNC,SAAS;IACX;IACAC,OAAO;QACLD,SAAS;IACX;IACA,eAAe;QACbA,SAAS;IACX;AACF,GAAG;IACDE,GAAG;QAAC;QAAkC;QAAoC;QAA2B;QAA0B;KAAyB;AAC1J;AACA,MAAMC,sBAAsB,WAAW,GAAEP,IAAAA,eAAQ,EAAC;IAChDF,MAAM;QACJG,QAAQ;QACRO,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,MAAM;IACR;IACAT,QAAQ;QACNU,QAAQ;IACV;IACAR,OAAO;QACLQ,QAAQ;IACV;IACA,eAAe;QACbA,QAAQ;IACV;AACF,GAAG;IACDP,GAAG;QAAC;QAA2B;QAA6B;QAAiC;QAA0B;QAA6B;QAA6B;QAA8B;QAA8B;KAA8B;AAC7Q;AACA;;CAEC,GACD,MAAMQ,YAAY,WAAW,GAAEd,IAAAA,eAAQ,EAAC;IACtCF,MAAM;QACJiB,QAAQ;QACRC,QAAQ;QACRC,QAAQ;QACRC,QAAQ;YAAC;YAAY;SAAW;QAChCC,SAAS;QACTC,QAAQ;YAAC;YAAY;SAAW;QAChCC,SAAS;QACTC,QAAQ;QACRC,SAAS;QACTC,QAAQ;YAAC;YAAY;SAAW;QAChCC,SAAS;YAAC;YAAY;SAAW;QACjCC,SAAS;YAAC;YAAW;SAAW;QAChCC,QAAQ;YAAC;YAAY;SAAU;IACjC;AACF,GAAG;IACDrB,GAAG;QAAC;QAAwC;QAAiC;QAA+B;QAAuD;QAAsD;QAAkC;QAAwD;QAA0D;QAA6E;QAA4F;QAA2F;QAAwF;KAAuF;AAClyB;AAIO,MAAMT,8BAA8B+B,CAAAA;IACzC,MAAMC,SAASf;IACf,MAAMgB,eAAe;QACnBC,OAAOhC;QACPiC,MAAMzB;IACR;IACAqB,MAAM9B,IAAI,CAACmC,SAAS,GAAGC,IAAAA,mBAAY,EAACtC,oBAAoBE,IAAI,EAAE+B,OAAO/B,IAAI,EAAE8B,MAAMO,gBAAgB,GAAGL,aAAaE,IAAI,CAAClC,IAAI,GAAGgC,aAAaC,KAAK,CAACjC,IAAI,EAAE8B,MAAMO,gBAAgB,GAAGL,aAAaE,IAAI,CAACJ,MAAMQ,IAAI,CAAC,GAAGN,aAAaC,KAAK,CAACH,MAAMQ,IAAI,CAAC,EAAER,MAAM9B,IAAI,CAACmC,SAAS;IACnQ,OAAOL;AACT,GACA,qDAAqD"}
+{"version":3,"sources":["useTableCellStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nexport const tableCellClassName = 'fui-TableCell';\nexport const tableCellClassNames = {\n  root: tableCellClassName\n};\nconst useTableLayoutStyles = /*#__PURE__*/__styles({\n  root: {\n    mc9l5x: \"f15pt5es\",\n    ha4doy: \"fmrv4ls\"\n  },\n  medium: {\n    Bqenvij: \"f1ft4266\"\n  },\n  small: {\n    Bqenvij: \"fbsu25e\"\n  },\n  \"extra-small\": {\n    Bqenvij: \"frvgh55\"\n  }\n}, {\n  d: [\".f15pt5es{display:table-cell;}\", \".fmrv4ls{vertical-align:middle;}\", \".f1ft4266{height:44px;}\", \".fbsu25e{height:34px;}\", \".frvgh55{height:24px;}\"]\n});\nconst useFlexLayoutStyles = /*#__PURE__*/__styles({\n  root: {\n    mc9l5x: \"f22iagw\",\n    Bf4jedk: \"f10tiqix\",\n    Bt984gj: \"f122n59\",\n    Bh6795r: \"fqerorx\",\n    Bnnss6s: \"f1neuvcm\",\n    xawz: \"fkjuxzh\"\n  },\n  medium: {\n    sshi5w: \"f5pgtk9\"\n  },\n  small: {\n    sshi5w: \"fcep9tg\"\n  },\n  \"extra-small\": {\n    sshi5w: \"f1pha7fy\"\n  }\n}, {\n  d: [\".f22iagw{display:flex;}\", \".f10tiqix{min-width:0px;}\", \".f122n59{align-items:center;}\", \".fqerorx{flex-grow:1;}\", \".f1neuvcm{flex-shrink:1;}\", \".fkjuxzh{flex-basis:0px;}\", \".f5pgtk9{min-height:44px;}\", \".fcep9tg{min-height:34px;}\", \".f1pha7fy{min-height:24px;}\"]\n});\n/**\n * Styles for the root slot\n */\nconst useStyles = /*#__PURE__*/__styles({\n  root: {\n    qhf8xq: \"f10pi13n\",\n    z8tnut: \"f1nbblvp\",\n    z189sj: [\"f1vdfbxk\", \"f1f5gg8d\"],\n    Byoj8tv: \"f1ov4xf1\",\n    uwmqm3: [\"f1f5gg8d\", \"f1vdfbxk\"],\n    Bn4voq9: \"fz36nt7\",\n    g9k6zt: \"f9znhxp\",\n    Bfpq7zp: \"fqrak0z\",\n    kdpuga: [\"f1o2ludy\", \"f1kjnpwc\"],\n    Bw81rd7: [\"f1kjnpwc\", \"f1o2ludy\"],\n    B6xbmo0: [\"fxmnebo\", \"f1witrsb\"],\n    dm238s: [\"f1witrsb\", \"fxmnebo\"]\n  }\n}, {\n  d: [\".f10pi13n{position:relative;}\", \".f1nbblvp{padding-top:0px;}\", \".f1vdfbxk{padding-right:var(--spacingHorizontalS);}\", \".f1f5gg8d{padding-left:var(--spacingHorizontalS);}\", \".f1ov4xf1{padding-bottom:0px;}\", \".fz36nt7[data-fui-focus-visible]{outline-width:2px;}\", \".f9znhxp[data-fui-focus-visible]{outline-style:solid;}\", \".fqrak0z[data-fui-focus-visible]{outline-color:var(--colorStrokeFocus2);}\", \".f1o2ludy[data-fui-focus-visible]{border-bottom-right-radius:var(--borderRadiusMedium);}\", \".f1kjnpwc[data-fui-focus-visible]{border-bottom-left-radius:var(--borderRadiusMedium);}\", \".fxmnebo[data-fui-focus-visible]{border-top-right-radius:var(--borderRadiusMedium);}\", \".f1witrsb[data-fui-focus-visible]{border-top-left-radius:var(--borderRadiusMedium);}\"]\n});\n/**\n * Apply styling to the TableCell slots based on the state\n */\nexport const useTableCellStyles_unstable = state => {\n  const styles = useStyles();\n  const layoutStyles = {\n    table: useTableLayoutStyles(),\n    flex: useFlexLayoutStyles()\n  };\n  state.root.className = mergeClasses(tableCellClassNames.root, styles.root, state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, state.noNativeElements ? layoutStyles.flex[state.size] : layoutStyles.table[state.size], state.root.className);\n  return state;\n};\n//# sourceMappingURL=useTableCellStyles.styles.js.map"],"names":["tableCellClassName","tableCellClassNames","useTableCellStyles_unstable","root","useTableLayoutStyles","__styles","mc9l5x","ha4doy","medium","Bqenvij","small","d","useFlexLayoutStyles","Bf4jedk","Bt984gj","Bh6795r","Bnnss6s","xawz","sshi5w","useStyles","qhf8xq","z8tnut","z189sj","Byoj8tv","uwmqm3","Bn4voq9","g9k6zt","Bfpq7zp","kdpuga","Bw81rd7","B6xbmo0","dm238s","state","styles","layoutStyles","table","flex","className","mergeClasses","noNativeElements","size"],"mappings":";;;;;;;;;;;IAGaA,kBAAkB;eAAlBA;;IACAC,mBAAmB;eAAnBA;;IAiEAC,2BAA2B;eAA3BA;;;uBArEsC;AAG5C,MAAMF,qBAAqB;AAC3B,MAAMC,sBAAsB;IACjCE,MAAMH;AACR;AACA,MAAMI,uBAAuB,WAAW,GAAEC,IAAAA,eAAQ,EAAC;IACjDF,MAAM;QACJG,QAAQ;QACRC,QAAQ;IACV;IACAC,QAAQ;QACNC,SAAS;IACX;IACAC,OAAO;QACLD,SAAS;IACX;IACA,eAAe;QACbA,SAAS;IACX;AACF,GAAG;IACDE,GAAG;QAAC;QAAkC;QAAoC;QAA2B;QAA0B;KAAyB;AAC1J;AACA,MAAMC,sBAAsB,WAAW,GAAEP,IAAAA,eAAQ,EAAC;IAChDF,MAAM;QACJG,QAAQ;QACRO,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,MAAM;IACR;IACAT,QAAQ;QACNU,QAAQ;IACV;IACAR,OAAO;QACLQ,QAAQ;IACV;IACA,eAAe;QACbA,QAAQ;IACV;AACF,GAAG;IACDP,GAAG;QAAC;QAA2B;QAA6B;QAAiC;QAA0B;QAA6B;QAA6B;QAA8B;QAA8B;KAA8B;AAC7Q;AACA;;CAEC,GACD,MAAMQ,YAAY,WAAW,GAAEd,IAAAA,eAAQ,EAAC;IACtCF,MAAM;QACJiB,QAAQ;QACRC,QAAQ;QACRC,QAAQ;YAAC;YAAY;SAAW;QAChCC,SAAS;QACTC,QAAQ;YAAC;YAAY;SAAW;QAChCC,SAAS;QACTC,QAAQ;QACRC,SAAS;QACTC,QAAQ;YAAC;YAAY;SAAW;QAChCC,SAAS;YAAC;YAAY;SAAW;QACjCC,SAAS;YAAC;YAAW;SAAW;QAChCC,QAAQ;YAAC;YAAY;SAAU;IACjC;AACF,GAAG;IACDpB,GAAG;QAAC;QAAiC;QAA+B;QAAuD;QAAsD;QAAkC;QAAwD;QAA0D;QAA6E;QAA4F;QAA2F;QAAwF;KAAuF;AAC1vB;AAIO,MAAMT,8BAA8B8B,CAAAA;IACzC,MAAMC,SAASd;IACf,MAAMe,eAAe;QACnBC,OAAO/B;QACPgC,MAAMxB;IACR;IACAoB,MAAM7B,IAAI,CAACkC,SAAS,GAAGC,IAAAA,mBAAY,EAACrC,oBAAoBE,IAAI,EAAE8B,OAAO9B,IAAI,EAAE6B,MAAMO,gBAAgB,GAAGL,aAAaE,IAAI,CAACjC,IAAI,GAAG+B,aAAaC,KAAK,CAAChC,IAAI,EAAE6B,MAAMO,gBAAgB,GAAGL,aAAaE,IAAI,CAACJ,MAAMQ,IAAI,CAAC,GAAGN,aAAaC,KAAK,CAACH,MAAMQ,IAAI,CAAC,EAAER,MAAM7B,IAAI,CAACkC,SAAS;IACnQ,OAAOL;AACT,GACA,qDAAqD"}

package/lib-commonjs/components/TableCellActions/useTableCellActions.js

@@ -17,8 +17,11 @@ const useTableCellActions_unstable = (props, ref)=>{
         components: {
             root: 'div'
         },
-        root: _reactutilities.slot.always((0, _reactutilities.getNativeElementProps)('div', {
-            ref,
+        root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)('div', {
+            // FIXME:
+            // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`
+            // but since it would be a breaking change to fix it, we are casting ref to it's proper type
+            ref: ref,
             ...props
         }), {
             elementType: 'div'

package/lib-commonjs/components/TableCellActions/useTableCellActions.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useTableCellActions.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\n/**\n * Create the state required to render TableCellActions.\n *\n * The returned state can be modified with hooks such as useTableCellActionsStyles_unstable,\n * before being passed to renderTableCellActions_unstable.\n *\n * @param props - props from this instance of TableCellActions\n * @param ref - reference to root HTMLElement of TableCellActions\n */ export const useTableCellActions_unstable = (props, ref)=>{\n    var _props_visible;\n    return {\n        components: {\n            root: 'div'\n        },\n        root: slot.always(getNativeElementProps('div', {\n            ref,\n            ...props\n        }), {\n            elementType: 'div'\n        }),\n        visible: (_props_visible = props.visible) !== null && _props_visible !== void 0 ? _props_visible : false\n    };\n};\n"],"names":["useTableCellActions_unstable","props","ref","_props_visible","components","root","slot","always","getNativeElementProps","elementType","visible"],"mappings":";;;;+BAUiBA;;;eAAAA;;;;iEAVM;gCACqB;AASjC,MAAMA,+BAA+B,CAACC,OAAOC;IACpD,IAAIC;IACJ,OAAO;QACHC,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAAC,OAAO;YAC3CN;YACA,GAAGD,KAAK;QACZ,IAAI;YACAQ,aAAa;QACjB;QACAC,SAAS,AAACP,CAAAA,iBAAiBF,MAAMS,OAAO,AAAD,MAAO,QAAQP,mBAAmB,KAAK,IAAIA,iBAAiB;IACvG;AACJ"}
+{"version":3,"sources":["useTableCellActions.js"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\n/**\n * Create the state required to render TableCellActions.\n *\n * The returned state can be modified with hooks such as useTableCellActionsStyles_unstable,\n * before being passed to renderTableCellActions_unstable.\n *\n * @param props - props from this instance of TableCellActions\n * @param ref - reference to root HTMLElement of TableCellActions\n */ export const useTableCellActions_unstable = (props, ref)=>{\n    var _props_visible;\n    return {\n        components: {\n            root: 'div'\n        },\n        root: slot.always(getIntrinsicElementProps('div', {\n            // FIXME:\n            // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n            // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n            ref: ref,\n            ...props\n        }), {\n            elementType: 'div'\n        }),\n        visible: (_props_visible = props.visible) !== null && _props_visible !== void 0 ? _props_visible : false\n    };\n};\n"],"names":["useTableCellActions_unstable","props","ref","_props_visible","components","root","slot","always","getIntrinsicElementProps","elementType","visible"],"mappings":";;;;+BAUiBA;;;eAAAA;;;;iEAVM;gCACwB;AASpC,MAAMA,+BAA+B,CAACC,OAAOC;IACpD,IAAIC;IACJ,OAAO;QACHC,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,wCAAwB,EAAC,OAAO;YAC9C,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FN,KAAKA;YACL,GAAGD,KAAK;QACZ,IAAI;YACAQ,aAAa;QACjB;QACAC,SAAS,AAACP,CAAAA,iBAAiBF,MAAMS,OAAO,AAAD,MAAO,QAAQP,mBAAmB,KAAK,IAAIA,iBAAiB;IACvG;AACJ"}

package/lib-commonjs/components/TableCellLayout/useTableCellLayout.js

@@ -27,8 +27,11 @@ const useTableCellLayout_unstable = (props, ref)=>{
             content: 'div',
             media: 'span'
         },
-        root: _reactutilities.slot.always((0, _reactutilities.getNativeElementProps)('div', {
-            ref,
+        root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)('div', {
+            // FIXME:
+            // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`
+            // but since it would be a breaking change to fix it, we are casting ref to it's proper type
+            ref: ref,
             ...props
         }), {
             elementType: 'div'

package/lib-commonjs/components/TableCellLayout/useTableCellLayout.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useTableCellLayout.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\nimport { useTableContext } from '../../contexts/tableContext';\nconst tableAvatarSizeMap = {\n    medium: 32,\n    small: 24,\n    'extra-small': 20\n};\n/**\n * Create the state required to render TableCellLayout.\n *\n * The returned state can be modified with hooks such as useTableCellLayoutStyles_unstable,\n * before being passed to renderTableCellLayout_unstable.\n *\n * @param props - props from this instance of TableCellLayout\n * @param ref - reference to root HTMLElement of TableCellLayout\n */ export const useTableCellLayout_unstable = (props, ref)=>{\n    const { size } = useTableContext();\n    return {\n        components: {\n            root: 'div',\n            main: 'span',\n            description: 'span',\n            content: 'div',\n            media: 'span'\n        },\n        root: slot.always(getNativeElementProps('div', {\n            ref,\n            ...props\n        }), {\n            elementType: 'div'\n        }),\n        appearance: props.appearance,\n        truncate: props.truncate,\n        main: slot.optional(props.main, {\n            renderByDefault: true,\n            elementType: 'span'\n        }),\n        media: slot.optional(props.media, {\n            elementType: 'span'\n        }),\n        description: slot.optional(props.description, {\n            elementType: 'span'\n        }),\n        content: slot.optional(props.content, {\n            renderByDefault: !!props.description || !!props.children,\n            elementType: 'div'\n        }),\n        avatarSize: tableAvatarSizeMap[size],\n        size\n    };\n};\n"],"names":["useTableCellLayout_unstable","tableAvatarSizeMap","medium","small","props","ref","size","useTableContext","components","root","main","description","content","media","slot","always","getNativeElementProps","elementType","appearance","truncate","optional","renderByDefault","children","avatarSize"],"mappings":";;;;+BAgBiBA;;;eAAAA;;;;iEAhBM;gCACqB;8BACZ;AAChC,MAAMC,qBAAqB;IACvBC,QAAQ;IACRC,OAAO;IACP,eAAe;AACnB;AASW,MAAMH,8BAA8B,CAACI,OAAOC;IACnD,MAAM,EAAEC,IAAI,EAAE,GAAGC,IAAAA,6BAAe;IAChC,OAAO;QACHC,YAAY;YACRC,MAAM;YACNC,MAAM;YACNC,aAAa;YACbC,SAAS;YACTC,OAAO;QACX;QACAJ,MAAMK,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAAC,OAAO;YAC3CX;YACA,GAAGD,KAAK;QACZ,IAAI;YACAa,aAAa;QACjB;QACAC,YAAYd,MAAMc,UAAU;QAC5BC,UAAUf,MAAMe,QAAQ;QACxBT,MAAMI,oBAAI,CAACM,QAAQ,CAAChB,MAAMM,IAAI,EAAE;YAC5BW,iBAAiB;YACjBJ,aAAa;QACjB;QACAJ,OAAOC,oBAAI,CAACM,QAAQ,CAAChB,MAAMS,KAAK,EAAE;YAC9BI,aAAa;QACjB;QACAN,aAAaG,oBAAI,CAACM,QAAQ,CAAChB,MAAMO,WAAW,EAAE;YAC1CM,aAAa;QACjB;QACAL,SAASE,oBAAI,CAACM,QAAQ,CAAChB,MAAMQ,OAAO,EAAE;YAClCS,iBAAiB,CAAC,CAACjB,MAAMO,WAAW,IAAI,CAAC,CAACP,MAAMkB,QAAQ;YACxDL,aAAa;QACjB;QACAM,YAAYtB,kBAAkB,CAACK,KAAK;QACpCA;IACJ;AACJ"}
+{"version":3,"sources":["useTableCellLayout.js"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { useTableContext } from '../../contexts/tableContext';\nconst tableAvatarSizeMap = {\n    medium: 32,\n    small: 24,\n    'extra-small': 20\n};\n/**\n * Create the state required to render TableCellLayout.\n *\n * The returned state can be modified with hooks such as useTableCellLayoutStyles_unstable,\n * before being passed to renderTableCellLayout_unstable.\n *\n * @param props - props from this instance of TableCellLayout\n * @param ref - reference to root HTMLElement of TableCellLayout\n */ export const useTableCellLayout_unstable = (props, ref)=>{\n    const { size } = useTableContext();\n    return {\n        components: {\n            root: 'div',\n            main: 'span',\n            description: 'span',\n            content: 'div',\n            media: 'span'\n        },\n        root: slot.always(getIntrinsicElementProps('div', {\n            // FIXME:\n            // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n            // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n            ref: ref,\n            ...props\n        }), {\n            elementType: 'div'\n        }),\n        appearance: props.appearance,\n        truncate: props.truncate,\n        main: slot.optional(props.main, {\n            renderByDefault: true,\n            elementType: 'span'\n        }),\n        media: slot.optional(props.media, {\n            elementType: 'span'\n        }),\n        description: slot.optional(props.description, {\n            elementType: 'span'\n        }),\n        content: slot.optional(props.content, {\n            renderByDefault: !!props.description || !!props.children,\n            elementType: 'div'\n        }),\n        avatarSize: tableAvatarSizeMap[size],\n        size\n    };\n};\n"],"names":["useTableCellLayout_unstable","tableAvatarSizeMap","medium","small","props","ref","size","useTableContext","components","root","main","description","content","media","slot","always","getIntrinsicElementProps","elementType","appearance","truncate","optional","renderByDefault","children","avatarSize"],"mappings":";;;;+BAgBiBA;;;eAAAA;;;;iEAhBM;gCACwB;8BACf;AAChC,MAAMC,qBAAqB;IACvBC,QAAQ;IACRC,OAAO;IACP,eAAe;AACnB;AASW,MAAMH,8BAA8B,CAACI,OAAOC;IACnD,MAAM,EAAEC,IAAI,EAAE,GAAGC,IAAAA,6BAAe;IAChC,OAAO;QACHC,YAAY;YACRC,MAAM;YACNC,MAAM;YACNC,aAAa;YACbC,SAAS;YACTC,OAAO;QACX;QACAJ,MAAMK,oBAAI,CAACC,MAAM,CAACC,IAAAA,wCAAwB,EAAC,OAAO;YAC9C,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FX,KAAKA;YACL,GAAGD,KAAK;QACZ,IAAI;YACAa,aAAa;QACjB;QACAC,YAAYd,MAAMc,UAAU;QAC5BC,UAAUf,MAAMe,QAAQ;QACxBT,MAAMI,oBAAI,CAACM,QAAQ,CAAChB,MAAMM,IAAI,EAAE;YAC5BW,iBAAiB;YACjBJ,aAAa;QACjB;QACAJ,OAAOC,oBAAI,CAACM,QAAQ,CAAChB,MAAMS,KAAK,EAAE;YAC9BI,aAAa;QACjB;QACAN,aAAaG,oBAAI,CAACM,QAAQ,CAAChB,MAAMO,WAAW,EAAE;YAC1CM,aAAa;QACjB;QACAL,SAASE,oBAAI,CAACM,QAAQ,CAAChB,MAAMQ,OAAO,EAAE;YAClCS,iBAAiB,CAAC,CAACjB,MAAMO,WAAW,IAAI,CAAC,CAACP,MAAMkB,QAAQ;YACxDL,aAAa;QACjB;QACAM,YAAYtB,kBAAkB,CAACK,KAAK;QACpCA;IACJ;AACJ"}

package/lib-commonjs/components/TableHeader/useTableHeader.js

@@ -20,8 +20,11 @@ const useTableHeader_unstable = (props, ref)=>{
         components: {
             root: rootComponent
         },
-        root: _reactutilities.slot.always((0, _reactutilities.getNativeElementProps)(rootComponent, {
-            ref,
+        root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)(rootComponent, {
+            // FIXME:
+            // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`
+            // but since it would be a breaking change to fix it, we are casting ref to it's proper type
+            ref: ref,
             role: rootComponent === 'div' ? 'rowgroup' : undefined,
             ...props
         }), {

package/lib-commonjs/components/TableHeader/useTableHeader.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useTableHeader.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\nimport { useTableContext } from '../../contexts/tableContext';\n/**\n * Create the state required to render TableHeader.\n *\n * The returned state can be modified with hooks such as useTableHeaderStyles_unstable,\n * before being passed to renderTableHeader_unstable.\n *\n * @param props - props from this instance of TableHeader\n * @param ref - reference to root HTMLElement of TableHeader\n */ export const useTableHeader_unstable = (props, ref)=>{\n    const { noNativeElements } = useTableContext();\n    var _props_as;\n    const rootComponent = ((_props_as = props.as) !== null && _props_as !== void 0 ? _props_as : noNativeElements) ? 'div' : 'thead';\n    return {\n        components: {\n            root: rootComponent\n        },\n        root: slot.always(getNativeElementProps(rootComponent, {\n            ref,\n            role: rootComponent === 'div' ? 'rowgroup' : undefined,\n            ...props\n        }), {\n            elementType: rootComponent\n        }),\n        noNativeElements\n    };\n};\n"],"names":["useTableHeader_unstable","props","ref","noNativeElements","useTableContext","_props_as","rootComponent","as","components","root","slot","always","getNativeElementProps","role","undefined","elementType"],"mappings":";;;;+BAWiBA;;;eAAAA;;;;iEAXM;gCACqB;8BACZ;AASrB,MAAMA,0BAA0B,CAACC,OAAOC;IAC/C,MAAM,EAAEC,gBAAgB,EAAE,GAAGC,IAAAA,6BAAe;IAC5C,IAAIC;IACJ,MAAMC,gBAAgB,AAAC,CAAA,AAACD,CAAAA,YAAYJ,MAAMM,EAAE,AAAD,MAAO,QAAQF,cAAc,KAAK,IAAIA,YAAYF,gBAAe,IAAK,QAAQ;IACzH,OAAO;QACHK,YAAY;YACRC,MAAMH;QACV;QACAG,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAACN,eAAe;YACnDJ;YACAW,MAAMP,kBAAkB,QAAQ,aAAaQ;YAC7C,GAAGb,KAAK;QACZ,IAAI;YACAc,aAAaT;QACjB;QACAH;IACJ;AACJ"}
+{"version":3,"sources":["useTableHeader.js"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { useTableContext } from '../../contexts/tableContext';\n/**\n * Create the state required to render TableHeader.\n *\n * The returned state can be modified with hooks such as useTableHeaderStyles_unstable,\n * before being passed to renderTableHeader_unstable.\n *\n * @param props - props from this instance of TableHeader\n * @param ref - reference to root HTMLElement of TableHeader\n */ export const useTableHeader_unstable = (props, ref)=>{\n    const { noNativeElements } = useTableContext();\n    var _props_as;\n    const rootComponent = ((_props_as = props.as) !== null && _props_as !== void 0 ? _props_as : noNativeElements) ? 'div' : 'thead';\n    return {\n        components: {\n            root: rootComponent\n        },\n        root: slot.always(getIntrinsicElementProps(rootComponent, {\n            // FIXME:\n            // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n            // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n            ref: ref,\n            role: rootComponent === 'div' ? 'rowgroup' : undefined,\n            ...props\n        }), {\n            elementType: rootComponent\n        }),\n        noNativeElements\n    };\n};\n"],"names":["useTableHeader_unstable","props","ref","noNativeElements","useTableContext","_props_as","rootComponent","as","components","root","slot","always","getIntrinsicElementProps","role","undefined","elementType"],"mappings":";;;;+BAWiBA;;;eAAAA;;;;iEAXM;gCACwB;8BACf;AASrB,MAAMA,0BAA0B,CAACC,OAAOC;IAC/C,MAAM,EAAEC,gBAAgB,EAAE,GAAGC,IAAAA,6BAAe;IAC5C,IAAIC;IACJ,MAAMC,gBAAgB,AAAC,CAAA,AAACD,CAAAA,YAAYJ,MAAMM,EAAE,AAAD,MAAO,QAAQF,cAAc,KAAK,IAAIA,YAAYF,gBAAe,IAAK,QAAQ;IACzH,OAAO;QACHK,YAAY;YACRC,MAAMH;QACV;QACAG,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,wCAAwB,EAACN,eAAe;YACtD,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FJ,KAAKA;YACLW,MAAMP,kBAAkB,QAAQ,aAAaQ;YAC7C,GAAGb,KAAK;QACZ,IAAI;YACAc,aAAaT;QACjB;QACAH;IACJ;AACJ"}

package/lib-commonjs/components/TableHeaderCell/useTableHeaderCell.js

@@ -36,7 +36,10 @@ const useTableHeaderCell_unstable = (props, ref)=>{
             sortIcon: 'span',
             aside: 'span'
         },
-        root: _reactutilities.slot.always((0, _reactutilities.getNativeElementProps)(rootComponent, {
+        root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)(rootComponent, {
+            // FIXME:
+            // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`
+            // but since it would be a breaking change to fix it, we are casting ref to it's proper type
             ref: (0, _reactutilities.useMergedRefs)(ref, (0, _reacttabster.useFocusWithin)()),
             role: rootComponent === 'div' ? 'columnheader' : undefined,
             'aria-sort': sortable ? (_props_sortDirection = props.sortDirection) !== null && _props_sortDirection !== void 0 ? _props_sortDirection : 'none' : undefined,

package/lib-commonjs/components/TableHeaderCell/useTableHeaderCell.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useTableHeaderCell.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useFocusWithin } from '@fluentui/react-tabster';\nimport { ArrowUpRegular, ArrowDownRegular } from '@fluentui/react-icons';\nimport { useARIAButtonShorthand } from '@fluentui/react-aria';\nimport { useTableContext } from '../../contexts/tableContext';\nconst sortIcons = {\n    ascending: /*#__PURE__*/ React.createElement(ArrowUpRegular, {\n        fontSize: 12\n    }),\n    descending: /*#__PURE__*/ React.createElement(ArrowDownRegular, {\n        fontSize: 12\n    })\n};\n/**\n * Create the state required to render TableHeaderCell.\n *\n * The returned state can be modified with hooks such as useTableHeaderCellStyles_unstable,\n * before being passed to renderTableHeaderCell_unstable.\n *\n * @param props - props from this instance of TableHeaderCell\n * @param ref - reference to root HTMLElement of TableHeaderCell\n */ export const useTableHeaderCell_unstable = (props, ref)=>{\n    const { noNativeElements, sortable: contextSortable } = useTableContext();\n    const { sortable = contextSortable } = props;\n    var _props_as;\n    const rootComponent = ((_props_as = props.as) !== null && _props_as !== void 0 ? _props_as : noNativeElements) ? 'div' : 'th';\n    var _props_sortDirection;\n    return {\n        components: {\n            root: rootComponent,\n            button: 'div',\n            sortIcon: 'span',\n            aside: 'span'\n        },\n        root: slot.always(getNativeElementProps(rootComponent, {\n            ref: useMergedRefs(ref, useFocusWithin()),\n            role: rootComponent === 'div' ? 'columnheader' : undefined,\n            'aria-sort': sortable ? (_props_sortDirection = props.sortDirection) !== null && _props_sortDirection !== void 0 ? _props_sortDirection : 'none' : undefined,\n            ...props\n        }), {\n            elementType: rootComponent\n        }),\n        aside: slot.optional(props.aside, {\n            elementType: 'span'\n        }),\n        sortIcon: slot.optional(props.sortIcon, {\n            renderByDefault: !!props.sortDirection,\n            defaultProps: {\n                children: props.sortDirection ? sortIcons[props.sortDirection] : undefined\n            },\n            elementType: 'span'\n        }),\n        button: slot.always(useARIAButtonShorthand(props.button, {\n            required: true,\n            defaultProps: {\n                as: 'div',\n                ...!sortable && {\n                    role: 'presentation',\n                    tabIndex: undefined\n                }\n            }\n        }), {\n            elementType: 'div'\n        }),\n        sortable,\n        noNativeElements\n    };\n};\n"],"names":["useTableHeaderCell_unstable","sortIcons","ascending","React","createElement","ArrowUpRegular","fontSize","descending","ArrowDownRegular","props","ref","noNativeElements","sortable","contextSortable","useTableContext","_props_as","rootComponent","as","_props_sortDirection","components","root","button","sortIcon","aside","slot","always","getNativeElementProps","useMergedRefs","useFocusWithin","role","undefined","sortDirection","elementType","optional","renderByDefault","defaultProps","children","useARIAButtonShorthand","required","tabIndex"],"mappings":";;;;+BAsBiBA;;;eAAAA;;;;iEAtBM;gCACoC;8BAC5B;4BACkB;2BACV;8BACP;AAChC,MAAMC,YAAY;IACdC,WAAW,WAAW,GAAGC,OAAMC,aAAa,CAACC,0BAAc,EAAE;QACzDC,UAAU;IACd;IACAC,YAAY,WAAW,GAAGJ,OAAMC,aAAa,CAACI,4BAAgB,EAAE;QAC5DF,UAAU;IACd;AACJ;AASW,MAAMN,8BAA8B,CAACS,OAAOC;IACnD,MAAM,EAAEC,gBAAgB,EAAEC,UAAUC,eAAe,EAAE,GAAGC,IAAAA,6BAAe;IACvE,MAAM,EAAEF,WAAWC,eAAe,EAAE,GAAGJ;IACvC,IAAIM;IACJ,MAAMC,gBAAgB,AAAC,CAAA,AAACD,CAAAA,YAAYN,MAAMQ,EAAE,AAAD,MAAO,QAAQF,cAAc,KAAK,IAAIA,YAAYJ,gBAAe,IAAK,QAAQ;IACzH,IAAIO;IACJ,OAAO;QACHC,YAAY;YACRC,MAAMJ;YACNK,QAAQ;YACRC,UAAU;YACVC,OAAO;QACX;QACAH,MAAMI,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAACV,eAAe;YACnDN,KAAKiB,IAAAA,6BAAa,EAACjB,KAAKkB,IAAAA,4BAAc;YACtCC,MAAMb,kBAAkB,QAAQ,iBAAiBc;YACjD,aAAalB,WAAW,AAACM,CAAAA,uBAAuBT,MAAMsB,aAAa,AAAD,MAAO,QAAQb,yBAAyB,KAAK,IAAIA,uBAAuB,SAASY;YACnJ,GAAGrB,KAAK;QACZ,IAAI;YACAuB,aAAahB;QACjB;QACAO,OAAOC,oBAAI,CAACS,QAAQ,CAACxB,MAAMc,KAAK,EAAE;YAC9BS,aAAa;QACjB;QACAV,UAAUE,oBAAI,CAACS,QAAQ,CAACxB,MAAMa,QAAQ,EAAE;YACpCY,iBAAiB,CAAC,CAACzB,MAAMsB,aAAa;YACtCI,cAAc;gBACVC,UAAU3B,MAAMsB,aAAa,GAAG9B,SAAS,CAACQ,MAAMsB,aAAa,CAAC,GAAGD;YACrE;YACAE,aAAa;QACjB;QACAX,QAAQG,oBAAI,CAACC,MAAM,CAACY,IAAAA,iCAAsB,EAAC5B,MAAMY,MAAM,EAAE;YACrDiB,UAAU;YACVH,cAAc;gBACVlB,IAAI;gBACJ,GAAG,CAACL,YAAY;oBACZiB,MAAM;oBACNU,UAAUT;gBACd,CAAC;YACL;QACJ,IAAI;YACAE,aAAa;QACjB;QACApB;QACAD;IACJ;AACJ"}
+{"version":3,"sources":["useTableHeaderCell.js"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useFocusWithin } from '@fluentui/react-tabster';\nimport { ArrowUpRegular, ArrowDownRegular } from '@fluentui/react-icons';\nimport { useARIAButtonShorthand } from '@fluentui/react-aria';\nimport { useTableContext } from '../../contexts/tableContext';\nconst sortIcons = {\n    ascending: /*#__PURE__*/ React.createElement(ArrowUpRegular, {\n        fontSize: 12\n    }),\n    descending: /*#__PURE__*/ React.createElement(ArrowDownRegular, {\n        fontSize: 12\n    })\n};\n/**\n * Create the state required to render TableHeaderCell.\n *\n * The returned state can be modified with hooks such as useTableHeaderCellStyles_unstable,\n * before being passed to renderTableHeaderCell_unstable.\n *\n * @param props - props from this instance of TableHeaderCell\n * @param ref - reference to root HTMLElement of TableHeaderCell\n */ export const useTableHeaderCell_unstable = (props, ref)=>{\n    const { noNativeElements, sortable: contextSortable } = useTableContext();\n    const { sortable = contextSortable } = props;\n    var _props_as;\n    const rootComponent = ((_props_as = props.as) !== null && _props_as !== void 0 ? _props_as : noNativeElements) ? 'div' : 'th';\n    var _props_sortDirection;\n    return {\n        components: {\n            root: rootComponent,\n            button: 'div',\n            sortIcon: 'span',\n            aside: 'span'\n        },\n        root: slot.always(getIntrinsicElementProps(rootComponent, {\n            // FIXME:\n            // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n            // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n            ref: useMergedRefs(ref, useFocusWithin()),\n            role: rootComponent === 'div' ? 'columnheader' : undefined,\n            'aria-sort': sortable ? (_props_sortDirection = props.sortDirection) !== null && _props_sortDirection !== void 0 ? _props_sortDirection : 'none' : undefined,\n            ...props\n        }), {\n            elementType: rootComponent\n        }),\n        aside: slot.optional(props.aside, {\n            elementType: 'span'\n        }),\n        sortIcon: slot.optional(props.sortIcon, {\n            renderByDefault: !!props.sortDirection,\n            defaultProps: {\n                children: props.sortDirection ? sortIcons[props.sortDirection] : undefined\n            },\n            elementType: 'span'\n        }),\n        button: slot.always(useARIAButtonShorthand(props.button, {\n            required: true,\n            defaultProps: {\n                as: 'div',\n                ...!sortable && {\n                    role: 'presentation',\n                    tabIndex: undefined\n                }\n            }\n        }), {\n            elementType: 'div'\n        }),\n        sortable,\n        noNativeElements\n    };\n};\n"],"names":["useTableHeaderCell_unstable","sortIcons","ascending","React","createElement","ArrowUpRegular","fontSize","descending","ArrowDownRegular","props","ref","noNativeElements","sortable","contextSortable","useTableContext","_props_as","rootComponent","as","_props_sortDirection","components","root","button","sortIcon","aside","slot","always","getIntrinsicElementProps","useMergedRefs","useFocusWithin","role","undefined","sortDirection","elementType","optional","renderByDefault","defaultProps","children","useARIAButtonShorthand","required","tabIndex"],"mappings":";;;;+BAsBiBA;;;eAAAA;;;;iEAtBM;gCACuC;8BAC/B;4BACkB;2BACV;8BACP;AAChC,MAAMC,YAAY;IACdC,WAAW,WAAW,GAAGC,OAAMC,aAAa,CAACC,0BAAc,EAAE;QACzDC,UAAU;IACd;IACAC,YAAY,WAAW,GAAGJ,OAAMC,aAAa,CAACI,4BAAgB,EAAE;QAC5DF,UAAU;IACd;AACJ;AASW,MAAMN,8BAA8B,CAACS,OAAOC;IACnD,MAAM,EAAEC,gBAAgB,EAAEC,UAAUC,eAAe,EAAE,GAAGC,IAAAA,6BAAe;IACvE,MAAM,EAAEF,WAAWC,eAAe,EAAE,GAAGJ;IACvC,IAAIM;IACJ,MAAMC,gBAAgB,AAAC,CAAA,AAACD,CAAAA,YAAYN,MAAMQ,EAAE,AAAD,MAAO,QAAQF,cAAc,KAAK,IAAIA,YAAYJ,gBAAe,IAAK,QAAQ;IACzH,IAAIO;IACJ,OAAO;QACHC,YAAY;YACRC,MAAMJ;YACNK,QAAQ;YACRC,UAAU;YACVC,OAAO;QACX;QACAH,MAAMI,oBAAI,CAACC,MAAM,CAACC,IAAAA,wCAAwB,EAACV,eAAe;YACtD,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FN,KAAKiB,IAAAA,6BAAa,EAACjB,KAAKkB,IAAAA,4BAAc;YACtCC,MAAMb,kBAAkB,QAAQ,iBAAiBc;YACjD,aAAalB,WAAW,AAACM,CAAAA,uBAAuBT,MAAMsB,aAAa,AAAD,MAAO,QAAQb,yBAAyB,KAAK,IAAIA,uBAAuB,SAASY;YACnJ,GAAGrB,KAAK;QACZ,IAAI;YACAuB,aAAahB;QACjB;QACAO,OAAOC,oBAAI,CAACS,QAAQ,CAACxB,MAAMc,KAAK,EAAE;YAC9BS,aAAa;QACjB;QACAV,UAAUE,oBAAI,CAACS,QAAQ,CAACxB,MAAMa,QAAQ,EAAE;YACpCY,iBAAiB,CAAC,CAACzB,MAAMsB,aAAa;YACtCI,cAAc;gBACVC,UAAU3B,MAAMsB,aAAa,GAAG9B,SAAS,CAACQ,MAAMsB,aAAa,CAAC,GAAGD;YACrE;YACAE,aAAa;QACjB;QACAX,QAAQG,oBAAI,CAACC,MAAM,CAACY,IAAAA,iCAAsB,EAAC5B,MAAMY,MAAM,EAAE;YACrDiB,UAAU;YACVH,cAAc;gBACVlB,IAAI;gBACJ,GAAG,CAACL,YAAY;oBACZiB,MAAM;oBACNU,UAAUT;gBACd,CAAC;YACL;QACJ,IAAI;YACAE,aAAa;QACjB;QACApB;QACAD;IACJ;AACJ"}

package/lib-commonjs/components/TableResizeHandle/useTableResizeHandle.js

@@ -21,8 +21,11 @@ const useTableResizeHandle_unstable = (props, ref)=>{
         components: {
             root: 'div'
         },
-        root: _reactutilities.slot.always((0, _reactutilities.getNativeElementProps)('div', {
-            ref,
+        root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)('div', {
+            // FIXME:
+            // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`
+            // but since it would be a breaking change to fix it, we are casting ref to it's proper type
+            ref: ref,
             ...props,
             onClick
         }), {

package/lib-commonjs/components/TableResizeHandle/useTableResizeHandle.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useTableResizeHandle.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useEventCallback, slot } from '@fluentui/react-utilities';\n/**\n * Create the state required to render TableResizeHandle.\n *\n * The returned state can be modified with hooks such as useTableResizeHandleStyles_unstable,\n * before being passed to renderTableResizeHandle_unstable.\n *\n * @param props - props from this instance of TableResizeHandle\n * @param ref - reference to root HTMLElement of TableResizeHandle\n */ export const useTableResizeHandle_unstable = (props, ref)=>{\n    const onClick = useEventCallback((event)=>{\n        var _props_onClick;\n        (_props_onClick = props.onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(props, event);\n        event.stopPropagation();\n    });\n    return {\n        components: {\n            root: 'div'\n        },\n        root: slot.always(getNativeElementProps('div', {\n            ref,\n            ...props,\n            onClick\n        }), {\n            elementType: 'div'\n        })\n    };\n};\n"],"names":["useTableResizeHandle_unstable","props","ref","onClick","useEventCallback","event","_props_onClick","call","stopPropagation","components","root","slot","always","getNativeElementProps","elementType"],"mappings":";;;;+BAUiBA;;;eAAAA;;;;iEAVM;gCACuC;AASnD,MAAMA,gCAAgC,CAACC,OAAOC;IACrD,MAAMC,UAAUC,IAAAA,gCAAgB,EAAC,CAACC;QAC9B,IAAIC;QACHA,CAAAA,iBAAiBL,MAAME,OAAO,AAAD,MAAO,QAAQG,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeC,IAAI,CAACN,OAAOI;QAC7GA,MAAMG,eAAe;IACzB;IACA,OAAO;QACHC,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAAC,OAAO;YAC3CX;YACA,GAAGD,KAAK;YACRE;QACJ,IAAI;YACAW,aAAa;QACjB;IACJ;AACJ"}
+{"version":3,"sources":["useTableResizeHandle.js"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, useEventCallback, slot } from '@fluentui/react-utilities';\n/**\n * Create the state required to render TableResizeHandle.\n *\n * The returned state can be modified with hooks such as useTableResizeHandleStyles_unstable,\n * before being passed to renderTableResizeHandle_unstable.\n *\n * @param props - props from this instance of TableResizeHandle\n * @param ref - reference to root HTMLElement of TableResizeHandle\n */ export const useTableResizeHandle_unstable = (props, ref)=>{\n    const onClick = useEventCallback((event)=>{\n        var _props_onClick;\n        (_props_onClick = props.onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(props, event);\n        event.stopPropagation();\n    });\n    return {\n        components: {\n            root: 'div'\n        },\n        root: slot.always(getIntrinsicElementProps('div', {\n            // FIXME:\n            // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n            // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n            ref: ref,\n            ...props,\n            onClick\n        }), {\n            elementType: 'div'\n        })\n    };\n};\n"],"names":["useTableResizeHandle_unstable","props","ref","onClick","useEventCallback","event","_props_onClick","call","stopPropagation","components","root","slot","always","getIntrinsicElementProps","elementType"],"mappings":";;;;+BAUiBA;;;eAAAA;;;;iEAVM;gCAC0C;AAStD,MAAMA,gCAAgC,CAACC,OAAOC;IACrD,MAAMC,UAAUC,IAAAA,gCAAgB,EAAC,CAACC;QAC9B,IAAIC;QACHA,CAAAA,iBAAiBL,MAAME,OAAO,AAAD,MAAO,QAAQG,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeC,IAAI,CAACN,OAAOI;QAC7GA,MAAMG,eAAe;IACzB;IACA,OAAO;QACHC,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,wCAAwB,EAAC,OAAO;YAC9C,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FX,KAAKA;YACL,GAAGD,KAAK;YACRE;QACJ,IAAI;YACAW,aAAa;QACjB;IACJ;AACJ"}

package/lib-commonjs/components/TableRow/useTableRow.js

@@ -26,7 +26,10 @@ const useTableRow_unstable = (props, ref)=>{
         components: {
             root: rootComponent
         },
-        root: _reactutilities.slot.always((0, _reactutilities.getNativeElementProps)(rootComponent, {
+        root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)(rootComponent, {
+            // FIXME:
+            // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`
+            // but since it would be a breaking change to fix it, we are casting ref to it's proper type
             ref: (0, _reactutilities.useMergedRefs)(ref, focusVisibleRef, focusWithinRef),
             role: rootComponent === 'div' ? 'row' : undefined,
             ...props

package/lib-commonjs/components/TableRow/useTableRow.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useTableRow.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useFocusVisible, useFocusWithin } from '@fluentui/react-tabster';\nimport { useTableContext } from '../../contexts/tableContext';\nimport { useIsInTableHeader } from '../../contexts/tableHeaderContext';\n/**\n * Create the state required to render TableRow.\n *\n * The returned state can be modified with hooks such as useTableRowStyles_unstable,\n * before being passed to renderTableRow_unstable.\n *\n * @param props - props from this instance of TableRow\n * @param ref - reference to root HTMLElement of TableRow\n */ export const useTableRow_unstable = (props, ref)=>{\n    const { noNativeElements, size } = useTableContext();\n    var _props_as;\n    const rootComponent = ((_props_as = props.as) !== null && _props_as !== void 0 ? _props_as : noNativeElements) ? 'div' : 'tr';\n    const focusVisibleRef = useFocusVisible();\n    const focusWithinRef = useFocusWithin();\n    const isHeaderRow = useIsInTableHeader();\n    var _props_appearance;\n    return {\n        components: {\n            root: rootComponent\n        },\n        root: slot.always(getNativeElementProps(rootComponent, {\n            ref: useMergedRefs(ref, focusVisibleRef, focusWithinRef),\n            role: rootComponent === 'div' ? 'row' : undefined,\n            ...props\n        }), {\n            elementType: rootComponent\n        }),\n        size,\n        noNativeElements,\n        appearance: (_props_appearance = props.appearance) !== null && _props_appearance !== void 0 ? _props_appearance : 'none',\n        isHeaderRow\n    };\n};\n"],"names":["useTableRow_unstable","props","ref","noNativeElements","size","useTableContext","_props_as","rootComponent","as","focusVisibleRef","useFocusVisible","focusWithinRef","useFocusWithin","isHeaderRow","useIsInTableHeader","_props_appearance","components","root","slot","always","getNativeElementProps","useMergedRefs","role","undefined","elementType","appearance"],"mappings":";;;;+BAaiBA;;;eAAAA;;;;iEAbM;gCACoC;8BACX;8BAChB;oCACG;AASxB,MAAMA,uBAAuB,CAACC,OAAOC;IAC5C,MAAM,EAAEC,gBAAgB,EAAEC,IAAI,EAAE,GAAGC,IAAAA,6BAAe;IAClD,IAAIC;IACJ,MAAMC,gBAAgB,AAAC,CAAA,AAACD,CAAAA,YAAYL,MAAMO,EAAE,AAAD,MAAO,QAAQF,cAAc,KAAK,IAAIA,YAAYH,gBAAe,IAAK,QAAQ;IACzH,MAAMM,kBAAkBC,IAAAA,6BAAe;IACvC,MAAMC,iBAAiBC,IAAAA,4BAAc;IACrC,MAAMC,cAAcC,IAAAA,sCAAkB;IACtC,IAAIC;IACJ,OAAO;QACHC,YAAY;YACRC,MAAMV;QACV;QACAU,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAACb,eAAe;YACnDL,KAAKmB,IAAAA,6BAAa,EAACnB,KAAKO,iBAAiBE;YACzCW,MAAMf,kBAAkB,QAAQ,QAAQgB;YACxC,GAAGtB,KAAK;QACZ,IAAI;YACAuB,aAAajB;QACjB;QACAH;QACAD;QACAsB,YAAY,AAACV,CAAAA,oBAAoBd,MAAMwB,UAAU,AAAD,MAAO,QAAQV,sBAAsB,KAAK,IAAIA,oBAAoB;QAClHF;IACJ;AACJ"}
+{"version":3,"sources":["useTableRow.js"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useFocusVisible, useFocusWithin } from '@fluentui/react-tabster';\nimport { useTableContext } from '../../contexts/tableContext';\nimport { useIsInTableHeader } from '../../contexts/tableHeaderContext';\n/**\n * Create the state required to render TableRow.\n *\n * The returned state can be modified with hooks such as useTableRowStyles_unstable,\n * before being passed to renderTableRow_unstable.\n *\n * @param props - props from this instance of TableRow\n * @param ref - reference to root HTMLElement of TableRow\n */ export const useTableRow_unstable = (props, ref)=>{\n    const { noNativeElements, size } = useTableContext();\n    var _props_as;\n    const rootComponent = ((_props_as = props.as) !== null && _props_as !== void 0 ? _props_as : noNativeElements) ? 'div' : 'tr';\n    const focusVisibleRef = useFocusVisible();\n    const focusWithinRef = useFocusWithin();\n    const isHeaderRow = useIsInTableHeader();\n    var _props_appearance;\n    return {\n        components: {\n            root: rootComponent\n        },\n        root: slot.always(getIntrinsicElementProps(rootComponent, {\n            // FIXME:\n            // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n            // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n            ref: useMergedRefs(ref, focusVisibleRef, focusWithinRef),\n            role: rootComponent === 'div' ? 'row' : undefined,\n            ...props\n        }), {\n            elementType: rootComponent\n        }),\n        size,\n        noNativeElements,\n        appearance: (_props_appearance = props.appearance) !== null && _props_appearance !== void 0 ? _props_appearance : 'none',\n        isHeaderRow\n    };\n};\n"],"names":["useTableRow_unstable","props","ref","noNativeElements","size","useTableContext","_props_as","rootComponent","as","focusVisibleRef","useFocusVisible","focusWithinRef","useFocusWithin","isHeaderRow","useIsInTableHeader","_props_appearance","components","root","slot","always","getIntrinsicElementProps","useMergedRefs","role","undefined","elementType","appearance"],"mappings":";;;;+BAaiBA;;;eAAAA;;;;iEAbM;gCACuC;8BACd;8BAChB;oCACG;AASxB,MAAMA,uBAAuB,CAACC,OAAOC;IAC5C,MAAM,EAAEC,gBAAgB,EAAEC,IAAI,EAAE,GAAGC,IAAAA,6BAAe;IAClD,IAAIC;IACJ,MAAMC,gBAAgB,AAAC,CAAA,AAACD,CAAAA,YAAYL,MAAMO,EAAE,AAAD,MAAO,QAAQF,cAAc,KAAK,IAAIA,YAAYH,gBAAe,IAAK,QAAQ;IACzH,MAAMM,kBAAkBC,IAAAA,6BAAe;IACvC,MAAMC,iBAAiBC,IAAAA,4BAAc;IACrC,MAAMC,cAAcC,IAAAA,sCAAkB;IACtC,IAAIC;IACJ,OAAO;QACHC,YAAY;YACRC,MAAMV;QACV;QACAU,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,wCAAwB,EAACb,eAAe;YACtD,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FL,KAAKmB,IAAAA,6BAAa,EAACnB,KAAKO,iBAAiBE;YACzCW,MAAMf,kBAAkB,QAAQ,QAAQgB;YACxC,GAAGtB,KAAK;QACZ,IAAI;YACAuB,aAAajB;QACjB;QACAH;QACAD;QACAsB,YAAY,AAACV,CAAAA,oBAAoBd,MAAMwB,UAAU,AAAD,MAAO,QAAQV,sBAAsB,KAAK,IAAIA,oBAAoB;QAClHF;IACJ;AACJ"}

package/lib-commonjs/components/TableRow/useTableRowStyles.styles.js

@@ -72,9 +72,6 @@ const useFlexLayoutStyles = /*#__PURE__*/ (0, _react.__styles)({
             "fxmnebo"
         ]
     },
-    noAppearanceFocusWithin: {
-        Bm5rygw: "f13cic75"
-    },
     rootInteractive: {
         ecr2s2: "f1wfn5kd",
         lj723h: "f1g4hkjv",
@@ -238,7 +235,6 @@ const useFlexLayoutStyles = /*#__PURE__*/ (0, _react.__styles)({
         ".f1kjnpwc[data-fui-focus-visible]{border-bottom-left-radius:var(--borderRadiusMedium);}",
         ".fxmnebo[data-fui-focus-visible]{border-top-right-radius:var(--borderRadiusMedium);}",
         ".f1witrsb[data-fui-focus-visible]{border-top-left-radius:var(--borderRadiusMedium);}",
-        ".f13cic75[data-fui-focus-within]:focus-within{background-color:var(--colorSubtleBackgroundHover);}",
         ".f1vxd6vx{border-bottom-width:var(--strokeWidthThin);}",
         ".fg706s2{border-bottom-style:solid;}",
         ".frpde29{border-bottom-color:var(--colorNeutralStroke2);}",
@@ -357,6 +353,6 @@ const useTableRowStyles_unstable = (state)=>{
         table: useTableLayoutStyles(),
         flex: useFlexLayoutStyles()
     };
-    state.root.className = (0, _react.mergeClasses)(tableRowClassNames.root, styles.root, !state.isHeaderRow && styles.rootInteractive, styles[state.size], state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, styles[state.appearance], state.appearance === 'none' && !state.isHeaderRow && styles.noAppearanceFocusWithin, state.root.className);
+    state.root.className = (0, _react.mergeClasses)(tableRowClassNames.root, styles.root, !state.isHeaderRow && styles.rootInteractive, styles[state.size], state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, styles[state.appearance], state.root.className);
     return state;
 }; //# sourceMappingURL=useTableRowStyles.styles.js.map

package/lib-commonjs/components/TableRow/useTableRowStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useTableRowStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { tableCellActionsClassNames } from '../TableCellActions/useTableCellActionsStyles.styles';\nimport { tableSelectionCellClassNames } from '../TableSelectionCell/useTableSelectionCellStyles.styles';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nexport const tableRowClassName = 'fui-TableRow';\nexport const tableRowClassNames = {\n  root: tableRowClassName\n};\nconst useTableLayoutStyles = /*#__PURE__*/__styles({\n  root: {\n    mc9l5x: \"f1u0rzck\"\n  }\n}, {\n  d: [\".f1u0rzck{display:table-row;}\"]\n});\nconst useFlexLayoutStyles = /*#__PURE__*/__styles({\n  root: {\n    mc9l5x: \"f22iagw\",\n    Bt984gj: \"f122n59\"\n  }\n}, {\n  d: [\".f22iagw{display:flex;}\", \".f122n59{align-items:center;}\"]\n});\n/**\n * Styles for the root slot\n */\nconst useStyles = /*#__PURE__*/__styles({\n  root: {\n    sj55zd: \"f19n0e5\",\n    B7ck84d: \"f1ewtqcl\",\n    Bconypa: \"f1jazu75\",\n    B6guboy: \"f1xeqee6\",\n    Bn4voq9: \"fz36nt7\",\n    g9k6zt: \"f9znhxp\",\n    Bfpq7zp: \"fqrak0z\",\n    kdpuga: [\"f1o2ludy\", \"f1kjnpwc\"],\n    Bw81rd7: [\"f1kjnpwc\", \"f1o2ludy\"],\n    B6xbmo0: [\"fxmnebo\", \"f1witrsb\"],\n    dm238s: [\"f1witrsb\", \"fxmnebo\"]\n  },\n  noAppearanceFocusWithin: {\n    Bm5rygw: \"f13cic75\"\n  },\n  rootInteractive: {\n    ecr2s2: \"f1wfn5kd\",\n    lj723h: \"f1g4hkjv\",\n    B43xm9u: \"f15ngxrw\",\n    i921ia: \"fjbbrdp\",\n    Jwef8y: \"f1t94bn6\",\n    Bi91k9c: \"feu1g3u\",\n    Bpt6rm4: \"f1uorfem\",\n    ff6mpl: \"fw60kww\"\n  },\n  medium: {\n    Bn0qgzm: \"f1vxd6vx\",\n    oivjwe: \"fg706s2\",\n    B9xav0g: \"frpde29\"\n  },\n  small: {\n    Bn0qgzm: \"f1vxd6vx\",\n    oivjwe: \"fg706s2\",\n    B9xav0g: \"frpde29\"\n  },\n  \"extra-small\": {\n    Be2twd7: \"fy9rknc\"\n  },\n  brand: {\n    De3pzq: \"f16xkysk\",\n    g2u3we: \"f1bh3yvw\",\n    h3c5rm: [\"fmi79ni\", \"f11fozsx\"],\n    B9xav0g: \"fnzw4c6\",\n    zhjwy3: [\"f11fozsx\", \"fmi79ni\"],\n    ecr2s2: \"ftepret\",\n    gwxt9v: \"fqlf3fd\",\n    v3aym: [\"f9dpb3h\", \"fw2muls\"],\n    Bc736ss: \"f1yat0gj\",\n    Bk6ri7n: [\"fw2muls\", \"f9dpb3h\"],\n    Bk5ld8o: \"f7nae3y\",\n    c4eypz: [\"fkbere7\", \"fa97sf3\"],\n    felo30: \"fmtyzcc\",\n    Eshu5l: [\"fa97sf3\", \"fkbere7\"],\n    Bjwas2f: \"fb6zhgp\",\n    Bn1d65q: [\"fyowp6c\", \"fz08sq8\"],\n    Bxeuatn: \"f9dii88\",\n    n51gp8: [\"fz08sq8\", \"fyowp6c\"],\n    Beo2b4z: [\"f1afxoft\", \"flqq2yx\"],\n    h6lo6r: [\"flqq2yx\", \"f1afxoft\"],\n    Btyw6ap: [\"f1b5xrmd\", \"f1831rx6\"],\n    w1pwid: [\"f1831rx6\", \"f1b5xrmd\"],\n    Brwvgy3: \"fd94n53\",\n    yadkgm: \"f1e0wld5\"\n  },\n  neutral: {\n    gwxt9v: \"fqlf3fd\",\n    v3aym: [\"f9dpb3h\", \"fw2muls\"],\n    Bc736ss: \"f1yat0gj\",\n    Bk6ri7n: [\"fw2muls\", \"f9dpb3h\"],\n    Bk5ld8o: \"f7nae3y\",\n    c4eypz: [\"fkbere7\", \"fa97sf3\"],\n    felo30: \"fmtyzcc\",\n    Eshu5l: [\"fa97sf3\", \"fkbere7\"],\n    Bjwas2f: \"fb6zhgp\",\n    Bn1d65q: [\"fyowp6c\", \"fz08sq8\"],\n    Bxeuatn: \"f9dii88\",\n    n51gp8: [\"fz08sq8\", \"fyowp6c\"],\n    Beo2b4z: [\"f1afxoft\", \"flqq2yx\"],\n    h6lo6r: [\"flqq2yx\", \"f1afxoft\"],\n    Btyw6ap: [\"f1b5xrmd\", \"f1831rx6\"],\n    w1pwid: [\"f1831rx6\", \"f1b5xrmd\"],\n    Brwvgy3: \"fd94n53\",\n    yadkgm: \"f1e0wld5\",\n    De3pzq: \"fq5gl1p\",\n    sj55zd: \"f1cgsbmv\",\n    Jwef8y: \"f1uqaxdt\",\n    ecr2s2: \"fa9o754\",\n    g2u3we: \"frmsihh\",\n    h3c5rm: [\"frttxa5\", \"f11o2r7f\"],\n    B9xav0g: \"fem5et0\",\n    zhjwy3: [\"f11o2r7f\", \"frttxa5\"]\n  },\n  none: {}\n}, {\n  d: [\".f19n0e5{color:var(--colorNeutralForeground1);}\", \".f1ewtqcl{box-sizing:border-box;}\", \".f1jazu75[data-fui-focus-within]:focus-within .fui-TableSelectionCell{opacity:1;}\", \".f1xeqee6[data-fui-focus-within]:focus-within .fui-TableCellActions{opacity:1;}\", \".fz36nt7[data-fui-focus-visible]{outline-width:2px;}\", \".f9znhxp[data-fui-focus-visible]{outline-style:solid;}\", \".fqrak0z[data-fui-focus-visible]{outline-color:var(--colorStrokeFocus2);}\", \".f1o2ludy[data-fui-focus-visible]{border-bottom-right-radius:var(--borderRadiusMedium);}\", \".f1kjnpwc[data-fui-focus-visible]{border-bottom-left-radius:var(--borderRadiusMedium);}\", \".fxmnebo[data-fui-focus-visible]{border-top-right-radius:var(--borderRadiusMedium);}\", \".f1witrsb[data-fui-focus-visible]{border-top-left-radius:var(--borderRadiusMedium);}\", \".f13cic75[data-fui-focus-within]:focus-within{background-color:var(--colorSubtleBackgroundHover);}\", \".f1vxd6vx{border-bottom-width:var(--strokeWidthThin);}\", \".fg706s2{border-bottom-style:solid;}\", \".frpde29{border-bottom-color:var(--colorNeutralStroke2);}\", \".fy9rknc{font-size:var(--fontSizeBase200);}\", \".f16xkysk{background-color:var(--colorBrandBackground2);}\", \".f1bh3yvw{border-top-color:var(--colorTransparentStrokeInteractive);}\", \".fmi79ni{border-right-color:var(--colorTransparentStrokeInteractive);}\", \".f11fozsx{border-left-color:var(--colorTransparentStrokeInteractive);}\", \".fnzw4c6{border-bottom-color:var(--colorTransparentStrokeInteractive);}\", \".fq5gl1p{background-color:var(--colorSubtleBackgroundSelected);}\", \".f1cgsbmv{color:var(--colorNeutralForeground1Hover);}\", \".frmsihh{border-top-color:var(--colorNeutralStrokeOnBrand);}\", \".frttxa5{border-right-color:var(--colorNeutralStrokeOnBrand);}\", \".f11o2r7f{border-left-color:var(--colorNeutralStrokeOnBrand);}\", \".fem5et0{border-bottom-color:var(--colorNeutralStrokeOnBrand);}\"],\n  a: [\".f1wfn5kd:active{background-color:var(--colorSubtleBackgroundPressed);}\", \".f1g4hkjv:active{color:var(--colorNeutralForeground1Pressed);}\", \".f15ngxrw:active .fui-TableCellActions{opacity:1;}\", \".fjbbrdp:active .fui-TableSelectionCell{opacity:1;}\", \".ftepret:active{background-color:var(--colorBrandBackgroundInvertedSelected);}\", \".fa9o754:active{background-color:var(--colorSubtleBackgroundSelected);}\"],\n  h: [\".f1t94bn6:hover{background-color:var(--colorSubtleBackgroundHover);}\", \".feu1g3u:hover{color:var(--colorNeutralForeground1Hover);}\", \".f1uorfem:hover .fui-TableCellActions{opacity:1;}\", \".fw60kww:hover .fui-TableSelectionCell{opacity:1;}\", \".f1uqaxdt:hover{background-color:var(--colorSubtleBackgroundSelected);}\"],\n  m: [[\"@media (forced-colors: active){.fqlf3fd{border-top-width:2px;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.f9dpb3h{border-right-width:2px;}.fw2muls{border-left-width:2px;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.f1yat0gj{border-bottom-width:2px;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.f7nae3y{border-top-style:solid;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.fa97sf3{border-left-style:solid;}.fkbere7{border-right-style:solid;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.fmtyzcc{border-bottom-style:solid;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.fb6zhgp{border-top-color:transparent;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.fyowp6c{border-right-color:transparent;}.fz08sq8{border-left-color:transparent;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.f9dii88{border-bottom-color:transparent;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.f1afxoft{border-bottom-right-radius:var(--borderRadiusMedium);}.flqq2yx{border-bottom-left-radius:var(--borderRadiusMedium);}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.f1831rx6{border-top-left-radius:var(--borderRadiusMedium);}.f1b5xrmd{border-top-right-radius:var(--borderRadiusMedium);}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.fd94n53{box-sizing:border-box;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.f1e0wld5:focus-visible{outline-offset:-4px;}}\", {\n    m: \"(forced-colors: active)\"\n  }]]\n});\n/**\n * Apply styling to the TableRow slots based on the state\n */\nexport const useTableRowStyles_unstable = state => {\n  const styles = useStyles();\n  const layoutStyles = {\n    table: useTableLayoutStyles(),\n    flex: useFlexLayoutStyles()\n  };\n  state.root.className = mergeClasses(tableRowClassNames.root, styles.root, !state.isHeaderRow && styles.rootInteractive, styles[state.size], state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, styles[state.appearance], state.appearance === 'none' && !state.isHeaderRow && styles.noAppearanceFocusWithin, state.root.className);\n  return state;\n};\n//# sourceMappingURL=useTableRowStyles.styles.js.map"],"names":["tableRowClassName","tableRowClassNames","useTableRowStyles_unstable","root","useTableLayoutStyles","__styles","mc9l5x","d","useFlexLayoutStyles","Bt984gj","useStyles","sj55zd","B7ck84d","Bconypa","B6guboy","Bn4voq9","g9k6zt","Bfpq7zp","kdpuga","Bw81rd7","B6xbmo0","dm238s","noAppearanceFocusWithin","Bm5rygw","rootInteractive","ecr2s2","lj723h","B43xm9u","i921ia","Jwef8y","Bi91k9c","Bpt6rm4","ff6mpl","medium","Bn0qgzm","oivjwe","B9xav0g","small","Be2twd7","brand","De3pzq","g2u3we","h3c5rm","zhjwy3","gwxt9v","v3aym","Bc736ss","Bk6ri7n","Bk5ld8o","c4eypz","felo30","Eshu5l","Bjwas2f","Bn1d65q","Bxeuatn","n51gp8","Beo2b4z","h6lo6r","Btyw6ap","w1pwid","Brwvgy3","yadkgm","neutral","none","a","h","m","state","styles","layoutStyles","table","flex","className","mergeClasses","isHeaderRow","size","noNativeElements","appearance"],"mappings":";;;;;;;;;;;IAKaA,iBAAiB;eAAjBA;;IACAC,kBAAkB;eAAlBA;;IAuJAC,0BAA0B;eAA1BA;;;uBA7JsC;AAK5C,MAAMF,oBAAoB;AAC1B,MAAMC,qBAAqB;IAChCE,MAAMH;AACR;AACA,MAAMI,uBAAuB,WAAW,GAAEC,IAAAA,eAAQ,EAAC;IACjDF,MAAM;QACJG,QAAQ;IACV;AACF,GAAG;IACDC,GAAG;QAAC;KAAgC;AACtC;AACA,MAAMC,sBAAsB,WAAW,GAAEH,IAAAA,eAAQ,EAAC;IAChDF,MAAM;QACJG,QAAQ;QACRG,SAAS;IACX;AACF,GAAG;IACDF,GAAG;QAAC;QAA2B;KAAgC;AACjE;AACA;;CAEC,GACD,MAAMG,YAAY,WAAW,GAAEL,IAAAA,eAAQ,EAAC;IACtCF,MAAM;QACJQ,QAAQ;QACRC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,QAAQ;QACRC,SAAS;QACTC,QAAQ;YAAC;YAAY;SAAW;QAChCC,SAAS;YAAC;YAAY;SAAW;QACjCC,SAAS;YAAC;YAAW;SAAW;QAChCC,QAAQ;YAAC;YAAY;SAAU;IACjC;IACAC,yBAAyB;QACvBC,SAAS;IACX;IACAC,iBAAiB;QACfC,QAAQ;QACRC,QAAQ;QACRC,SAAS;QACTC,QAAQ;QACRC,QAAQ;QACRC,SAAS;QACTC,SAAS;QACTC,QAAQ;IACV;IACAC,QAAQ;QACNC,SAAS;QACTC,QAAQ;QACRC,SAAS;IACX;IACAC,OAAO;QACLH,SAAS;QACTC,QAAQ;QACRC,SAAS;IACX;IACA,eAAe;QACbE,SAAS;IACX;IACAC,OAAO;QACLC,QAAQ;QACRC,QAAQ;QACRC,QAAQ;YAAC;YAAW;SAAW;QAC/BN,SAAS;QACTO,QAAQ;YAAC;YAAY;SAAU;QAC/BlB,QAAQ;QACRmB,QAAQ;QACRC,OAAO;YAAC;YAAW;SAAU;QAC7BC,SAAS;QACTC,SAAS;YAAC;YAAW;SAAU;QAC/BC,SAAS;QACTC,QAAQ;YAAC;YAAW;SAAU;QAC9BC,QAAQ;QACRC,QAAQ;YAAC;YAAW;SAAU;QAC9BC,SAAS;QACTC,SAAS;YAAC;YAAW;SAAU;QAC/BC,SAAS;QACTC,QAAQ;YAAC;YAAW;SAAU;QAC9BC,SAAS;YAAC;YAAY;SAAU;QAChCC,QAAQ;YAAC;YAAW;SAAW;QAC/BC,SAAS;YAAC;YAAY;SAAW;QACjCC,QAAQ;YAAC;YAAY;SAAW;QAChCC,SAAS;QACTC,QAAQ;IACV;IACAC,SAAS;QACPlB,QAAQ;QACRC,OAAO;YAAC;YAAW;SAAU;QAC7BC,SAAS;QACTC,SAAS;YAAC;YAAW;SAAU;QAC/BC,SAAS;QACTC,QAAQ;YAAC;YAAW;SAAU;QAC9BC,QAAQ;QACRC,QAAQ;YAAC;YAAW;SAAU;QAC9BC,SAAS;QACTC,SAAS;YAAC;YAAW;SAAU;QAC/BC,SAAS;QACTC,QAAQ;YAAC;YAAW;SAAU;QAC9BC,SAAS;YAAC;YAAY;SAAU;QAChCC,QAAQ;YAAC;YAAW;SAAW;QAC/BC,SAAS;YAAC;YAAY;SAAW;QACjCC,QAAQ;YAAC;YAAY;SAAW;QAChCC,SAAS;QACTC,QAAQ;QACRrB,QAAQ;QACR7B,QAAQ;QACRkB,QAAQ;QACRJ,QAAQ;QACRgB,QAAQ;QACRC,QAAQ;YAAC;YAAW;SAAW;QAC/BN,SAAS;QACTO,QAAQ;YAAC;YAAY;SAAU;IACjC;IACAoB,MAAM,CAAC;AACT,GAAG;IACDxD,GAAG;QAAC;QAAmD;QAAqC;QAAqF;QAAmF;QAAwD;QAA0D;QAA6E;QAA4F;QAA2F;QAAwF;QAAwF;QAAsG;QAA0D;QAAwC;QAA6D;QAA+C;QAA6D;QAAyE;QAA0E;QAA0E;QAA2E;QAAoE;QAAyD;QAAgE;QAAkE;QAAkE;KAAkE;IACt0DyD,GAAG;QAAC;QAA2E;QAAkE;QAAsD;QAAuD;QAAkF;KAA0E;IAC1ZC,GAAG;QAAC;QAAwE;QAA8D;QAAqD;QAAsD;KAA0E;IAC/TC,GAAG;QAAC;YAAC;YAAmE;gBACtEA,GAAG;YACL;SAAE;QAAE;YAAC;YAAqG;gBACxGA,GAAG;YACL;SAAE;QAAE;YAAC;YAAuE;gBAC1EA,GAAG;YACL;SAAE;QAAE;YAAC;YAAqE;gBACxEA,GAAG;YACL;SAAE;QAAE;YAAC;YAAyG;gBAC5GA,GAAG;YACL;SAAE;QAAE;YAAC;YAAwE;gBAC3EA,GAAG;YACL;SAAE;QAAE;YAAC;YAA2E;gBAC9EA,GAAG;YACL;SAAE;QAAE;YAAC;YAAqH;gBACxHA,GAAG;YACL;SAAE;QAAE;YAAC;YAA8E;gBACjFA,GAAG;YACL;SAAE;QAAE;YAAC;YAAkK;gBACrKA,GAAG;YACL;SAAE;QAAE;YAAC;YAA6J;gBAChKA,GAAG;YACL;SAAE;QAAE;YAAC;YAAoE;gBACvEA,GAAG;YACL;SAAE;QAAE;YAAC;YAAiF;gBACpFA,GAAG;YACL;SAAE;KAAC;AACL;AAIO,MAAMhE,6BAA6BiE,CAAAA;IACxC,MAAMC,SAAS1D;IACf,MAAM2D,eAAe;QACnBC,OAAOlE;QACPmE,MAAM/D;IACR;IACA2D,MAAMhE,IAAI,CAACqE,SAAS,GAAGC,IAAAA,mBAAY,EAACxE,mBAAmBE,IAAI,EAAEiE,OAAOjE,IAAI,EAAE,CAACgE,MAAMO,WAAW,IAAIN,OAAO5C,eAAe,EAAE4C,MAAM,CAACD,MAAMQ,IAAI,CAAC,EAAER,MAAMS,gBAAgB,GAAGP,aAAaE,IAAI,CAACpE,IAAI,GAAGkE,aAAaC,KAAK,CAACnE,IAAI,EAAEiE,MAAM,CAACD,MAAMU,UAAU,CAAC,EAAEV,MAAMU,UAAU,KAAK,UAAU,CAACV,MAAMO,WAAW,IAAIN,OAAO9C,uBAAuB,EAAE6C,MAAMhE,IAAI,CAACqE,SAAS;IAC1V,OAAOL;AACT,GACA,oDAAoD"}
+{"version":3,"sources":["useTableRowStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { tableCellActionsClassNames } from '../TableCellActions/useTableCellActionsStyles.styles';\nimport { tableSelectionCellClassNames } from '../TableSelectionCell/useTableSelectionCellStyles.styles';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nexport const tableRowClassName = 'fui-TableRow';\nexport const tableRowClassNames = {\n  root: tableRowClassName\n};\nconst useTableLayoutStyles = /*#__PURE__*/__styles({\n  root: {\n    mc9l5x: \"f1u0rzck\"\n  }\n}, {\n  d: [\".f1u0rzck{display:table-row;}\"]\n});\nconst useFlexLayoutStyles = /*#__PURE__*/__styles({\n  root: {\n    mc9l5x: \"f22iagw\",\n    Bt984gj: \"f122n59\"\n  }\n}, {\n  d: [\".f22iagw{display:flex;}\", \".f122n59{align-items:center;}\"]\n});\n/**\n * Styles for the root slot\n */\nconst useStyles = /*#__PURE__*/__styles({\n  root: {\n    sj55zd: \"f19n0e5\",\n    B7ck84d: \"f1ewtqcl\",\n    Bconypa: \"f1jazu75\",\n    B6guboy: \"f1xeqee6\",\n    Bn4voq9: \"fz36nt7\",\n    g9k6zt: \"f9znhxp\",\n    Bfpq7zp: \"fqrak0z\",\n    kdpuga: [\"f1o2ludy\", \"f1kjnpwc\"],\n    Bw81rd7: [\"f1kjnpwc\", \"f1o2ludy\"],\n    B6xbmo0: [\"fxmnebo\", \"f1witrsb\"],\n    dm238s: [\"f1witrsb\", \"fxmnebo\"]\n  },\n  rootInteractive: {\n    ecr2s2: \"f1wfn5kd\",\n    lj723h: \"f1g4hkjv\",\n    B43xm9u: \"f15ngxrw\",\n    i921ia: \"fjbbrdp\",\n    Jwef8y: \"f1t94bn6\",\n    Bi91k9c: \"feu1g3u\",\n    Bpt6rm4: \"f1uorfem\",\n    ff6mpl: \"fw60kww\"\n  },\n  medium: {\n    Bn0qgzm: \"f1vxd6vx\",\n    oivjwe: \"fg706s2\",\n    B9xav0g: \"frpde29\"\n  },\n  small: {\n    Bn0qgzm: \"f1vxd6vx\",\n    oivjwe: \"fg706s2\",\n    B9xav0g: \"frpde29\"\n  },\n  \"extra-small\": {\n    Be2twd7: \"fy9rknc\"\n  },\n  brand: {\n    De3pzq: \"f16xkysk\",\n    g2u3we: \"f1bh3yvw\",\n    h3c5rm: [\"fmi79ni\", \"f11fozsx\"],\n    B9xav0g: \"fnzw4c6\",\n    zhjwy3: [\"f11fozsx\", \"fmi79ni\"],\n    ecr2s2: \"ftepret\",\n    gwxt9v: \"fqlf3fd\",\n    v3aym: [\"f9dpb3h\", \"fw2muls\"],\n    Bc736ss: \"f1yat0gj\",\n    Bk6ri7n: [\"fw2muls\", \"f9dpb3h\"],\n    Bk5ld8o: \"f7nae3y\",\n    c4eypz: [\"fkbere7\", \"fa97sf3\"],\n    felo30: \"fmtyzcc\",\n    Eshu5l: [\"fa97sf3\", \"fkbere7\"],\n    Bjwas2f: \"fb6zhgp\",\n    Bn1d65q: [\"fyowp6c\", \"fz08sq8\"],\n    Bxeuatn: \"f9dii88\",\n    n51gp8: [\"fz08sq8\", \"fyowp6c\"],\n    Beo2b4z: [\"f1afxoft\", \"flqq2yx\"],\n    h6lo6r: [\"flqq2yx\", \"f1afxoft\"],\n    Btyw6ap: [\"f1b5xrmd\", \"f1831rx6\"],\n    w1pwid: [\"f1831rx6\", \"f1b5xrmd\"],\n    Brwvgy3: \"fd94n53\",\n    yadkgm: \"f1e0wld5\"\n  },\n  neutral: {\n    gwxt9v: \"fqlf3fd\",\n    v3aym: [\"f9dpb3h\", \"fw2muls\"],\n    Bc736ss: \"f1yat0gj\",\n    Bk6ri7n: [\"fw2muls\", \"f9dpb3h\"],\n    Bk5ld8o: \"f7nae3y\",\n    c4eypz: [\"fkbere7\", \"fa97sf3\"],\n    felo30: \"fmtyzcc\",\n    Eshu5l: [\"fa97sf3\", \"fkbere7\"],\n    Bjwas2f: \"fb6zhgp\",\n    Bn1d65q: [\"fyowp6c\", \"fz08sq8\"],\n    Bxeuatn: \"f9dii88\",\n    n51gp8: [\"fz08sq8\", \"fyowp6c\"],\n    Beo2b4z: [\"f1afxoft\", \"flqq2yx\"],\n    h6lo6r: [\"flqq2yx\", \"f1afxoft\"],\n    Btyw6ap: [\"f1b5xrmd\", \"f1831rx6\"],\n    w1pwid: [\"f1831rx6\", \"f1b5xrmd\"],\n    Brwvgy3: \"fd94n53\",\n    yadkgm: \"f1e0wld5\",\n    De3pzq: \"fq5gl1p\",\n    sj55zd: \"f1cgsbmv\",\n    Jwef8y: \"f1uqaxdt\",\n    ecr2s2: \"fa9o754\",\n    g2u3we: \"frmsihh\",\n    h3c5rm: [\"frttxa5\", \"f11o2r7f\"],\n    B9xav0g: \"fem5et0\",\n    zhjwy3: [\"f11o2r7f\", \"frttxa5\"]\n  },\n  none: {}\n}, {\n  d: [\".f19n0e5{color:var(--colorNeutralForeground1);}\", \".f1ewtqcl{box-sizing:border-box;}\", \".f1jazu75[data-fui-focus-within]:focus-within .fui-TableSelectionCell{opacity:1;}\", \".f1xeqee6[data-fui-focus-within]:focus-within .fui-TableCellActions{opacity:1;}\", \".fz36nt7[data-fui-focus-visible]{outline-width:2px;}\", \".f9znhxp[data-fui-focus-visible]{outline-style:solid;}\", \".fqrak0z[data-fui-focus-visible]{outline-color:var(--colorStrokeFocus2);}\", \".f1o2ludy[data-fui-focus-visible]{border-bottom-right-radius:var(--borderRadiusMedium);}\", \".f1kjnpwc[data-fui-focus-visible]{border-bottom-left-radius:var(--borderRadiusMedium);}\", \".fxmnebo[data-fui-focus-visible]{border-top-right-radius:var(--borderRadiusMedium);}\", \".f1witrsb[data-fui-focus-visible]{border-top-left-radius:var(--borderRadiusMedium);}\", \".f1vxd6vx{border-bottom-width:var(--strokeWidthThin);}\", \".fg706s2{border-bottom-style:solid;}\", \".frpde29{border-bottom-color:var(--colorNeutralStroke2);}\", \".fy9rknc{font-size:var(--fontSizeBase200);}\", \".f16xkysk{background-color:var(--colorBrandBackground2);}\", \".f1bh3yvw{border-top-color:var(--colorTransparentStrokeInteractive);}\", \".fmi79ni{border-right-color:var(--colorTransparentStrokeInteractive);}\", \".f11fozsx{border-left-color:var(--colorTransparentStrokeInteractive);}\", \".fnzw4c6{border-bottom-color:var(--colorTransparentStrokeInteractive);}\", \".fq5gl1p{background-color:var(--colorSubtleBackgroundSelected);}\", \".f1cgsbmv{color:var(--colorNeutralForeground1Hover);}\", \".frmsihh{border-top-color:var(--colorNeutralStrokeOnBrand);}\", \".frttxa5{border-right-color:var(--colorNeutralStrokeOnBrand);}\", \".f11o2r7f{border-left-color:var(--colorNeutralStrokeOnBrand);}\", \".fem5et0{border-bottom-color:var(--colorNeutralStrokeOnBrand);}\"],\n  a: [\".f1wfn5kd:active{background-color:var(--colorSubtleBackgroundPressed);}\", \".f1g4hkjv:active{color:var(--colorNeutralForeground1Pressed);}\", \".f15ngxrw:active .fui-TableCellActions{opacity:1;}\", \".fjbbrdp:active .fui-TableSelectionCell{opacity:1;}\", \".ftepret:active{background-color:var(--colorBrandBackgroundInvertedSelected);}\", \".fa9o754:active{background-color:var(--colorSubtleBackgroundSelected);}\"],\n  h: [\".f1t94bn6:hover{background-color:var(--colorSubtleBackgroundHover);}\", \".feu1g3u:hover{color:var(--colorNeutralForeground1Hover);}\", \".f1uorfem:hover .fui-TableCellActions{opacity:1;}\", \".fw60kww:hover .fui-TableSelectionCell{opacity:1;}\", \".f1uqaxdt:hover{background-color:var(--colorSubtleBackgroundSelected);}\"],\n  m: [[\"@media (forced-colors: active){.fqlf3fd{border-top-width:2px;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.f9dpb3h{border-right-width:2px;}.fw2muls{border-left-width:2px;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.f1yat0gj{border-bottom-width:2px;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.f7nae3y{border-top-style:solid;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.fa97sf3{border-left-style:solid;}.fkbere7{border-right-style:solid;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.fmtyzcc{border-bottom-style:solid;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.fb6zhgp{border-top-color:transparent;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.fyowp6c{border-right-color:transparent;}.fz08sq8{border-left-color:transparent;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.f9dii88{border-bottom-color:transparent;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.f1afxoft{border-bottom-right-radius:var(--borderRadiusMedium);}.flqq2yx{border-bottom-left-radius:var(--borderRadiusMedium);}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.f1831rx6{border-top-left-radius:var(--borderRadiusMedium);}.f1b5xrmd{border-top-right-radius:var(--borderRadiusMedium);}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.fd94n53{box-sizing:border-box;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.f1e0wld5:focus-visible{outline-offset:-4px;}}\", {\n    m: \"(forced-colors: active)\"\n  }]]\n});\n/**\n * Apply styling to the TableRow slots based on the state\n */\nexport const useTableRowStyles_unstable = state => {\n  const styles = useStyles();\n  const layoutStyles = {\n    table: useTableLayoutStyles(),\n    flex: useFlexLayoutStyles()\n  };\n  state.root.className = mergeClasses(tableRowClassNames.root, styles.root, !state.isHeaderRow && styles.rootInteractive, styles[state.size], state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root, styles[state.appearance], state.root.className);\n  return state;\n};\n//# sourceMappingURL=useTableRowStyles.styles.js.map"],"names":["tableRowClassName","tableRowClassNames","useTableRowStyles_unstable","root","useTableLayoutStyles","__styles","mc9l5x","d","useFlexLayoutStyles","Bt984gj","useStyles","sj55zd","B7ck84d","Bconypa","B6guboy","Bn4voq9","g9k6zt","Bfpq7zp","kdpuga","Bw81rd7","B6xbmo0","dm238s","rootInteractive","ecr2s2","lj723h","B43xm9u","i921ia","Jwef8y","Bi91k9c","Bpt6rm4","ff6mpl","medium","Bn0qgzm","oivjwe","B9xav0g","small","Be2twd7","brand","De3pzq","g2u3we","h3c5rm","zhjwy3","gwxt9v","v3aym","Bc736ss","Bk6ri7n","Bk5ld8o","c4eypz","felo30","Eshu5l","Bjwas2f","Bn1d65q","Bxeuatn","n51gp8","Beo2b4z","h6lo6r","Btyw6ap","w1pwid","Brwvgy3","yadkgm","neutral","none","a","h","m","state","styles","layoutStyles","table","flex","className","mergeClasses","isHeaderRow","size","noNativeElements","appearance"],"mappings":"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"}

package/lib-commonjs/hooks/useMeasureElement.js

@@ -31,11 +31,10 @@ function useMeasureElement() {
         // cleanup previous container
         if (container.current) {
             resizeObserver.unobserve(container.current);
-            container.current.remove();
         }
-        if (el) {
-            container.current = targetDocument.createElement('div');
-            el.insertAdjacentElement('beforebegin', container.current);
+        container.current = undefined;
+        if (el === null || el === void 0 ? void 0 : el.parentElement) {
+            container.current = el.parentElement;
             resizeObserver.observe(container.current);
             handleResize();
         }