@dappworks/kit 0.4.122 → 0.4.124
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/aiem.d.mts +629 -0
- package/dist/aiem.mjs +3 -0
- package/dist/aiem.mjs.map +1 -1
- package/dist/form.d.mts +1 -0
- package/dist/form.mjs +75 -16
- package/dist/form.mjs.map +1 -1
- package/dist/metrics.mjs +1 -1
- package/dist/metrics.mjs.map +1 -1
- package/package.json +1 -1
package/dist/metrics.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../components/JSONMetricsView/index.tsx","../components/JSONMetricsView/BarChartCard/index.tsx","../components/JSONMetricsView/ChartBox/index.tsx","../components/JSONMetricsView/LineChartCard/index.tsx","../components/JSONMetricsView/AreaChartCard/index.tsx","../components/JSONMetricsView/DonutChartCard/index.tsx","../components/JSONMetricsView/CountCard/index.tsx","../components/JSONMetricsView/TableCard/index.tsx","../components/JSONMetricsView/KPICard/index.tsx"],"names":["React","AreaChart","LineChart"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Col, Grid } from '@tremor/react';\nimport { BarChartCard } from './BarChartCard';\nimport { LineChartCard } from './LineChartCard';\nimport { AreaChartCard } from './AreaChartCard';\nimport { DonutChartCard } from './DonutChartCard';\nimport { CountCard } from './CountCard';\nimport { TableCard } from './TableCard';\nimport { KPICard } from './KPICard';\n\nexport type JSONMetricsViewType = AreaChartCard | LineChartCard | BarChartCard | DonutChartCard | CountCard | TableCard | KPICard;\n\nconst components = {\n AreaChartCard,\n LineChartCard,\n BarChartCard,\n DonutChartCard,\n CountCard,\n TableCard,\n KPICard,\n};\n\nconst JSONMetricsView = ({ data }: { data: JSONMetricsViewType[] }) => {\n return (\n <Grid numItems={1} numItemsSm={1} numItemsLg={2} numItemsMd={2} className=\"gap-2\">\n {data.map((item, index) => {\n const Component = components[item.type];\n return (\n <Col key={index} numColSpanSm={1} numColSpanMd={item.numColSpanMd ?? 1}>\n {/* @ts-ignore */}\n <Component {...item} />\n </Col>\n );\n })}\n </Grid>\n );\n};\n\nexport const MetricsView = ({ data }: { data: JSONMetricsViewType }) => {\n const Comp = components[data.type];\n // @ts-ignore\n return <Comp {...data} />;\n};\n\nexport { JSONMetricsView };\n","import React from 'react';\nimport { BarChart, ValueFormatter } from '@tremor/react';\nimport { ChartBox } from '../ChartBox';\nimport { cn } from '../../../lib/utils';\n\nexport type BarChartCard = ChartBox & {\n type?: 'BarChartCard';\n categories?: string[];\n index?: string;\n valueFormatter?: ValueFormatter;\n showLegend?: boolean;\n showGridLines?: boolean;\n stack?: boolean;\n showAnimation?: boolean;\n};\n\nexport const BarChartCard = (props: BarChartCard) => {\n const {\n data = [],\n categories = ['value'],\n index = 'date',\n valueFormatter = (number) => `${number}`,\n showLegend = false,\n showGridLines = false,\n stack = false,\n chartClassName,\n showAnimation = true,\n } = props;\n\n return (\n <ChartBox {...props}>\n <BarChart\n className={cn('h-72 mt-4', chartClassName)}\n data={data}\n index={index}\n categories={categories}\n colors={['indigo', 'cyan', 'teal', 'green', 'yellow', 'orange', 'red', 'slate', 'violet', 'rose', 'pink', 'purple', 'blue']}\n valueFormatter={valueFormatter}\n yAxisWidth={48}\n showLegend={showLegend}\n showGridLines={showGridLines}\n stack={stack}\n showAnimation={showAnimation}\n />\n </ChartBox>\n );\n};\n","import React from 'react';\nimport { cn } from '../../../lib/utils';\nimport { Card } from '@nextui-org/react';\n\nexport interface ChartBox {\n title?: React.ReactNode;\n description?: string;\n error?: string;\n data?: {\n [key: string]: any;\n }[];\n children?: React.ReactNode;\n gridH?: number; // grid units, not pixels\n numColSpanMd?: number;\n className?: string;\n headerClassName?: string;\n contentClassName?: string;\n chartClassName?: string;\n}\n\nexport const ChartBox = ({ title, description, error, children, className, headerClassName, contentClassName }: ChartBox) => {\n return (\n <Card className={cn('shadow-sm border dark:border-[#3e3e3e]', className)}>\n {(title || description) && (\n <div className={cn('p-4 h-[60px]', headerClassName)}>\n {title && <div>{title}</div>}\n {description && <div className=\"text-xs\">{description}</div>}\n </div>\n )}\n <div className={cn('px-2 pb-5', contentClassName)}>{error ? <div className=\"text-red-600\">{error}</div> : children}</div>\n </Card>\n );\n};\n","import React from 'react';\nimport { Color, CurveType, CustomTooltipProps, LineChart, ValueFormatter } from '@tremor/react';\nimport { ChartBox } from '../ChartBox';\nimport { cn } from '../../../lib/utils';\n\nexport type LineChartCard = ChartBox & {\n type?: 'LineChartCard';\n categories?: string[];\n index?: string;\n curveType?: CurveType;\n colors?: (Color | string)[];\n showLegend?: boolean;\n showGridLines?: boolean;\n showXAxis?: boolean;\n showYAxis?: boolean;\n startEndOnly?: boolean;\n showTooltip?: boolean;\n showAnimation?: boolean;\n autoMinValue?: boolean;\n valueFormatter?: ValueFormatter;\n customTooltip?: React.ComponentType<CustomTooltipProps>;\n};\n\nexport const LineChartCard = (props: LineChartCard) => {\n const {\n data = [],\n categories = ['value'],\n index = 'date',\n curveType = 'linear',\n colors = ['indigo', 'cyan', 'teal', 'green', 'yellow', 'orange', 'red', 'slate', 'violet', 'rose', 'pink', 'purple', 'blue'],\n showLegend = false,\n showGridLines = false,\n chartClassName,\n showXAxis = true,\n showYAxis = true,\n startEndOnly = false,\n showTooltip = true,\n showAnimation = true,\n autoMinValue = true,\n valueFormatter = (number) => `${number}`,\n customTooltip\n } = props;\n\n return (\n <ChartBox {...props}>\n <LineChart\n className={cn('h-72 mt-4', chartClassName)}\n data={data}\n index={index}\n categories={categories}\n colors={colors}\n valueFormatter={valueFormatter}\n showLegend={showLegend}\n showGridLines={showGridLines}\n curveType={curveType}\n showXAxis={showXAxis}\n showYAxis={showYAxis}\n startEndOnly={startEndOnly}\n showTooltip={showTooltip}\n showAnimation={showAnimation}\n autoMinValue={autoMinValue}\n customTooltip={customTooltip}\n />\n </ChartBox>\n );\n};\n","import React from 'react';\nimport { AreaChart, Color, CurveType, CustomTooltipProps, ValueFormatter } from '@tremor/react';\nimport { ChartBox } from '../ChartBox';\nimport { cn } from '../../../lib/utils';\n\nexport type AreaChartCard = ChartBox & {\n type?: 'AreaChartCard';\n categories?: string[];\n index?: string;\n curveType?: CurveType;\n colors?: (Color | string)[];\n showLegend?: boolean;\n showGridLines?: boolean;\n stack?: boolean;\n showXAxis?: boolean;\n showYAxis?: boolean;\n startEndOnly?: boolean;\n showTooltip?: boolean;\n showAnimation?: boolean;\n autoMinValue?: boolean;\n valueFormatter?: ValueFormatter;\n customTooltip?: React.ComponentType<CustomTooltipProps>\n};\n\n\nexport const AreaChartCard = (props: AreaChartCard) => {\n const {\n data = [],\n categories = ['value'],\n index = 'date',\n curveType = 'linear',\n colors = ['indigo', 'cyan', 'teal', 'green', 'yellow', 'orange', 'red', 'slate', 'violet', 'rose', 'pink', 'purple', 'blue'],\n showLegend = false,\n showGridLines = false,\n stack = false,\n chartClassName,\n showXAxis = true,\n showYAxis = true,\n startEndOnly = false,\n showTooltip = true,\n showAnimation = true,\n autoMinValue = true,\n valueFormatter = (number) => `${number}`,\n customTooltip,\n } = props;\n\n return (\n <ChartBox {...props}>\n <AreaChart\n className={cn('h-72 mt-4', chartClassName)}\n data={data}\n index={index}\n categories={categories}\n colors={colors}\n valueFormatter={valueFormatter}\n showLegend={showLegend}\n showGridLines={showGridLines}\n stack={stack}\n curveType={curveType}\n showXAxis={showXAxis}\n showYAxis={showYAxis}\n startEndOnly={startEndOnly}\n showTooltip={showTooltip}\n showAnimation={showAnimation}\n autoMinValue={autoMinValue}\n customTooltip={customTooltip}\n />\n </ChartBox>\n );\n};\n\n","import React from 'react';\nimport { DonutChart, ValueFormatter } from '@tremor/react';\nimport { ChartBox } from '../ChartBox';\nimport { cn } from '../../../lib/utils';\n\nexport type DonutChartCard = ChartBox & {\n type?: 'DonutChartCard';\n categories?: string[];\n index?: string;\n valueFormatter?: ValueFormatter;\n showLabel?: boolean;\n variant?: 'donut' | 'pie';\n showAnimation?: boolean;\n};\n\nexport const DonutChartCard = (props: DonutChartCard) => {\n const { data = [], categories = ['value'], index = 'name', valueFormatter = (number) => `${number}`, showLabel = true, variant = 'donut', chartClassName, showAnimation = true } = props;\n const category = categories[0];\n return (\n <ChartBox {...props}>\n <DonutChart\n className={cn('h-72 mt-4', chartClassName)}\n data={data}\n index={index}\n category={category}\n colors={['indigo', 'cyan', 'teal', 'green', 'yellow', 'orange', 'red', 'slate', 'violet', 'rose', 'pink', 'purple', 'blue']}\n valueFormatter={valueFormatter}\n showLabel={showLabel}\n variant={variant}\n showAnimation={showAnimation}\n />\n </ChartBox>\n );\n};\n","import React from 'react';\nimport { ChartBox } from '../ChartBox';\nimport { cn } from '../../../lib/utils';\n\nexport type CountCard = ChartBox & {\n type?: 'CountCard';\n summedColumnIndex?: string;\n};\n\nexport const CountCard = (props: CountCard) => {\n if (!props.data?.length) {\n return (\n <ChartBox {...props}>\n <div className={cn(\"mt-2 ml-2 text-2xl overflow-auto\", props.chartClassName)}>\n <span className=\"text-gray-400\">No data</span>\n </div>\n </ChartBox>\n );\n }\n\n if (!props.summedColumnIndex) {\n return (\n <ChartBox {...props}>\n <div className={cn(\"mt-2 ml-2 text-2xl overflow-auto\", props.chartClassName)}>\n <span className=\"text-gray-400 text-sm\">\n set <span className=\"font-bold\">summedColumnIndex</span> to sum up values\n </span>\n </div>\n </ChartBox>\n );\n }\n\n const sum = props.data.reduce((acc, cur) => {\n const v = cur[props.summedColumnIndex];\n if (typeof v == 'number') {\n return acc + v;\n } else {\n return acc;\n }\n }, 0);\n\n return (\n <ChartBox {...props}>\n <div className={cn(\"mt-2 ml-2 font-bold text-2xl overflow-auto\", props.chartClassName)}>{sum}</div>\n </ChartBox>\n );\n};","import React from 'react';\nimport { ChartBox } from '../ChartBox';\nimport { JSONTable } from '../../JSONTable';\nimport { cn } from '../../../lib/utils';\n\nexport type TableCard = ChartBox & {\n type?: 'TableCard';\n columnOptions?: {\n [key: string]: {\n label: string;\n hidden: boolean;\n }\n }\n}\n\nexport const TableCard = (props: TableCard) => {\n const { data = [], columnOptions = {}, chartClassName } = props;\n return (\n <ChartBox {...props}>\n {data?.length > 0\n ? <JSONTable dataSource={data} columnOptions={columnOptions} className={cn(\"h-[256px]\", chartClassName)} />\n : <div className={cn(\"h-[256px] flex justify-center items-center text-gray-400\", chartClassName)}>No data</div>\n }\n </ChartBox>\n );\n};\n","import React from 'react';\nimport { AreaChart, LineChart, Text, ValueFormatter } from '@tremor/react';\nimport { ChartBox } from '../ChartBox';\nimport { SkeletonBox } from '../../Common/SkeletonBox';\nimport { cn } from '../../../lib/utils';\n\nexport type KPICard = ChartBox & {\n type?: 'KPICard';\n categories?: string[];\n index?: string;\n chartType?: 'area' | 'line';\n curveType?: 'linear' | 'step' | 'monotone';\n metricTitle?: string;\n metric?: string | number;\n valueFormatter?: ValueFormatter;\n loading?: boolean;\n};\n\nexport const KPICard = (props: KPICard) => {\n const { metricTitle, metric, chartType = 'area', data = [], categories = ['value'], index = 'date', valueFormatter = (number) => `${number}`, curveType = 'linear', loading, chartClassName } = props;\n\n if (loading) {\n return (\n <ChartBox {...props}>\n <div className=\"mt-4 space-x-6 px-2 flex items-center\">\n <div className=\"w-auto\">\n <Text className=\"whitespace-nowrap\">Loading...</Text>\n <div className=\"font-bold text-3xl\">-</div>\n </div>\n <SkeletonBox className=\"flex-col w-full\" skClassName=\"h-[100px] overflow-hidden\" line={1} />\n </div>\n </ChartBox>\n );\n }\n\n const ChartComp = chartType === 'area' ? AreaChart : LineChart;\n\n return (\n <ChartBox {...props}>\n <div className=\"mt-4 space-x-6 px-2 flex items-center\">\n <div className=\"w-auto\">\n <Text className=\"whitespace-nowrap\">{metricTitle}</Text>\n <div className=\"font-bold text-3xl\">{metric ?? '-'}</div>\n </div>\n <ChartComp\n className={cn('h-[100px] overflow-hidden', chartClassName)}\n data={data}\n index={index}\n categories={categories}\n colors={['indigo', 'cyan', 'teal', 'green', 'yellow', 'orange', 'red', 'slate', 'violet', 'rose', 'pink', 'purple', 'blue']}\n valueFormatter={valueFormatter}\n curveType={curveType}\n showXAxis={false}\n showGridLines={false}\n startEndOnly={true}\n showYAxis={false}\n showLegend={false}\n autoMinValue={true}\n showAnimation={true}\n />\n </div>\n </ChartBox>\n );\n};\n"]}
|
|
1
|
+
{"version":3,"sources":["../components/JSONMetricsView/index.tsx","../components/JSONMetricsView/BarChartCard/index.tsx","../components/JSONMetricsView/ChartBox/index.tsx","../components/JSONMetricsView/LineChartCard/index.tsx","../components/JSONMetricsView/AreaChartCard/index.tsx","../components/JSONMetricsView/DonutChartCard/index.tsx","../components/JSONMetricsView/CountCard/index.tsx","../components/JSONMetricsView/TableCard/index.tsx","../components/JSONMetricsView/KPICard/index.tsx"],"names":["React","AreaChart","LineChart"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Col, Grid } from '@tremor/react';\nimport { BarChartCard } from './BarChartCard';\nimport { LineChartCard } from './LineChartCard';\nimport { AreaChartCard } from './AreaChartCard';\nimport { DonutChartCard } from './DonutChartCard';\nimport { CountCard } from './CountCard';\nimport { TableCard } from './TableCard';\nimport { KPICard } from './KPICard';\n\nexport type JSONMetricsViewType = AreaChartCard | LineChartCard | BarChartCard | DonutChartCard | CountCard | TableCard | KPICard;\n\nconst components = {\n AreaChartCard,\n LineChartCard,\n BarChartCard,\n DonutChartCard,\n CountCard,\n TableCard,\n KPICard,\n};\n\nconst JSONMetricsView = ({ data }: { data: JSONMetricsViewType[] }) => {\n return (\n <Grid numItems={1} numItemsSm={1} numItemsLg={2} numItemsMd={2} className=\"gap-2\">\n {data.map((item, index) => {\n const Component = components[item.type];\n return (\n <Col key={index} numColSpanSm={1} numColSpanMd={item.numColSpanMd ?? 1}>\n {/* @ts-ignore */}\n <Component {...item} />\n </Col>\n );\n })}\n </Grid>\n );\n};\n\nexport const MetricsView = ({ data }: { data: JSONMetricsViewType }) => {\n const Comp = components[data.type];\n // @ts-ignore\n return <Comp {...data} />;\n};\n\nexport { JSONMetricsView };\n","import React from 'react';\nimport { BarChart, ValueFormatter } from '@tremor/react';\nimport { ChartBox } from '../ChartBox';\nimport { cn } from '../../../lib/utils';\n\nexport type BarChartCard = ChartBox & {\n type?: 'BarChartCard';\n categories?: string[];\n index?: string;\n valueFormatter?: ValueFormatter;\n showLegend?: boolean;\n showGridLines?: boolean;\n stack?: boolean;\n showAnimation?: boolean;\n};\n\nexport const BarChartCard = (props: BarChartCard) => {\n const {\n data = [],\n categories = ['value'],\n index = 'date',\n valueFormatter = (number) => `${number}`,\n showLegend = false,\n showGridLines = false,\n stack = false,\n chartClassName,\n showAnimation = true,\n } = props;\n\n return (\n <ChartBox {...props}>\n <BarChart\n className={cn('h-72 mt-4', chartClassName)}\n data={data}\n index={index}\n categories={categories}\n colors={['indigo', 'cyan', 'teal', 'green', 'yellow', 'orange', 'red', 'slate', 'violet', 'rose', 'pink', 'purple', 'blue']}\n valueFormatter={valueFormatter}\n yAxisWidth={48}\n showLegend={showLegend}\n showGridLines={showGridLines}\n stack={stack}\n showAnimation={showAnimation}\n />\n </ChartBox>\n );\n};\n","import React from 'react';\nimport { cn } from '../../../lib/utils';\nimport { Card } from '@nextui-org/react';\n\nexport interface ChartBox {\n title?: React.ReactNode;\n description?: string;\n error?: string;\n data?: {\n [key: string]: any;\n }[];\n children?: React.ReactNode;\n gridH?: number; // grid units, not pixels\n numColSpanMd?: number;\n className?: string;\n headerClassName?: string;\n contentClassName?: string;\n chartClassName?: string;\n}\n\nexport const ChartBox = ({ title, description, error, children, className, headerClassName, contentClassName }: ChartBox) => {\n return (\n <Card className={cn('shadow-sm rounded-lg border dark:border-[#3e3e3e]', className)}>\n {(title || description) && (\n <div className={cn('p-4 h-[60px]', headerClassName)}>\n {title && <div>{title}</div>}\n {description && <div className=\"text-xs\">{description}</div>}\n </div>\n )}\n <div className={cn('px-2 pb-5', contentClassName)}>{error ? <div className=\"text-red-600\">{error}</div> : children}</div>\n </Card>\n );\n};\n","import React from 'react';\nimport { Color, CurveType, CustomTooltipProps, LineChart, ValueFormatter } from '@tremor/react';\nimport { ChartBox } from '../ChartBox';\nimport { cn } from '../../../lib/utils';\n\nexport type LineChartCard = ChartBox & {\n type?: 'LineChartCard';\n categories?: string[];\n index?: string;\n curveType?: CurveType;\n colors?: (Color | string)[];\n showLegend?: boolean;\n showGridLines?: boolean;\n showXAxis?: boolean;\n showYAxis?: boolean;\n startEndOnly?: boolean;\n showTooltip?: boolean;\n showAnimation?: boolean;\n autoMinValue?: boolean;\n valueFormatter?: ValueFormatter;\n customTooltip?: React.ComponentType<CustomTooltipProps>;\n};\n\nexport const LineChartCard = (props: LineChartCard) => {\n const {\n data = [],\n categories = ['value'],\n index = 'date',\n curveType = 'linear',\n colors = ['indigo', 'cyan', 'teal', 'green', 'yellow', 'orange', 'red', 'slate', 'violet', 'rose', 'pink', 'purple', 'blue'],\n showLegend = false,\n showGridLines = false,\n chartClassName,\n showXAxis = true,\n showYAxis = true,\n startEndOnly = false,\n showTooltip = true,\n showAnimation = true,\n autoMinValue = true,\n valueFormatter = (number) => `${number}`,\n customTooltip\n } = props;\n\n return (\n <ChartBox {...props}>\n <LineChart\n className={cn('h-72 mt-4', chartClassName)}\n data={data}\n index={index}\n categories={categories}\n colors={colors}\n valueFormatter={valueFormatter}\n showLegend={showLegend}\n showGridLines={showGridLines}\n curveType={curveType}\n showXAxis={showXAxis}\n showYAxis={showYAxis}\n startEndOnly={startEndOnly}\n showTooltip={showTooltip}\n showAnimation={showAnimation}\n autoMinValue={autoMinValue}\n customTooltip={customTooltip}\n />\n </ChartBox>\n );\n};\n","import React from 'react';\nimport { AreaChart, Color, CurveType, CustomTooltipProps, ValueFormatter } from '@tremor/react';\nimport { ChartBox } from '../ChartBox';\nimport { cn } from '../../../lib/utils';\n\nexport type AreaChartCard = ChartBox & {\n type?: 'AreaChartCard';\n categories?: string[];\n index?: string;\n curveType?: CurveType;\n colors?: (Color | string)[];\n showLegend?: boolean;\n showGridLines?: boolean;\n stack?: boolean;\n showXAxis?: boolean;\n showYAxis?: boolean;\n startEndOnly?: boolean;\n showTooltip?: boolean;\n showAnimation?: boolean;\n autoMinValue?: boolean;\n valueFormatter?: ValueFormatter;\n customTooltip?: React.ComponentType<CustomTooltipProps>\n};\n\n\nexport const AreaChartCard = (props: AreaChartCard) => {\n const {\n data = [],\n categories = ['value'],\n index = 'date',\n curveType = 'linear',\n colors = ['indigo', 'cyan', 'teal', 'green', 'yellow', 'orange', 'red', 'slate', 'violet', 'rose', 'pink', 'purple', 'blue'],\n showLegend = false,\n showGridLines = false,\n stack = false,\n chartClassName,\n showXAxis = true,\n showYAxis = true,\n startEndOnly = false,\n showTooltip = true,\n showAnimation = true,\n autoMinValue = true,\n valueFormatter = (number) => `${number}`,\n customTooltip,\n } = props;\n\n return (\n <ChartBox {...props}>\n <AreaChart\n className={cn('h-72 mt-4', chartClassName)}\n data={data}\n index={index}\n categories={categories}\n colors={colors}\n valueFormatter={valueFormatter}\n showLegend={showLegend}\n showGridLines={showGridLines}\n stack={stack}\n curveType={curveType}\n showXAxis={showXAxis}\n showYAxis={showYAxis}\n startEndOnly={startEndOnly}\n showTooltip={showTooltip}\n showAnimation={showAnimation}\n autoMinValue={autoMinValue}\n customTooltip={customTooltip}\n />\n </ChartBox>\n );\n};\n\n","import React from 'react';\nimport { DonutChart, ValueFormatter } from '@tremor/react';\nimport { ChartBox } from '../ChartBox';\nimport { cn } from '../../../lib/utils';\n\nexport type DonutChartCard = ChartBox & {\n type?: 'DonutChartCard';\n categories?: string[];\n index?: string;\n valueFormatter?: ValueFormatter;\n showLabel?: boolean;\n variant?: 'donut' | 'pie';\n showAnimation?: boolean;\n};\n\nexport const DonutChartCard = (props: DonutChartCard) => {\n const { data = [], categories = ['value'], index = 'name', valueFormatter = (number) => `${number}`, showLabel = true, variant = 'donut', chartClassName, showAnimation = true } = props;\n const category = categories[0];\n return (\n <ChartBox {...props}>\n <DonutChart\n className={cn('h-72 mt-4', chartClassName)}\n data={data}\n index={index}\n category={category}\n colors={['indigo', 'cyan', 'teal', 'green', 'yellow', 'orange', 'red', 'slate', 'violet', 'rose', 'pink', 'purple', 'blue']}\n valueFormatter={valueFormatter}\n showLabel={showLabel}\n variant={variant}\n showAnimation={showAnimation}\n />\n </ChartBox>\n );\n};\n","import React from 'react';\nimport { ChartBox } from '../ChartBox';\nimport { cn } from '../../../lib/utils';\n\nexport type CountCard = ChartBox & {\n type?: 'CountCard';\n summedColumnIndex?: string;\n};\n\nexport const CountCard = (props: CountCard) => {\n if (!props.data?.length) {\n return (\n <ChartBox {...props}>\n <div className={cn(\"mt-2 ml-2 text-2xl overflow-auto\", props.chartClassName)}>\n <span className=\"text-gray-400\">No data</span>\n </div>\n </ChartBox>\n );\n }\n\n if (!props.summedColumnIndex) {\n return (\n <ChartBox {...props}>\n <div className={cn(\"mt-2 ml-2 text-2xl overflow-auto\", props.chartClassName)}>\n <span className=\"text-gray-400 text-sm\">\n set <span className=\"font-bold\">summedColumnIndex</span> to sum up values\n </span>\n </div>\n </ChartBox>\n );\n }\n\n const sum = props.data.reduce((acc, cur) => {\n const v = cur[props.summedColumnIndex];\n if (typeof v == 'number') {\n return acc + v;\n } else {\n return acc;\n }\n }, 0);\n\n return (\n <ChartBox {...props}>\n <div className={cn(\"mt-2 ml-2 font-bold text-2xl overflow-auto\", props.chartClassName)}>{sum}</div>\n </ChartBox>\n );\n};","import React from 'react';\nimport { ChartBox } from '../ChartBox';\nimport { JSONTable } from '../../JSONTable';\nimport { cn } from '../../../lib/utils';\n\nexport type TableCard = ChartBox & {\n type?: 'TableCard';\n columnOptions?: {\n [key: string]: {\n label: string;\n hidden: boolean;\n }\n }\n}\n\nexport const TableCard = (props: TableCard) => {\n const { data = [], columnOptions = {}, chartClassName } = props;\n return (\n <ChartBox {...props}>\n {data?.length > 0\n ? <JSONTable dataSource={data} columnOptions={columnOptions} className={cn(\"h-[256px]\", chartClassName)} />\n : <div className={cn(\"h-[256px] flex justify-center items-center text-gray-400\", chartClassName)}>No data</div>\n }\n </ChartBox>\n );\n};\n","import React from 'react';\nimport { AreaChart, LineChart, Text, ValueFormatter } from '@tremor/react';\nimport { ChartBox } from '../ChartBox';\nimport { SkeletonBox } from '../../Common/SkeletonBox';\nimport { cn } from '../../../lib/utils';\n\nexport type KPICard = ChartBox & {\n type?: 'KPICard';\n categories?: string[];\n index?: string;\n chartType?: 'area' | 'line';\n curveType?: 'linear' | 'step' | 'monotone';\n metricTitle?: string;\n metric?: string | number;\n valueFormatter?: ValueFormatter;\n loading?: boolean;\n};\n\nexport const KPICard = (props: KPICard) => {\n const { metricTitle, metric, chartType = 'area', data = [], categories = ['value'], index = 'date', valueFormatter = (number) => `${number}`, curveType = 'linear', loading, chartClassName } = props;\n\n if (loading) {\n return (\n <ChartBox {...props}>\n <div className=\"mt-4 space-x-6 px-2 flex items-center\">\n <div className=\"w-auto\">\n <Text className=\"whitespace-nowrap\">Loading...</Text>\n <div className=\"font-bold text-3xl\">-</div>\n </div>\n <SkeletonBox className=\"flex-col w-full\" skClassName=\"h-[100px] overflow-hidden\" line={1} />\n </div>\n </ChartBox>\n );\n }\n\n const ChartComp = chartType === 'area' ? AreaChart : LineChart;\n\n return (\n <ChartBox {...props}>\n <div className=\"mt-4 space-x-6 px-2 flex items-center\">\n <div className=\"w-auto\">\n <Text className=\"whitespace-nowrap\">{metricTitle}</Text>\n <div className=\"font-bold text-3xl\">{metric ?? '-'}</div>\n </div>\n <ChartComp\n className={cn('h-[100px] overflow-hidden', chartClassName)}\n data={data}\n index={index}\n categories={categories}\n colors={['indigo', 'cyan', 'teal', 'green', 'yellow', 'orange', 'red', 'slate', 'violet', 'rose', 'pink', 'purple', 'blue']}\n valueFormatter={valueFormatter}\n curveType={curveType}\n showXAxis={false}\n showGridLines={false}\n startEndOnly={true}\n showYAxis={false}\n showLegend={false}\n autoMinValue={true}\n showAnimation={true}\n />\n </div>\n </ChartBox>\n );\n};\n"]}
|