@fluentui/react-swatch-picker 9.4.1 → 9.4.3

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,12 +1,41 @@
1
1
  # Change Log - @fluentui/react-swatch-picker
2
2
 
3
- This log was last generated on Mon, 28 Jul 2025 18:44:12 GMT and should not be manually modified.
3
+ This log was last generated on Thu, 07 Aug 2025 09:59:08 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [9.4.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-swatch-picker_v9.4.3)
8
+
9
+ Thu, 07 Aug 2025 09:59:08 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-swatch-picker_v9.4.2..@fluentui/react-swatch-picker_v9.4.3)
11
+
12
+ ### Patches
13
+
14
+ - fix: migrate to R19 compatible JSX.* namespace types ([PR #34923](https://github.com/microsoft/fluentui/pull/34923) by martinhochel@microsoft.com)
15
+ - Bump @fluentui/react-context-selector to v9.2.5 ([PR #34980](https://github.com/microsoft/fluentui/pull/34980) by beachball)
16
+ - Bump @fluentui/react-field to v9.4.3 ([PR #34980](https://github.com/microsoft/fluentui/pull/34980) by beachball)
17
+ - Bump @fluentui/react-jsx-runtime to v9.1.5 ([PR #34980](https://github.com/microsoft/fluentui/pull/34980) by beachball)
18
+ - Bump @fluentui/react-tabster to v9.26.3 ([PR #34980](https://github.com/microsoft/fluentui/pull/34980) by beachball)
19
+ - Bump @fluentui/react-utilities to v9.23.2 ([PR #34980](https://github.com/microsoft/fluentui/pull/34980) by beachball)
20
+
21
+ ## [9.4.2](https://github.com/microsoft/fluentui/tree/@fluentui/react-swatch-picker_v9.4.2)
22
+
23
+ Wed, 30 Jul 2025 13:10:57 GMT
24
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-swatch-picker_v9.4.1..@fluentui/react-swatch-picker_v9.4.2)
25
+
26
+ ### Patches
27
+
28
+ - Bump @fluentui/react-context-selector to v9.2.4 ([PR #34881](https://github.com/microsoft/fluentui/pull/34881) by beachball)
29
+ - Bump @fluentui/react-field to v9.4.2 ([PR #34881](https://github.com/microsoft/fluentui/pull/34881) by beachball)
30
+ - Bump @fluentui/react-jsx-runtime to v9.1.4 ([PR #34881](https://github.com/microsoft/fluentui/pull/34881) by beachball)
31
+ - Bump @fluentui/react-shared-contexts to v9.24.1 ([PR #34881](https://github.com/microsoft/fluentui/pull/34881) by beachball)
32
+ - Bump @fluentui/react-tabster to v9.26.2 ([PR #34881](https://github.com/microsoft/fluentui/pull/34881) by beachball)
33
+ - Bump @fluentui/react-theme to v9.2.0 ([PR #34881](https://github.com/microsoft/fluentui/pull/34881) by beachball)
34
+ - Bump @fluentui/react-utilities to v9.23.1 ([PR #34881](https://github.com/microsoft/fluentui/pull/34881) by beachball)
35
+
7
36
  ## [9.4.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-swatch-picker_v9.4.1)
8
37
 
9
- Mon, 28 Jul 2025 18:44:12 GMT
38
+ Mon, 28 Jul 2025 18:48:21 GMT
10
39
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-swatch-picker_v9.4.0..@fluentui/react-swatch-picker_v9.4.1)
11
40
 
12
41
  ### Patches
package/dist/index.d.ts CHANGED
@@ -6,6 +6,7 @@ import type { ContextSelector } from '@fluentui/react-context-selector';
6
6
  import type { EventData } from '@fluentui/react-utilities';
7
7
  import type { EventHandler } from '@fluentui/react-utilities';
8
8
  import type { ForwardRefComponent } from '@fluentui/react-utilities';
9
+ import type { JSXElement } from '@fluentui/react-utilities';
9
10
  import * as React_2 from 'react';
10
11
  import type { Slot } from '@fluentui/react-utilities';
11
12
  import type { SlotClassNames } from '@fluentui/react-utilities';
@@ -125,7 +126,7 @@ export declare const renderImageSwatch_unstable: (state: ImageSwatchState) => JS
125
126
  */
126
127
  export declare const renderSwatchPicker_unstable: (state: SwatchPickerState, contextValues: SwatchPickerContextValues) => JSX.Element;
127
128
 
128
- export declare const renderSwatchPickerGrid: (props: SwatchPickerGridProps) => JSX.Element[];
129
+ export declare const renderSwatchPickerGrid: (props: SwatchPickerGridProps) => JSXElement[];
129
130
 
130
131
  /**
131
132
  * Render the final JSX of SwatchPickerRow
@@ -173,10 +174,10 @@ export declare type SwatchPickerGridProps = {
173
174
  items: SwatchProps[];
174
175
  columnCount: number;
175
176
  renderRow?: (props: {
176
- children: JSX.Element[];
177
+ children: JSXElement[];
177
178
  rowId: string | number;
178
- }) => JSX.Element;
179
- renderSwatch?: (item: SwatchProps) => JSX.Element;
179
+ }) => JSXElement;
180
+ renderSwatch?: (item: SwatchProps) => JSXElement;
180
181
  };
181
182
 
182
183
  export declare type SwatchPickerOnSelectEventHandler = EventHandler<SwatchPickerOnSelectionChangeData>;
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/utils/renderUtils.tsx"],"sourcesContent":["import * as React from 'react';\nimport { ColorSwatch, SwatchPickerRow, ImageSwatch } from '../';\nimport type { ColorSwatchProps, ImageSwatchProps } from '../';\n\nexport type SwatchProps = ImageSwatchProps | ColorSwatchProps;\n\nexport type SwatchPickerGridProps = {\n items: SwatchProps[];\n columnCount: number;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n renderRow?: (props: { children: JSX.Element[]; rowId: string | number }) => JSX.Element;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n renderSwatch?: (item: SwatchProps) => JSX.Element;\n};\n\nexport const renderSwatchPickerGrid = (props: SwatchPickerGridProps) => {\n const { items, columnCount, renderRow, renderSwatch } = props;\n const _renderRow = renderRow || (({ children, rowId }) => <SwatchPickerRow key={rowId}>{children}</SwatchPickerRow>);\n const _renderSwatch =\n renderSwatch ||\n ((item: SwatchProps) =>\n (item as ImageSwatchProps).src ? (\n <ImageSwatch key={item.value} src={(item as ImageSwatchProps).src ?? ''} {...item} />\n ) : (\n <ColorSwatch key={item.value} color={item.color || ''} {...item} />\n ));\n\n const rowCount = Math.ceil(items.length / columnCount);\n const rows = Array.from({ length: rowCount }, (_, i) => {\n const start = i * columnCount;\n const end = start + columnCount;\n return items.slice(start, end);\n });\n\n return rows.map((row, index) => _renderRow({ children: row.map(_renderSwatch), rowId: index }));\n};\n"],"names":["React","ColorSwatch","SwatchPickerRow","ImageSwatch","renderSwatchPickerGrid","props","items","columnCount","renderRow","renderSwatch","_renderRow","children","rowId","key","_renderSwatch","item","src","value","color","rowCount","Math","ceil","length","rows","Array","from","_","i","start","end","slice","map","row","index"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,WAAW,EAAEC,eAAe,EAAEC,WAAW,QAAQ,MAAM;AAchE,OAAO,MAAMC,yBAAyB,CAACC;IACrC,MAAM,EAAEC,KAAK,EAAEC,WAAW,EAAEC,SAAS,EAAEC,YAAY,EAAE,GAAGJ;IACxD,MAAMK,aAAaF,aAAc,CAAA,CAAC,EAAEG,QAAQ,EAAEC,KAAK,EAAE,iBAAK,oBAACV;YAAgBW,KAAKD;WAAQD,SAA0B;IAClH,MAAMG,gBACJL,gBACC,CAAA,CAACM;YAEqC;eADrC,AAACA,KAA0BC,GAAG,iBAC5B,oBAACb;YAAYU,KAAKE,KAAKE,KAAK;YAAED,KAAK,CAAA,YAAA,AAACD,KAA0BC,GAAG,cAA9B,uBAAA,YAAkC;YAAK,GAAGD,IAAI;2BAEjF,oBAACd;YAAYY,KAAKE,KAAKE,KAAK;YAAEC,OAAOH,KAAKG,KAAK,IAAI;YAAK,GAAGH,IAAI;;KACjE;IAEJ,MAAMI,WAAWC,KAAKC,IAAI,CAACf,MAAMgB,MAAM,GAAGf;IAC1C,MAAMgB,OAAOC,MAAMC,IAAI,CAAC;QAAEH,QAAQH;IAAS,GAAG,CAACO,GAAGC;QAChD,MAAMC,QAAQD,IAAIpB;QAClB,MAAMsB,MAAMD,QAAQrB;QACpB,OAAOD,MAAMwB,KAAK,CAACF,OAAOC;IAC5B;IAEA,OAAON,KAAKQ,GAAG,CAAC,CAACC,KAAKC,QAAUvB,WAAW;YAAEC,UAAUqB,IAAID,GAAG,CAACjB;YAAgBF,OAAOqB;QAAM;AAC9F,EAAE"}
1
+ {"version":3,"sources":["../src/utils/renderUtils.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { ColorSwatch, SwatchPickerRow, ImageSwatch } from '../';\nimport type { ColorSwatchProps, ImageSwatchProps } from '../';\n\nexport type SwatchProps = ImageSwatchProps | ColorSwatchProps;\n\nexport type SwatchPickerGridProps = {\n items: SwatchProps[];\n columnCount: number;\n renderRow?: (props: { children: JSXElement[]; rowId: string | number }) => JSXElement;\n renderSwatch?: (item: SwatchProps) => JSXElement;\n};\n\nexport const renderSwatchPickerGrid = (props: SwatchPickerGridProps) => {\n const { items, columnCount, renderRow, renderSwatch } = props;\n const _renderRow = renderRow || (({ children, rowId }) => <SwatchPickerRow key={rowId}>{children}</SwatchPickerRow>);\n const _renderSwatch =\n renderSwatch ||\n ((item: SwatchProps) =>\n (item as ImageSwatchProps).src ? (\n <ImageSwatch key={item.value} src={(item as ImageSwatchProps).src ?? ''} {...item} />\n ) : (\n <ColorSwatch key={item.value} color={item.color || ''} {...item} />\n ));\n\n const rowCount = Math.ceil(items.length / columnCount);\n const rows = Array.from({ length: rowCount }, (_, i) => {\n const start = i * columnCount;\n const end = start + columnCount;\n return items.slice(start, end);\n });\n\n return rows.map((row, index) => _renderRow({ children: row.map(_renderSwatch), rowId: index }));\n};\n"],"names":["React","ColorSwatch","SwatchPickerRow","ImageSwatch","renderSwatchPickerGrid","props","items","columnCount","renderRow","renderSwatch","_renderRow","children","rowId","key","_renderSwatch","item","src","value","color","rowCount","Math","ceil","length","rows","Array","from","_","i","start","end","slice","map","row","index"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,WAAW,EAAEC,eAAe,EAAEC,WAAW,QAAQ,MAAM;AAYhE,OAAO,MAAMC,yBAAyB,CAACC;IACrC,MAAM,EAAEC,KAAK,EAAEC,WAAW,EAAEC,SAAS,EAAEC,YAAY,EAAE,GAAGJ;IACxD,MAAMK,aAAaF,aAAc,CAAA,CAAC,EAAEG,QAAQ,EAAEC,KAAK,EAAE,iBAAK,oBAACV;YAAgBW,KAAKD;WAAQD,SAA0B;IAClH,MAAMG,gBACJL,gBACC,CAAA,CAACM;YAEqC;eADrC,AAACA,KAA0BC,GAAG,iBAC5B,oBAACb;YAAYU,KAAKE,KAAKE,KAAK;YAAED,KAAK,CAAA,YAAA,AAACD,KAA0BC,GAAG,cAA9B,uBAAA,YAAkC;YAAK,GAAGD,IAAI;2BAEjF,oBAACd;YAAYY,KAAKE,KAAKE,KAAK;YAAEC,OAAOH,KAAKG,KAAK,IAAI;YAAK,GAAGH,IAAI;;KACjE;IAEJ,MAAMI,WAAWC,KAAKC,IAAI,CAACf,MAAMgB,MAAM,GAAGf;IAC1C,MAAMgB,OAAOC,MAAMC,IAAI,CAAC;QAAEH,QAAQH;IAAS,GAAG,CAACO,GAAGC;QAChD,MAAMC,QAAQD,IAAIpB;QAClB,MAAMsB,MAAMD,QAAQrB;QACpB,OAAOD,MAAMwB,KAAK,CAACF,OAAOC;IAC5B;IAEA,OAAON,KAAKQ,GAAG,CAAC,CAACC,KAAKC,QAAUvB,WAAW;YAAEC,UAAUqB,IAAID,GAAG,CAACjB;YAAgBF,OAAOqB;QAAM;AAC9F,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/utils/renderUtils.tsx"],"sourcesContent":["import * as React from 'react';\nimport { ColorSwatch, SwatchPickerRow, ImageSwatch } from '../';\nimport type { ColorSwatchProps, ImageSwatchProps } from '../';\n\nexport type SwatchProps = ImageSwatchProps | ColorSwatchProps;\n\nexport type SwatchPickerGridProps = {\n items: SwatchProps[];\n columnCount: number;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n renderRow?: (props: { children: JSX.Element[]; rowId: string | number }) => JSX.Element;\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n renderSwatch?: (item: SwatchProps) => JSX.Element;\n};\n\nexport const renderSwatchPickerGrid = (props: SwatchPickerGridProps) => {\n const { items, columnCount, renderRow, renderSwatch } = props;\n const _renderRow = renderRow || (({ children, rowId }) => <SwatchPickerRow key={rowId}>{children}</SwatchPickerRow>);\n const _renderSwatch =\n renderSwatch ||\n ((item: SwatchProps) =>\n (item as ImageSwatchProps).src ? (\n <ImageSwatch key={item.value} src={(item as ImageSwatchProps).src ?? ''} {...item} />\n ) : (\n <ColorSwatch key={item.value} color={item.color || ''} {...item} />\n ));\n\n const rowCount = Math.ceil(items.length / columnCount);\n const rows = Array.from({ length: rowCount }, (_, i) => {\n const start = i * columnCount;\n const end = start + columnCount;\n return items.slice(start, end);\n });\n\n return rows.map((row, index) => _renderRow({ children: row.map(_renderSwatch), rowId: index }));\n};\n"],"names":["React","ColorSwatch","SwatchPickerRow","ImageSwatch","renderSwatchPickerGrid","props","items","columnCount","renderRow","renderSwatch","_renderRow","children","rowId","key","_renderSwatch","item","src","value","color","rowCount","Math","ceil","length","rows","Array","from","_","i","start","end","slice","map","row","index"],"mappings":";;;;+BAeaI;;;;;;;iEAfU,QAAQ;kBAC2B,MAAM;AAczD,+BAA+B,CAACC;IACrC,MAAM,EAAEC,KAAK,EAAEC,WAAW,EAAEC,SAAS,EAAEC,YAAY,EAAE,GAAGJ;IACxD,MAAMK,aAAaF,aAAc,CAAA,CAAC,EAAEG,QAAQ,EAAEC,KAAK,EAAE,GAAA,WAAA,GAAK,OAAA,aAAA,CAACV,iBAAAA,EAAAA;YAAgBW,KAAKD;WAAQD,SAAAA,CAA0B;IAClH,MAAMG,gBACJL,gBACC,CAAA,CAACM;YAEqC;eADpCA,KAA0BC,GAAG,GAAA,WAAA,GAC5B,OAAA,aAAA,CAACb,aAAAA,EAAAA;YAAYU,KAAKE,KAAKE,KAAK;YAAED,KAAK,CAAA,YAACD,KAA0BC,GAAAA,AAAG,MAAA,QAA9B,cAAA,KAAA,IAAA,YAAkC;YAAK,GAAGD,IAAI;2BAEjF,OAAA,aAAA,CAACd,aAAAA,EAAAA;YAAYY,KAAKE,KAAKE,KAAK;YAAEC,OAAOH,KAAKG,KAAK,IAAI;YAAK,GAAGH,IAAI;;MACjE;IAEJ,MAAMI,WAAWC,KAAKC,IAAI,CAACf,MAAMgB,MAAM,GAAGf;IAC1C,MAAMgB,OAAOC,MAAMC,IAAI,CAAC;QAAEH,QAAQH;IAAS,GAAG,CAACO,GAAGC;QAChD,MAAMC,QAAQD,IAAIpB;QAClB,MAAMsB,MAAMD,QAAQrB;QACpB,OAAOD,MAAMwB,KAAK,CAACF,OAAOC;IAC5B;IAEA,OAAON,KAAKQ,GAAG,CAAC,CAACC,KAAKC,QAAUvB,WAAW;YAAEC,UAAUqB,IAAID,GAAG,CAACjB;YAAgBF,OAAOqB;QAAM;AAC9F,EAAE"}
1
+ {"version":3,"sources":["../src/utils/renderUtils.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { ColorSwatch, SwatchPickerRow, ImageSwatch } from '../';\nimport type { ColorSwatchProps, ImageSwatchProps } from '../';\n\nexport type SwatchProps = ImageSwatchProps | ColorSwatchProps;\n\nexport type SwatchPickerGridProps = {\n items: SwatchProps[];\n columnCount: number;\n renderRow?: (props: { children: JSXElement[]; rowId: string | number }) => JSXElement;\n renderSwatch?: (item: SwatchProps) => JSXElement;\n};\n\nexport const renderSwatchPickerGrid = (props: SwatchPickerGridProps) => {\n const { items, columnCount, renderRow, renderSwatch } = props;\n const _renderRow = renderRow || (({ children, rowId }) => <SwatchPickerRow key={rowId}>{children}</SwatchPickerRow>);\n const _renderSwatch =\n renderSwatch ||\n ((item: SwatchProps) =>\n (item as ImageSwatchProps).src ? (\n <ImageSwatch key={item.value} src={(item as ImageSwatchProps).src ?? ''} {...item} />\n ) : (\n <ColorSwatch key={item.value} color={item.color || ''} {...item} />\n ));\n\n const rowCount = Math.ceil(items.length / columnCount);\n const rows = Array.from({ length: rowCount }, (_, i) => {\n const start = i * columnCount;\n const end = start + columnCount;\n return items.slice(start, end);\n });\n\n return rows.map((row, index) => _renderRow({ children: row.map(_renderSwatch), rowId: index }));\n};\n"],"names":["React","ColorSwatch","SwatchPickerRow","ImageSwatch","renderSwatchPickerGrid","props","items","columnCount","renderRow","renderSwatch","_renderRow","children","rowId","key","_renderSwatch","item","src","value","color","rowCount","Math","ceil","length","rows","Array","from","_","i","start","end","slice","map","row","index"],"mappings":";;;;+BAcaI;;;;;;;iEAdU,QAAQ;kBAE2B,MAAM;AAYzD,+BAA+B,CAACC;IACrC,MAAM,EAAEC,KAAK,EAAEC,WAAW,EAAEC,SAAS,EAAEC,YAAY,EAAE,GAAGJ;IACxD,MAAMK,aAAaF,aAAc,CAAA,CAAC,EAAEG,QAAQ,EAAEC,KAAK,EAAE,GAAA,WAAA,GAAK,OAAA,aAAA,CAACV,iBAAAA,EAAAA;YAAgBW,KAAKD;WAAQD,SAAAA,CAA0B;IAClH,MAAMG,gBACJL,gBACC,CAAA,CAACM;YAEqC;eADpCA,KAA0BC,GAAG,GAAA,WAAA,GAC5B,OAAA,aAAA,CAACb,aAAAA,EAAAA;YAAYU,KAAKE,KAAKE,KAAK;YAAED,KAAK,CAAA,YAACD,KAA0BC,GAAAA,AAAG,MAAA,QAA9B,cAAA,KAAA,IAAA,YAAkC;YAAK,GAAGD,IAAI;2BAEjF,OAAA,aAAA,CAACd,aAAAA,EAAAA;YAAYY,KAAKE,KAAKE,KAAK;YAAEC,OAAOH,KAAKG,KAAK,IAAI;YAAK,GAAGH,IAAI;;MACjE;IAEJ,MAAMI,WAAWC,KAAKC,IAAI,CAACf,MAAMgB,MAAM,GAAGf;IAC1C,MAAMgB,OAAOC,MAAMC,IAAI,CAAC;QAAEH,QAAQH;IAAS,GAAG,CAACO,GAAGC;QAChD,MAAMC,QAAQD,IAAIpB;QAClB,MAAMsB,MAAMD,QAAQrB;QACpB,OAAOD,MAAMwB,KAAK,CAACF,OAAOC;IAC5B;IAEA,OAAON,KAAKQ,GAAG,CAAC,CAACC,KAAKC,QAAUvB,WAAW;YAAEC,UAAUqB,IAAID,GAAG,CAACjB;YAAgBF,OAAOqB;QAAM;AAC9F,EAAE"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui/react-swatch-picker",
3
- "version": "9.4.1",
3
+ "version": "9.4.3",
4
4
  "description": "New fluentui react package",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
@@ -20,14 +20,14 @@
20
20
  "@fluentui/scripts-cypress": "*"
21
21
  },
22
22
  "dependencies": {
23
- "@fluentui/react-context-selector": "^9.2.3",
24
- "@fluentui/react-field": "^9.4.1",
23
+ "@fluentui/react-context-selector": "^9.2.5",
24
+ "@fluentui/react-field": "^9.4.3",
25
25
  "@fluentui/react-icons": "^2.0.245",
26
- "@fluentui/react-jsx-runtime": "^9.1.3",
27
- "@fluentui/react-shared-contexts": "^9.24.0",
28
- "@fluentui/react-tabster": "^9.26.1",
29
- "@fluentui/react-theme": "^9.1.24",
30
- "@fluentui/react-utilities": "^9.23.0",
26
+ "@fluentui/react-jsx-runtime": "^9.1.5",
27
+ "@fluentui/react-shared-contexts": "^9.24.1",
28
+ "@fluentui/react-tabster": "^9.26.3",
29
+ "@fluentui/react-theme": "^9.2.0",
30
+ "@fluentui/react-utilities": "^9.23.2",
31
31
  "@griffel/react": "^1.5.22",
32
32
  "@swc/helpers": "^0.5.1"
33
33
  },