@fluentui/react-swatch-picker 9.1.3 → 9.1.5

package/lib-commonjs/components/ImageSwatch/ImageSwatch.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":""}
+{"version":3,"sources":["ImageSwatch.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { SwatchPickerProps } from '../SwatchPicker/SwatchPicker.types';\n\nexport type ImageSwatchSlots = {\n  root: Slot<'button'>;\n};\n\n/**\n * ImageSwatch Props\n */\nexport type ImageSwatchProps = ComponentProps<ImageSwatchSlots> &\n  Pick<SwatchPickerProps, 'size' | 'shape'> & {\n    /**\n     * Swatch color\n     */\n    src: string;\n\n    /**\n     * Swatch value\n     */\n    value: string;\n  };\n\n/**\n * State used in rendering ImageSwatch\n */\nexport type ImageSwatchState = ComponentState<ImageSwatchSlots> &\n  Pick<ImageSwatchProps, 'color' | 'size' | 'shape' | 'value'> & {\n    selected: boolean;\n  };\n"],"names":[],"rangeMappings":";;","mappings":"AAuBA;;CAEC"}

package/lib-commonjs/components/ImageSwatch/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.js"],"sourcesContent":["export * from './ImageSwatch';\nexport * from './ImageSwatch.types';\nexport * from './renderImageSwatch';\nexport * from './useImageSwatch';\nexport * from './useImageSwatchStyles.styles';\n"],"names":[],"mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './ImageSwatch';\nexport * from './ImageSwatch.types';\nexport * from './renderImageSwatch';\nexport * from './useImageSwatch';\nexport * from './useImageSwatchStyles.styles';\n"],"names":[],"rangeMappings":";;;;;;;;;","mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA"}

package/lib-commonjs/components/ImageSwatch/renderImageSwatch.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderImageSwatch.js"],"sourcesContent":["  import { jsx as _jsx } from \"@fluentui/react-jsx-runtime/jsx-runtime\";\nimport { assertSlots } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of ImageSwatch\n */ export const renderImageSwatch_unstable = (state)=>{\n    assertSlots(state);\n    return /*#__PURE__*/ _jsx(state.root, {});\n};\n"],"names":["renderImageSwatch_unstable","state","assertSlots","_jsx","root"],"mappings":";;;;+BAIiBA;;;eAAAA;;;4BAJa;gCACF;AAGjB,MAAMA,6BAA6B,CAACC;IAC3CC,IAAAA,2BAAW,EAACD;IACZ,OAAO,WAAW,GAAGE,IAAAA,eAAI,EAACF,MAAMG,IAAI,EAAE,CAAC;AAC3C"}
+{"version":3,"sources":["renderImageSwatch.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { ImageSwatchState, ImageSwatchSlots } from './ImageSwatch.types';\n\n/**\n * Render the final JSX of ImageSwatch\n */\nexport const renderImageSwatch_unstable = (state: ImageSwatchState) => {\n  assertSlots<ImageSwatchSlots>(state);\n\n  return <state.root />;\n};\n"],"names":["renderImageSwatch_unstable","state","assertSlots","_jsx","root"],"rangeMappings":";;;;;;;;;;;;;;;","mappings":";;;;+BASaA;;;eAAAA;;;4BARb;gCAE4B;AAMrB,MAAMA,6BAA6B,CAACC;IACzCC,IAAAA,2BAAAA,EAA8BD;IAE9B,OAAA,WAAA,GAAOE,IAAAA,eAAA,EAACF,MAAMG,IAAI,EAAA,CAAA;AACpB"}

package/lib-commonjs/components/ImageSwatch/useImageSwatch.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useImageSwatch.js"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot, useEventCallback, mergeCallbacks } from '@fluentui/react-utilities';\nimport { useSwatchPickerContextValue_unstable } from '../../contexts/swatchPicker';\n/**\n * Create the state required to render ImageSwatch.\n *\n * The returned state can be modified with hooks such as useImageSwatchStyles_unstable,\n * before being passed to renderImageSwatch_unstable.\n *\n * @param props - props from this instance of ImageSwatch\n * @param ref - reference to root HTMLDivElement of ImageSwatch\n */ export const useImageSwatch_unstable = (props, ref)=>{\n    const { src, value, onClick, style, ...rest } = props;\n    const size = useSwatchPickerContextValue_unstable((ctx)=>ctx.size);\n    const shape = useSwatchPickerContextValue_unstable((ctx)=>ctx.shape);\n    const isGrid = useSwatchPickerContextValue_unstable((ctx)=>ctx.isGrid);\n    const requestSelectionChange = useSwatchPickerContextValue_unstable((ctx)=>ctx.requestSelectionChange);\n    const selected = useSwatchPickerContextValue_unstable((ctx)=>ctx.selectedValue === value);\n    const role = isGrid ? 'gridcell' : 'radio';\n    const ariaSelected = isGrid ? {\n        'aria-selected': selected\n    } : {\n        'aria-checked': selected\n    };\n    const onImageSwatchClick = useEventCallback(mergeCallbacks(onClick, (event)=>requestSelectionChange(event, {\n            selectedValue: value,\n            selectedSwatch: src\n        })));\n    return {\n        components: {\n            root: 'button'\n        },\n        root: slot.always(getIntrinsicElementProps('button', {\n            ref,\n            role,\n            ...ariaSelected,\n            onClick: onImageSwatchClick,\n            ...rest,\n            style: {\n                backgroundImage: `url(${src})`,\n                ...style\n            }\n        }), {\n            elementType: 'button'\n        }),\n        value,\n        selected,\n        size,\n        shape\n    };\n};\n"],"names":["useImageSwatch_unstable","props","ref","src","value","onClick","style","rest","size","useSwatchPickerContextValue_unstable","ctx","shape","isGrid","requestSelectionChange","selected","selectedValue","role","ariaSelected","onImageSwatchClick","useEventCallback","mergeCallbacks","event","selectedSwatch","components","root","slot","always","getIntrinsicElementProps","backgroundImage","elementType"],"mappings":";;;;+BAWiBA;;;eAAAA;;;;iEAXM;gCAC0D;8BAC5B;AAS1C,MAAMA,0BAA0B,CAACC,OAAOC;IAC/C,MAAM,EAAEC,GAAG,EAAEC,KAAK,EAAEC,OAAO,EAAEC,KAAK,EAAE,GAAGC,MAAM,GAAGN;IAChD,MAAMO,OAAOC,IAAAA,kDAAoC,EAAC,CAACC,MAAMA,IAAIF,IAAI;IACjE,MAAMG,QAAQF,IAAAA,kDAAoC,EAAC,CAACC,MAAMA,IAAIC,KAAK;IACnE,MAAMC,SAASH,IAAAA,kDAAoC,EAAC,CAACC,MAAMA,IAAIE,MAAM;IACrE,MAAMC,yBAAyBJ,IAAAA,kDAAoC,EAAC,CAACC,MAAMA,IAAIG,sBAAsB;IACrG,MAAMC,WAAWL,IAAAA,kDAAoC,EAAC,CAACC,MAAMA,IAAIK,aAAa,KAAKX;IACnF,MAAMY,OAAOJ,SAAS,aAAa;IACnC,MAAMK,eAAeL,SAAS;QAC1B,iBAAiBE;IACrB,IAAI;QACA,gBAAgBA;IACpB;IACA,MAAMI,qBAAqBC,IAAAA,gCAAgB,EAACC,IAAAA,8BAAc,EAACf,SAAS,CAACgB,QAAQR,uBAAuBQ,OAAO;YACnGN,eAAeX;YACfkB,gBAAgBnB;QACpB;IACJ,OAAO;QACHoB,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,wCAAwB,EAAC,UAAU;YACjDzB;YACAc;YACA,GAAGC,YAAY;YACfZ,SAASa;YACT,GAAGX,IAAI;YACPD,OAAO;gBACHsB,iBAAiB,CAAC,IAAI,EAAEzB,IAAI,CAAC,CAAC;gBAC9B,GAAGG,KAAK;YACZ;QACJ,IAAI;YACAuB,aAAa;QACjB;QACAzB;QACAU;QACAN;QACAG;IACJ;AACJ"}
+{"version":3,"sources":["useImageSwatch.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot, useEventCallback, mergeCallbacks } from '@fluentui/react-utilities';\nimport type { ImageSwatchProps, ImageSwatchState } from './ImageSwatch.types';\nimport { useSwatchPickerContextValue_unstable } from '../../contexts/swatchPicker';\n\n/**\n * Create the state required to render ImageSwatch.\n *\n * The returned state can be modified with hooks such as useImageSwatchStyles_unstable,\n * before being passed to renderImageSwatch_unstable.\n *\n * @param props - props from this instance of ImageSwatch\n * @param ref - reference to root HTMLDivElement of ImageSwatch\n */\nexport const useImageSwatch_unstable = (\n  props: ImageSwatchProps,\n  ref: React.Ref<HTMLButtonElement>,\n): ImageSwatchState => {\n  const { src, value, onClick, style, ...rest } = props;\n  const size = useSwatchPickerContextValue_unstable(ctx => ctx.size);\n  const shape = useSwatchPickerContextValue_unstable(ctx => ctx.shape);\n  const isGrid = useSwatchPickerContextValue_unstable(ctx => ctx.isGrid);\n\n  const requestSelectionChange = useSwatchPickerContextValue_unstable(ctx => ctx.requestSelectionChange);\n  const selected = useSwatchPickerContextValue_unstable(ctx => ctx.selectedValue === value);\n\n  const role = isGrid ? 'gridcell' : 'radio';\n  const ariaSelected = isGrid\n    ? {\n        'aria-selected': selected,\n      }\n    : { 'aria-checked': selected };\n\n  const onImageSwatchClick = useEventCallback(\n    mergeCallbacks(onClick, (event: React.MouseEvent<HTMLButtonElement>) =>\n      requestSelectionChange(event, {\n        selectedValue: value,\n        selectedSwatch: src,\n      }),\n    ),\n  );\n\n  return {\n    components: {\n      root: 'button',\n    },\n    root: slot.always(\n      getIntrinsicElementProps('button', {\n        ref,\n        role,\n        ...ariaSelected,\n        onClick: onImageSwatchClick,\n        ...rest,\n        style: {\n          backgroundImage: `url(${src})`,\n          ...style,\n        },\n      }),\n      { elementType: 'button' },\n    ),\n    value,\n    selected,\n    size,\n    shape,\n  };\n};\n"],"names":["useImageSwatch_unstable","props","ref","src","value","onClick","style","rest","size","useSwatchPickerContextValue_unstable","ctx","shape","isGrid","requestSelectionChange","selected","selectedValue","role","ariaSelected","onImageSwatchClick","useEventCallback","mergeCallbacks","event","selectedSwatch","components","root","slot","always","getIntrinsicElementProps","backgroundImage","elementType"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAcaA;;;eAAAA;;;;iEAdU;gCAC0D;8BAE5B;AAW9C,MAAMA,0BAA0B,CACrCC,OACAC;IAEA,MAAM,EAAEC,GAAG,EAAEC,KAAK,EAAEC,OAAO,EAAEC,KAAK,EAAE,GAAGC,MAAM,GAAGN;IAChD,MAAMO,OAAOC,IAAAA,kDAAAA,EAAqCC,CAAAA,MAAOA,IAAIF,IAAI;IACjE,MAAMG,QAAQF,IAAAA,kDAAAA,EAAqCC,CAAAA,MAAOA,IAAIC,KAAK;IACnE,MAAMC,SAASH,IAAAA,kDAAAA,EAAqCC,CAAAA,MAAOA,IAAIE,MAAM;IAErE,MAAMC,yBAAyBJ,IAAAA,kDAAAA,EAAqCC,CAAAA,MAAOA,IAAIG,sBAAsB;IACrG,MAAMC,WAAWL,IAAAA,kDAAAA,EAAqCC,CAAAA,MAAOA,IAAIK,aAAa,KAAKX;IAEnF,MAAMY,OAAOJ,SAAS,aAAa;IACnC,MAAMK,eAAeL,SACjB;QACE,iBAAiBE;IACnB,IACA;QAAE,gBAAgBA;IAAS;IAE/B,MAAMI,qBAAqBC,IAAAA,gCAAAA,EACzBC,IAAAA,8BAAAA,EAAef,SAAS,CAACgB,QACvBR,uBAAuBQ,OAAO;YAC5BN,eAAeX;YACfkB,gBAAgBnB;QAClB;IAIJ,OAAO;QACLoB,YAAY;YACVC,MAAM;QACR;QACAA,MAAMC,oBAAAA,CAAKC,MAAM,CACfC,IAAAA,wCAAAA,EAAyB,UAAU;YACjCzB;YACAc;YACA,GAAGC,YAAY;YACfZ,SAASa;YACT,GAAGX,IAAI;YACPD,OAAO;gBACLsB,iBAAiB,CAAC,IAAI,EAAEzB,IAAI,CAAC,CAAC;gBAC9B,GAAGG,KAAK;YACV;QACF,IACA;YAAEuB,aAAa;QAAS;QAE1BzB;QACAU;QACAN;QACAG;IACF;AACF"}

package/lib-commonjs/components/ImageSwatch/useImageSwatchStyles.styles.js

@@ -22,17 +22,17 @@ const imageSwatchClassNames = {
 };
 /**
  * Styles for the root slot
- */ const useStyles = /*#__PURE__*/ (0, _react.__resetStyles)("r1kt2fyq", null, {
+ */ const useStyles = /*#__PURE__*/ (0, _react.__resetStyles)("r18b5q7m", null, {
     r: [
-        ".r1kt2fyq{display:inline-flex;box-sizing:border-box;border:1px solid var(--colorTransparentStroke);background-size:cover;background-repeat:no-repeat;padding:0;}",
-        ".r1kt2fyq:hover{cursor:pointer;border:none;box-shadow:inset 0 0 0 var(--strokeWidthThick) var(--colorBrandStroke1),inset 0 0 0 var(--strokeWidthThicker) var(--colorStrokeFocus1);}",
-        ".r1kt2fyq:hover:active{border:none;box-shadow:inset 0 0 0 var(--strokeWidthThicker) var(--colorBrandStroke1),inset 0 0 0 var(--strokeWidthThickest) var(--colorStrokeFocus1);}",
-        ".r1kt2fyq:focus{outline:none;}",
-        ".r1kt2fyq:focus-visible{outline:none;}",
-        ".r1kt2fyq[data-fui-focus-visible]{border:none;outline:none;box-shadow:inset 0 0 0 var(--strokeWidthThick) var(--colorStrokeFocus2),inset 0 0 0 var(--strokeWidthThicker) var(--colorStrokeFocus1);}"
+        ".r18b5q7m{display:inline-flex;box-sizing:border-box;border:1px solid var(--colorTransparentStroke);background-size:cover;background-repeat:no-repeat;padding:0;}",
+        ".r18b5q7m:hover{cursor:pointer;border:none;box-shadow:inset 0 0 0 var(--strokeWidthThick) var(--colorBrandStroke1),inset 0 0 0 var(--strokeWidthThicker) var(--colorStrokeFocus1);}",
+        ".r18b5q7m:hover:active{border:none;box-shadow:inset 0 0 0 var(--strokeWidthThicker) var(--colorCompoundBrandStrokePressed),inset 0 0 0 var(--strokeWidthThickest) var(--colorStrokeFocus1);}",
+        ".r18b5q7m:focus{outline:none;}",
+        ".r18b5q7m:focus-visible{outline:none;}",
+        ".r18b5q7m[data-fui-focus-visible]{border:none;outline:none;box-shadow:inset 0 0 0 var(--strokeWidthThick) var(--colorStrokeFocus2),inset 0 0 0 var(--strokeWidthThicker) var(--colorStrokeFocus1);}"
     ],
     s: [
-        "@media (forced-colors: active){.r1kt2fyq{forced-color-adjust:none;}.r1kt2fyq:hover{box-shadow:inset 0 0 0 var(--strokeWidthThick) var(--colorBrandStroke2Hover),inset 0 0 0 var(--strokeWidthThicker) var(--colorStrokeFocus1);}.r1kt2fyq:hover:active{box-shadow:inset 0 0 0 var(--strokeWidthThicker) var(--colorBrandStroke2Pressed),inset 0 0 0 var(--strokeWidthThickest) var(--colorStrokeFocus1);}}"
+        "@media (forced-colors: active){.r18b5q7m{forced-color-adjust:none;}.r18b5q7m:hover{box-shadow:inset 0 0 0 var(--strokeWidthThick) var(--colorBrandStroke2Hover),inset 0 0 0 var(--strokeWidthThicker) var(--colorStrokeFocus1);}.r18b5q7m:hover:active{box-shadow:inset 0 0 0 var(--strokeWidthThicker) var(--colorBrandStroke2Pressed),inset 0 0 0 var(--strokeWidthThickest) var(--colorStrokeFocus1);}}"
     ]
 });
 const useStylesSelected = /*#__PURE__*/ (0, _react.__styles)({
@@ -55,8 +55,8 @@ const useStylesSelected = /*#__PURE__*/ (0, _react.__styles)({
         B4j52fo: 0,
         irswps: "f3bhgqh",
         E5pizo: "f8ps3yo",
-        Bvxd0ez: "f1txz9o1",
-        vajtyg: "f1frtkom",
+        Bvxd0ez: "f106r15f",
+        vajtyg: "ft0nc49",
         j6ew2k: "f16jq8vy",
         Bspt33j: "f18nq7tj"
     }
@@ -72,8 +72,8 @@ const useStylesSelected = /*#__PURE__*/ (0, _react.__styles)({
         ".f16jq8vy[data-fui-focus-visible]{box-shadow:inset 0 0 0 var(--strokeWidthThicker) var(--colorStrokeFocus2),inset 0 0 0 5px var(--colorStrokeFocus1);}"
     ],
     h: [
-        ".f1txz9o1:hover{box-shadow:inset 0 0 0 var(--strokeWidthThickest) var(--colorBrandStroke1),inset 0 0 0 6px var(--colorStrokeFocus1);}",
-        ".f1frtkom:hover:active{box-shadow:inset 0 0 0 var(--strokeWidthThickest) var(--colorBrandStroke1),inset 0 0 0 7px var(--colorStrokeFocus1);}"
+        ".f106r15f:hover{box-shadow:inset 0 0 0 var(--strokeWidthThickest) var(--colorCompoundBrandStrokeHover),inset 0 0 0 6px var(--colorStrokeFocus1);}",
+        ".ft0nc49:hover:active{box-shadow:inset 0 0 0 var(--strokeWidthThickest) var(--colorCompoundBrandStrokePressed),inset 0 0 0 7px var(--colorStrokeFocus1);}"
     ],
     m: [
         [
@@ -191,6 +191,7 @@ const useShapeStyles = /*#__PURE__*/ (0, _react.__styles)({
     ]
 });
 const useImageSwatchStyles_unstable = (state)=>{
+    'use no memo';
     const styles = useStyles();
     const selectedStyles = useStylesSelected();
     const sizeStyles = useSizeStyles();

package/lib-commonjs/components/ImageSwatch/useImageSwatchStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useImageSwatchStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses, __resetStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nexport const imageSwatchClassNames = {\n  root: 'fui-ImageSwatch'\n};\n/**\n * Styles for the root slot\n */\nconst useStyles = /*#__PURE__*/__resetStyles(\"r1kt2fyq\", null, {\n  r: [\".r1kt2fyq{display:inline-flex;box-sizing:border-box;border:1px solid var(--colorTransparentStroke);background-size:cover;background-repeat:no-repeat;padding:0;}\", \".r1kt2fyq:hover{cursor:pointer;border:none;box-shadow:inset 0 0 0 var(--strokeWidthThick) var(--colorBrandStroke1),inset 0 0 0 var(--strokeWidthThicker) var(--colorStrokeFocus1);}\", \".r1kt2fyq:hover:active{border:none;box-shadow:inset 0 0 0 var(--strokeWidthThicker) var(--colorBrandStroke1),inset 0 0 0 var(--strokeWidthThickest) var(--colorStrokeFocus1);}\", \".r1kt2fyq:focus{outline:none;}\", \".r1kt2fyq:focus-visible{outline:none;}\", \".r1kt2fyq[data-fui-focus-visible]{border:none;outline:none;box-shadow:inset 0 0 0 var(--strokeWidthThick) var(--colorStrokeFocus2),inset 0 0 0 var(--strokeWidthThicker) var(--colorStrokeFocus1);}\"],\n  s: [\"@media (forced-colors: active){.r1kt2fyq{forced-color-adjust:none;}.r1kt2fyq:hover{box-shadow:inset 0 0 0 var(--strokeWidthThick) var(--colorBrandStroke2Hover),inset 0 0 0 var(--strokeWidthThicker) var(--colorStrokeFocus1);}.r1kt2fyq:hover:active{box-shadow:inset 0 0 0 var(--strokeWidthThicker) var(--colorBrandStroke2Pressed),inset 0 0 0 var(--strokeWidthThickest) var(--colorStrokeFocus1);}}\"]\n});\nconst useStylesSelected = /*#__PURE__*/__styles({\n  selected: {\n    Bgfg5da: 0,\n    B9xav0g: 0,\n    oivjwe: 0,\n    Bn0qgzm: 0,\n    B4g9neb: 0,\n    zhjwy3: 0,\n    wvpqe5: 0,\n    ibv6hh: 0,\n    u1mtju: 0,\n    h3c5rm: 0,\n    vrafjx: 0,\n    Bekrc4i: 0,\n    i8vvqc: 0,\n    g2u3we: 0,\n    icvyot: 0,\n    B4j52fo: 0,\n    irswps: \"f3bhgqh\",\n    E5pizo: \"f8ps3yo\",\n    Bvxd0ez: \"f1txz9o1\",\n    vajtyg: \"f1frtkom\",\n    j6ew2k: \"f16jq8vy\",\n    Bspt33j: \"f18nq7tj\"\n  }\n}, {\n  d: [[\".f3bhgqh{border:none;}\", {\n    p: -2\n  }], \".f8ps3yo{box-shadow:inset 0 0 0 var(--strokeWidthThicker) var(--colorBrandStroke1),inset 0 0 0 5px var(--colorStrokeFocus1);}\", \".f16jq8vy[data-fui-focus-visible]{box-shadow:inset 0 0 0 var(--strokeWidthThicker) var(--colorStrokeFocus2),inset 0 0 0 5px var(--colorStrokeFocus1);}\"],\n  h: [\".f1txz9o1:hover{box-shadow:inset 0 0 0 var(--strokeWidthThickest) var(--colorBrandStroke1),inset 0 0 0 6px var(--colorStrokeFocus1);}\", \".f1frtkom:hover:active{box-shadow:inset 0 0 0 var(--strokeWidthThickest) var(--colorBrandStroke1),inset 0 0 0 7px var(--colorStrokeFocus1);}\"],\n  m: [[\"@media (forced-colors: active){.f18nq7tj{box-shadow:inset 0 0 0 var(--strokeWidthThicker) var(--colorBrandStroke2Pressed),inset 0 0 0 5px var(--colorStrokeFocus1);}}\", {\n    m: \"(forced-colors: active)\"\n  }]]\n});\nconst useSizeStyles = /*#__PURE__*/__styles({\n  \"extra-small\": {\n    a9b677: \"f64fuq3\",\n    Bqenvij: \"fjamq6b\"\n  },\n  small: {\n    a9b677: \"fq4mcun\",\n    Bqenvij: \"frvgh55\"\n  },\n  medium: {\n    a9b677: \"f1w9dchk\",\n    Bqenvij: \"fxldao9\"\n  },\n  large: {\n    a9b677: \"f1szoe96\",\n    Bqenvij: \"f1d2rq10\"\n  }\n}, {\n  d: [\".f64fuq3{width:20px;}\", \".fjamq6b{height:20px;}\", \".fq4mcun{width:24px;}\", \".frvgh55{height:24px;}\", \".f1w9dchk{width:28px;}\", \".fxldao9{height:28px;}\", \".f1szoe96{width:32px;}\", \".f1d2rq10{height:32px;}\"]\n});\nconst useShapeStyles = /*#__PURE__*/__styles({\n  rounded: {\n    Beyfa6y: 0,\n    Bbmb7ep: 0,\n    Btl43ni: 0,\n    B7oj6ja: 0,\n    Dimara: \"ft85np5\",\n    Bw81rd7: 0,\n    kdpuga: 0,\n    dm238s: 0,\n    B6xbmo0: 0,\n    B3whbx2: \"f2krc9w\"\n  },\n  circular: {\n    Beyfa6y: 0,\n    Bbmb7ep: 0,\n    Btl43ni: 0,\n    B7oj6ja: 0,\n    Dimara: \"f44lkw9\",\n    Bw81rd7: 0,\n    kdpuga: 0,\n    dm238s: 0,\n    B6xbmo0: 0,\n    B3whbx2: \"f1062rbf\"\n  },\n  square: {\n    Beyfa6y: 0,\n    Bbmb7ep: 0,\n    Btl43ni: 0,\n    B7oj6ja: 0,\n    Dimara: \"f1fabniw\",\n    Bw81rd7: 0,\n    kdpuga: 0,\n    dm238s: 0,\n    B6xbmo0: 0,\n    B3whbx2: \"fj0ryk1\"\n  }\n}, {\n  d: [[\".ft85np5{border-radius:var(--borderRadiusMedium);}\", {\n    p: -1\n  }], [\".f2krc9w[data-fui-focus-visible]{border-radius:var(--borderRadiusMedium);}\", {\n    p: -1\n  }], [\".f44lkw9{border-radius:var(--borderRadiusCircular);}\", {\n    p: -1\n  }], [\".f1062rbf[data-fui-focus-visible]{border-radius:var(--borderRadiusCircular);}\", {\n    p: -1\n  }], [\".f1fabniw{border-radius:var(--borderRadiusNone);}\", {\n    p: -1\n  }], [\".fj0ryk1[data-fui-focus-visible]{border-radius:var(--borderRadiusNone);}\", {\n    p: -1\n  }]]\n});\n/**\n * Apply styling to the ImageSwatch slots based on the state\n */\nexport const useImageSwatchStyles_unstable = state => {\n  const styles = useStyles();\n  const selectedStyles = useStylesSelected();\n  const sizeStyles = useSizeStyles();\n  const shapeStyles = useShapeStyles();\n  const {\n    size = 'medium',\n    shape = 'square'\n  } = state;\n  state.root.className = mergeClasses(imageSwatchClassNames.root, styles, sizeStyles[size], shapeStyles[shape], state.selected && selectedStyles.selected, state.root.className);\n  return state;\n};\n//# sourceMappingURL=useImageSwatchStyles.styles.js.map"],"names":["imageSwatchClassNames","useImageSwatchStyles_unstable","root","useStyles","__resetStyles","r","s","useStylesSelected","__styles","selected","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","E5pizo","Bvxd0ez","vajtyg","j6ew2k","Bspt33j","d","p","h","m","useSizeStyles","a9b677","Bqenvij","small","medium","large","useShapeStyles","rounded","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","Bw81rd7","kdpuga","dm238s","B6xbmo0","B3whbx2","circular","square","state","styles","selectedStyles","sizeStyles","shapeStyles","size","shape","className","mergeClasses"],"mappings":"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"}
+{"version":3,"sources":["useImageSwatchStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, makeResetStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nexport const imageSwatchClassNames = {\n    root: 'fui-ImageSwatch'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeResetStyles({\n    display: 'inline-flex',\n    boxSizing: 'border-box',\n    border: `1px solid ${tokens.colorTransparentStroke}`,\n    backgroundSize: 'cover',\n    backgroundRepeat: 'no-repeat',\n    padding: '0',\n    ':hover': {\n        cursor: 'pointer',\n        border: 'none',\n        boxShadow: `inset 0 0 0 ${tokens.strokeWidthThick} ${tokens.colorBrandStroke1}, inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorStrokeFocus1}`\n    },\n    ':hover:active': {\n        border: 'none',\n        boxShadow: `inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorCompoundBrandStrokePressed}, inset 0 0 0 ${tokens.strokeWidthThickest} ${tokens.colorStrokeFocus1}`\n    },\n    ':focus': {\n        outline: 'none'\n    },\n    ':focus-visible': {\n        outline: 'none'\n    },\n    ...createCustomFocusIndicatorStyle({\n        border: 'none',\n        outline: 'none',\n        boxShadow: `inset 0 0 0 ${tokens.strokeWidthThick} ${tokens.colorStrokeFocus2}, inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorStrokeFocus1}`\n    }),\n    // High contrast styles\n    '@media (forced-colors: active)': {\n        forcedColorAdjust: 'none',\n        ':hover': {\n            boxShadow: `inset 0 0 0 ${tokens.strokeWidthThick} ${tokens.colorBrandStroke2Hover}, inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorStrokeFocus1}`\n        },\n        ':hover:active': {\n            boxShadow: `inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorBrandStroke2Pressed}, inset 0 0 0 ${tokens.strokeWidthThickest} ${tokens.colorStrokeFocus1}`\n        }\n    }\n});\nconst useStylesSelected = makeStyles({\n    selected: {\n        border: 'none',\n        boxShadow: `inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorBrandStroke1}, inset 0 0 0 5px ${tokens.colorStrokeFocus1}`,\n        ':hover': {\n            boxShadow: `inset 0 0 0 ${tokens.strokeWidthThickest} ${tokens.colorCompoundBrandStrokeHover}, inset 0 0 0 6px ${tokens.colorStrokeFocus1}`\n        },\n        ':hover:active': {\n            boxShadow: `inset 0 0 0 ${tokens.strokeWidthThickest} ${tokens.colorCompoundBrandStrokePressed}, inset 0 0 0 7px ${tokens.colorStrokeFocus1}`\n        },\n        ...createCustomFocusIndicatorStyle({\n            boxShadow: `inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorStrokeFocus2}, inset 0 0 0 5px ${tokens.colorStrokeFocus1}`\n        }),\n        '@media (forced-colors: active)': {\n            boxShadow: `inset 0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorBrandStroke2Pressed}, inset 0 0 0 5px ${tokens.colorStrokeFocus1}`\n        }\n    }\n});\nconst useSizeStyles = makeStyles({\n    'extra-small': {\n        width: '20px',\n        height: '20px'\n    },\n    small: {\n        width: '24px',\n        height: '24px'\n    },\n    medium: {\n        width: '28px',\n        height: '28px'\n    },\n    large: {\n        width: '32px',\n        height: '32px'\n    }\n});\nconst useShapeStyles = makeStyles({\n    rounded: {\n        borderRadius: tokens.borderRadiusMedium,\n        ...createCustomFocusIndicatorStyle({\n            borderRadius: tokens.borderRadiusMedium\n        })\n    },\n    circular: {\n        borderRadius: tokens.borderRadiusCircular,\n        ...createCustomFocusIndicatorStyle({\n            borderRadius: tokens.borderRadiusCircular\n        })\n    },\n    square: {\n        borderRadius: tokens.borderRadiusNone,\n        ...createCustomFocusIndicatorStyle({\n            borderRadius: tokens.borderRadiusNone\n        })\n    }\n});\n/**\n * Apply styling to the ImageSwatch slots based on the state\n */ export const useImageSwatchStyles_unstable = (state)=>{\n    'use no memo';\n    const styles = useStyles();\n    const selectedStyles = useStylesSelected();\n    const sizeStyles = useSizeStyles();\n    const shapeStyles = useShapeStyles();\n    const { size = 'medium', shape = 'square' } = state;\n    state.root.className = mergeClasses(imageSwatchClassNames.root, styles, sizeStyles[size], shapeStyles[shape], state.selected && selectedStyles.selected, state.root.className);\n    return state;\n};\n"],"names":["imageSwatchClassNames","useImageSwatchStyles_unstable","root","useStyles","__resetStyles","r","s","useStylesSelected","__styles","selected","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","E5pizo","Bvxd0ez","vajtyg","j6ew2k","Bspt33j","d","p","h","m","useSizeStyles","a9b677","Bqenvij","small","medium","large","useShapeStyles","rounded","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","Bw81rd7","kdpuga","dm238s","B6xbmo0","B3whbx2","circular","square","state","styles","selectedStyles","sizeStyles","shapeStyles","size","shape","className","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/lib-commonjs/components/SwatchPicker/SwatchPicker.js.map

@@ -1 +1 @@
-{"version":3,"sources":["SwatchPicker.js"],"sourcesContent":["import * as React from 'react';\nimport { useSwatchPicker_unstable } from './useSwatchPicker';\nimport { renderSwatchPicker_unstable } from './renderSwatchPicker';\nimport { useSwatchPickerStyles_unstable } from './useSwatchPickerStyles.styles';\nimport { useSwatchPickerContextValues } from '../../contexts/swatchPicker';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n/**\n * SwatchPicker component - TODO: add more docs\n */ export const SwatchPicker = /*#__PURE__*/ React.forwardRef((props, ref)=>{\n    const state = useSwatchPicker_unstable(props, ref);\n    const contextValues = useSwatchPickerContextValues(state);\n    useSwatchPickerStyles_unstable(state);\n    useCustomStyleHook_unstable('useSwatchPickerStyles_unstable')(state);\n    return renderSwatchPicker_unstable(state, contextValues);\n});\nSwatchPicker.displayName = 'SwatchPicker';\n"],"names":["SwatchPicker","React","forwardRef","props","ref","state","useSwatchPicker_unstable","contextValues","useSwatchPickerContextValues","useSwatchPickerStyles_unstable","useCustomStyleHook_unstable","renderSwatchPicker_unstable","displayName"],"mappings":";;;;+BAQiBA;;;eAAAA;;;;iEARM;iCACkB;oCACG;6CACG;8BACF;qCACD;AAGjC,MAAMA,eAAe,WAAW,GAAGC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IACnE,MAAMC,QAAQC,IAAAA,yCAAwB,EAACH,OAAOC;IAC9C,MAAMG,gBAAgBC,IAAAA,0CAA4B,EAACH;IACnDI,IAAAA,2DAA8B,EAACJ;IAC/BK,IAAAA,gDAA2B,EAAC,kCAAkCL;IAC9D,OAAOM,IAAAA,+CAA2B,EAACN,OAAOE;AAC9C;AACAP,aAAaY,WAAW,GAAG"}
+{"version":3,"sources":["SwatchPicker.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useSwatchPicker_unstable } from './useSwatchPicker';\nimport { renderSwatchPicker_unstable } from './renderSwatchPicker';\nimport { useSwatchPickerStyles_unstable } from './useSwatchPickerStyles.styles';\nimport type { SwatchPickerProps } from './SwatchPicker.types';\nimport { useSwatchPickerContextValues } from '../../contexts/swatchPicker';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * SwatchPicker component - TODO: add more docs\n */\nexport const SwatchPicker: ForwardRefComponent<SwatchPickerProps> = React.forwardRef((props, ref) => {\n  const state = useSwatchPicker_unstable(props, ref);\n  const contextValues = useSwatchPickerContextValues(state);\n\n  useSwatchPickerStyles_unstable(state);\n  useCustomStyleHook_unstable('useSwatchPickerStyles_unstable')(state);\n\n  return renderSwatchPicker_unstable(state, contextValues);\n});\n\nSwatchPicker.displayName = 'SwatchPicker';\n"],"names":["SwatchPicker","React","forwardRef","props","ref","state","useSwatchPicker_unstable","contextValues","useSwatchPickerContextValues","useSwatchPickerStyles_unstable","useCustomStyleHook_unstable","renderSwatchPicker_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAYaA;;;eAAAA;;;;iEAZU;iCAEkB;oCACG;6CACG;8BAEF;qCACD;AAKrC,MAAMA,eAAAA,WAAAA,GAAuDC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,QAAQC,IAAAA,yCAAAA,EAAyBH,OAAOC;IAC9C,MAAMG,gBAAgBC,IAAAA,0CAAAA,EAA6BH;IAEnDI,IAAAA,2DAAAA,EAA+BJ;IAC/BK,IAAAA,gDAAAA,EAA4B,kCAAkCL;IAE9D,OAAOM,IAAAA,+CAAAA,EAA4BN,OAAOE;AAC5C;AAEAP,aAAaY,WAAW,GAAG"}

package/lib-commonjs/components/SwatchPicker/SwatchPicker.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["SwatchPicker.types.js"],"sourcesContent":["import * as React from 'react';\n"],"names":[],"mappings":";;;;;iEAAuB"}
+{"version":3,"sources":["SwatchPicker.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot, EventHandler, EventData } from '@fluentui/react-utilities';\nimport { SwatchPickerContextValue } from '../../contexts/swatchPicker';\n\nexport type SwatchPickerSlots = {\n  root: Slot<'div'>;\n};\n\nexport type SwatchPickerOnSelectEventHandler = EventHandler<SwatchPickerOnSelectionChangeData>;\n\nexport type SwatchPickerOnSelectionChangeData = EventData<'click', React.MouseEvent<HTMLButtonElement>> & {\n  selectedValue: string;\n  selectedSwatch: string;\n};\n\n/**\n * SwatchPicker Props\n */\nexport type SwatchPickerProps = ComponentProps<SwatchPickerSlots> & {\n  /**\n   * Default selected value\n   */\n  defaultSelectedValue?: string;\n\n  /**\n   * Whether SwatchPicker is row or grid\n   */\n  layout?: 'row' | 'grid';\n\n  /**\n   * Triggers a callback when the value has been changed\n   */\n  onSelectionChange?: EventHandler<SwatchPickerOnSelectionChangeData>;\n\n  /**\n   * Controlled selected value\n   */\n  selectedValue?: string;\n\n  /**\n   * Swatch size\n   * @defaultvalue 'medium'\n   */\n  size?: 'extra-small' | 'small' | 'medium' | 'large';\n\n  /**\n   * Swatch shape\n   * @defaultvalue 'square'\n   */\n  shape?: 'rounded' | 'square' | 'circular';\n\n  /**\n   * Spacing between swatches\n   * @defaultvalue 'medium'\n   */\n  spacing?: 'small' | 'medium';\n};\n\n/**\n * State used in rendering SwatchPicker\n */\nexport type SwatchPickerState = ComponentState<SwatchPickerSlots> &\n  SwatchPickerContextValue &\n  Pick<SwatchPickerProps, 'layout' | 'size' | 'shape' | 'spacing'> & {\n    isGrid: boolean;\n  };\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;iEAAuB"}

package/lib-commonjs/components/SwatchPicker/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.js"],"sourcesContent":["export * from './SwatchPicker';\nexport * from './SwatchPicker.types';\nexport * from './renderSwatchPicker';\nexport * from './useSwatchPicker';\nexport * from './useSwatchPickerStyles.styles';\n"],"names":[],"mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './SwatchPicker';\nexport * from './SwatchPicker.types';\nexport * from './renderSwatchPicker';\nexport * from './useSwatchPicker';\nexport * from './useSwatchPickerStyles.styles';\n"],"names":[],"rangeMappings":";;;;;;;;;","mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA"}

package/lib-commonjs/components/SwatchPicker/renderSwatchPicker.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderSwatchPicker.js"],"sourcesContent":["  import { jsx as _jsx } from \"@fluentui/react-jsx-runtime/jsx-runtime\";\nimport { assertSlots } from '@fluentui/react-utilities';\nimport { SwatchPickerProvider } from '../../contexts/swatchPicker';\n/**\n * Render the final JSX of SwatchPicker\n */ export const renderSwatchPicker_unstable = (state, contextValues)=>{\n    assertSlots(state);\n    return /*#__PURE__*/ _jsx(SwatchPickerProvider, {\n        value: contextValues.swatchPicker,\n        children: /*#__PURE__*/ _jsx(state.root, {\n            children: state.root.children\n        })\n    });\n};\n"],"names":["renderSwatchPicker_unstable","state","contextValues","assertSlots","_jsx","SwatchPickerProvider","value","swatchPicker","children","root"],"mappings":";;;;+BAKiBA;;;eAAAA;;;4BALa;gCACF;8BACS;AAG1B,MAAMA,8BAA8B,CAACC,OAAOC;IACnDC,IAAAA,2BAAW,EAACF;IACZ,OAAO,WAAW,GAAGG,IAAAA,eAAI,EAACC,kCAAoB,EAAE;QAC5CC,OAAOJ,cAAcK,YAAY;QACjCC,UAAU,WAAW,GAAGJ,IAAAA,eAAI,EAACH,MAAMQ,IAAI,EAAE;YACrCD,UAAUP,MAAMQ,IAAI,CAACD,QAAQ;QACjC;IACJ;AACJ"}
+{"version":3,"sources":["renderSwatchPicker.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport { SwatchPickerProvider } from '../../contexts/swatchPicker';\nimport type { SwatchPickerContextValues } from '../../contexts/swatchPicker';\nimport type { SwatchPickerState, SwatchPickerSlots } from './SwatchPicker.types';\n\n/**\n * Render the final JSX of SwatchPicker\n */\nexport const renderSwatchPicker_unstable = (state: SwatchPickerState, contextValues: SwatchPickerContextValues) => {\n  assertSlots<SwatchPickerSlots>(state);\n\n  return (\n    <SwatchPickerProvider value={contextValues.swatchPicker}>\n      <state.root>{state.root.children}</state.root>\n    </SwatchPickerProvider>\n  );\n};\n"],"names":["renderSwatchPicker_unstable","state","contextValues","assertSlots","_jsx","SwatchPickerProvider","value","swatchPicker","root","children"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAWaA;;;eAAAA;;;4BAVb;gCAE4B;8BACS;AAO9B,MAAMA,8BAA8B,CAACC,OAA0BC;IACpEC,IAAAA,2BAAAA,EAA+BF;IAE/B,OAAA,WAAA,GACEG,IAAAA,eAAA,EAACC,kCAAAA,EAAAA;QAAqBC,OAAOJ,cAAcK,YAAY;kBACrD,WAAA,GAAAH,IAAAA,eAAA,EAACH,MAAMO,IAAI,EAAA;sBAAEP,MAAMO,IAAI,CAACC,QAAQ;;;AAGtC"}

package/lib-commonjs/components/SwatchPicker/useSwatchPicker.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useSwatchPicker.js"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, useControllableState, useEventCallback, slot } from '@fluentui/react-utilities';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\n/**\n * Create the state required to render SwatchPicker.\n *\n * The returned state can be modified with hooks such as useSwatchPickerStyles_unstable,\n * before being passed to renderSwatchPicker_unstable.\n *\n * @param props - props from this instance of SwatchPicker\n * @param ref - reference to root HTMLElement of SwatchPicker\n */ export const useSwatchPicker_unstable = (props, ref)=>{\n    const { layout, onSelectionChange, size = 'medium', shape, spacing = 'medium', style, ...rest } = props;\n    const isGrid = layout === 'grid';\n    const focusAttributes = useArrowNavigationGroup({\n        circular: true,\n        axis: isGrid ? 'grid-linear' : 'both',\n        memorizeCurrent: true\n    });\n    const role = isGrid ? 'grid' : 'radiogroup';\n    const [selectedValue, setSelectedValue] = useControllableState({\n        state: props.selectedValue,\n        defaultState: props.defaultSelectedValue,\n        initialState: ''\n    });\n    const requestSelectionChange = useEventCallback((event, data)=>{\n        onSelectionChange === null || onSelectionChange === void 0 ? void 0 : onSelectionChange(event, {\n            type: 'click',\n            event,\n            selectedValue: data.selectedValue,\n            selectedSwatch: data.selectedSwatch\n        });\n        setSelectedValue(data.selectedValue);\n    });\n    return {\n        components: {\n            root: 'div'\n        },\n        root: slot.always(getIntrinsicElementProps('div', {\n            ref,\n            role,\n            ...focusAttributes,\n            ...rest\n        }), {\n            elementType: 'div'\n        }),\n        isGrid,\n        requestSelectionChange,\n        selectedValue,\n        size,\n        shape,\n        spacing\n    };\n};\n"],"names":["useSwatchPicker_unstable","props","ref","layout","onSelectionChange","size","shape","spacing","style","rest","isGrid","focusAttributes","useArrowNavigationGroup","circular","axis","memorizeCurrent","role","selectedValue","setSelectedValue","useControllableState","state","defaultState","defaultSelectedValue","initialState","requestSelectionChange","useEventCallback","event","data","type","selectedSwatch","components","root","slot","always","getIntrinsicElementProps","elementType"],"mappings":";;;;+BAWiBA;;;eAAAA;;;;iEAXM;gCACgE;8BAC/C;AAS7B,MAAMA,2BAA2B,CAACC,OAAOC;IAChD,MAAM,EAAEC,MAAM,EAAEC,iBAAiB,EAAEC,OAAO,QAAQ,EAAEC,KAAK,EAAEC,UAAU,QAAQ,EAAEC,KAAK,EAAE,GAAGC,MAAM,GAAGR;IAClG,MAAMS,SAASP,WAAW;IAC1B,MAAMQ,kBAAkBC,IAAAA,qCAAuB,EAAC;QAC5CC,UAAU;QACVC,MAAMJ,SAAS,gBAAgB;QAC/BK,iBAAiB;IACrB;IACA,MAAMC,OAAON,SAAS,SAAS;IAC/B,MAAM,CAACO,eAAeC,iBAAiB,GAAGC,IAAAA,oCAAoB,EAAC;QAC3DC,OAAOnB,MAAMgB,aAAa;QAC1BI,cAAcpB,MAAMqB,oBAAoB;QACxCC,cAAc;IAClB;IACA,MAAMC,yBAAyBC,IAAAA,gCAAgB,EAAC,CAACC,OAAOC;QACpDvB,sBAAsB,QAAQA,sBAAsB,KAAK,IAAI,KAAK,IAAIA,kBAAkBsB,OAAO;YAC3FE,MAAM;YACNF;YACAT,eAAeU,KAAKV,aAAa;YACjCY,gBAAgBF,KAAKE,cAAc;QACvC;QACAX,iBAAiBS,KAAKV,aAAa;IACvC;IACA,OAAO;QACHa,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,wCAAwB,EAAC,OAAO;YAC9ChC;YACAc;YACA,GAAGL,eAAe;YAClB,GAAGF,IAAI;QACX,IAAI;YACA0B,aAAa;QACjB;QACAzB;QACAc;QACAP;QACAZ;QACAC;QACAC;IACJ;AACJ"}
+{"version":3,"sources":["useSwatchPicker.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, useControllableState, useEventCallback, slot } from '@fluentui/react-utilities';\nimport type { SwatchPickerProps, SwatchPickerState } from './SwatchPicker.types';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\n\n/**\n * Create the state required to render SwatchPicker.\n *\n * The returned state can be modified with hooks such as useSwatchPickerStyles_unstable,\n * before being passed to renderSwatchPicker_unstable.\n *\n * @param props - props from this instance of SwatchPicker\n * @param ref - reference to root HTMLElement of SwatchPicker\n */\nexport const useSwatchPicker_unstable = (\n  props: SwatchPickerProps,\n  ref: React.Ref<HTMLDivElement>,\n): SwatchPickerState => {\n  const { layout, onSelectionChange, size = 'medium', shape, spacing = 'medium', style, ...rest } = props;\n\n  const isGrid = layout === 'grid';\n  const focusAttributes = useArrowNavigationGroup({\n    circular: true,\n    axis: isGrid ? 'grid-linear' : 'both',\n    memorizeCurrent: true,\n  });\n\n  const role = isGrid ? 'grid' : 'radiogroup';\n\n  const [selectedValue, setSelectedValue] = useControllableState({\n    state: props.selectedValue,\n    defaultState: props.defaultSelectedValue,\n    initialState: '',\n  });\n\n  const requestSelectionChange: SwatchPickerState['requestSelectionChange'] = useEventCallback((event, data) => {\n    onSelectionChange?.(event, {\n      type: 'click',\n      event,\n      selectedValue: data.selectedValue,\n      selectedSwatch: data.selectedSwatch,\n    });\n    setSelectedValue(data.selectedValue);\n  });\n\n  return {\n    components: {\n      root: 'div',\n    },\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        ref,\n        role,\n        ...focusAttributes,\n        ...rest,\n      }),\n      { elementType: 'div' },\n    ),\n    isGrid,\n    requestSelectionChange,\n    selectedValue,\n    size,\n    shape,\n    spacing,\n  };\n};\n"],"names":["useSwatchPicker_unstable","props","ref","layout","onSelectionChange","size","shape","spacing","style","rest","isGrid","focusAttributes","useArrowNavigationGroup","circular","axis","memorizeCurrent","role","selectedValue","setSelectedValue","useControllableState","state","defaultState","defaultSelectedValue","initialState","requestSelectionChange","useEventCallback","event","data","type","selectedSwatch","components","root","slot","always","getIntrinsicElementProps","elementType"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAcaA;;;eAAAA;;;;iEAdU;gCACgE;8BAE/C;AAWjC,MAAMA,2BAA2B,CACtCC,OACAC;IAEA,MAAM,EAAEC,MAAM,EAAEC,iBAAiB,EAAEC,OAAO,QAAQ,EAAEC,KAAK,EAAEC,UAAU,QAAQ,EAAEC,KAAK,EAAE,GAAGC,MAAM,GAAGR;IAElG,MAAMS,SAASP,WAAW;IAC1B,MAAMQ,kBAAkBC,IAAAA,qCAAAA,EAAwB;QAC9CC,UAAU;QACVC,MAAMJ,SAAS,gBAAgB;QAC/BK,iBAAiB;IACnB;IAEA,MAAMC,OAAON,SAAS,SAAS;IAE/B,MAAM,CAACO,eAAeC,iBAAiB,GAAGC,IAAAA,oCAAAA,EAAqB;QAC7DC,OAAOnB,MAAMgB,aAAa;QAC1BI,cAAcpB,MAAMqB,oBAAoB;QACxCC,cAAc;IAChB;IAEA,MAAMC,yBAAsEC,IAAAA,gCAAAA,EAAiB,CAACC,OAAOC;QACnGvB,sBAAAA,QAAAA,sBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,kBAAoBsB,OAAO;YACzBE,MAAM;YACNF;YACAT,eAAeU,KAAKV,aAAa;YACjCY,gBAAgBF,KAAKE,cAAc;QACrC;QACAX,iBAAiBS,KAAKV,aAAa;IACrC;IAEA,OAAO;QACLa,YAAY;YACVC,MAAM;QACR;QACAA,MAAMC,oBAAAA,CAAKC,MAAM,CACfC,IAAAA,wCAAAA,EAAyB,OAAO;YAC9BhC;YACAc;YACA,GAAGL,eAAe;YAClB,GAAGF,IAAI;QACT,IACA;YAAE0B,aAAa;QAAM;QAEvBzB;QACAc;QACAP;QACAZ;QACAC;QACAC;IACF;AACF"}

package/lib-commonjs/components/SwatchPicker/useSwatchPickerStyles.styles.js

@@ -73,6 +73,7 @@ const swatchPickerClassNames = {
     ]
 });
 const useSwatchPickerStyles_unstable = (state)=>{
+    'use no memo';
     const styles = useStyles();
     const layoutStyle = state.isGrid ? styles.grid : styles.row;
     const spacingStyle = state.spacing === 'small' ? styles.spacingSmall : styles.spacingMedium;

package/lib-commonjs/components/SwatchPicker/useSwatchPickerStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useSwatchPickerStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const swatchPickerClassNames = {\n  root: 'fui-SwatchPicker'\n};\n/**\n * Styles for the root slot\n */\nconst useStyles = /*#__PURE__*/__styles({\n  root: {\n    Byoj8tv: 0,\n    uwmqm3: 0,\n    z189sj: 0,\n    z8tnut: 0,\n    B0ocmuz: \"f14ufcw5\",\n    mc9l5x: \"f22iagw\"\n  },\n  row: {\n    Beiy3e4: \"f1063pyq\"\n  },\n  grid: {\n    Beiy3e4: \"f1vx9l62\"\n  },\n  spacingSmall: {\n    i8kkvl: 0,\n    Belr9w4: 0,\n    rmohyg: \"f1t6b6ee\"\n  },\n  spacingMedium: {\n    i8kkvl: 0,\n    Belr9w4: 0,\n    rmohyg: \"f4xv25i\"\n  }\n}, {\n  d: [[\".f14ufcw5{padding:var(--spacingHorizontalNone) var(--spacingVerticalNone);}\", {\n    p: -1\n  }], \".f22iagw{display:flex;}\", \".f1063pyq{flex-direction:row;}\", \".f1vx9l62{flex-direction:column;}\", [\".f1t6b6ee{gap:2px;}\", {\n    p: -1\n  }], [\".f4xv25i{gap:4px;}\", {\n    p: -1\n  }]]\n});\n/**\n * Apply styling to the SwatchPicker slots based on the state\n */\nexport const useSwatchPickerStyles_unstable = state => {\n  const styles = useStyles();\n  const layoutStyle = state.isGrid ? styles.grid : styles.row;\n  const spacingStyle = state.spacing === 'small' ? styles.spacingSmall : styles.spacingMedium;\n  state.root.className = mergeClasses(swatchPickerClassNames.root, styles.root, layoutStyle, spacingStyle, state.root.className);\n  return state;\n};\n//# sourceMappingURL=useSwatchPickerStyles.styles.js.map"],"names":["swatchPickerClassNames","useSwatchPickerStyles_unstable","root","useStyles","__styles","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","mc9l5x","row","Beiy3e4","grid","spacingSmall","i8kkvl","Belr9w4","rmohyg","spacingMedium","d","p","state","styles","layoutStyle","isGrid","spacingStyle","spacing","className","mergeClasses"],"mappings":";;;;;;;;;;;IAEaA,sBAAsB;eAAtBA;;IA2CAC,8BAA8B;eAA9BA;;;uBA7C0B;AAEhC,MAAMD,yBAAyB;IACpCE,MAAM;AACR;AACA;;CAEC,GACD,MAAMC,YAAY,WAAW,GAAEC,IAAAA,eAAQ,EAAC;IACtCF,MAAM;QACJG,SAAS;QACTC,QAAQ;QACRC,QAAQ;QACRC,QAAQ;QACRC,SAAS;QACTC,QAAQ;IACV;IACAC,KAAK;QACHC,SAAS;IACX;IACAC,MAAM;QACJD,SAAS;IACX;IACAE,cAAc;QACZC,QAAQ;QACRC,SAAS;QACTC,QAAQ;IACV;IACAC,eAAe;QACbH,QAAQ;QACRC,SAAS;QACTC,QAAQ;IACV;AACF,GAAG;IACDE,GAAG;QAAC;YAAC;YAA+E;gBAClFC,GAAG,CAAC;YACN;SAAE;QAAE;QAA2B;QAAkC;QAAqC;YAAC;YAAuB;gBAC5HA,GAAG,CAAC;YACN;SAAE;QAAE;YAAC;YAAsB;gBACzBA,GAAG,CAAC;YACN;SAAE;KAAC;AACL;AAIO,MAAMnB,iCAAiCoB,CAAAA;IAC5C,MAAMC,SAASnB;IACf,MAAMoB,cAAcF,MAAMG,MAAM,GAAGF,OAAOT,IAAI,GAAGS,OAAOX,GAAG;IAC3D,MAAMc,eAAeJ,MAAMK,OAAO,KAAK,UAAUJ,OAAOR,YAAY,GAAGQ,OAAOJ,aAAa;IAC3FG,MAAMnB,IAAI,CAACyB,SAAS,GAAGC,IAAAA,mBAAY,EAAC5B,uBAAuBE,IAAI,EAAEoB,OAAOpB,IAAI,EAAEqB,aAAaE,cAAcJ,MAAMnB,IAAI,CAACyB,SAAS;IAC7H,OAAON;AACT,GACA,wDAAwD"}
+{"version":3,"sources":["useSwatchPickerStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const swatchPickerClassNames = {\n    root: 'fui-SwatchPicker'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n    root: {\n        padding: `${tokens.spacingHorizontalNone} ${tokens.spacingVerticalNone}`,\n        display: 'flex'\n    },\n    row: {\n        flexDirection: 'row'\n    },\n    grid: {\n        flexDirection: 'column'\n    },\n    spacingSmall: {\n        gap: '2px'\n    },\n    spacingMedium: {\n        gap: '4px'\n    }\n});\n/**\n * Apply styling to the SwatchPicker slots based on the state\n */ export const useSwatchPickerStyles_unstable = (state)=>{\n    'use no memo';\n    const styles = useStyles();\n    const layoutStyle = state.isGrid ? styles.grid : styles.row;\n    const spacingStyle = state.spacing === 'small' ? styles.spacingSmall : styles.spacingMedium;\n    state.root.className = mergeClasses(swatchPickerClassNames.root, styles.root, layoutStyle, spacingStyle, state.root.className);\n    return state;\n};\n"],"names":["swatchPickerClassNames","useSwatchPickerStyles_unstable","root","useStyles","__styles","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","mc9l5x","row","Beiy3e4","grid","spacingSmall","i8kkvl","Belr9w4","rmohyg","spacingMedium","d","p","state","styles","layoutStyle","isGrid","spacingStyle","spacing","className","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAEaA,sBAAsB;eAAtBA;;IAyBIC,8BAA8B;eAA9BA;;;uBA3BwB;AAElC,MAAMD,yBAAyB;IAClCE,MAAM;AACV;AACA;;CAEA,GAAI,MAAMC,YAAS,WAAA,GAAGC,IAAAA,eAAA,EAAA;IAAAF,MAAA;QAAAG,SAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAC,SAAA;QAAAC,QAAA;IAAA;IAAAC,KAAA;QAAAC,SAAA;IAAA;IAAAC,MAAA;QAAAD,SAAA;IAAA;IAAAE,cAAA;QAAAC,QAAA;QAAAC,SAAA;QAAAC,QAAA;IAAA;IAAAC,eAAA;QAAAH,QAAA;QAAAC,SAAA;QAAAC,QAAA;IAAA;AAAA,GAAA;IAAAE,GAAA;QAAA;YAAA;YAAA;gBAAAC,GAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAA,GAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,GAAA,CAAA;YAAA;SAAA;KAAA;AAAA;AAoBX,MAAMnB,iCAAkCoB,CAAAA;IAC/C;IACA,MAAMC,SAASnB;IACf,MAAMoB,cAAcF,MAAMG,MAAM,GAAGF,OAAOT,IAAI,GAAGS,OAAOX,GAAG;IAC3D,MAAMc,eAAeJ,MAAMK,OAAO,KAAK,UAAUJ,OAAOR,YAAY,GAAGQ,OAAOJ,aAAa;IAC3FG,MAAMnB,IAAI,CAACyB,SAAS,GAAGC,IAAAA,mBAAY,EAAC5B,uBAAuBE,IAAI,EAAEoB,OAAOpB,IAAI,EAAEqB,aAAaE,cAAcJ,MAAMnB,IAAI,CAACyB,SAAS;IAC7H,OAAON;AACX"}

package/lib-commonjs/components/SwatchPickerRow/SwatchPickerRow.js.map

@@ -1 +1 @@
-{"version":3,"sources":["SwatchPickerRow.js"],"sourcesContent":["import * as React from 'react';\nimport { useSwatchPickerRow_unstable } from './useSwatchPickerRow';\nimport { renderSwatchPickerRow_unstable } from './renderSwatchPickerRow';\nimport { useSwatchPickerRowStyles_unstable } from './useSwatchPickerRowStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n/**\n * SwatchPickerRow component is used to render a row of swatches.\n */ export const SwatchPickerRow = /*#__PURE__*/ React.forwardRef((props, ref)=>{\n    const state = useSwatchPickerRow_unstable(props, ref);\n    useSwatchPickerRowStyles_unstable(state);\n    useCustomStyleHook_unstable('useSwatchPickerRowStyles_unstable')(state);\n    return renderSwatchPickerRow_unstable(state);\n});\nSwatchPickerRow.displayName = 'SwatchPickerRow';\n"],"names":["SwatchPickerRow","React","forwardRef","props","ref","state","useSwatchPickerRow_unstable","useSwatchPickerRowStyles_unstable","useCustomStyleHook_unstable","renderSwatchPickerRow_unstable","displayName"],"mappings":";;;;+BAOiBA;;;eAAAA;;;;iEAPM;oCACqB;uCACG;gDACG;qCACN;AAGjC,MAAMA,kBAAkB,WAAW,GAAGC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IACtE,MAAMC,QAAQC,IAAAA,+CAA2B,EAACH,OAAOC;IACjDG,IAAAA,iEAAiC,EAACF;IAClCG,IAAAA,gDAA2B,EAAC,qCAAqCH;IACjE,OAAOI,IAAAA,qDAA8B,EAACJ;AAC1C;AACAL,gBAAgBU,WAAW,GAAG"}
+{"version":3,"sources":["SwatchPickerRow.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useSwatchPickerRow_unstable } from './useSwatchPickerRow';\nimport { renderSwatchPickerRow_unstable } from './renderSwatchPickerRow';\nimport { useSwatchPickerRowStyles_unstable } from './useSwatchPickerRowStyles.styles';\nimport type { SwatchPickerRowProps } from './SwatchPickerRow.types';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * SwatchPickerRow component is used to render a row of swatches.\n */\nexport const SwatchPickerRow: ForwardRefComponent<SwatchPickerRowProps> = React.forwardRef((props, ref) => {\n  const state = useSwatchPickerRow_unstable(props, ref);\n\n  useSwatchPickerRowStyles_unstable(state);\n  useCustomStyleHook_unstable('useSwatchPickerRowStyles_unstable')(state);\n  return renderSwatchPickerRow_unstable(state);\n});\n\nSwatchPickerRow.displayName = 'SwatchPickerRow';\n"],"names":["SwatchPickerRow","React","forwardRef","props","ref","state","useSwatchPickerRow_unstable","useSwatchPickerRowStyles_unstable","useCustomStyleHook_unstable","renderSwatchPickerRow_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAWaA;;;eAAAA;;;;iEAXU;oCAEqB;uCACG;gDACG;qCAEN;AAKrC,MAAMA,kBAAAA,WAAAA,GAA6DC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IACjG,MAAMC,QAAQC,IAAAA,+CAAAA,EAA4BH,OAAOC;IAEjDG,IAAAA,iEAAAA,EAAkCF;IAClCG,IAAAA,gDAAAA,EAA4B,qCAAqCH;IACjE,OAAOI,IAAAA,qDAAAA,EAA+BJ;AACxC;AAEAL,gBAAgBU,WAAW,GAAG"}

package/lib-commonjs/components/SwatchPickerRow/SwatchPickerRow.types.js

@@ -1,4 +1,6 @@
-"use strict";
+/**
+ * State used in rendering SwatchPickerRow
+ */ "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
 });

package/lib-commonjs/components/SwatchPickerRow/SwatchPickerRow.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":""}
+{"version":3,"sources":["SwatchPickerRow.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { SwatchPickerProps } from '../SwatchPicker/SwatchPicker.types';\n\nexport type SwatchPickerRowSlots = {\n  root: Slot<'div'>;\n};\n\n/**\n * SwatchPickerRow Props\n */\nexport type SwatchPickerRowProps = ComponentProps<SwatchPickerRowSlots>;\n\n/**\n * State used in rendering SwatchPickerRow\n */\nexport type SwatchPickerRowState = ComponentState<SwatchPickerRowSlots> & Pick<SwatchPickerProps, 'spacing'>;\n"],"names":[],"rangeMappings":";;","mappings":"AAYA;;CAEC"}

package/lib-commonjs/components/SwatchPickerRow/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.js"],"sourcesContent":["export * from './SwatchPickerRow';\nexport * from './SwatchPickerRow.types';\nexport * from './renderSwatchPickerRow';\nexport * from './useSwatchPickerRow';\nexport * from './useSwatchPickerRowStyles.styles';\n"],"names":[],"mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './SwatchPickerRow';\nexport * from './SwatchPickerRow.types';\nexport * from './renderSwatchPickerRow';\nexport * from './useSwatchPickerRow';\nexport * from './useSwatchPickerRowStyles.styles';\n"],"names":[],"rangeMappings":";;;;;;;;;","mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA"}

package/lib-commonjs/components/SwatchPickerRow/renderSwatchPickerRow.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderSwatchPickerRow.js"],"sourcesContent":["  import { jsx as _jsx } from \"@fluentui/react-jsx-runtime/jsx-runtime\";\nimport { assertSlots } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of SwatchPickerRow\n */ export const renderSwatchPickerRow_unstable = (state)=>{\n    assertSlots(state);\n    return /*#__PURE__*/ _jsx(state.root, {});\n};\n"],"names":["renderSwatchPickerRow_unstable","state","assertSlots","_jsx","root"],"mappings":";;;;+BAIiBA;;;eAAAA;;;4BAJa;gCACF;AAGjB,MAAMA,iCAAiC,CAACC;IAC/CC,IAAAA,2BAAW,EAACD;IACZ,OAAO,WAAW,GAAGE,IAAAA,eAAI,EAACF,MAAMG,IAAI,EAAE,CAAC;AAC3C"}
+{"version":3,"sources":["renderSwatchPickerRow.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { SwatchPickerRowState, SwatchPickerRowSlots } from './SwatchPickerRow.types';\n\n/**\n * Render the final JSX of SwatchPickerRow\n */\nexport const renderSwatchPickerRow_unstable = (state: SwatchPickerRowState) => {\n  assertSlots<SwatchPickerRowSlots>(state);\n  return <state.root />;\n};\n"],"names":["renderSwatchPickerRow_unstable","state","assertSlots","_jsx","root"],"rangeMappings":";;;;;;;;;;;;;;;","mappings":";;;;+BASaA;;;eAAAA;;;4BARb;gCAE4B;AAMrB,MAAMA,iCAAiC,CAACC;IAC7CC,IAAAA,2BAAAA,EAAkCD;IAClC,OAAA,WAAA,GAAOE,IAAAA,eAAA,EAACF,MAAMG,IAAI,EAAA,CAAA;AACpB"}

package/lib-commonjs/components/SwatchPickerRow/useSwatchPickerRow.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useSwatchPickerRow.js"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { useSwatchPickerContextValue_unstable } from '../../contexts/swatchPicker';\n/**\n * Create the state required to render SwatchPickerRow.\n *\n * The returned state can be modified with hooks such as useSwatchPickerRowStyles_unstable,\n * before being passed to renderSwatchPickerRow_unstable.\n *\n * @param props - props from this instance of SwatchPickerRow\n * @param ref - reference to root HTMLDivElement of SwatchPickerRow\n */ export const useSwatchPickerRow_unstable = (props, ref)=>{\n    const { style, ...rest } = props;\n    const spacing = useSwatchPickerContextValue_unstable((ctx)=>ctx.spacing);\n    return {\n        components: {\n            root: 'div'\n        },\n        root: slot.always(getIntrinsicElementProps('div', {\n            ref,\n            role: 'row',\n            ...rest\n        }), {\n            elementType: 'div'\n        }),\n        spacing\n    };\n};\n"],"names":["useSwatchPickerRow_unstable","props","ref","style","rest","spacing","useSwatchPickerContextValue_unstable","ctx","components","root","slot","always","getIntrinsicElementProps","role","elementType"],"mappings":";;;;+BAWiBA;;;eAAAA;;;;iEAXM;gCACwB;8BACM;AAS1C,MAAMA,8BAA8B,CAACC,OAAOC;IACnD,MAAM,EAAEC,KAAK,EAAE,GAAGC,MAAM,GAAGH;IAC3B,MAAMI,UAAUC,IAAAA,kDAAoC,EAAC,CAACC,MAAMA,IAAIF,OAAO;IACvE,OAAO;QACHG,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,wCAAwB,EAAC,OAAO;YAC9CV;YACAW,MAAM;YACN,GAAGT,IAAI;QACX,IAAI;YACAU,aAAa;QACjB;QACAT;IACJ;AACJ"}
+{"version":3,"sources":["useSwatchPickerRow.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { SwatchPickerRowProps, SwatchPickerRowState } from './SwatchPickerRow.types';\nimport { useSwatchPickerContextValue_unstable } from '../../contexts/swatchPicker';\n\n/**\n * Create the state required to render SwatchPickerRow.\n *\n * The returned state can be modified with hooks such as useSwatchPickerRowStyles_unstable,\n * before being passed to renderSwatchPickerRow_unstable.\n *\n * @param props - props from this instance of SwatchPickerRow\n * @param ref - reference to root HTMLDivElement of SwatchPickerRow\n */\nexport const useSwatchPickerRow_unstable = (\n  props: SwatchPickerRowProps,\n  ref: React.Ref<HTMLDivElement>,\n): SwatchPickerRowState => {\n  const { style, ...rest } = props;\n  const spacing = useSwatchPickerContextValue_unstable(ctx => ctx.spacing);\n\n  return {\n    components: {\n      root: 'div',\n    },\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        ref,\n        role: 'row',\n        ...rest,\n      }),\n      { elementType: 'div' },\n    ),\n    spacing,\n  };\n};\n"],"names":["useSwatchPickerRow_unstable","props","ref","style","rest","spacing","useSwatchPickerContextValue_unstable","ctx","components","root","slot","always","getIntrinsicElementProps","role","elementType"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAcaA;;;eAAAA;;;;iEAdU;gCACwB;8BAEM;AAW9C,MAAMA,8BAA8B,CACzCC,OACAC;IAEA,MAAM,EAAEC,KAAK,EAAE,GAAGC,MAAM,GAAGH;IAC3B,MAAMI,UAAUC,IAAAA,kDAAAA,EAAqCC,CAAAA,MAAOA,IAAIF,OAAO;IAEvE,OAAO;QACLG,YAAY;YACVC,MAAM;QACR;QACAA,MAAMC,oBAAAA,CAAKC,MAAM,CACfC,IAAAA,wCAAAA,EAAyB,OAAO;YAC9BV;YACAW,MAAM;YACN,GAAGT,IAAI;QACT,IACA;YAAEU,aAAa;QAAM;QAEvBT;IACF;AACF"}

package/lib-commonjs/components/SwatchPickerRow/useSwatchPickerRowStyles.styles.js

@@ -39,6 +39,7 @@ const useStyles = /*#__PURE__*/ (0, _react.__styles)({
     ]
 });
 const useSwatchPickerRowStyles_unstable = (state)=>{
+    'use no memo';
     const resetStyles = useResetStyles();
     const styles = useStyles();
     const spacingStyle = state.spacing === 'small' ? styles.spacingSmall : styles.spacingMedium;

package/lib-commonjs/components/SwatchPickerRow/useSwatchPickerRowStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useSwatchPickerRowStyles.styles.js"],"sourcesContent":["import { __resetStyles, mergeClasses, __styles } from '@griffel/react';\nexport const swatchPickerRowClassNames = {\n  root: 'fui-SwatchPickerRow'\n};\n/**\n * Styles for the root slot\n */\nconst useResetStyles = /*#__PURE__*/__resetStyles(\"r1xhj18k\", null, [\".r1xhj18k{display:flex;flex-direction:row;}\"]);\nconst useStyles = /*#__PURE__*/__styles({\n  spacingSmall: {\n    i8kkvl: \"f16mnhsx\"\n  },\n  spacingMedium: {\n    i8kkvl: \"f1q8lukm\"\n  }\n}, {\n  d: [\".f16mnhsx{column-gap:2px;}\", \".f1q8lukm{column-gap:4px;}\"]\n});\n/**\n * Apply styling to the SwatchPickerRow slots based on the state\n */\nexport const useSwatchPickerRowStyles_unstable = state => {\n  const resetStyles = useResetStyles();\n  const styles = useStyles();\n  const spacingStyle = state.spacing === 'small' ? styles.spacingSmall : styles.spacingMedium;\n  state.root.className = mergeClasses(swatchPickerRowClassNames.root, resetStyles, spacingStyle, state.root.className);\n  return state;\n};\n//# sourceMappingURL=useSwatchPickerRowStyles.styles.js.map"],"names":["swatchPickerRowClassNames","useSwatchPickerRowStyles_unstable","root","useResetStyles","__resetStyles","useStyles","__styles","spacingSmall","i8kkvl","spacingMedium","d","state","resetStyles","styles","spacingStyle","spacing","className","mergeClasses"],"mappings":";;;;;;;;;;;IACaA,yBAAyB;eAAzBA;;IAoBAC,iCAAiC;eAAjCA;;;uBArByC;AAC/C,MAAMD,4BAA4B;IACvCE,MAAM;AACR;AACA;;CAEC,GACD,MAAMC,iBAAiB,WAAW,GAAEC,IAAAA,oBAAa,EAAC,YAAY,MAAM;IAAC;CAA8C;AACnH,MAAMC,YAAY,WAAW,GAAEC,IAAAA,eAAQ,EAAC;IACtCC,cAAc;QACZC,QAAQ;IACV;IACAC,eAAe;QACbD,QAAQ;IACV;AACF,GAAG;IACDE,GAAG;QAAC;QAA8B;KAA6B;AACjE;AAIO,MAAMT,oCAAoCU,CAAAA;IAC/C,MAAMC,cAAcT;IACpB,MAAMU,SAASR;IACf,MAAMS,eAAeH,MAAMI,OAAO,KAAK,UAAUF,OAAON,YAAY,GAAGM,OAAOJ,aAAa;IAC3FE,MAAMT,IAAI,CAACc,SAAS,GAAGC,IAAAA,mBAAY,EAACjB,0BAA0BE,IAAI,EAAEU,aAAaE,cAAcH,MAAMT,IAAI,CAACc,SAAS;IACnH,OAAOL;AACT,GACA,2DAA2D"}
+{"version":3,"sources":["useSwatchPickerRowStyles.styles.js"],"sourcesContent":["import { makeResetStyles, mergeClasses, makeStyles } from '@griffel/react';\nexport const swatchPickerRowClassNames = {\n    root: 'fui-SwatchPickerRow'\n};\n/**\n * Styles for the root slot\n */ const useResetStyles = makeResetStyles({\n    display: 'flex',\n    flexDirection: 'row'\n});\nconst useStyles = makeStyles({\n    spacingSmall: {\n        columnGap: '2px'\n    },\n    spacingMedium: {\n        columnGap: '4px'\n    }\n});\n/**\n * Apply styling to the SwatchPickerRow slots based on the state\n */ export const useSwatchPickerRowStyles_unstable = (state)=>{\n    'use no memo';\n    const resetStyles = useResetStyles();\n    const styles = useStyles();\n    const spacingStyle = state.spacing === 'small' ? styles.spacingSmall : styles.spacingMedium;\n    state.root.className = mergeClasses(swatchPickerRowClassNames.root, resetStyles, spacingStyle, state.root.className);\n    return state;\n};\n"],"names":["swatchPickerRowClassNames","useSwatchPickerRowStyles_unstable","root","useResetStyles","__resetStyles","useStyles","__styles","spacingSmall","i8kkvl","spacingMedium","d","state","resetStyles","styles","spacingStyle","spacing","className","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IACaA,yBAAyB;eAAzBA;;IAmBIC,iCAAiC;eAAjCA;;;uBApByC;AACnD,MAAMD,4BAA4B;IACrCE,MAAM;AACV;AACA;;CAEA,GAAI,MAAMC,iBAAc,WAAA,GAAGC,IAAAA,oBAAA,EAAA,YAAA,MAAA;IAAA;CAG1B;AACD,MAAMC,YAAS,WAAA,GAAGC,IAAAA,eAAA,EAAA;IAAAC,cAAA;QAAAC,QAAA;IAAA;IAAAC,eAAA;QAAAD,QAAA;IAAA;AAAA,GAAA;IAAAE,GAAA;QAAA;QAAA;KAAA;AAAA;AAUP,MAAMT,oCAAqCU,CAAAA;IAClD;IACA,MAAMC,cAAcT;IACpB,MAAMU,SAASR;IACf,MAAMS,eAAeH,MAAMI,OAAO,KAAK,UAAUF,OAAON,YAAY,GAAGM,OAAOJ,aAAa;IAC3FE,MAAMT,IAAI,CAACc,SAAS,GAAGC,IAAAA,mBAAY,EAACjB,0BAA0BE,IAAI,EAAEU,aAAaE,cAAcH,MAAMT,IAAI,CAACc,SAAS;IACnH,OAAOL;AACX"}

package/lib-commonjs/contexts/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.js"],"sourcesContent":["export * from './swatchPicker';\n"],"names":[],"mappings":";;;;;uBAAc"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './swatchPicker';\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;uBAAc"}

package/lib-commonjs/contexts/swatchPicker.js

@@ -9,17 +9,17 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    useSwatchPickerContextValues: function() {
-        return useSwatchPickerContextValues;
+    SwatchPickerProvider: function() {
+        return SwatchPickerProvider;
     },
     swatchPickerContextDefaultValue: function() {
         return swatchPickerContextDefaultValue;
     },
-    SwatchPickerProvider: function() {
-        return SwatchPickerProvider;
-    },
     useSwatchPickerContextValue_unstable: function() {
         return useSwatchPickerContextValue_unstable;
+    },
+    useSwatchPickerContextValues: function() {
+        return useSwatchPickerContextValues;
     }
 });
 const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");

package/lib-commonjs/contexts/swatchPicker.js.map

@@ -1 +1 @@
-{"version":3,"sources":["swatchPicker.js"],"sourcesContent":["import * as React from 'react';\nimport { createContext, useContextSelector } from '@fluentui/react-context-selector';\nexport const useSwatchPickerContextValues = (state)=>{\n    const { isGrid, size, shape, spacing, requestSelectionChange, selectedValue } = state;\n    // This context is created with \"@fluentui/react-context-selector\", these is no sense to memoize it\n    const swatchPicker = {\n        isGrid,\n        size,\n        shape,\n        spacing,\n        selectedValue,\n        requestSelectionChange\n    };\n    return {\n        swatchPicker\n    };\n};\nexport const swatchPickerContextDefaultValue = {\n    requestSelectionChange: ()=>{\n    /*noop*/ },\n    isGrid: false,\n    size: 'medium',\n    shape: 'square',\n    spacing: 'medium',\n    selectedValue: undefined\n};\nconst SwatchPickerContext = createContext(undefined);\nexport const SwatchPickerProvider = SwatchPickerContext.Provider;\nexport const useSwatchPickerContextValue_unstable = (selector)=>useContextSelector(SwatchPickerContext, (ctx = swatchPickerContextDefaultValue)=>selector(ctx));\n"],"names":["useSwatchPickerContextValues","swatchPickerContextDefaultValue","SwatchPickerProvider","useSwatchPickerContextValue_unstable","state","isGrid","size","shape","spacing","requestSelectionChange","selectedValue","swatchPicker","undefined","SwatchPickerContext","createContext","Provider","selector","useContextSelector","ctx"],"mappings":";;;;;;;;;;;IAEaA,4BAA4B;eAA5BA;;IAeAC,+BAA+B;eAA/BA;;IAUAC,oBAAoB;eAApBA;;IACAC,oCAAoC;eAApCA;;;;iEA5BU;sCAC2B;AAC3C,MAAMH,+BAA+B,CAACI;IACzC,MAAM,EAAEC,MAAM,EAAEC,IAAI,EAAEC,KAAK,EAAEC,OAAO,EAAEC,sBAAsB,EAAEC,aAAa,EAAE,GAAGN;IAChF,mGAAmG;IACnG,MAAMO,eAAe;QACjBN;QACAC;QACAC;QACAC;QACAE;QACAD;IACJ;IACA,OAAO;QACHE;IACJ;AACJ;AACO,MAAMV,kCAAkC;IAC3CQ,wBAAwB;IACxB,MAAM,GAAG;IACTJ,QAAQ;IACRC,MAAM;IACNC,OAAO;IACPC,SAAS;IACTE,eAAeE;AACnB;AACA,MAAMC,sBAAsBC,IAAAA,mCAAa,EAACF;AACnC,MAAMV,uBAAuBW,oBAAoBE,QAAQ;AACzD,MAAMZ,uCAAuC,CAACa,WAAWC,IAAAA,wCAAkB,EAACJ,qBAAqB,CAACK,MAAMjB,+BAA+B,GAAGe,SAASE"}
+{"version":3,"sources":["swatchPicker.ts"],"sourcesContent":["import * as React from 'react';\nimport { createContext, useContextSelector } from '@fluentui/react-context-selector';\nimport type { ContextSelector, Context } from '@fluentui/react-context-selector';\nimport type { SwatchPickerProps, SwatchPickerState } from '../components/SwatchPicker/SwatchPicker.types';\n\n/**\n * The context through which individual color controls communicate with the picker.\n */\nexport type SwatchPickerContextValue = Pick<SwatchPickerProps, 'size' | 'shape' | 'spacing' | 'selectedValue'> & {\n  /**\n   * Whether layout is grid.\n   */\n  isGrid: boolean;\n\n  /**\n   * @internal\n   * Callback used by ColorSwatch to request a change on it's selected state\n   * Should be used to select ColorSwatch\n   */\n  requestSelectionChange: (\n    event: React.MouseEvent<HTMLButtonElement>,\n    data: { selectedValue: string; selectedSwatch: string },\n  ) => void;\n};\n\nexport const useSwatchPickerContextValues = (state: SwatchPickerState): SwatchPickerContextValues => {\n  const { isGrid, size, shape, spacing, requestSelectionChange, selectedValue } = state;\n\n  // This context is created with \"@fluentui/react-context-selector\", these is no sense to memoize it\n  const swatchPicker: SwatchPickerContextValue = {\n    isGrid,\n    size,\n    shape,\n    spacing,\n    selectedValue,\n    requestSelectionChange,\n  };\n\n  return { swatchPicker };\n};\n\nexport const swatchPickerContextDefaultValue: SwatchPickerContextValue = {\n  requestSelectionChange: () => {\n    /*noop*/\n  },\n  isGrid: false,\n  size: 'medium',\n  shape: 'square',\n  spacing: 'medium',\n  selectedValue: undefined,\n};\n\nexport type SwatchPickerContextValues = {\n  swatchPicker: SwatchPickerContextValue;\n};\n\nconst SwatchPickerContext = createContext<SwatchPickerContextValue | undefined>(\n  undefined,\n) as Context<SwatchPickerContextValue>;\n\nexport const SwatchPickerProvider = SwatchPickerContext.Provider;\n\nexport const useSwatchPickerContextValue_unstable = <T>(selector: ContextSelector<SwatchPickerContextValue, T>): T =>\n  useContextSelector(SwatchPickerContext, (ctx = swatchPickerContextDefaultValue) => selector(ctx));\n"],"names":["SwatchPickerProvider","swatchPickerContextDefaultValue","useSwatchPickerContextValue_unstable","useSwatchPickerContextValues","state","isGrid","size","shape","spacing","requestSelectionChange","selectedValue","swatchPicker","undefined","SwatchPickerContext","createContext","Provider","selector","useContextSelector","ctx"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IA4DaA,oBAAAA;eAAAA;;IAnBAC,+BAAAA;eAAAA;;IAqBAC,oCAAAA;eAAAA;;IArCAC,4BAAAA;eAAAA;;;;iEAzBU;sCAC2B;AAwB3C,MAAMA,+BAA+B,CAACC;IAC3C,MAAM,EAAEC,MAAM,EAAEC,IAAI,EAAEC,KAAK,EAAEC,OAAO,EAAEC,sBAAsB,EAAEC,aAAa,EAAE,GAAGN;IAEhF,mGAAmG;IACnG,MAAMO,eAAyC;QAC7CN;QACAC;QACAC;QACAC;QACAE;QACAD;IACF;IAEA,OAAO;QAAEE;IAAa;AACxB;AAEO,MAAMV,kCAA4D;IACvEQ,wBAAwB;IACtB,MAAM,GACR;IACAJ,QAAQ;IACRC,MAAM;IACNC,OAAO;IACPC,SAAS;IACTE,eAAeE;AACjB;AAMA,MAAMC,sBAAsBC,IAAAA,mCAAAA,EAC1BF;AAGK,MAAMZ,uBAAuBa,oBAAoBE,QAAQ;AAEzD,MAAMb,uCAAuC,CAAIc,WACtDC,IAAAA,wCAAAA,EAAmBJ,qBAAqB,CAACK,MAAMjB,+BAA+B,GAAKe,SAASE"}

package/lib-commonjs/index.js

@@ -9,56 +9,74 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    SwatchPicker: function() {
-        return _SwatchPicker.SwatchPicker;
-    },
-    renderSwatchPicker_unstable: function() {
-        return _SwatchPicker.renderSwatchPicker_unstable;
+    ColorSwatch: function() {
+        return _ColorSwatch.ColorSwatch;
     },
-    useSwatchPickerStyles_unstable: function() {
-        return _SwatchPicker.useSwatchPickerStyles_unstable;
+    EmptySwatch: function() {
+        return _EmptySwatch.EmptySwatch;
     },
-    useSwatchPicker_unstable: function() {
-        return _SwatchPicker.useSwatchPicker_unstable;
+    ImageSwatch: function() {
+        return _ImageSwatch.ImageSwatch;
     },
-    swatchPickerClassNames: function() {
-        return _SwatchPicker.swatchPickerClassNames;
+    SwatchPicker: function() {
+        return _SwatchPicker.SwatchPicker;
     },
     SwatchPickerProvider: function() {
         return _contexts.SwatchPickerProvider;
     },
-    swatchPickerContextDefaultValue: function() {
-        return _contexts.swatchPickerContextDefaultValue;
+    SwatchPickerRow: function() {
+        return _SwatchPickerRow.SwatchPickerRow;
     },
-    useSwatchPickerContextValue_unstable: function() {
-        return _contexts.useSwatchPickerContextValue_unstable;
+    colorSwatchClassNames: function() {
+        return _ColorSwatch.colorSwatchClassNames;
     },
-    useSwatchPickerContextValues: function() {
-        return _contexts.useSwatchPickerContextValues;
+    emptySwatchClassNames: function() {
+        return _EmptySwatch.emptySwatchClassNames;
     },
-    ColorSwatch: function() {
-        return _ColorSwatch.ColorSwatch;
+    imageSwatchClassNames: function() {
+        return _ImageSwatch.imageSwatchClassNames;
     },
     renderColorSwatch_unstable: function() {
         return _ColorSwatch.renderColorSwatch_unstable;
     },
-    useColorSwatchStyles_unstable: function() {
-        return _ColorSwatch.useColorSwatchStyles_unstable;
+    renderEmptySwatch_unstable: function() {
+        return _EmptySwatch.renderEmptySwatch_unstable;
     },
-    useColorSwatch_unstable: function() {
-        return _ColorSwatch.useColorSwatch_unstable;
+    renderImageSwatch_unstable: function() {
+        return _ImageSwatch.renderImageSwatch_unstable;
     },
-    colorSwatchClassNames: function() {
-        return _ColorSwatch.colorSwatchClassNames;
+    renderSwatchPickerGrid: function() {
+        return _renderUtils.renderSwatchPickerGrid;
+    },
+    renderSwatchPickerRow_unstable: function() {
+        return _SwatchPickerRow.renderSwatchPickerRow_unstable;
+    },
+    renderSwatchPicker_unstable: function() {
+        return _SwatchPicker.renderSwatchPicker_unstable;
     },
     swatchCSSVars: function() {
         return _ColorSwatch.swatchCSSVars;
     },
-    ImageSwatch: function() {
-        return _ImageSwatch.ImageSwatch;
+    swatchPickerClassNames: function() {
+        return _SwatchPicker.swatchPickerClassNames;
     },
-    renderImageSwatch_unstable: function() {
-        return _ImageSwatch.renderImageSwatch_unstable;
+    swatchPickerContextDefaultValue: function() {
+        return _contexts.swatchPickerContextDefaultValue;
+    },
+    swatchPickerRowClassNames: function() {
+        return _SwatchPickerRow.swatchPickerRowClassNames;
+    },
+    useColorSwatchStyles_unstable: function() {
+        return _ColorSwatch.useColorSwatchStyles_unstable;
+    },
+    useColorSwatch_unstable: function() {
+        return _ColorSwatch.useColorSwatch_unstable;
+    },
+    useEmptySwatchStyles_unstable: function() {
+        return _EmptySwatch.useEmptySwatchStyles_unstable;
+    },
+    useEmptySwatch_unstable: function() {
+        return _EmptySwatch.useEmptySwatch_unstable;
     },
     useImageSwatchStyles_unstable: function() {
         return _ImageSwatch.useImageSwatchStyles_unstable;
@@ -66,14 +84,11 @@ _export(exports, {
     useImageSwatch_unstable: function() {
         return _ImageSwatch.useImageSwatch_unstable;
     },
-    imageSwatchClassNames: function() {
-        return _ImageSwatch.imageSwatchClassNames;
-    },
-    SwatchPickerRow: function() {
-        return _SwatchPickerRow.SwatchPickerRow;
+    useSwatchPickerContextValue_unstable: function() {
+        return _contexts.useSwatchPickerContextValue_unstable;
     },
-    renderSwatchPickerRow_unstable: function() {
-        return _SwatchPickerRow.renderSwatchPickerRow_unstable;
+    useSwatchPickerContextValues: function() {
+        return _contexts.useSwatchPickerContextValues;
     },
     useSwatchPickerRowStyles_unstable: function() {
         return _SwatchPickerRow.useSwatchPickerRowStyles_unstable;
@@ -81,26 +96,11 @@ _export(exports, {
     useSwatchPickerRow_unstable: function() {
         return _SwatchPickerRow.useSwatchPickerRow_unstable;
     },
-    swatchPickerRowClassNames: function() {
-        return _SwatchPickerRow.swatchPickerRowClassNames;
-    },
-    renderSwatchPickerGrid: function() {
-        return _renderUtils.renderSwatchPickerGrid;
-    },
-    EmptySwatch: function() {
-        return _EmptySwatch.EmptySwatch;
-    },
-    renderEmptySwatch_unstable: function() {
-        return _EmptySwatch.renderEmptySwatch_unstable;
-    },
-    useEmptySwatchStyles_unstable: function() {
-        return _EmptySwatch.useEmptySwatchStyles_unstable;
-    },
-    useEmptySwatch_unstable: function() {
-        return _EmptySwatch.useEmptySwatch_unstable;
+    useSwatchPickerStyles_unstable: function() {
+        return _SwatchPicker.useSwatchPickerStyles_unstable;
     },
-    emptySwatchClassNames: function() {
-        return _EmptySwatch.emptySwatchClassNames;
+    useSwatchPicker_unstable: function() {
+        return _SwatchPicker.useSwatchPicker_unstable;
     }
 });
 const _SwatchPicker = require("./SwatchPicker");

package/lib-commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.js"],"sourcesContent":["export { SwatchPicker, renderSwatchPicker_unstable, useSwatchPickerStyles_unstable, useSwatchPicker_unstable, swatchPickerClassNames } from './SwatchPicker';\nexport { SwatchPickerProvider, swatchPickerContextDefaultValue, useSwatchPickerContextValue_unstable, useSwatchPickerContextValues } from './contexts';\nexport { ColorSwatch, renderColorSwatch_unstable, useColorSwatchStyles_unstable, useColorSwatch_unstable, colorSwatchClassNames, swatchCSSVars } from './ColorSwatch';\nexport { ImageSwatch, renderImageSwatch_unstable, useImageSwatchStyles_unstable, useImageSwatch_unstable, imageSwatchClassNames } from './ImageSwatch';\nexport { SwatchPickerRow, renderSwatchPickerRow_unstable, useSwatchPickerRowStyles_unstable, useSwatchPickerRow_unstable, swatchPickerRowClassNames } from './SwatchPickerRow';\nexport { renderSwatchPickerGrid } from './utils/renderUtils';\nexport { EmptySwatch, renderEmptySwatch_unstable, useEmptySwatchStyles_unstable, useEmptySwatch_unstable, emptySwatchClassNames } from './EmptySwatch';\n"],"names":["SwatchPicker","renderSwatchPicker_unstable","useSwatchPickerStyles_unstable","useSwatchPicker_unstable","swatchPickerClassNames","SwatchPickerProvider","swatchPickerContextDefaultValue","useSwatchPickerContextValue_unstable","useSwatchPickerContextValues","ColorSwatch","renderColorSwatch_unstable","useColorSwatchStyles_unstable","useColorSwatch_unstable","colorSwatchClassNames","swatchCSSVars","ImageSwatch","renderImageSwatch_unstable","useImageSwatchStyles_unstable","useImageSwatch_unstable","imageSwatchClassNames","SwatchPickerRow","renderSwatchPickerRow_unstable","useSwatchPickerRowStyles_unstable","useSwatchPickerRow_unstable","swatchPickerRowClassNames","renderSwatchPickerGrid","EmptySwatch","renderEmptySwatch_unstable","useEmptySwatchStyles_unstable","useEmptySwatch_unstable","emptySwatchClassNames"],"mappings":";;;;;;;;;;;IAASA,YAAY;eAAZA,0BAAY;;IAAEC,2BAA2B;eAA3BA,yCAA2B;;IAAEC,8BAA8B;eAA9BA,4CAA8B;;IAAEC,wBAAwB;eAAxBA,sCAAwB;;IAAEC,sBAAsB;eAAtBA,oCAAsB;;IAC3HC,oBAAoB;eAApBA,8BAAoB;;IAAEC,+BAA+B;eAA/BA,yCAA+B;;IAAEC,oCAAoC;eAApCA,8CAAoC;;IAAEC,4BAA4B;eAA5BA,sCAA4B;;IACzHC,WAAW;eAAXA,wBAAW;;IAAEC,0BAA0B;eAA1BA,uCAA0B;;IAAEC,6BAA6B;eAA7BA,0CAA6B;;IAAEC,uBAAuB;eAAvBA,oCAAuB;;IAAEC,qBAAqB;eAArBA,kCAAqB;;IAAEC,aAAa;eAAbA,0BAAa;;IACrIC,WAAW;eAAXA,wBAAW;;IAAEC,0BAA0B;eAA1BA,uCAA0B;;IAAEC,6BAA6B;eAA7BA,0CAA6B;;IAAEC,uBAAuB;eAAvBA,oCAAuB;;IAAEC,qBAAqB;eAArBA,kCAAqB;;IACtHC,eAAe;eAAfA,gCAAe;;IAAEC,8BAA8B;eAA9BA,+CAA8B;;IAAEC,iCAAiC;eAAjCA,kDAAiC;;IAAEC,2BAA2B;eAA3BA,4CAA2B;;IAAEC,yBAAyB;eAAzBA,0CAAyB;;IAC1IC,sBAAsB;eAAtBA,mCAAsB;;IACtBC,WAAW;eAAXA,wBAAW;;IAAEC,0BAA0B;eAA1BA,uCAA0B;;IAAEC,6BAA6B;eAA7BA,0CAA6B;;IAAEC,uBAAuB;eAAvBA,oCAAuB;;IAAEC,qBAAqB;eAArBA,kCAAqB;;;8BANa;0BACF;6BACY;6BACf;iCACoB;6BACpH;6BACgG"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export {\n  SwatchPicker,\n  renderSwatchPicker_unstable,\n  useSwatchPickerStyles_unstable,\n  useSwatchPicker_unstable,\n  swatchPickerClassNames,\n} from './SwatchPicker';\nexport {\n  SwatchPickerProvider,\n  swatchPickerContextDefaultValue,\n  useSwatchPickerContextValue_unstable,\n  useSwatchPickerContextValues,\n} from './contexts';\nexport type { SwatchPickerContextValue, SwatchPickerContextValues } from './contexts';\nexport type {\n  SwatchPickerProps,\n  SwatchPickerSlots,\n  SwatchPickerState,\n  SwatchPickerOnSelectionChangeData,\n  SwatchPickerOnSelectEventHandler,\n} from './SwatchPicker';\nexport {\n  ColorSwatch,\n  renderColorSwatch_unstable,\n  useColorSwatchStyles_unstable,\n  useColorSwatch_unstable,\n  colorSwatchClassNames,\n  swatchCSSVars,\n} from './ColorSwatch';\nexport type { ColorSwatchProps, ColorSwatchSlots, ColorSwatchState } from './ColorSwatch';\nexport {\n  ImageSwatch,\n  renderImageSwatch_unstable,\n  useImageSwatchStyles_unstable,\n  useImageSwatch_unstable,\n  imageSwatchClassNames,\n} from './ImageSwatch';\nexport type { ImageSwatchProps, ImageSwatchSlots, ImageSwatchState } from './ImageSwatch';\nexport type { SwatchPickerRowProps, SwatchPickerRowSlots, SwatchPickerRowState } from './SwatchPickerRow';\nexport {\n  SwatchPickerRow,\n  renderSwatchPickerRow_unstable,\n  useSwatchPickerRowStyles_unstable,\n  useSwatchPickerRow_unstable,\n  swatchPickerRowClassNames,\n} from './SwatchPickerRow';\nexport { renderSwatchPickerGrid } from './utils/renderUtils';\nexport type { SwatchProps, SwatchPickerGridProps } from './utils/renderUtils';\nexport {\n  EmptySwatch,\n  renderEmptySwatch_unstable,\n  useEmptySwatchStyles_unstable,\n  useEmptySwatch_unstable,\n  emptySwatchClassNames,\n} from './EmptySwatch';\nexport type { EmptySwatchProps, EmptySwatchSlots, EmptySwatchState } from './EmptySwatch';\n"],"names":["ColorSwatch","EmptySwatch","ImageSwatch","SwatchPicker","SwatchPickerProvider","SwatchPickerRow","colorSwatchClassNames","emptySwatchClassNames","imageSwatchClassNames","renderColorSwatch_unstable","renderEmptySwatch_unstable","renderImageSwatch_unstable","renderSwatchPickerGrid","renderSwatchPickerRow_unstable","renderSwatchPicker_unstable","swatchCSSVars","swatchPickerClassNames","swatchPickerContextDefaultValue","swatchPickerRowClassNames","useColorSwatchStyles_unstable","useColorSwatch_unstable","useEmptySwatchStyles_unstable","useEmptySwatch_unstable","useImageSwatchStyles_unstable","useImageSwatch_unstable","useSwatchPickerContextValue_unstable","useSwatchPickerContextValues","useSwatchPickerRowStyles_unstable","useSwatchPickerRow_unstable","useSwatchPickerStyles_unstable","useSwatchPicker_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAsBEA,WAAW;eAAXA,wBAAW;;IA2BXC,WAAW;eAAXA,wBAAW;;IAlBXC,WAAW;eAAXA,wBAAW;;IA9BXC,YAAY;eAAZA,0BAAY;;IAOZC,oBAAoB;eAApBA,8BAAoB;;IAgCpBC,eAAe;eAAfA,gCAAe;;IAdfC,qBAAqB;eAArBA,kCAAqB;;IA2BrBC,qBAAqB;eAArBA,kCAAqB;;IAlBrBC,qBAAqB;eAArBA,kCAAqB;;IAZrBC,0BAA0B;eAA1BA,uCAA0B;;IA2B1BC,0BAA0B;eAA1BA,uCAA0B;;IAlB1BC,0BAA0B;eAA1BA,uCAA0B;;IAcnBC,sBAAsB;eAAtBA,mCAAsB;;IAL7BC,8BAA8B;eAA9BA,+CAA8B;;IAvC9BC,2BAA2B;eAA3BA,yCAA2B;;IAyB3BC,aAAa;eAAbA,0BAAa;;IAtBbC,sBAAsB;eAAtBA,oCAAsB;;IAItBC,+BAA+B;eAA/BA,yCAA+B;;IAmC/BC,yBAAyB;eAAzBA,0CAAyB;;IApBzBC,6BAA6B;eAA7BA,0CAA6B;;IAC7BC,uBAAuB;eAAvBA,oCAAuB;;IA0BvBC,6BAA6B;eAA7BA,0CAA6B;;IAC7BC,uBAAuB;eAAvBA,oCAAuB;;IAnBvBC,6BAA6B;eAA7BA,0CAA6B;;IAC7BC,uBAAuB;eAAvBA,oCAAuB;;IAxBvBC,oCAAoC;eAApCA,8CAAoC;;IACpCC,4BAA4B;eAA5BA,sCAA4B;;IA+B5BC,iCAAiC;eAAjCA,kDAAiC;;IACjCC,2BAA2B;eAA3BA,4CAA2B;;IAxC3BC,8BAA8B;eAA9BA,4CAA8B;;IAC9BC,wBAAwB;eAAxBA,sCAAwB;;;8BAEnB;0BAMA;6BAgBA;6BAQA;iCASA;6BACgC;6BAQhC"}