{
  "version": 3,
  "sources": ["../src/highlighted-colors.tsx"],
  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __unstableMotion as motion } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { useStylesPreviewColors } from './preview-hooks';\n\ninterface HighlightedColorsProps {\n\tnormalizedColorSwatchSize: number;\n\tratio: number;\n}\n\nexport default function HighlightedColors( {\n\tnormalizedColorSwatchSize,\n\tratio,\n}: HighlightedColorsProps ) {\n\tconst { highlightedColors } = useStylesPreviewColors();\n\tconst scaledSwatchSize = normalizedColorSwatchSize * ratio;\n\treturn highlightedColors.map( ( { slug, color }, index ) => (\n\t\t<motion.div\n\t\t\tkey={ `${ slug }-${ index }` }\n\t\t\tstyle={ {\n\t\t\t\theight: scaledSwatchSize,\n\t\t\t\twidth: scaledSwatchSize,\n\t\t\t\tbackground: color,\n\t\t\t\tborderRadius: scaledSwatchSize / 2,\n\t\t\t} }\n\t\t\tanimate={ {\n\t\t\t\tscale: 1,\n\t\t\t\topacity: 1,\n\t\t\t} }\n\t\t\tinitial={ {\n\t\t\t\tscale: 0.1,\n\t\t\t\topacity: 0,\n\t\t\t} }\n\t\t\ttransition={ {\n\t\t\t\tdelay: index === 1 ? 0.2 : 0.1,\n\t\t\t} }\n\t\t/>\n\t) );\n}\n"],
  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,wBAA2C;AAK3C,2BAAuC;AAcrC;AAPa,SAAR,kBAAoC;AAAA,EAC1C;AAAA,EACA;AACD,GAA4B;AAC3B,QAAM,EAAE,kBAAkB,QAAI,6CAAuB;AACrD,QAAM,mBAAmB,4BAA4B;AACrD,SAAO,kBAAkB,IAAK,CAAE,EAAE,MAAM,MAAM,GAAG,UAChD;AAAA,IAAC,kBAAAA,iBAAO;AAAA,IAAP;AAAA,MAEA,OAAQ;AAAA,QACP,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,YAAY;AAAA,QACZ,cAAc,mBAAmB;AAAA,MAClC;AAAA,MACA,SAAU;AAAA,QACT,OAAO;AAAA,QACP,SAAS;AAAA,MACV;AAAA,MACA,SAAU;AAAA,QACT,OAAO;AAAA,QACP,SAAS;AAAA,MACV;AAAA,MACA,YAAa;AAAA,QACZ,OAAO,UAAU,IAAI,MAAM;AAAA,MAC5B;AAAA;AAAA,IAjBM,GAAI,IAAK,IAAK,KAAM;AAAA,EAkB3B,CACC;AACH;",
  "names": ["motion"]
}
