{
  "version": 3,
  "sources": ["../src/color-preview.tsx"],
  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __experimentalHStack as HStack } from '@wordpress/components';\nimport { useContext } from '@wordpress/element';\nimport { getStyle } from '@wordpress/global-styles-engine';\nimport type { Color } from '@wordpress/global-styles-engine';\n\n/**\n * Internal dependencies\n */\nimport { GlobalStylesContext } from './context';\n\nexport function ColorPreview() {\n\tconst { merged } = useContext( GlobalStylesContext );\n\n\t// Extract main colors from the global styles\n\tconst backgroundColor = getStyle( merged, 'color.background' ) || '#ffffff';\n\tconst textColor = getStyle( merged, 'color.text' ) || '#000000';\n\n\t// Get color palette - handle both array and object formats\n\tconst palette = merged?.settings?.color?.palette;\n\tlet paletteColors: Color[] = [];\n\n\tif ( Array.isArray( palette ) ) {\n\t\tpaletteColors = palette;\n\t} else if ( palette && typeof palette === 'object' ) {\n\t\tpaletteColors = palette.theme || palette.custom || [];\n\t}\n\n\t// Get first few colors from palette for preview\n\tconst previewColors = paletteColors.slice( 0, 4 );\n\n\treturn (\n\t\t<HStack\n\t\t\tspacing={ 0 }\n\t\t\tjustify=\"center\"\n\t\t\tstyle={ {\n\t\t\t\theight: '100%',\n\t\t\t\toverflow: 'hidden',\n\t\t\t\tminHeight: '40px',\n\t\t\t} }\n\t\t>\n\t\t\t{ /* Background color swatch */ }\n\t\t\t<div\n\t\t\t\tstyle={ {\n\t\t\t\t\tbackgroundColor,\n\t\t\t\t\twidth: '25%',\n\t\t\t\t\theight: '100%',\n\t\t\t\t\tminHeight: '40px',\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t{ /* Text color swatch */ }\n\t\t\t<div\n\t\t\t\tstyle={ {\n\t\t\t\t\tbackgroundColor: textColor,\n\t\t\t\t\twidth: '25%',\n\t\t\t\t\theight: '100%',\n\t\t\t\t\tminHeight: '40px',\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t{ /* Palette colors */ }\n\t\t\t{ previewColors\n\t\t\t\t.slice( 0, 2 )\n\t\t\t\t.map( ( color: Color, index: number ) => (\n\t\t\t\t\t<div\n\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\tbackgroundColor: color.color,\n\t\t\t\t\t\t\twidth: '25%',\n\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\tminHeight: '40px',\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t) ) }\n\t\t</HStack>\n\t);\n}\n"],
  "mappings": ";AAGA,SAAS,wBAAwB,cAAc;AAC/C,SAAS,kBAAkB;AAC3B,SAAS,gBAAgB;AAMzB,SAAS,2BAA2B;AAuBlC,SAUC,KAVD;AArBK,SAAS,eAAe;AAC9B,QAAM,EAAE,OAAO,IAAI,WAAY,mBAAoB;AAGnD,QAAM,kBAAkB,SAAU,QAAQ,kBAAmB,KAAK;AAClE,QAAM,YAAY,SAAU,QAAQ,YAAa,KAAK;AAGtD,QAAM,UAAU,QAAQ,UAAU,OAAO;AACzC,MAAI,gBAAyB,CAAC;AAE9B,MAAK,MAAM,QAAS,OAAQ,GAAI;AAC/B,oBAAgB;AAAA,EACjB,WAAY,WAAW,OAAO,YAAY,UAAW;AACpD,oBAAgB,QAAQ,SAAS,QAAQ,UAAU,CAAC;AAAA,EACrD;AAGA,QAAM,gBAAgB,cAAc,MAAO,GAAG,CAAE;AAEhD,SACC;AAAA,IAAC;AAAA;AAAA,MACA,SAAU;AAAA,MACV,SAAQ;AAAA,MACR,OAAQ;AAAA,QACP,QAAQ;AAAA,QACR,UAAU;AAAA,QACV,WAAW;AAAA,MACZ;AAAA,MAGA;AAAA;AAAA,UAAC;AAAA;AAAA,YACA,OAAQ;AAAA,cACP;AAAA,cACA,OAAO;AAAA,cACP,QAAQ;AAAA,cACR,WAAW;AAAA,YACZ;AAAA;AAAA,QACD;AAAA,QAEA;AAAA,UAAC;AAAA;AAAA,YACA,OAAQ;AAAA,cACP,iBAAiB;AAAA,cACjB,OAAO;AAAA,cACP,QAAQ;AAAA,cACR,WAAW;AAAA,YACZ;AAAA;AAAA,QACD;AAAA,QAEE,cACA,MAAO,GAAG,CAAE,EACZ,IAAK,CAAE,OAAc,UACrB;AAAA,UAAC;AAAA;AAAA,YAEA,OAAQ;AAAA,cACP,iBAAiB,MAAM;AAAA,cACvB,OAAO;AAAA,cACP,QAAQ;AAAA,cACR,WAAW;AAAA,YACZ;AAAA;AAAA,UANM;AAAA,QAOP,CACC;AAAA;AAAA;AAAA,EACJ;AAEF;",
  "names": []
}