{"version":3,"file":"index.mjs","names":["ReChartsBarChart","Tooltip"],"sources":["../../src/BarChart/index.tsx"],"sourcesContent":["'use client';\n\nimport { Flexbox, Skeleton, css, cssVar, cx } from '@lobehub/ui';\nimport { MouseEvent, forwardRef, useMemo, useState } from 'react';\nimport {\n  Bar,\n  CartesianGrid,\n  Label,\n  Legend,\n  BarChart as ReChartsBarChart,\n  ResponsiveContainer,\n  Tooltip,\n  XAxis,\n  YAxis,\n} from 'recharts';\nimport { AxisDomain } from 'recharts/types/util/types';\n\nimport BaseChartProps from '@/common/BaseChartProps';\nimport ChartLegend from '@/common/ChartLegend';\nimport ChartTooltip from '@/common/ChartTooltip';\nimport CustomYAxisTick from '@/common/CustomYAxisTick';\nimport NoData from '@/common/NoData';\nimport { constructCategoryColors, deepEqual, getYAxisDomain } from '@/common/utils';\nimport { useThemeColorRange } from '@/hooks/useThemeColorRange';\nimport { defaultValueFormatter } from '@/utils';\nimport { getMaxLabelLength } from '@/utils/getMaxLabelLength';\n\nimport { styles } from './styles';\n\nexport interface BarChartProps extends BaseChartProps {\n  barCategoryGap?: string | number;\n  layout?: 'vertical' | 'horizontal';\n  stack?: boolean;\n}\n\nconst BarChart = forwardRef<HTMLDivElement, BarChartProps>((props, ref) => {\n  const themeColorRange = useThemeColorRange();\n  const {\n    data = [],\n    categories = [],\n    customCategories,\n    index,\n    yAxisAlign = 'left',\n    colors = themeColorRange,\n    valueFormatter = defaultValueFormatter,\n    xAxisLabelFormatter = defaultValueFormatter,\n    layout = 'horizontal',\n    stack = false,\n    startEndOnly = false,\n    animationDuration = 900,\n    showAnimation = false,\n    showXAxis = true,\n    showYAxis = true,\n    yAxisWidth,\n    intervalType = 'equidistantPreserveStart',\n    showTooltip = true,\n    showLegend = true,\n    showGridLines = true,\n    autoMinValue = false,\n    minValue,\n    maxValue,\n    allowDecimals = true,\n    noDataText,\n    onValueChange,\n    enableLegendSlider = false,\n    customTooltip,\n    rotateLabelX,\n    barCategoryGap,\n    tickGap = 5,\n    loading,\n    xAxisLabel,\n    yAxisLabel,\n    yAxisDomain: yAxisDomainOverride,\n    className,\n    width = '100%',\n    height = 280,\n    style,\n    ...rest\n  } = props;\n\n  const [activeBar, setActiveBar] = useState<any | undefined>();\n  const [activeLegend, setActiveLegend] = useState<string | undefined>();\n  const [legendHeight, setLegendHeight] = useState(60);\n  const calculatedYAxisWidth: number | string = useMemo(() => {\n    if (yAxisWidth) return yAxisWidth;\n    return getMaxLabelLength({ data, index, layout, valueFormatter });\n  }, [yAxisWidth, layout, data, valueFormatter, index]);\n\n  if (loading || !data) return <Skeleton height={height} width={width} />;\n\n  const CustomTooltip = customTooltip;\n  const paddingValue = !showXAxis && !showYAxis ? 0 : 20;\n  const categoryColors = constructCategoryColors(categories, colors);\n  const hasOnValueChange = !!onValueChange;\n\n  const onBarClick = (data: any, idx: number, event: MouseEvent) => {\n    event.stopPropagation();\n    if (!onValueChange) return;\n    if (deepEqual(activeBar, { ...data.payload, value: data.value })) {\n      setActiveLegend(undefined);\n      setActiveBar(undefined);\n      onValueChange?.(null);\n    } else {\n      setActiveLegend(data.tooltipPayload?.[0]?.dataKey);\n      setActiveBar({\n        ...data.payload,\n        value: data.value,\n      });\n      onValueChange?.({\n        categoryClicked: data.tooltipPayload?.[0]?.dataKey,\n        eventType: 'bar',\n        ...data.payload,\n      });\n    }\n  };\n\n  const onCategoryClick = (dataKey: string) => {\n    if (!hasOnValueChange) return;\n    if (dataKey === activeLegend && !activeBar) {\n      setActiveLegend(undefined);\n      onValueChange?.(null);\n    } else {\n      setActiveLegend(dataKey);\n      onValueChange?.({\n        categoryClicked: dataKey,\n        eventType: 'category',\n      });\n    }\n    setActiveBar(undefined);\n  };\n\n  const yAxisDomain = (yAxisDomainOverride ??\n    getYAxisDomain(autoMinValue, minValue, maxValue)) as AxisDomain;\n\n  return (\n    <Flexbox\n      className={className}\n      height={height}\n      ref={ref}\n      style={{ position: 'relative', ...style }}\n      width={width}\n      {...rest}\n    >\n      <ResponsiveContainer>\n        {data?.length ? (\n          <ReChartsBarChart\n            barCategoryGap={barCategoryGap}\n            data={data}\n            layout={layout === 'vertical' ? 'vertical' : 'horizontal'}\n            margin={{\n              bottom: xAxisLabel ? 30 : undefined,\n              left: yAxisLabel ? 20 : undefined,\n              right: yAxisLabel ? 5 : undefined,\n              top: 5,\n            }}\n            onClick={\n              hasOnValueChange && (activeLegend || activeBar)\n                ? () => {\n                    setActiveBar(undefined);\n                    setActiveLegend(undefined);\n                    onValueChange?.(null);\n                  }\n                : undefined\n            }\n            stackOffset={stack ? 'sign' : 'none'}\n          >\n            {showGridLines ? (\n              <CartesianGrid\n                className={styles.gridLines}\n                horizontal={layout !== 'vertical'}\n                vertical={layout === 'vertical'}\n              />\n            ) : undefined}\n\n            {layout === 'vertical' ? (\n              <XAxis\n                allowDecimals={allowDecimals}\n                angle={rotateLabelX?.angle}\n                axisLine={false}\n                className={styles.label}\n                domain={yAxisDomain as AxisDomain}\n                dy={rotateLabelX?.verticalShift}\n                fill=\"\"\n                hide={!showXAxis}\n                minTickGap={tickGap}\n                stroke=\"\"\n                tick={{ transform: 'translate(-3, 0)' }}\n                tickFormatter={valueFormatter}\n                tickLine={false}\n                type=\"number\"\n              >\n                {xAxisLabel && (\n                  <Label\n                    className={cx(styles.strongLabel, styles.emphasis)}\n                    offset={-20}\n                    position=\"insideBottom\"\n                    style={{\n                      fill: cssVar.colorTextSecondary,\n                      fontWeight: 500,\n                      textAnchor: 'middle',\n                    }}\n                  >\n                    {xAxisLabel}\n                  </Label>\n                )}\n              </XAxis>\n            ) : (\n              <XAxis\n                angle={rotateLabelX?.angle}\n                axisLine={false}\n                className={styles.label}\n                dataKey={index}\n                dy={rotateLabelX?.verticalShift}\n                fill=\"\"\n                hide={!showXAxis}\n                interval={startEndOnly ? 'preserveStartEnd' : intervalType}\n                minTickGap={tickGap}\n                padding={{ left: paddingValue, right: paddingValue }}\n                stroke=\"\"\n                tick={{ transform: 'translate(0, 6)' }}\n                tickFormatter={xAxisLabelFormatter}\n                tickLine={false}\n                ticks={startEndOnly ? [data[0][index], data.at(-1)[index]] : undefined}\n              >\n                {xAxisLabel && (\n                  <Label\n                    className={cx(styles.strongLabel, styles.emphasis)}\n                    offset={-20}\n                    position=\"insideBottom\"\n                    style={{\n                      fill: cssVar.colorTextSecondary,\n                      fontWeight: 500,\n                      textAnchor: 'middle',\n                    }}\n                  >\n                    {xAxisLabel}\n                  </Label>\n                )}\n              </XAxis>\n            )}\n            {layout === 'vertical' ? (\n              <YAxis\n                axisLine={false}\n                className={styles.label}\n                dataKey={index}\n                fill=\"\"\n                hide={!showYAxis}\n                interval=\"preserveStartEnd\"\n                stroke=\"\"\n                tick={(props) => (\n                  <CustomYAxisTick\n                    {...props}\n                    align={yAxisAlign}\n                    formatter={xAxisLabelFormatter}\n                    textAnchor={yAxisAlign === 'left' ? 'start' : 'end'}\n                    yAxisLabel={Boolean(yAxisLabel)}\n                  />\n                )}\n                tickFormatter={xAxisLabelFormatter}\n                tickLine={false}\n                ticks={startEndOnly ? [data[0][index], data.at(-1)[index]] : undefined}\n                type=\"category\"\n                width={calculatedYAxisWidth}\n              >\n                {yAxisLabel && (\n                  <Label\n                    angle={-90}\n                    className={styles.emphasis}\n                    offset={-15}\n                    position=\"insideLeft\"\n                    style={{\n                      fill: cssVar.colorTextSecondary,\n                      fontWeight: 500,\n                      textAnchor: 'middle',\n                    }}\n                  >\n                    {yAxisLabel}\n                  </Label>\n                )}\n              </YAxis>\n            ) : (\n              <YAxis\n                allowDecimals={allowDecimals}\n                axisLine={false}\n                className={styles.label}\n                domain={yAxisDomain as AxisDomain}\n                fill=\"\"\n                hide={!showYAxis}\n                stroke=\"\"\n                tick={(props) => (\n                  <CustomYAxisTick\n                    {...props}\n                    align={yAxisAlign}\n                    formatter={valueFormatter}\n                    textAnchor={yAxisAlign === 'left' ? 'start' : 'end'}\n                    yAxisLabel={Boolean(yAxisLabel)}\n                  />\n                )}\n                tickFormatter={valueFormatter}\n                tickLine={false}\n                type=\"number\"\n                width={calculatedYAxisWidth}\n              >\n                {yAxisLabel && (\n                  <Label\n                    angle={-90}\n                    className={styles.emphasis}\n                    offset={-15}\n                    position=\"insideLeft\"\n                    style={{\n                      fill: cssVar.colorTextSecondary,\n                      fontWeight: 500,\n                      textAnchor: 'middle',\n                    }}\n                  >\n                    {yAxisLabel}\n                  </Label>\n                )}\n              </YAxis>\n            )}\n            <Tooltip\n              content={\n                showTooltip\n                  ? ({ active, payload, label }) =>\n                      CustomTooltip ? (\n                        <CustomTooltip\n                          active={active}\n                          customCategories={customCategories}\n                          label={label}\n                          payload={(stack ? payload?.reverse() : payload)?.map(\n                            (payloadItem: any) => ({\n                              ...payloadItem,\n                              color: categoryColors.get(payloadItem.dataKey) ?? cssVar.colorPrimary,\n                            }),\n                          )}\n                          valueFormatter={valueFormatter}\n                        />\n                      ) : (\n                        <ChartTooltip\n                          active={active}\n                          categoryColors={categoryColors}\n                          customCategories={customCategories}\n                          label={label}\n                          payload={stack ? payload?.reverse() : payload}\n                          valueFormatter={valueFormatter}\n                        />\n                      )\n                  : undefined\n              }\n              cursor={{ fill: cssVar.colorFillTertiary }}\n              isAnimationActive={false}\n              position={{ y: 0 }}\n              wrapperStyle={{ outline: 'none' }}\n            />\n            {showLegend ? (\n              <Legend\n                content={({ payload }) =>\n                  ChartLegend(\n                    { payload },\n                    categoryColors,\n                    setLegendHeight,\n                    activeLegend,\n                    hasOnValueChange\n                      ? (clickedLegendItem: string) => onCategoryClick(clickedLegendItem)\n                      : undefined,\n                    enableLegendSlider,\n                    customCategories,\n                  )\n                }\n                height={legendHeight}\n                verticalAlign=\"top\"\n              />\n            ) : undefined}\n            {categories.map((category) => {\n              return (\n                <Bar\n                  animationDuration={animationDuration}\n                  className={cx(css`\n                    fill: ${categoryColors.get(category) ?? cssVar.colorPrimary};\n                  `)}\n                  dataKey={category}\n                  fill={''}\n                  isAnimationActive={showAnimation}\n                  key={category}\n                  name={category}\n                  onClick={onBarClick}\n                  stackId={stack ? 'a' : undefined}\n                  style={{\n                    cursor: onValueChange ? 'pointer' : undefined,\n                  }}\n                  type=\"linear\"\n                />\n              );\n            })}\n          </ReChartsBarChart>\n        ) : (\n          <NoData noDataText={noDataText} />\n        )}\n      </ResponsiveContainer>\n    </Flexbox>\n  );\n});\n\nBarChart.displayName = 'BarChart';\n\nexport default BarChart;\n"],"mappings":";;;;;;;;;;;;;;;AAmCA,MAAM,WAAW,YAA2C,OAAO,QAAQ;CACzE,MAAM,kBAAkB,mBAAmB;CAC3C,MAAM,EACJ,OAAO,CAAC,GACR,aAAa,CAAC,GACd,kBACA,OACA,aAAa,QACb,SAAS,iBACT,iBAAiB,uBACjB,sBAAsB,uBACtB,SAAS,cACT,QAAQ,OACR,eAAe,OACf,oBAAoB,KACpB,gBAAgB,OAChB,YAAY,MACZ,YAAY,MACZ,YACA,eAAe,4BACf,cAAc,MACd,aAAa,MACb,gBAAgB,MAChB,eAAe,OACf,UACA,UACA,gBAAgB,MAChB,YACA,eACA,qBAAqB,OACrB,eACA,cACA,gBACA,UAAU,GACV,SACA,YACA,YACA,aAAa,qBACb,WACA,QAAQ,QACR,SAAS,KACT,OACA,GAAG,SACD;CAEJ,MAAM,CAAC,WAAW,gBAAgB,SAA0B;CAC5D,MAAM,CAAC,cAAc,mBAAmB,SAA6B;CACrE,MAAM,CAAC,cAAc,mBAAmB,SAAS,EAAE;CACnD,MAAM,uBAAwC,cAAc;EAC1D,IAAI,YAAY,OAAO;EACvB,OAAO,kBAAkB;GAAE;GAAM;GAAO;GAAQ;EAAe,CAAC;CAClE,GAAG;EAAC;EAAY;EAAQ;EAAM;EAAgB;CAAK,CAAC;CAEpD,IAAI,WAAW,CAAC,MAAM,OAAO,oBAAC,UAAD;EAAkB;EAAe;CAAQ,CAAA;CAEtE,MAAM,gBAAgB;CACtB,MAAM,eAAe,CAAC,aAAa,CAAC,YAAY,IAAI;CACpD,MAAM,iBAAiB,wBAAwB,YAAY,MAAM;CACjE,MAAM,mBAAmB,CAAC,CAAC;CAE3B,MAAM,cAAc,MAAW,KAAa,UAAsB;EAChE,MAAM,gBAAgB;EACtB,IAAI,CAAC,eAAe;EACpB,IAAI,UAAU,WAAW;GAAE,GAAG,KAAK;GAAS,OAAO,KAAK;EAAM,CAAC,GAAG;GAChE,gBAAgB,KAAA,CAAS;GACzB,aAAa,KAAA,CAAS;GACtB,gBAAgB,IAAI;EACtB,OAAO;GACL,gBAAgB,KAAK,iBAAiB,EAAE,EAAE,OAAO;GACjD,aAAa;IACX,GAAG,KAAK;IACR,OAAO,KAAK;GACd,CAAC;GACD,gBAAgB;IACd,iBAAiB,KAAK,iBAAiB,EAAE,EAAE;IAC3C,WAAW;IACX,GAAG,KAAK;GACV,CAAC;EACH;CACF;CAEA,MAAM,mBAAmB,YAAoB;EAC3C,IAAI,CAAC,kBAAkB;EACvB,IAAI,YAAY,gBAAgB,CAAC,WAAW;GAC1C,gBAAgB,KAAA,CAAS;GACzB,gBAAgB,IAAI;EACtB,OAAO;GACL,gBAAgB,OAAO;GACvB,gBAAgB;IACd,iBAAiB;IACjB,WAAW;GACb,CAAC;EACH;EACA,aAAa,KAAA,CAAS;CACxB;CAEA,MAAM,cAAe,uBACnB,eAAe,cAAc,UAAU,QAAQ;CAEjD,OACE,oBAAC,SAAD;EACa;EACH;EACH;EACL,OAAO;GAAE,UAAU;GAAY,GAAG;EAAM;EACjC;EACP,GAAI;EAEJ,UAAA,oBAAC,qBAAD,EAAA,UACG,MAAM,SACL,qBAACA,YAAD;GACkB;GACV;GACN,QAAQ,WAAW,aAAa,aAAa;GAC7C,QAAQ;IACN,QAAQ,aAAa,KAAK,KAAA;IAC1B,MAAM,aAAa,KAAK,KAAA;IACxB,OAAO,aAAa,IAAI,KAAA;IACxB,KAAK;GACP;GACA,SACE,qBAAqB,gBAAgB,mBAC3B;IACJ,aAAa,KAAA,CAAS;IACtB,gBAAgB,KAAA,CAAS;IACzB,gBAAgB,IAAI;GACtB,IACA,KAAA;GAEN,aAAa,QAAQ,SAAS;GAnBhC,UAAA;IAqBG,gBACC,oBAAC,eAAD;KACE,WAAW,OAAO;KAClB,YAAY,WAAW;KACvB,UAAU,WAAW;IACtB,CAAA,IACC,KAAA;IAEH,WAAW,aACV,oBAAC,OAAD;KACiB;KACf,OAAO,cAAc;KACrB,UAAU;KACV,WAAW,OAAO;KAClB,QAAQ;KACR,IAAI,cAAc;KAClB,MAAK;KACL,MAAM,CAAC;KACP,YAAY;KACZ,QAAO;KACP,MAAM,EAAE,WAAW,mBAAmB;KACtC,eAAe;KACf,UAAU;KACV,MAAK;KAEJ,UAAA,cACC,oBAAC,OAAD;MACE,WAAW,GAAG,OAAO,aAAa,OAAO,QAAQ;MACjD,QAAQ;MACR,UAAS;MACT,OAAO;OACL,MAAM,OAAO;OACb,YAAY;OACZ,YAAY;MACd;MAEC,UAAA;KACI,CAAA;IAEJ,CAAA,IAEP,oBAAC,OAAD;KACE,OAAO,cAAc;KACrB,UAAU;KACV,WAAW,OAAO;KAClB,SAAS;KACT,IAAI,cAAc;KAClB,MAAK;KACL,MAAM,CAAC;KACP,UAAU,eAAe,qBAAqB;KAC9C,YAAY;KACZ,SAAS;MAAE,MAAM;MAAc,OAAO;KAAa;KACnD,QAAO;KACP,MAAM,EAAE,WAAW,kBAAkB;KACrC,eAAe;KACf,UAAU;KACV,OAAO,eAAe,CAAC,KAAK,EAAE,CAAC,QAAQ,KAAK,GAAG,EAAE,CAAC,CAAC,MAAM,IAAI,KAAA;KAE5D,UAAA,cACC,oBAAC,OAAD;MACE,WAAW,GAAG,OAAO,aAAa,OAAO,QAAQ;MACjD,QAAQ;MACR,UAAS;MACT,OAAO;OACL,MAAM,OAAO;OACb,YAAY;OACZ,YAAY;MACd;MAEC,UAAA;KACI,CAAA;IAEJ,CAAA;IAER,WAAW,aACV,oBAAC,OAAD;KACE,UAAU;KACV,WAAW,OAAO;KAClB,SAAS;KACT,MAAK;KACL,MAAM,CAAC;KACP,UAAS;KACT,QAAO;KACP,OAAO,UACL,oBAAC,iBAAD;MACE,GAAI;MACJ,OAAO;MACP,WAAW;MACX,YAAY,eAAe,SAAS,UAAU;MAC9C,YAAY,QAAQ,UAAU;KAC/B,CAAA;KAEH,eAAe;KACf,UAAU;KACV,OAAO,eAAe,CAAC,KAAK,EAAE,CAAC,QAAQ,KAAK,GAAG,EAAE,CAAC,CAAC,MAAM,IAAI,KAAA;KAC7D,MAAK;KACL,OAAO;KAEN,UAAA,cACC,oBAAC,OAAD;MACE,OAAO;MACP,WAAW,OAAO;MAClB,QAAQ;MACR,UAAS;MACT,OAAO;OACL,MAAM,OAAO;OACb,YAAY;OACZ,YAAY;MACd;MAEC,UAAA;KACI,CAAA;IAEJ,CAAA,IAEP,oBAAC,OAAD;KACiB;KACf,UAAU;KACV,WAAW,OAAO;KAClB,QAAQ;KACR,MAAK;KACL,MAAM,CAAC;KACP,QAAO;KACP,OAAO,UACL,oBAAC,iBAAD;MACE,GAAI;MACJ,OAAO;MACP,WAAW;MACX,YAAY,eAAe,SAAS,UAAU;MAC9C,YAAY,QAAQ,UAAU;KAC/B,CAAA;KAEH,eAAe;KACf,UAAU;KACV,MAAK;KACL,OAAO;KAEN,UAAA,cACC,oBAAC,OAAD;MACE,OAAO;MACP,WAAW,OAAO;MAClB,QAAQ;MACR,UAAS;MACT,OAAO;OACL,MAAM,OAAO;OACb,YAAY;OACZ,YAAY;MACd;MAEC,UAAA;KACI,CAAA;IAEJ,CAAA;IAET,oBAACC,WAAD;KACE,SACE,eACK,EAAE,QAAQ,SAAS,YAClB,gBACE,oBAAC,eAAD;MACU;MACU;MACX;MACP,UAAU,QAAQ,SAAS,QAAQ,IAAI,QAAA,EAAU,KAC9C,iBAAsB;OACrB,GAAG;OACH,OAAO,eAAe,IAAI,YAAY,OAAO,KAAK,OAAO;MAC3D,EACF;MACgB;KACjB,CAAA,IAED,oBAAC,cAAD;MACU;MACQ;MACE;MACX;MACP,SAAS,QAAQ,SAAS,QAAQ,IAAI;MACtB;KACjB,CAAA,IAEL,KAAA;KAEN,QAAQ,EAAE,MAAM,OAAO,kBAAkB;KACzC,mBAAmB;KACnB,UAAU,EAAE,GAAG,EAAE;KACjB,cAAc,EAAE,SAAS,OAAO;IACjC,CAAA;IACA,aACC,oBAAC,QAAD;KACE,UAAU,EAAE,cACV,YACE,EAAE,QAAQ,GACV,gBACA,iBACA,cACA,oBACK,sBAA8B,gBAAgB,iBAAiB,IAChE,KAAA,GACJ,oBACA,gBACF;KAEF,QAAQ;KACR,eAAc;IACf,CAAA,IACC,KAAA;IACH,WAAW,KAAK,aAAa;KAC5B,OACE,oBAAC,KAAD;MACqB;MACnB,WAAW,GAAG,GAAG;4BACP,eAAe,IAAI,QAAQ,KAAK,OAAO,aAAa;mBAC7D;MACD,SAAS;MACT,MAAM;MACN,mBAAmB;MAEnB,MAAM;MACN,SAAS;MACT,SAAS,QAAQ,MAAM,KAAA;MACvB,OAAO,EACL,QAAQ,gBAAgB,YAAY,KAAA,EACtC;MACA,MAAK;KACN,GARM,QAQN;IAEL,CAAC;GACe;EAElB,CAAA,IAAA,oBAAC,QAAD,EAAoB,WAAa,CAAA,EAEhB,CAAA;CACd,CAAA;AAEb,CAAC;AAED,SAAS,cAAc"}