@grafana/ui/dist/esm/components/ColorPicker/NamedColorsPalette.mjs.map

Grafana Components Library

{"version":3,"file":"NamedColorsPalette.mjs","sources":["../../../../src/components/ColorPicker/NamedColorsPalette.tsx"],"sourcesContent":["import { css } from '@emotion/css';\n\nimport { GrafanaTheme2 } from '@grafana/data';\n\nimport { useStyles2, useTheme2 } from '../../themes/ThemeContext';\nimport { t } from '../../utils/i18n';\n\nimport { ColorSwatch } from './ColorSwatch';\nimport NamedColorsGroup from './NamedColorsGroup';\n\nexport interface NamedColorsPaletteProps {\n  color?: string;\n  onChange: (colorName: string) => void;\n}\n\nexport const NamedColorsPalette = ({ color, onChange }: NamedColorsPaletteProps) => {\n  const theme = useTheme2();\n  const styles = useStyles2(getStyles);\n\n  const swatches: JSX.Element[] = [];\n  for (const hue of theme.visualization.hues) {\n    swatches.push(<NamedColorsGroup key={hue.name} selectedColor={color} hue={hue} onColorSelect={onChange} />);\n  }\n\n  return (\n    <>\n      <div className={styles.swatches}>{swatches}</div>\n      <div className={styles.extraColors}>\n        <ColorSwatch\n          isSelected={color === 'transparent'}\n          color={'rgba(0,0,0,0)'}\n          label={t('grafana-ui.named-colors-palette.transparent-swatch', 'Transparent')}\n          onClick={() => onChange('transparent')}\n        />\n        <ColorSwatch\n          isSelected={color === 'text'}\n          color={theme.colors.text.primary}\n          label={t('grafana-ui.named-colors-palette.text-color-swatch', 'Text color')}\n          onClick={() => onChange('text')}\n        />\n      </div>\n    </>\n  );\n};\n\nconst getStyles = (theme: GrafanaTheme2) => {\n  return {\n    container: css({\n      display: 'flex',\n      flexDirection: 'column',\n    }),\n    extraColors: css({\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'space-around',\n      gap: theme.spacing(1),\n      padding: theme.spacing(1, 0),\n    }),\n    swatches: css({\n      display: 'grid',\n      flexGrow: 1,\n    }),\n  };\n};\n"],"names":[],"mappings":";;;;;;;AAeO,MAAM,kBAAqB,GAAA,CAAC,EAAE,KAAA,EAAO,UAAwC,KAAA;AAClF,EAAA,MAAM,QAAQ,SAAU,EAAA;AACxB,EAAM,MAAA,MAAA,GAAS,WAAW,SAAS,CAAA;AAEnC,EAAA,MAAM,WAA0B,EAAC;AACjC,EAAW,KAAA,MAAA,GAAA,IAAO,KAAM,CAAA,aAAA,CAAc,IAAM,EAAA;AAC1C,IAAS,QAAA,CAAA,IAAA,iBAAM,GAAA,CAAA,gBAAA,EAAA,EAAgC,aAAe,EAAA,KAAA,EAAO,KAAU,aAAe,EAAA,QAAA,EAAA,EAAzD,GAAI,CAAA,IAA+D,CAAE,CAAA;AAAA;AAG5G,EAAA,uBAEI,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,MAAO,CAAA,QAAA,EAAW,QAAS,EAAA,QAAA,EAAA,CAAA;AAAA,oBAC1C,IAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,MAAA,CAAO,WACrB,EAAA,QAAA,EAAA;AAAA,sBAAA,GAAA;AAAA,QAAC,WAAA;AAAA,QAAA;AAAA,UACC,YAAY,KAAU,KAAA,aAAA;AAAA,UACtB,KAAO,EAAA,eAAA;AAAA,UACP,KAAA,EAAO,CAAE,CAAA,oDAAA,EAAsD,aAAa,CAAA;AAAA,UAC5E,OAAA,EAAS,MAAM,QAAA,CAAS,aAAa;AAAA;AAAA,OACvC;AAAA,sBACA,GAAA;AAAA,QAAC,WAAA;AAAA,QAAA;AAAA,UACC,YAAY,KAAU,KAAA,MAAA;AAAA,UACtB,KAAA,EAAO,KAAM,CAAA,MAAA,CAAO,IAAK,CAAA,OAAA;AAAA,UACzB,KAAA,EAAO,CAAE,CAAA,mDAAA,EAAqD,YAAY,CAAA;AAAA,UAC1E,OAAA,EAAS,MAAM,QAAA,CAAS,MAAM;AAAA;AAAA;AAChC,KACF,EAAA;AAAA,GACF,EAAA,CAAA;AAEJ;AAEA,MAAM,SAAA,GAAY,CAAC,KAAyB,KAAA;AAC1C,EAAO,OAAA;AAAA,IACL,WAAW,GAAI,CAAA;AAAA,MACb,OAAS,EAAA,MAAA;AAAA,MACT,aAAe,EAAA;AAAA,KAChB,CAAA;AAAA,IACD,aAAa,GAAI,CAAA;AAAA,MACf,OAAS,EAAA,MAAA;AAAA,MACT,UAAY,EAAA,QAAA;AAAA,MACZ,cAAgB,EAAA,cAAA;AAAA,MAChB,GAAA,EAAK,KAAM,CAAA,OAAA,CAAQ,CAAC,CAAA;AAAA,MACpB,OAAS,EAAA,KAAA,CAAM,OAAQ,CAAA,CAAA,EAAG,CAAC;AAAA,KAC5B,CAAA;AAAA,IACD,UAAU,GAAI,CAAA;AAAA,MACZ,OAAS,EAAA,MAAA;AAAA,MACT,QAAU,EAAA;AAAA,KACX;AAAA,GACH;AACF,CAAA;;;;"}