{"version":3,"file":"index.mjs","names":[],"sources":["../../src/BarList/index.tsx"],"sourcesContent":["'use client';\n\nimport { A, Flexbox } from '@lobehub/ui';\nimport { Skeleton } from '@lobehub/ui/base-ui';\nimport { cssVar, cx } from 'antd-style';\nimport React, { HTMLAttributes, ReactNode, forwardRef, useMemo } from 'react';\n\nimport NoData, { NoDataProps } from '@/common/NoData';\nimport { ValueFormatter } from '@/types/charts';\nimport { defaultValueFormatter } from '@/utils';\n\nimport { styles } from './styles';\n\nexport interface Bar {\n  [key: string]: any;\n  color?: string;\n  href?: string;\n  icon?: ReactNode;\n  key?: string;\n  name: ReactNode;\n  target?: string;\n  value: number;\n}\n\nexport interface BarListProps extends HTMLAttributes<HTMLDivElement> {\n  color?: string;\n  data: Bar[];\n  height?: string | number;\n  leftLabel?: ReactNode;\n  loading?: boolean;\n  noDataText?: NoDataProps['noDataText'];\n  onValueChange?: (payload: Bar) => void;\n  rightLabel?: ReactNode;\n  showAnimation?: boolean;\n  sortOrder?: 'ascending' | 'descending' | 'none';\n  valueFormatter?: ValueFormatter;\n  width?: string | number;\n}\n\nconst prefixCls = 'ant';\n\nconst BarList = forwardRef<HTMLDivElement, BarListProps>((props, ref) => {\n  const {\n    data = [],\n    color = cssVar.colorTextQuaternary,\n    valueFormatter = defaultValueFormatter,\n    showAnimation = false,\n    onValueChange,\n    sortOrder = 'descending',\n    className,\n    leftLabel,\n    rightLabel,\n    style,\n    loading,\n    width = '100%',\n    height,\n    noDataText,\n    ...rest\n  } = props;\n\n  const sortedData = useMemo(() => {\n    if (sortOrder === 'none') {\n      return data;\n    }\n    return [...data].sort((a, b) => {\n      return sortOrder === 'ascending' ? a.value - b.value : b.value - a.value;\n    });\n  }, [data, sortOrder]);\n\n  const widths = useMemo(() => {\n    const maxValue = Math.max(...sortedData.map((item) => item.value), 0);\n    return sortedData.map((item) =>\n      item.value === 0 ? 0 : Math.max((item.value / maxValue) * 100, 2),\n    );\n  }, [sortedData]);\n\n  if (loading || !data) return <Skeleton height={height} width={width} />;\n\n  const rowHeight = 32;\n  const labelHeight = 20;\n\n  return (\n    <Flexbox\n      aria-sort={sortOrder}\n      className={className}\n      gap={24}\n      horizontal\n      justify={'space-between'}\n      ref={ref}\n      style={{ minHeight: height, position: 'relative', ...style }}\n      width={width}\n      {...rest}\n    >\n      <Flexbox flex={1} gap={8} style={{ overflow: 'hidden', position: 'relative' }}>\n        {(leftLabel || rightLabel) && (\n          <Flexbox className={cx(styles.label, styles.emphasis)} height={labelHeight} width=\"100%\">\n            {leftLabel}\n          </Flexbox>\n        )}\n        {sortedData.map((item, index) => {\n          return (\n            <Flexbox\n              align={'center'}\n              className={cx(styles.barContainer, onValueChange && styles.barHover)}\n              height={rowHeight}\n              horizontal\n              key={item.key ?? index}\n              onClick={() => {\n                onValueChange?.(item);\n              }}\n              style={{\n                cursor: onValueChange ? 'pointer' : 'default',\n              }}\n              width={'100%'}\n            >\n              <div\n                className={cx(`${prefixCls}-chart-bar-item`, styles.bar)}\n                style={{\n                  background: item.color ?? color,\n                  transition: showAnimation ? undefined : 'none',\n                  width: `${widths[index]}%`,\n                  zIndex: 0,\n                }}\n              />\n              <Flexbox\n                align={'center'}\n                gap={8}\n                horizontal\n                paddingInline={8}\n                style={{ overflow: 'hidden', position: 'relative', width: '100%', zIndex: 1 }}\n              >\n                {item.icon}\n                {item.href ? (\n                  <A\n                    className={cx(styles.sourceALabel, styles.emphasis)}\n                    href={item.href}\n                    onClick={(event) => event.stopPropagation()}\n                    target={item.target}\n                  >\n                    {item.name}\n                  </A>\n                ) : (\n                  <div className={cx(styles.sourceLabel, styles.emphasis)}>{item.name}</div>\n                )}\n              </Flexbox>\n            </Flexbox>\n          );\n        })}\n        {!data?.length && <NoData noDataText={noDataText} />}\n      </Flexbox>\n      <Flexbox gap={8}>\n        {(leftLabel || rightLabel) && (\n          <Flexbox\n            className={cx(styles.label, styles.emphasis)}\n            height={labelHeight}\n            style={{ textAlign: 'right' }}\n            width=\"100%\"\n          >\n            {rightLabel}\n          </Flexbox>\n        )}\n        {sortedData.map((item, index) => (\n          <Flexbox\n            align={'center'}\n            height={rowHeight}\n            horizontal\n            justify={'flex-end'}\n            key={item.key ?? index}\n          >\n            <div className={cx(styles.strongLabel, styles.emphasis)}>\n              {valueFormatter(item.value)}\n            </div>\n          </Flexbox>\n        ))}\n      </Flexbox>\n    </Flexbox>\n  );\n});\n\nBarList.displayName = 'BarList';\n\nexport default BarList;\n"],"mappings":";;;;;;;;;;AAuCA,MAAM,YAAY;AAElB,MAAM,UAAU,YAA0C,OAAO,QAAQ;CACvE,MAAM,EACJ,OAAO,CAAC,GACR,QAAQ,OAAO,qBACf,iBAAiB,uBACjB,gBAAgB,OAChB,eACA,YAAY,cACZ,WACA,WACA,YACA,OACA,SACA,QAAQ,QACR,QACA,YACA,GAAG,SACD;CAEJ,MAAM,aAAa,cAAc;EAC/B,IAAI,cAAc,QAChB,OAAO;EAET,OAAO,CAAC,GAAG,IAAI,CAAC,CAAC,MAAM,GAAG,MAAM;GAC9B,OAAO,cAAc,cAAc,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE;EACrE,CAAC;CACH,GAAG,CAAC,MAAM,SAAS,CAAC;CAEpB,MAAM,SAAS,cAAc;EAC3B,MAAM,WAAW,KAAK,IAAI,GAAG,WAAW,KAAK,SAAS,KAAK,KAAK,GAAG,CAAC;EACpE,OAAO,WAAW,KAAK,SACrB,KAAK,UAAU,IAAI,IAAI,KAAK,IAAK,KAAK,QAAQ,WAAY,KAAK,CAAC,CAClE;CACF,GAAG,CAAC,UAAU,CAAC;CAEf,IAAI,WAAW,CAAC,MAAM,OAAO,oBAAC,UAAD;EAAkB;EAAe;CAAQ,CAAA;CAEtE,MAAM,YAAY;CAClB,MAAM,cAAc;CAEpB,OACE,qBAAC,SAAD;EACE,aAAW;EACA;EACX,KAAK;EACL,YAAA;EACA,SAAS;EACJ;EACL,OAAO;GAAE,WAAW;GAAQ,UAAU;GAAY,GAAG;EAAM;EACpD;EACP,GAAI;EATN,UAAA,CAWE,qBAAC,SAAD;GAAS,MAAM;GAAG,KAAK;GAAG,OAAO;IAAE,UAAU;IAAU,UAAU;GAAW;GAA5E,UAAA;KACI,aAAa,eACb,oBAAC,SAAD;KAAS,WAAW,GAAG,OAAO,OAAO,OAAO,QAAQ;KAAG,QAAQ;KAAa,OAAM;KAC/E,UAAA;IACM,CAAA;IAEV,WAAW,KAAK,MAAM,UAAU;KAC/B,OACE,qBAAC,SAAD;MACE,OAAO;MACP,WAAW,GAAG,OAAO,cAAc,iBAAiB,OAAO,QAAQ;MACnE,QAAQ;MACR,YAAA;MAEA,eAAe;OACb,gBAAgB,IAAI;MACtB;MACA,OAAO,EACL,QAAQ,gBAAgB,YAAY,UACtC;MACA,OAAO;MAZT,UAAA,CAcE,oBAAC,OAAD;OACE,WAAW,GAAG,GAAG,UAAU,kBAAkB,OAAO,GAAG;OACvD,OAAO;QACL,YAAY,KAAK,SAAS;QAC1B,YAAY,gBAAgB,KAAA,IAAY;QACxC,OAAO,GAAG,OAAO,OAAO;QACxB,QAAQ;OACV;MACD,CAAA,GACD,qBAAC,SAAD;OACE,OAAO;OACP,KAAK;OACL,YAAA;OACA,eAAe;OACf,OAAO;QAAE,UAAU;QAAU,UAAU;QAAY,OAAO;QAAQ,QAAQ;OAAE;OAL9E,UAAA,CAOG,KAAK,MACL,KAAK,OACJ,oBAAC,GAAD;QACE,WAAW,GAAG,OAAO,cAAc,OAAO,QAAQ;QAClD,MAAM,KAAK;QACX,UAAU,UAAU,MAAM,gBAAgB;QAC1C,QAAQ,KAAK;QAEZ,UAAA,KAAK;OACL,CAAA,IAEH,oBAAC,OAAD;QAAK,WAAW,GAAG,OAAO,aAAa,OAAO,QAAQ;QAAI,UAAA,KAAK;OAAU,CAAA,CAEpE;MACF,CAAA,CAAA;KAvCF,GAAA,KAAK,OAAO,KAuCV;IAEb,CAAC;IACA,CAAC,MAAM,UAAU,oBAAC,QAAD,EAAoB,WAAa,CAAA;GAC5C;EACT,CAAA,GAAA,qBAAC,SAAD;GAAS,KAAK;GAAd,UAAA,EACI,aAAa,eACb,oBAAC,SAAD;IACE,WAAW,GAAG,OAAO,OAAO,OAAO,QAAQ;IAC3C,QAAQ;IACR,OAAO,EAAE,WAAW,QAAQ;IAC5B,OAAM;IAEL,UAAA;GACM,CAAA,GAEV,WAAW,KAAK,MAAM,UACrB,oBAAC,SAAD;IACE,OAAO;IACP,QAAQ;IACR,YAAA;IACA,SAAS;IAGT,UAAA,oBAAC,OAAD;KAAK,WAAW,GAAG,OAAO,aAAa,OAAO,QAAQ;KACnD,UAAA,eAAe,KAAK,KAAK;IACvB,CAAA;GACE,GALF,KAAK,OAAO,KAKV,CACV,CACM;EACF,CAAA,CAAA;;AAEb,CAAC;AAED,QAAQ,cAAc"}