@fluentui/react-list 9.6.14 → 9.6.16

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,22 +1,49 @@
1
1
  # Change Log - @fluentui/react-list
2
2
 
3
- This log was last generated on Thu, 23 Apr 2026 11:59:25 GMT and should not be manually modified.
3
+ This log was last generated on Wed, 24 Jun 2026 11:03:35 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [9.6.16](https://github.com/microsoft/fluentui/tree/@fluentui/react-list_v9.6.16)
8
+
9
+ Wed, 24 Jun 2026 11:03:35 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-list_v9.6.15..@fluentui/react-list_v9.6.16)
11
+
12
+ ### Patches
13
+
14
+ - fix: remove redundant use no memo directives, and add justification to valid ones ([PR #36224](https://github.com/microsoft/fluentui/pull/36224) by martinhochel@microsoft.com)
15
+ - Bump @fluentui/react-checkbox to v9.6.3 ([commit](https://github.com/microsoft/fluentui/commit/a4b871ca80c1f16f35ab4229def4fe02be7f30ea) by beachball)
16
+ - Bump @fluentui/react-context-selector to v9.2.18 ([commit](https://github.com/microsoft/fluentui/commit/a4b871ca80c1f16f35ab4229def4fe02be7f30ea) by beachball)
17
+ - Bump @fluentui/react-jsx-runtime to v9.4.4 ([commit](https://github.com/microsoft/fluentui/commit/a4b871ca80c1f16f35ab4229def4fe02be7f30ea) by beachball)
18
+ - Bump @fluentui/react-tabster to v9.26.16 ([commit](https://github.com/microsoft/fluentui/commit/a4b871ca80c1f16f35ab4229def4fe02be7f30ea) by beachball)
19
+ - Bump @fluentui/react-utilities to v9.26.5 ([commit](https://github.com/microsoft/fluentui/commit/a4b871ca80c1f16f35ab4229def4fe02be7f30ea) by beachball)
20
+
21
+ ## [9.6.15](https://github.com/microsoft/fluentui/tree/@fluentui/react-list_v9.6.15)
22
+
23
+ Tue, 26 May 2026 09:39:19 GMT
24
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-list_v9.6.14..@fluentui/react-list_v9.6.15)
25
+
26
+ ### Patches
27
+
28
+ - Bump @fluentui/react-checkbox to v9.6.2 ([PR #36246](https://github.com/microsoft/fluentui/pull/36246) by beachball)
29
+ - Bump @fluentui/react-context-selector to v9.2.17 ([PR #36246](https://github.com/microsoft/fluentui/pull/36246) by beachball)
30
+ - Bump @fluentui/react-jsx-runtime to v9.4.3 ([PR #36246](https://github.com/microsoft/fluentui/pull/36246) by beachball)
31
+ - Bump @fluentui/react-tabster to v9.26.15 ([PR #36246](https://github.com/microsoft/fluentui/pull/36246) by beachball)
32
+ - Bump @fluentui/react-utilities to v9.26.4 ([PR #36246](https://github.com/microsoft/fluentui/pull/36246) by beachball)
33
+
7
34
  ## [9.6.14](https://github.com/microsoft/fluentui/tree/@fluentui/react-list_v9.6.14)
8
35
 
9
- Thu, 23 Apr 2026 11:59:25 GMT
36
+ Thu, 23 Apr 2026 14:21:03 GMT
10
37
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-list_v9.6.13..@fluentui/react-list_v9.6.14)
11
38
 
12
39
  ### Patches
13
40
 
14
41
  - perf: memoize context values in use*ContextValues hooks ([PR #36008](https://github.com/microsoft/fluentui/pull/36008) by olfedias@microsoft.com)
15
- - Bump @fluentui/react-checkbox to v9.6.1 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
16
- - Bump @fluentui/react-context-selector to v9.2.16 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
17
- - Bump @fluentui/react-jsx-runtime to v9.4.2 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
18
- - Bump @fluentui/react-tabster to v9.26.14 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
19
- - Bump @fluentui/react-utilities to v9.26.3 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
42
+ - Bump @fluentui/react-checkbox to v9.6.1 ([PR #36035](https://github.com/microsoft/fluentui/pull/36035) by beachball)
43
+ - Bump @fluentui/react-context-selector to v9.2.16 ([PR #36035](https://github.com/microsoft/fluentui/pull/36035) by beachball)
44
+ - Bump @fluentui/react-jsx-runtime to v9.4.2 ([PR #36035](https://github.com/microsoft/fluentui/pull/36035) by beachball)
45
+ - Bump @fluentui/react-tabster to v9.26.14 ([PR #36035](https://github.com/microsoft/fluentui/pull/36035) by beachball)
46
+ - Bump @fluentui/react-utilities to v9.26.3 ([PR #36035](https://github.com/microsoft/fluentui/pull/36035) by beachball)
20
47
 
21
48
  ## [9.6.13](https://github.com/microsoft/fluentui/tree/@fluentui/react-list_v9.6.13)
22
49
 
@@ -9,9 +9,8 @@ const useRootBaseStyles = /*#__PURE__*/__resetStyles("r1m6yby2", null, [".r1m6yb
9
9
  * Apply styling to the List slots based on the state
10
10
  */
11
11
  export const useListStyles_unstable = state => {
12
- 'use no memo';
13
-
14
12
  const rootStyles = useRootBaseStyles();
13
+ // eslint-disable-next-line react-hooks/immutability
15
14
  state.root.className = mergeClasses(listClassNames.root, rootStyles, state.root.className);
16
15
  return state;
17
16
  };
@@ -1 +1 @@
1
- {"version":3,"names":["__resetStyles","mergeClasses","listClassNames","root","useRootBaseStyles","useListStyles_unstable","state","rootStyles","className"],"sources":["useListStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles, mergeClasses } from '@griffel/react';\nexport const listClassNames = {\n root: 'fui-List'\n};\nconst useRootBaseStyles = makeResetStyles({\n padding: 0,\n margin: 0,\n textIndent: 0,\n listStyleType: 'none'\n});\n/**\n * Apply styling to the List slots based on the state\n */ export const useListStyles_unstable = (state)=>{\n 'use no memo';\n const rootStyles = useRootBaseStyles();\n state.root.className = mergeClasses(listClassNames.root, rootStyles, state.root.className);\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,aAAA,EAA0BC,YAAY,QAAQ,gBAAgB;AAC9D,OAAO,MAAMC,cAAc,GAAG;EAC1BC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,iBAAiB,gBAAGJ,aAAA,wFAKzB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMK,sBAAsB,GAAIC,KAAK,IAAG;EAC/C,aAAa;;EACb,MAAMC,UAAU,GAAGH,iBAAiB,CAAC,CAAC;EACtCE,KAAK,CAACH,IAAI,CAACK,SAAS,GAAGP,YAAY,CAACC,cAAc,CAACC,IAAI,EAAEI,UAAU,EAAED,KAAK,CAACH,IAAI,CAACK,SAAS,CAAC;EAC1F,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
1
+ {"version":3,"names":["__resetStyles","mergeClasses","listClassNames","root","useRootBaseStyles","useListStyles_unstable","state","rootStyles","className"],"sources":["useListStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles, mergeClasses } from '@griffel/react';\nexport const listClassNames = {\n root: 'fui-List'\n};\nconst useRootBaseStyles = makeResetStyles({\n padding: 0,\n margin: 0,\n textIndent: 0,\n listStyleType: 'none'\n});\n/**\n * Apply styling to the List slots based on the state\n */ export const useListStyles_unstable = (state)=>{\n const rootStyles = useRootBaseStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(listClassNames.root, rootStyles, state.root.className);\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,aAAA,EAA0BC,YAAY,QAAQ,gBAAgB;AAC9D,OAAO,MAAMC,cAAc,GAAG;EAC1BC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,iBAAiB,gBAAGJ,aAAA,wFAKzB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMK,sBAAsB,GAAIC,KAAK,IAAG;EAC/C,MAAMC,UAAU,GAAGH,iBAAiB,CAAC,CAAC;EACtC;EACAE,KAAK,CAACH,IAAI,CAACK,SAAS,GAAGP,YAAY,CAACC,cAAc,CAACC,IAAI,EAAEI,UAAU,EAAED,KAAK,CAACH,IAAI,CAACK,SAAS,CAAC;EAC1F,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
@@ -12,8 +12,8 @@ const useRootBaseStyles = makeResetStyles({
12
12
  /**
13
13
  * Apply styling to the List slots based on the state
14
14
  */ export const useListStyles_unstable = (state)=>{
15
- 'use no memo';
16
15
  const rootStyles = useRootBaseStyles();
16
+ // eslint-disable-next-line react-hooks/immutability
17
17
  state.root.className = mergeClasses(listClassNames.root, rootStyles, state.root.className);
18
18
  return state;
19
19
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/List/useListStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeResetStyles, mergeClasses } from '@griffel/react';\nimport type { ListSlots, ListState } from './List.types';\n\nexport const listClassNames: SlotClassNames<ListSlots> = {\n root: 'fui-List',\n};\n\nconst useRootBaseStyles = makeResetStyles({\n padding: 0,\n margin: 0,\n textIndent: 0,\n listStyleType: 'none',\n});\n\n/**\n * Apply styling to the List slots based on the state\n */\nexport const useListStyles_unstable = (state: ListState): ListState => {\n 'use no memo';\n\n const rootStyles = useRootBaseStyles();\n\n state.root.className = mergeClasses(listClassNames.root, rootStyles, state.root.className);\n\n return state;\n};\n"],"names":["makeResetStyles","mergeClasses","listClassNames","root","useRootBaseStyles","padding","margin","textIndent","listStyleType","useListStyles_unstable","state","rootStyles","className"],"mappings":"AAAA;AAGA,SAASA,eAAe,EAAEC,YAAY,QAAQ,iBAAiB;AAG/D,OAAO,MAAMC,iBAA4C;IACvDC,MAAM;AACR,EAAE;AAEF,MAAMC,oBAAoBJ,gBAAgB;IACxCK,SAAS;IACTC,QAAQ;IACRC,YAAY;IACZC,eAAe;AACjB;AAEA;;CAEC,GACD,OAAO,MAAMC,yBAAyB,CAACC;IACrC;IAEA,MAAMC,aAAaP;IAEnBM,MAAMP,IAAI,CAACS,SAAS,GAAGX,aAAaC,eAAeC,IAAI,EAAEQ,YAAYD,MAAMP,IAAI,CAACS,SAAS;IAEzF,OAAOF;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/List/useListStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeResetStyles, mergeClasses } from '@griffel/react';\nimport type { ListSlots, ListState } from './List.types';\n\nexport const listClassNames: SlotClassNames<ListSlots> = {\n root: 'fui-List',\n};\n\nconst useRootBaseStyles = makeResetStyles({\n padding: 0,\n margin: 0,\n textIndent: 0,\n listStyleType: 'none',\n});\n\n/**\n * Apply styling to the List slots based on the state\n */\nexport const useListStyles_unstable = (state: ListState): ListState => {\n const rootStyles = useRootBaseStyles();\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(listClassNames.root, rootStyles, state.root.className);\n\n return state;\n};\n"],"names":["makeResetStyles","mergeClasses","listClassNames","root","useRootBaseStyles","padding","margin","textIndent","listStyleType","useListStyles_unstable","state","rootStyles","className"],"mappings":"AAAA;AAGA,SAASA,eAAe,EAAEC,YAAY,QAAQ,iBAAiB;AAG/D,OAAO,MAAMC,iBAA4C;IACvDC,MAAM;AACR,EAAE;AAEF,MAAMC,oBAAoBJ,gBAAgB;IACxCK,SAAS;IACTC,QAAQ;IACRC,YAAY;IACZC,eAAe;AACjB;AAEA;;CAEC,GACD,OAAO,MAAMC,yBAAyB,CAACC;IACrC,MAAMC,aAAaP;IAEnB,oDAAoD;IACpDM,MAAMP,IAAI,CAACS,SAAS,GAAGX,aAAaC,eAAeC,IAAI,EAAEQ,YAAYD,MAAMP,IAAI,CAACS,SAAS;IAEzF,OAAOF;AACT,EAAE"}
@@ -40,13 +40,13 @@ const useStyles = /*#__PURE__*/__styles({
40
40
  * Apply styling to the ListItem slots based on the state
41
41
  */
42
42
  export const useListItemStyles_unstable = state => {
43
- 'use no memo';
44
-
45
43
  const rootBaseStyles = useRootBaseStyles();
46
44
  const checkmarkBaseStyles = useCheckmarkBaseStyles();
47
45
  const styles = useStyles();
46
+ // eslint-disable-next-line react-hooks/immutability
48
47
  state.root.className = mergeClasses(listItemClassNames.root, rootBaseStyles, (state.selectable || state.navigable) && styles.rootClickableOrSelectable, state.disabled && styles.disabled, state.root.className);
49
48
  if (state.checkmark) {
49
+ // eslint-disable-next-line react-hooks/immutability
50
50
  state.checkmark.className = mergeClasses(listItemClassNames.checkmark, checkmarkBaseStyles.root, state.checkmark.className);
51
51
  }
52
52
  return state;
@@ -1 +1 @@
1
- {"version":3,"names":["__styles","__resetStyles","mergeClasses","createCustomFocusIndicatorStyle","tokens","listItemClassNames","root","checkmark","useRootBaseStyles","useCheckmarkBaseStyles","qb2dma","Bpb5tq4","Biccaaf","Gaeyjg","ldoezw","B6gmeee","d","p","useStyles","rootClickableOrSelectable","mc9l5x","Bceei9c","disabled","useListItemStyles_unstable","state","rootBaseStyles","checkmarkBaseStyles","styles","className","selectable","navigable"],"sources":["useListItemStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, makeResetStyles, mergeClasses } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nexport const listItemClassNames = {\n root: 'fui-ListItem',\n checkmark: 'fui-ListItem__checkmark'\n};\nconst useRootBaseStyles = makeResetStyles({\n padding: 0,\n margin: 0,\n textIndent: 0,\n listStyleType: 'none',\n ...createCustomFocusIndicatorStyle({\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n borderRadius: tokens.borderRadiusMedium\n }, {\n selector: 'focus'\n })\n});\nconst useCheckmarkBaseStyles = makeStyles({\n root: {\n alignSelf: 'center',\n '& .fui-Checkbox__indicator': {\n margin: '4px'\n }\n }\n});\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n rootClickableOrSelectable: {\n display: 'flex',\n cursor: 'pointer'\n },\n disabled: {\n cursor: 'default'\n }\n});\n/**\n * Apply styling to the ListItem slots based on the state\n */ export const useListItemStyles_unstable = (state)=>{\n 'use no memo';\n const rootBaseStyles = useRootBaseStyles();\n const checkmarkBaseStyles = useCheckmarkBaseStyles();\n const styles = useStyles();\n state.root.className = mergeClasses(listItemClassNames.root, rootBaseStyles, (state.selectable || state.navigable) && styles.rootClickableOrSelectable, state.disabled && styles.disabled, state.root.className);\n if (state.checkmark) {\n state.checkmark.className = mergeClasses(listItemClassNames.checkmark, checkmarkBaseStyles.root, state.checkmark.className);\n }\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,QAAA,EAAAC,aAAA,EAAsCC,YAAY,QAAQ,gBAAgB;AAC1E,SAASC,+BAA+B,QAAQ,yBAAyB;AACzE,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,OAAO,MAAMC,kBAAkB,GAAG;EAC9BC,IAAI,EAAE,cAAc;EACpBC,SAAS,EAAE;AACf,CAAC;AACD,MAAMC,iBAAiB,gBAAGP,aAAA,mOAWzB,CAAC;AACF,MAAMQ,sBAAsB,gBAAGT,QAAA;EAAAM,IAAA;IAAAI,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;AAAA,CAO9B,CAAC;AACF;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGlB,QAAA;EAAAmB,yBAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;EAAAC,QAAA;IAAAD,OAAA;EAAA;AAAA;EAAAL,CAAA;AAAA,CAQrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMO,0BAA0B,GAAIC,KAAK,IAAG;EACnD,aAAa;;EACb,MAAMC,cAAc,GAAGjB,iBAAiB,CAAC,CAAC;EAC1C,MAAMkB,mBAAmB,GAAGjB,sBAAsB,CAAC,CAAC;EACpD,MAAMkB,MAAM,GAAGT,SAAS,CAAC,CAAC;EAC1BM,KAAK,CAAClB,IAAI,CAACsB,SAAS,GAAG1B,YAAY,CAACG,kBAAkB,CAACC,IAAI,EAAEmB,cAAc,EAAE,CAACD,KAAK,CAACK,UAAU,IAAIL,KAAK,CAACM,SAAS,KAAKH,MAAM,CAACR,yBAAyB,EAAEK,KAAK,CAACF,QAAQ,IAAIK,MAAM,CAACL,QAAQ,EAAEE,KAAK,CAAClB,IAAI,CAACsB,SAAS,CAAC;EAChN,IAAIJ,KAAK,CAACjB,SAAS,EAAE;IACjBiB,KAAK,CAACjB,SAAS,CAACqB,SAAS,GAAG1B,YAAY,CAACG,kBAAkB,CAACE,SAAS,EAAEmB,mBAAmB,CAACpB,IAAI,EAAEkB,KAAK,CAACjB,SAAS,CAACqB,SAAS,CAAC;EAC/H;EACA,OAAOJ,KAAK;AAChB,CAAC","ignoreList":[]}
1
+ {"version":3,"names":["__styles","__resetStyles","mergeClasses","createCustomFocusIndicatorStyle","tokens","listItemClassNames","root","checkmark","useRootBaseStyles","useCheckmarkBaseStyles","qb2dma","Bpb5tq4","Biccaaf","Gaeyjg","ldoezw","B6gmeee","d","p","useStyles","rootClickableOrSelectable","mc9l5x","Bceei9c","disabled","useListItemStyles_unstable","state","rootBaseStyles","checkmarkBaseStyles","styles","className","selectable","navigable"],"sources":["useListItemStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, makeResetStyles, mergeClasses } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nexport const listItemClassNames = {\n root: 'fui-ListItem',\n checkmark: 'fui-ListItem__checkmark'\n};\nconst useRootBaseStyles = makeResetStyles({\n padding: 0,\n margin: 0,\n textIndent: 0,\n listStyleType: 'none',\n ...createCustomFocusIndicatorStyle({\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n borderRadius: tokens.borderRadiusMedium\n }, {\n selector: 'focus'\n })\n});\nconst useCheckmarkBaseStyles = makeStyles({\n root: {\n alignSelf: 'center',\n '& .fui-Checkbox__indicator': {\n margin: '4px'\n }\n }\n});\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n rootClickableOrSelectable: {\n display: 'flex',\n cursor: 'pointer'\n },\n disabled: {\n cursor: 'default'\n }\n});\n/**\n * Apply styling to the ListItem slots based on the state\n */ export const useListItemStyles_unstable = (state)=>{\n const rootBaseStyles = useRootBaseStyles();\n const checkmarkBaseStyles = useCheckmarkBaseStyles();\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(listItemClassNames.root, rootBaseStyles, (state.selectable || state.navigable) && styles.rootClickableOrSelectable, state.disabled && styles.disabled, state.root.className);\n if (state.checkmark) {\n // eslint-disable-next-line react-hooks/immutability\n state.checkmark.className = mergeClasses(listItemClassNames.checkmark, checkmarkBaseStyles.root, state.checkmark.className);\n }\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,QAAA,EAAAC,aAAA,EAAsCC,YAAY,QAAQ,gBAAgB;AAC1E,SAASC,+BAA+B,QAAQ,yBAAyB;AACzE,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,OAAO,MAAMC,kBAAkB,GAAG;EAC9BC,IAAI,EAAE,cAAc;EACpBC,SAAS,EAAE;AACf,CAAC;AACD,MAAMC,iBAAiB,gBAAGP,aAAA,mOAWzB,CAAC;AACF,MAAMQ,sBAAsB,gBAAGT,QAAA;EAAAM,IAAA;IAAAI,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;AAAA,CAO9B,CAAC;AACF;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGlB,QAAA;EAAAmB,yBAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;EAAAC,QAAA;IAAAD,OAAA;EAAA;AAAA;EAAAL,CAAA;AAAA,CAQrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMO,0BAA0B,GAAIC,KAAK,IAAG;EACnD,MAAMC,cAAc,GAAGjB,iBAAiB,CAAC,CAAC;EAC1C,MAAMkB,mBAAmB,GAAGjB,sBAAsB,CAAC,CAAC;EACpD,MAAMkB,MAAM,GAAGT,SAAS,CAAC,CAAC;EAC1B;EACAM,KAAK,CAAClB,IAAI,CAACsB,SAAS,GAAG1B,YAAY,CAACG,kBAAkB,CAACC,IAAI,EAAEmB,cAAc,EAAE,CAACD,KAAK,CAACK,UAAU,IAAIL,KAAK,CAACM,SAAS,KAAKH,MAAM,CAACR,yBAAyB,EAAEK,KAAK,CAACF,QAAQ,IAAIK,MAAM,CAACL,QAAQ,EAAEE,KAAK,CAAClB,IAAI,CAACsB,SAAS,CAAC;EAChN,IAAIJ,KAAK,CAACjB,SAAS,EAAE;IACjB;IACAiB,KAAK,CAACjB,SAAS,CAACqB,SAAS,GAAG1B,YAAY,CAACG,kBAAkB,CAACE,SAAS,EAAEmB,mBAAmB,CAACpB,IAAI,EAAEkB,KAAK,CAACjB,SAAS,CAACqB,SAAS,CAAC;EAC/H;EACA,OAAOJ,KAAK;AAChB,CAAC","ignoreList":[]}
@@ -40,12 +40,13 @@ const useCheckmarkBaseStyles = makeStyles({
40
40
  /**
41
41
  * Apply styling to the ListItem slots based on the state
42
42
  */ export const useListItemStyles_unstable = (state)=>{
43
- 'use no memo';
44
43
  const rootBaseStyles = useRootBaseStyles();
45
44
  const checkmarkBaseStyles = useCheckmarkBaseStyles();
46
45
  const styles = useStyles();
46
+ // eslint-disable-next-line react-hooks/immutability
47
47
  state.root.className = mergeClasses(listItemClassNames.root, rootBaseStyles, (state.selectable || state.navigable) && styles.rootClickableOrSelectable, state.disabled && styles.disabled, state.root.className);
48
48
  if (state.checkmark) {
49
+ // eslint-disable-next-line react-hooks/immutability
49
50
  state.checkmark.className = mergeClasses(listItemClassNames.checkmark, checkmarkBaseStyles.root, state.checkmark.className);
50
51
  }
51
52
  return state;
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/ListItem/useListItemStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, makeResetStyles, mergeClasses } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport type { ListItemSlots, ListItemState } from './ListItem.types';\nimport { tokens } from '@fluentui/react-theme';\n\nexport const listItemClassNames: SlotClassNames<ListItemSlots> = {\n root: 'fui-ListItem',\n checkmark: 'fui-ListItem__checkmark',\n};\n\nconst useRootBaseStyles = makeResetStyles({\n padding: 0,\n margin: 0,\n textIndent: 0,\n listStyleType: 'none',\n ...createCustomFocusIndicatorStyle(\n {\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n borderRadius: tokens.borderRadiusMedium,\n },\n { selector: 'focus' },\n ),\n});\n\nconst useCheckmarkBaseStyles = makeStyles({\n root: {\n alignSelf: 'center',\n\n '& .fui-Checkbox__indicator': { margin: '4px' },\n },\n});\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n rootClickableOrSelectable: {\n display: 'flex',\n cursor: 'pointer',\n },\n\n disabled: {\n cursor: 'default',\n },\n});\n\n/**\n * Apply styling to the ListItem slots based on the state\n */\nexport const useListItemStyles_unstable = (state: ListItemState): ListItemState => {\n 'use no memo';\n\n const rootBaseStyles = useRootBaseStyles();\n const checkmarkBaseStyles = useCheckmarkBaseStyles();\n const styles = useStyles();\n\n state.root.className = mergeClasses(\n listItemClassNames.root,\n rootBaseStyles,\n (state.selectable || state.navigable) && styles.rootClickableOrSelectable,\n state.disabled && styles.disabled,\n state.root.className,\n );\n\n if (state.checkmark) {\n state.checkmark.className = mergeClasses(\n listItemClassNames.checkmark,\n checkmarkBaseStyles.root,\n state.checkmark.className,\n );\n }\n\n return state;\n};\n"],"names":["makeStyles","makeResetStyles","mergeClasses","createCustomFocusIndicatorStyle","tokens","listItemClassNames","root","checkmark","useRootBaseStyles","padding","margin","textIndent","listStyleType","outline","strokeWidthThick","colorStrokeFocus2","borderRadius","borderRadiusMedium","selector","useCheckmarkBaseStyles","alignSelf","useStyles","rootClickableOrSelectable","display","cursor","disabled","useListItemStyles_unstable","state","rootBaseStyles","checkmarkBaseStyles","styles","className","selectable","navigable"],"mappings":"AAAA;AAGA,SAASA,UAAU,EAAEC,eAAe,EAAEC,YAAY,QAAQ,iBAAiB;AAC3E,SAASC,+BAA+B,QAAQ,0BAA0B;AAE1E,SAASC,MAAM,QAAQ,wBAAwB;AAE/C,OAAO,MAAMC,qBAAoD;IAC/DC,MAAM;IACNC,WAAW;AACb,EAAE;AAEF,MAAMC,oBAAoBP,gBAAgB;IACxCQ,SAAS;IACTC,QAAQ;IACRC,YAAY;IACZC,eAAe;IACf,GAAGT,gCACD;QACEU,SAAS,GAAGT,OAAOU,gBAAgB,CAAC,OAAO,EAAEV,OAAOW,iBAAiB,EAAE;QACvEC,cAAcZ,OAAOa,kBAAkB;IACzC,GACA;QAAEC,UAAU;IAAQ,EACrB;AACH;AAEA,MAAMC,yBAAyBnB,WAAW;IACxCM,MAAM;QACJc,WAAW;QAEX,8BAA8B;YAAEV,QAAQ;QAAM;IAChD;AACF;AACA;;CAEC,GACD,MAAMW,YAAYrB,WAAW;IAC3BsB,2BAA2B;QACzBC,SAAS;QACTC,QAAQ;IACV;IAEAC,UAAU;QACRD,QAAQ;IACV;AACF;AAEA;;CAEC,GACD,OAAO,MAAME,6BAA6B,CAACC;IACzC;IAEA,MAAMC,iBAAiBpB;IACvB,MAAMqB,sBAAsBV;IAC5B,MAAMW,SAAST;IAEfM,MAAMrB,IAAI,CAACyB,SAAS,GAAG7B,aACrBG,mBAAmBC,IAAI,EACvBsB,gBACA,AAACD,CAAAA,MAAMK,UAAU,IAAIL,MAAMM,SAAS,AAAD,KAAMH,OAAOR,yBAAyB,EACzEK,MAAMF,QAAQ,IAAIK,OAAOL,QAAQ,EACjCE,MAAMrB,IAAI,CAACyB,SAAS;IAGtB,IAAIJ,MAAMpB,SAAS,EAAE;QACnBoB,MAAMpB,SAAS,CAACwB,SAAS,GAAG7B,aAC1BG,mBAAmBE,SAAS,EAC5BsB,oBAAoBvB,IAAI,EACxBqB,MAAMpB,SAAS,CAACwB,SAAS;IAE7B;IAEA,OAAOJ;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/ListItem/useListItemStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, makeResetStyles, mergeClasses } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport type { ListItemSlots, ListItemState } from './ListItem.types';\nimport { tokens } from '@fluentui/react-theme';\n\nexport const listItemClassNames: SlotClassNames<ListItemSlots> = {\n root: 'fui-ListItem',\n checkmark: 'fui-ListItem__checkmark',\n};\n\nconst useRootBaseStyles = makeResetStyles({\n padding: 0,\n margin: 0,\n textIndent: 0,\n listStyleType: 'none',\n ...createCustomFocusIndicatorStyle(\n {\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n borderRadius: tokens.borderRadiusMedium,\n },\n { selector: 'focus' },\n ),\n});\n\nconst useCheckmarkBaseStyles = makeStyles({\n root: {\n alignSelf: 'center',\n\n '& .fui-Checkbox__indicator': { margin: '4px' },\n },\n});\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n rootClickableOrSelectable: {\n display: 'flex',\n cursor: 'pointer',\n },\n\n disabled: {\n cursor: 'default',\n },\n});\n\n/**\n * Apply styling to the ListItem slots based on the state\n */\nexport const useListItemStyles_unstable = (state: ListItemState): ListItemState => {\n const rootBaseStyles = useRootBaseStyles();\n const checkmarkBaseStyles = useCheckmarkBaseStyles();\n const styles = useStyles();\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n listItemClassNames.root,\n rootBaseStyles,\n (state.selectable || state.navigable) && styles.rootClickableOrSelectable,\n state.disabled && styles.disabled,\n state.root.className,\n );\n\n if (state.checkmark) {\n // eslint-disable-next-line react-hooks/immutability\n state.checkmark.className = mergeClasses(\n listItemClassNames.checkmark,\n checkmarkBaseStyles.root,\n state.checkmark.className,\n );\n }\n\n return state;\n};\n"],"names":["makeStyles","makeResetStyles","mergeClasses","createCustomFocusIndicatorStyle","tokens","listItemClassNames","root","checkmark","useRootBaseStyles","padding","margin","textIndent","listStyleType","outline","strokeWidthThick","colorStrokeFocus2","borderRadius","borderRadiusMedium","selector","useCheckmarkBaseStyles","alignSelf","useStyles","rootClickableOrSelectable","display","cursor","disabled","useListItemStyles_unstable","state","rootBaseStyles","checkmarkBaseStyles","styles","className","selectable","navigable"],"mappings":"AAAA;AAGA,SAASA,UAAU,EAAEC,eAAe,EAAEC,YAAY,QAAQ,iBAAiB;AAC3E,SAASC,+BAA+B,QAAQ,0BAA0B;AAE1E,SAASC,MAAM,QAAQ,wBAAwB;AAE/C,OAAO,MAAMC,qBAAoD;IAC/DC,MAAM;IACNC,WAAW;AACb,EAAE;AAEF,MAAMC,oBAAoBP,gBAAgB;IACxCQ,SAAS;IACTC,QAAQ;IACRC,YAAY;IACZC,eAAe;IACf,GAAGT,gCACD;QACEU,SAAS,GAAGT,OAAOU,gBAAgB,CAAC,OAAO,EAAEV,OAAOW,iBAAiB,EAAE;QACvEC,cAAcZ,OAAOa,kBAAkB;IACzC,GACA;QAAEC,UAAU;IAAQ,EACrB;AACH;AAEA,MAAMC,yBAAyBnB,WAAW;IACxCM,MAAM;QACJc,WAAW;QAEX,8BAA8B;YAAEV,QAAQ;QAAM;IAChD;AACF;AACA;;CAEC,GACD,MAAMW,YAAYrB,WAAW;IAC3BsB,2BAA2B;QACzBC,SAAS;QACTC,QAAQ;IACV;IAEAC,UAAU;QACRD,QAAQ;IACV;AACF;AAEA;;CAEC,GACD,OAAO,MAAME,6BAA6B,CAACC;IACzC,MAAMC,iBAAiBpB;IACvB,MAAMqB,sBAAsBV;IAC5B,MAAMW,SAAST;IAEf,oDAAoD;IACpDM,MAAMrB,IAAI,CAACyB,SAAS,GAAG7B,aACrBG,mBAAmBC,IAAI,EACvBsB,gBACA,AAACD,CAAAA,MAAMK,UAAU,IAAIL,MAAMM,SAAS,AAAD,KAAMH,OAAOR,yBAAyB,EACzEK,MAAMF,QAAQ,IAAIK,OAAOL,QAAQ,EACjCE,MAAMrB,IAAI,CAACyB,SAAS;IAGtB,IAAIJ,MAAMpB,SAAS,EAAE;QACnB,oDAAoD;QACpDoB,MAAMpB,SAAS,CAACwB,SAAS,GAAG7B,aAC1BG,mBAAmBE,SAAS,EAC5BsB,oBAAoBvB,IAAI,EACxBqB,MAAMpB,SAAS,CAACwB,SAAS;IAE7B;IAEA,OAAOJ;AACT,EAAE"}
@@ -25,8 +25,8 @@ const useRootBaseStyles = /*#__PURE__*/ (0, _react.__resetStyles)("r1m6yby2", nu
25
25
  ".r1m6yby2{padding:0;margin:0;text-indent:0;list-style-type:none;}"
26
26
  ]);
27
27
  const useListStyles_unstable = (state)=>{
28
- 'use no memo';
29
28
  const rootStyles = useRootBaseStyles();
29
+ // eslint-disable-next-line react-hooks/immutability
30
30
  state.root.className = (0, _react.mergeClasses)(listClassNames.root, rootStyles, state.root.className);
31
31
  return state;
32
32
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["useListStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles, mergeClasses } from '@griffel/react';\nexport const listClassNames = {\n root: 'fui-List'\n};\nconst useRootBaseStyles = makeResetStyles({\n padding: 0,\n margin: 0,\n textIndent: 0,\n listStyleType: 'none'\n});\n/**\n * Apply styling to the List slots based on the state\n */ export const useListStyles_unstable = (state)=>{\n 'use no memo';\n const rootStyles = useRootBaseStyles();\n state.root.className = mergeClasses(listClassNames.root, rootStyles, state.root.className);\n return state;\n};\n"],"names":["__resetStyles","mergeClasses","listClassNames","root","useRootBaseStyles","useListStyles_unstable","state","rootStyles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;kBAEe;;;0BAWY;;;;uBAZO,gBAAgB;AACvD,MAAME,iBAAiB;IAC1BC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,iBAAiB,GAAA,WAAA,OAAGJ,oBAAA,EAAA,YAAA,MAAA;IAAA;CAKzB,CAAC;AAGS,MAAMK,0BAA0BC,KAAK,IAAG;IAC/C,aAAa;IACb,MAAMC,UAAU,GAAGH,iBAAiB,CAAC,CAAC;IACtCE,KAAK,CAACH,IAAI,CAACK,SAAS,OAAGP,mBAAY,EAACC,cAAc,CAACC,IAAI,EAAEI,UAAU,EAAED,KAAK,CAACH,IAAI,CAACK,SAAS,CAAC;IAC1F,OAAOF,KAAK;AAChB,CAAC"}
1
+ {"version":3,"sources":["useListStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles, mergeClasses } from '@griffel/react';\nexport const listClassNames = {\n root: 'fui-List'\n};\nconst useRootBaseStyles = makeResetStyles({\n padding: 0,\n margin: 0,\n textIndent: 0,\n listStyleType: 'none'\n});\n/**\n * Apply styling to the List slots based on the state\n */ export const useListStyles_unstable = (state)=>{\n const rootStyles = useRootBaseStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(listClassNames.root, rootStyles, state.root.className);\n return state;\n};\n"],"names":["__resetStyles","mergeClasses","listClassNames","root","useRootBaseStyles","useListStyles_unstable","state","rootStyles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;kBAEe;;;IAWVK,sBAAsB;;;;uBAZO,gBAAgB;AACvD,MAAMH,iBAAiB;IAC1BC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,iBAAiB,GAAA,WAAA,OAAGJ,oBAAA,EAAA,YAAA,MAAA;IAAA;CAKzB,CAAC;AAGS,gCAAgCM,KAAK,IAAG;IAC/C,MAAMC,UAAU,GAAGH,iBAAiB,CAAC,CAAC;IACtC,oDAAA;IACAE,KAAK,CAACH,IAAI,CAACK,SAAS,OAAGP,mBAAY,EAACC,cAAc,CAACC,IAAI,EAAEI,UAAU,EAAED,KAAK,CAACH,IAAI,CAACK,SAAS,CAAC;IAC1F,OAAOF,KAAK;AAChB,CAAC"}
@@ -28,8 +28,8 @@ const useRootBaseStyles = (0, _react.makeResetStyles)({
28
28
  listStyleType: 'none'
29
29
  });
30
30
  const useListStyles_unstable = (state)=>{
31
- 'use no memo';
32
31
  const rootStyles = useRootBaseStyles();
32
+ // eslint-disable-next-line react-hooks/immutability
33
33
  state.root.className = (0, _react.mergeClasses)(listClassNames.root, rootStyles, state.root.className);
34
34
  return state;
35
35
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/List/useListStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeResetStyles, mergeClasses } from '@griffel/react';\nimport type { ListSlots, ListState } from './List.types';\n\nexport const listClassNames: SlotClassNames<ListSlots> = {\n root: 'fui-List',\n};\n\nconst useRootBaseStyles = makeResetStyles({\n padding: 0,\n margin: 0,\n textIndent: 0,\n listStyleType: 'none',\n});\n\n/**\n * Apply styling to the List slots based on the state\n */\nexport const useListStyles_unstable = (state: ListState): ListState => {\n 'use no memo';\n\n const rootStyles = useRootBaseStyles();\n\n state.root.className = mergeClasses(listClassNames.root, rootStyles, state.root.className);\n\n return state;\n};\n"],"names":["makeResetStyles","mergeClasses","listClassNames","root","useRootBaseStyles","padding","margin","textIndent","listStyleType","useListStyles_unstable","state","rootStyles","className"],"mappings":"AAAA;;;;;;;;;;;;kBAMaE;;;0BAcAO;;;;uBAjBiC,iBAAiB;AAGxD,MAAMP,iBAA4C;IACvDC,MAAM;AACR,EAAE;AAEF,MAAMC,wBAAoBJ,sBAAAA,EAAgB;IACxCK,SAAS;IACTC,QAAQ;IACRC,YAAY;IACZC,eAAe;AACjB;AAKO,MAAMC,yBAAyB,CAACC;IACrC;IAEA,MAAMC,aAAaP;IAEnBM,MAAMP,IAAI,CAACS,SAAS,OAAGX,mBAAAA,EAAaC,eAAeC,IAAI,EAAEQ,YAAYD,MAAMP,IAAI,CAACS,SAAS;IAEzF,OAAOF;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/List/useListStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeResetStyles, mergeClasses } from '@griffel/react';\nimport type { ListSlots, ListState } from './List.types';\n\nexport const listClassNames: SlotClassNames<ListSlots> = {\n root: 'fui-List',\n};\n\nconst useRootBaseStyles = makeResetStyles({\n padding: 0,\n margin: 0,\n textIndent: 0,\n listStyleType: 'none',\n});\n\n/**\n * Apply styling to the List slots based on the state\n */\nexport const useListStyles_unstable = (state: ListState): ListState => {\n const rootStyles = useRootBaseStyles();\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(listClassNames.root, rootStyles, state.root.className);\n\n return state;\n};\n"],"names":["makeResetStyles","mergeClasses","listClassNames","root","useRootBaseStyles","padding","margin","textIndent","listStyleType","useListStyles_unstable","state","rootStyles","className"],"mappings":"AAAA;;;;;;;;;;;;kBAMaE;;;0BAcAO;;;;uBAjBiC,iBAAiB;AAGxD,MAAMP,iBAA4C;IACvDC,MAAM;AACR,EAAE;AAEF,MAAMC,wBAAoBJ,sBAAAA,EAAgB;IACxCK,SAAS;IACTC,QAAQ;IACRC,YAAY;IACZC,eAAe;AACjB;AAKO,MAAMC,yBAAyB,CAACC;IACrC,MAAMC,aAAaP;IAEnB,oDAAoD;IACpDM,MAAMP,IAAI,CAACS,SAAS,OAAGX,mBAAAA,EAAaC,eAAeC,IAAI,EAAEQ,YAAYD,MAAMP,IAAI,CAACS,SAAS;IAEzF,OAAOF;AACT,EAAE"}
@@ -64,12 +64,13 @@ const useCheckmarkBaseStyles = /*#__PURE__*/ (0, _react.__styles)({
64
64
  ]
65
65
  });
66
66
  const useListItemStyles_unstable = (state)=>{
67
- 'use no memo';
68
67
  const rootBaseStyles = useRootBaseStyles();
69
68
  const checkmarkBaseStyles = useCheckmarkBaseStyles();
70
69
  const styles = useStyles();
70
+ // eslint-disable-next-line react-hooks/immutability
71
71
  state.root.className = (0, _react.mergeClasses)(listItemClassNames.root, rootBaseStyles, (state.selectable || state.navigable) && styles.rootClickableOrSelectable, state.disabled && styles.disabled, state.root.className);
72
72
  if (state.checkmark) {
73
+ // eslint-disable-next-line react-hooks/immutability
73
74
  state.checkmark.className = (0, _react.mergeClasses)(listItemClassNames.checkmark, checkmarkBaseStyles.root, state.checkmark.className);
74
75
  }
75
76
  return state;
@@ -1 +1 @@
1
- {"version":3,"sources":["useListItemStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, makeResetStyles, mergeClasses } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nexport const listItemClassNames = {\n root: 'fui-ListItem',\n checkmark: 'fui-ListItem__checkmark'\n};\nconst useRootBaseStyles = makeResetStyles({\n padding: 0,\n margin: 0,\n textIndent: 0,\n listStyleType: 'none',\n ...createCustomFocusIndicatorStyle({\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n borderRadius: tokens.borderRadiusMedium\n }, {\n selector: 'focus'\n })\n});\nconst useCheckmarkBaseStyles = makeStyles({\n root: {\n alignSelf: 'center',\n '& .fui-Checkbox__indicator': {\n margin: '4px'\n }\n }\n});\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n rootClickableOrSelectable: {\n display: 'flex',\n cursor: 'pointer'\n },\n disabled: {\n cursor: 'default'\n }\n});\n/**\n * Apply styling to the ListItem slots based on the state\n */ export const useListItemStyles_unstable = (state)=>{\n 'use no memo';\n const rootBaseStyles = useRootBaseStyles();\n const checkmarkBaseStyles = useCheckmarkBaseStyles();\n const styles = useStyles();\n state.root.className = mergeClasses(listItemClassNames.root, rootBaseStyles, (state.selectable || state.navigable) && styles.rootClickableOrSelectable, state.disabled && styles.disabled, state.root.className);\n if (state.checkmark) {\n state.checkmark.className = mergeClasses(listItemClassNames.checkmark, checkmarkBaseStyles.root, state.checkmark.className);\n }\n return state;\n};\n"],"names":["__styles","__resetStyles","mergeClasses","createCustomFocusIndicatorStyle","tokens","listItemClassNames","root","checkmark","useRootBaseStyles","useCheckmarkBaseStyles","qb2dma","Bpb5tq4","Biccaaf","Gaeyjg","ldoezw","B6gmeee","d","p","useStyles","rootClickableOrSelectable","mc9l5x","Bceei9c","disabled","useListItemStyles_unstable","state","rootBaseStyles","checkmarkBaseStyles","styles","className","selectable","navigable"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAICK,kBAAkB;;;8BAqCY;eAA1BkB;;;uBAxCyC,gBAAgB;AAGnE,2BAA2B;IAC9BjB,IAAI,EAAE,cAAc;IACpBC,SAAS,EAAE;AACf,CAAC;AACD,MAAMC,iBAAiB,GAAA,WAAA,OAAGP,oBAAA,EAAA,WAAA,MAAA;IAAA;IAAA;CAWzB,CAAC;AACF,MAAMQ,sBAAsB,GAAA,WAAA,OAAGT,eAAA,EAAA;IAAAM,IAAA,EAAA;QAAAI,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;KAAA;AAAA,CAO9B,CAAC;AACF;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,OAAGlB,eAAA,EAAA;IAAAmB,yBAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;IAAAC,QAAA,EAAA;QAAAD,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAL,CAAA,EAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CAQrB,CAAC;AAGS,oCAAoCQ,KAAK,IAAG;IACnD,aAAa;IACb,MAAMC,cAAc,GAAGjB,iBAAiB,CAAC,CAAC;IAC1C,MAAMkB,mBAAmB,GAAGjB,sBAAsB,CAAC,CAAC;IACpD,MAAMkB,MAAM,GAAGT,SAAS,CAAC,CAAC;IAC1BM,KAAK,CAAClB,IAAI,CAACsB,SAAS,OAAG1B,mBAAY,EAACG,kBAAkB,CAACC,IAAI,EAAEmB,cAAc,EAAE,CAACD,KAAK,CAACK,UAAU,IAAIL,KAAK,CAACM,SAAAA,AAAS,KAAKH,MAAM,CAACR,yBAAyB,EAAEK,KAAK,CAACF,QAAQ,IAAIK,MAAM,CAACL,QAAQ,EAAEE,KAAK,CAAClB,IAAI,CAACsB,SAAS,CAAC;IAChN,IAAIJ,KAAK,CAACjB,SAAS,EAAE;QACjBiB,KAAK,CAACjB,SAAS,CAACqB,SAAS,OAAG1B,mBAAY,EAACG,kBAAkB,CAACE,SAAS,EAAEmB,mBAAmB,CAACpB,IAAI,EAAEkB,KAAK,CAACjB,SAAS,CAACqB,SAAS,CAAC;IAC/H;IACA,OAAOJ,KAAK;AAChB,CAAC"}
1
+ {"version":3,"sources":["useListItemStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, makeResetStyles, mergeClasses } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nexport const listItemClassNames = {\n root: 'fui-ListItem',\n checkmark: 'fui-ListItem__checkmark'\n};\nconst useRootBaseStyles = makeResetStyles({\n padding: 0,\n margin: 0,\n textIndent: 0,\n listStyleType: 'none',\n ...createCustomFocusIndicatorStyle({\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n borderRadius: tokens.borderRadiusMedium\n }, {\n selector: 'focus'\n })\n});\nconst useCheckmarkBaseStyles = makeStyles({\n root: {\n alignSelf: 'center',\n '& .fui-Checkbox__indicator': {\n margin: '4px'\n }\n }\n});\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n rootClickableOrSelectable: {\n display: 'flex',\n cursor: 'pointer'\n },\n disabled: {\n cursor: 'default'\n }\n});\n/**\n * Apply styling to the ListItem slots based on the state\n */ export const useListItemStyles_unstable = (state)=>{\n const rootBaseStyles = useRootBaseStyles();\n const checkmarkBaseStyles = useCheckmarkBaseStyles();\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(listItemClassNames.root, rootBaseStyles, (state.selectable || state.navigable) && styles.rootClickableOrSelectable, state.disabled && styles.disabled, state.root.className);\n if (state.checkmark) {\n // eslint-disable-next-line react-hooks/immutability\n state.checkmark.className = mergeClasses(listItemClassNames.checkmark, checkmarkBaseStyles.root, state.checkmark.className);\n }\n return state;\n};\n"],"names":["__styles","__resetStyles","mergeClasses","createCustomFocusIndicatorStyle","tokens","listItemClassNames","root","checkmark","useRootBaseStyles","useCheckmarkBaseStyles","qb2dma","Bpb5tq4","Biccaaf","Gaeyjg","ldoezw","B6gmeee","d","p","useStyles","rootClickableOrSelectable","mc9l5x","Bceei9c","disabled","useListItemStyles_unstable","state","rootBaseStyles","checkmarkBaseStyles","styles","className","selectable","navigable"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAICK,kBAAkB;;;IAqCdkB,0BAA0B;;;;uBAxCe,gBAAgB;AAGnE,2BAA2B;IAC9BjB,IAAI,EAAE,cAAc;IACpBC,SAAS,EAAE;AACf,CAAC;AACD,MAAMC,iBAAiB,GAAA,WAAA,OAAGP,oBAAA,EAAA,WAAA,MAAA;IAAA;IAAA;CAWzB,CAAC;AACF,MAAMQ,sBAAsB,GAAA,WAAA,OAAGT,eAAA,EAAA;IAAAM,IAAA,EAAA;QAAAI,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;KAAA;AAAA,CAO9B,CAAC;AACF;;CAEA,GAAI,MAAMC,SAAS,GAAA,WAAA,GAAGlB,mBAAA,EAAA;IAAAmB,yBAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;IAAAC,QAAA,EAAA;QAAAD,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAL,CAAA,EAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CAQrB,CAAC;AAGS,oCAAoCQ,KAAK,IAAG;IACnD,MAAMC,cAAc,GAAGjB,iBAAiB,CAAC,CAAC;IAC1C,MAAMkB,mBAAmB,GAAGjB,sBAAsB,CAAC,CAAC;IACpD,MAAMkB,MAAM,GAAGT,SAAS,CAAC,CAAC;IAC1B,oDAAA;IACAM,KAAK,CAAClB,IAAI,CAACsB,SAAS,OAAG1B,mBAAY,EAACG,kBAAkB,CAACC,IAAI,EAAEmB,cAAc,EAAE,CAACD,KAAK,CAACK,UAAU,IAAIL,KAAK,CAACM,SAAAA,AAAS,KAAKH,MAAM,CAACR,yBAAyB,EAAEK,KAAK,CAACF,QAAQ,IAAIK,MAAM,CAACL,QAAQ,EAAEE,KAAK,CAAClB,IAAI,CAACsB,SAAS,CAAC;IAChN,IAAIJ,KAAK,CAACjB,SAAS,EAAE;QACjB,oDAAA;QACAiB,KAAK,CAACjB,SAAS,CAACqB,SAAS,OAAG1B,mBAAY,EAACG,kBAAkB,CAACE,SAAS,EAAEmB,mBAAmB,CAACpB,IAAI,EAAEkB,KAAK,CAACjB,SAAS,CAACqB,SAAS,CAAC;IAC/H;IACA,OAAOJ,KAAK;AAChB,CAAC"}
@@ -56,12 +56,13 @@ const useCheckmarkBaseStyles = (0, _react.makeStyles)({
56
56
  }
57
57
  });
58
58
  const useListItemStyles_unstable = (state)=>{
59
- 'use no memo';
60
59
  const rootBaseStyles = useRootBaseStyles();
61
60
  const checkmarkBaseStyles = useCheckmarkBaseStyles();
62
61
  const styles = useStyles();
62
+ // eslint-disable-next-line react-hooks/immutability
63
63
  state.root.className = (0, _react.mergeClasses)(listItemClassNames.root, rootBaseStyles, (state.selectable || state.navigable) && styles.rootClickableOrSelectable, state.disabled && styles.disabled, state.root.className);
64
64
  if (state.checkmark) {
65
+ // eslint-disable-next-line react-hooks/immutability
65
66
  state.checkmark.className = (0, _react.mergeClasses)(listItemClassNames.checkmark, checkmarkBaseStyles.root, state.checkmark.className);
66
67
  }
67
68
  return state;
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/ListItem/useListItemStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, makeResetStyles, mergeClasses } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport type { ListItemSlots, ListItemState } from './ListItem.types';\nimport { tokens } from '@fluentui/react-theme';\n\nexport const listItemClassNames: SlotClassNames<ListItemSlots> = {\n root: 'fui-ListItem',\n checkmark: 'fui-ListItem__checkmark',\n};\n\nconst useRootBaseStyles = makeResetStyles({\n padding: 0,\n margin: 0,\n textIndent: 0,\n listStyleType: 'none',\n ...createCustomFocusIndicatorStyle(\n {\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n borderRadius: tokens.borderRadiusMedium,\n },\n { selector: 'focus' },\n ),\n});\n\nconst useCheckmarkBaseStyles = makeStyles({\n root: {\n alignSelf: 'center',\n\n '& .fui-Checkbox__indicator': { margin: '4px' },\n },\n});\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n rootClickableOrSelectable: {\n display: 'flex',\n cursor: 'pointer',\n },\n\n disabled: {\n cursor: 'default',\n },\n});\n\n/**\n * Apply styling to the ListItem slots based on the state\n */\nexport const useListItemStyles_unstable = (state: ListItemState): ListItemState => {\n 'use no memo';\n\n const rootBaseStyles = useRootBaseStyles();\n const checkmarkBaseStyles = useCheckmarkBaseStyles();\n const styles = useStyles();\n\n state.root.className = mergeClasses(\n listItemClassNames.root,\n rootBaseStyles,\n (state.selectable || state.navigable) && styles.rootClickableOrSelectable,\n state.disabled && styles.disabled,\n state.root.className,\n );\n\n if (state.checkmark) {\n state.checkmark.className = mergeClasses(\n listItemClassNames.checkmark,\n checkmarkBaseStyles.root,\n state.checkmark.className,\n );\n }\n\n return state;\n};\n"],"names":["makeStyles","makeResetStyles","mergeClasses","createCustomFocusIndicatorStyle","tokens","listItemClassNames","root","checkmark","useRootBaseStyles","padding","margin","textIndent","listStyleType","outline","strokeWidthThick","colorStrokeFocus2","borderRadius","borderRadiusMedium","selector","useCheckmarkBaseStyles","alignSelf","useStyles","rootClickableOrSelectable","display","cursor","disabled","useListItemStyles_unstable","state","rootBaseStyles","checkmarkBaseStyles","styles","className","selectable","navigable"],"mappings":"AAAA;;;;;;;;;;;;IAQaK,kBAAAA;;;IA2CAqB,0BAAAA;;;;uBAhD6C,iBAAiB;8BAC3B,0BAA0B;4BAEnD,wBAAwB;AAExC,2BAA0D;IAC/DpB,MAAM;IACNC,WAAW;AACb,EAAE;AAEF,MAAMC,wBAAoBP,sBAAAA,EAAgB;IACxCQ,SAAS;IACTC,QAAQ;IACRC,YAAY;IACZC,eAAe;IACf,OAAGT,6CAAAA,EACD;QACEU,SAAS,GAAGT,kBAAAA,CAAOU,gBAAgB,CAAC,OAAO,EAAEV,kBAAAA,CAAOW,iBAAiB,EAAE;QACvEC,cAAcZ,kBAAAA,CAAOa,kBAAkB;IACzC,GACA;QAAEC,UAAU;IAAQ,EACrB;AACH;AAEA,MAAMC,6BAAyBnB,iBAAAA,EAAW;IACxCM,MAAM;QACJc,WAAW;QAEX,8BAA8B;YAAEV,QAAQ;QAAM;IAChD;AACF;AACA;;CAEC,GACD,MAAMW,gBAAYrB,iBAAAA,EAAW;IAC3BsB,2BAA2B;QACzBC,SAAS;QACTC,QAAQ;IACV;IAEAC,UAAU;QACRD,QAAQ;IACV;AACF;AAKO,mCAAmC,CAACG;IACzC;IAEA,MAAMC,iBAAiBpB;IACvB,MAAMqB,sBAAsBV;IAC5B,MAAMW,SAAST;IAEfM,MAAMrB,IAAI,CAACyB,SAAS,OAAG7B,mBAAAA,EACrBG,mBAAmBC,IAAI,EACvBsB,gBACCD,CAAAA,MAAMK,UAAU,IAAIL,MAAMM,SAAAA,AAAQ,KAAMH,OAAOR,yBAAyB,EACzEK,MAAMF,QAAQ,IAAIK,OAAOL,QAAQ,EACjCE,MAAMrB,IAAI,CAACyB,SAAS;IAGtB,IAAIJ,MAAMpB,SAAS,EAAE;QACnBoB,MAAMpB,SAAS,CAACwB,SAAS,OAAG7B,mBAAAA,EAC1BG,mBAAmBE,SAAS,EAC5BsB,oBAAoBvB,IAAI,EACxBqB,MAAMpB,SAAS,CAACwB,SAAS;IAE7B;IAEA,OAAOJ;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/ListItem/useListItemStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, makeResetStyles, mergeClasses } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport type { ListItemSlots, ListItemState } from './ListItem.types';\nimport { tokens } from '@fluentui/react-theme';\n\nexport const listItemClassNames: SlotClassNames<ListItemSlots> = {\n root: 'fui-ListItem',\n checkmark: 'fui-ListItem__checkmark',\n};\n\nconst useRootBaseStyles = makeResetStyles({\n padding: 0,\n margin: 0,\n textIndent: 0,\n listStyleType: 'none',\n ...createCustomFocusIndicatorStyle(\n {\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n borderRadius: tokens.borderRadiusMedium,\n },\n { selector: 'focus' },\n ),\n});\n\nconst useCheckmarkBaseStyles = makeStyles({\n root: {\n alignSelf: 'center',\n\n '& .fui-Checkbox__indicator': { margin: '4px' },\n },\n});\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n rootClickableOrSelectable: {\n display: 'flex',\n cursor: 'pointer',\n },\n\n disabled: {\n cursor: 'default',\n },\n});\n\n/**\n * Apply styling to the ListItem slots based on the state\n */\nexport const useListItemStyles_unstable = (state: ListItemState): ListItemState => {\n const rootBaseStyles = useRootBaseStyles();\n const checkmarkBaseStyles = useCheckmarkBaseStyles();\n const styles = useStyles();\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n listItemClassNames.root,\n rootBaseStyles,\n (state.selectable || state.navigable) && styles.rootClickableOrSelectable,\n state.disabled && styles.disabled,\n state.root.className,\n );\n\n if (state.checkmark) {\n // eslint-disable-next-line react-hooks/immutability\n state.checkmark.className = mergeClasses(\n listItemClassNames.checkmark,\n checkmarkBaseStyles.root,\n state.checkmark.className,\n );\n }\n\n return state;\n};\n"],"names":["makeStyles","makeResetStyles","mergeClasses","createCustomFocusIndicatorStyle","tokens","listItemClassNames","root","checkmark","useRootBaseStyles","padding","margin","textIndent","listStyleType","outline","strokeWidthThick","colorStrokeFocus2","borderRadius","borderRadiusMedium","selector","useCheckmarkBaseStyles","alignSelf","useStyles","rootClickableOrSelectable","display","cursor","disabled","useListItemStyles_unstable","state","rootBaseStyles","checkmarkBaseStyles","styles","className","selectable","navigable"],"mappings":"AAAA;;;;;;;;;;;;IAQaK,kBAAAA;;;IA2CAqB,0BAAAA;;;;uBAhD6C,iBAAiB;8BAC3B,0BAA0B;4BAEnD,wBAAwB;AAExC,2BAA0D;IAC/DpB,MAAM;IACNC,WAAW;AACb,EAAE;AAEF,MAAMC,wBAAoBP,sBAAAA,EAAgB;IACxCQ,SAAS;IACTC,QAAQ;IACRC,YAAY;IACZC,eAAe;IACf,OAAGT,6CAAAA,EACD;QACEU,SAAS,GAAGT,kBAAAA,CAAOU,gBAAgB,CAAC,OAAO,EAAEV,kBAAAA,CAAOW,iBAAiB,EAAE;QACvEC,cAAcZ,kBAAAA,CAAOa,kBAAkB;IACzC,GACA;QAAEC,UAAU;IAAQ,EACrB;AACH;AAEA,MAAMC,6BAAyBnB,iBAAAA,EAAW;IACxCM,MAAM;QACJc,WAAW;QAEX,8BAA8B;YAAEV,QAAQ;QAAM;IAChD;AACF;AACA;;CAEC,GACD,MAAMW,gBAAYrB,iBAAAA,EAAW;IAC3BsB,2BAA2B;QACzBC,SAAS;QACTC,QAAQ;IACV;IAEAC,UAAU;QACRD,QAAQ;IACV;AACF;AAKO,mCAAmC,CAACG;IACzC,MAAMC,iBAAiBpB;IACvB,MAAMqB,sBAAsBV;IAC5B,MAAMW,SAAST;IAEf,oDAAoD;IACpDM,MAAMrB,IAAI,CAACyB,SAAS,OAAG7B,mBAAAA,EACrBG,mBAAmBC,IAAI,EACvBsB,gBACCD,CAAAA,MAAMK,UAAU,IAAIL,MAAMM,SAAAA,AAAQ,KAAMH,OAAOR,yBAAyB,EACzEK,MAAMF,QAAQ,IAAIK,OAAOL,QAAQ,EACjCE,MAAMrB,IAAI,CAACyB,SAAS;IAGtB,IAAIJ,MAAMpB,SAAS,EAAE;QACnB,oDAAoD;QACpDoB,MAAMpB,SAAS,CAACwB,SAAS,OAAG7B,mBAAAA,EAC1BG,mBAAmBE,SAAS,EAC5BsB,oBAAoBvB,IAAI,EACxBqB,MAAMpB,SAAS,CAACwB,SAAS;IAE7B;IAEA,OAAOJ;AACT,EAAE"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui/react-list",
3
- "version": "9.6.14",
3
+ "version": "9.6.16",
4
4
  "description": "React List v9",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
@@ -18,13 +18,13 @@
18
18
  },
19
19
  "license": "MIT",
20
20
  "dependencies": {
21
- "@fluentui/react-checkbox": "^9.6.1",
22
- "@fluentui/react-context-selector": "^9.2.16",
23
- "@fluentui/react-jsx-runtime": "^9.4.2",
21
+ "@fluentui/react-checkbox": "^9.6.3",
22
+ "@fluentui/react-context-selector": "^9.2.18",
23
+ "@fluentui/react-jsx-runtime": "^9.4.4",
24
24
  "@fluentui/keyboard-keys": "^9.0.8",
25
- "@fluentui/react-tabster": "^9.26.14",
25
+ "@fluentui/react-tabster": "^9.26.16",
26
26
  "@fluentui/react-theme": "^9.2.1",
27
- "@fluentui/react-utilities": "^9.26.3",
27
+ "@fluentui/react-utilities": "^9.26.5",
28
28
  "@fluentui/react-shared-contexts": "^9.26.2",
29
29
  "@griffel/react": "^1.5.32",
30
30
  "@swc/helpers": "^0.5.1"