@redsift/charts 11.6.0-muiv5-alpha.4 → 11.6.0-muiv5-alpha.5

package/_internal/theme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.js","sources":["../../src/hooks/useColor.tsx","../../src/utils/index.ts","../../src/types/size.ts","../../src/types/theme.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport { ScaleOrdinal as d3ScaleOrdinal } from 'd3';\nimport { getColorScale } from '../scheme';\nimport { ChartTheme, JSONArray, JSONObject } from '../types';\nimport { Theme } from '@redsift/design-system';\n\nexport interface UseColorProps {\n  /** Dataset to use to generate the chart. */\n  data: JSONArray;\n  /** Color palette to use. */\n  colorTheme: ChartTheme;\n  /** Name of the field that will be used to categorize the data. */\n  category: string | ((d: JSONObject) => string);\n  /** Theme */\n  theme: Theme;\n}\n\nexport const useColor = ({ data, colorTheme, category, theme }: UseColorProps) => {\n  const colorScale = useMemo<d3ScaleOrdinal<string, string>>(\n    () =>\n      getColorScale({\n        colorTheme,\n        domain: data.map((d) => (typeof category === 'string' ? (d[category] as string) : category(d))),\n        theme,\n      }),\n    [colorTheme]\n  );\n\n  return colorScale;\n};\n","import { CategoryDatum, Statistics } from '../types';\n\nexport type SortingMethod =\n  | 'none'\n  | 'asc-key'\n  | 'desc-key'\n  | 'asc-value'\n  | 'desc-value'\n  | string[]\n  | ((a: CategoryDatum, b: CategoryDatum) => 1 | -1);\n\nexport const getSortingMethod: (sortingMethod: SortingMethod) => (a: CategoryDatum, b: CategoryDatum) => 1 | -1 = (\n  sortingMethod\n) => {\n  if (sortingMethod === 'asc-key') {\n    return (a: CategoryDatum, b: CategoryDatum) =>\n      a.key === b.key ? (a.value > b.value ? -1 : 1) : a.key < b.key ? -1 : 1;\n  } else if (sortingMethod === 'desc-key') {\n    return (a: CategoryDatum, b: CategoryDatum) =>\n      a.key === b.key ? (a.value > b.value ? 1 : -1) : a.key < b.key ? 1 : -1;\n  } else if (sortingMethod === 'asc-value') {\n    return (a: CategoryDatum, b: CategoryDatum) =>\n      a.value === b.value ? (a.key > b.key ? -1 : 1) : a.value < b.value ? -1 : 1;\n  } else if (sortingMethod === 'desc-value') {\n    return (a: CategoryDatum, b: CategoryDatum) =>\n      a.value === b.value ? (a.key > b.key ? 1 : -1) : a.value < b.value ? 1 : -1;\n  } else if (typeof sortingMethod === 'function') {\n    return sortingMethod;\n  } else if (Array.isArray(sortingMethod)) {\n    return (a: CategoryDatum, b: CategoryDatum) => {\n      if (sortingMethod.indexOf(a.key) === -1) {\n        return 1;\n      }\n      if (sortingMethod.indexOf(b.key) === -1) {\n        return -1;\n      }\n\n      return sortingMethod.indexOf(a.key) === sortingMethod.indexOf(b.key)\n        ? a.key > b.key\n          ? 1\n          : -1\n        : sortingMethod.indexOf(a.key) < sortingMethod.indexOf(b.key)\n        ? -1\n        : 1;\n    };\n  }\n  return () => 1;\n};\n\nexport const isValidDate = (value: string) => {\n  const date = new Date(value);\n  return !isNaN(date.getTime()) && date.toISOString().startsWith(value);\n};\n\nexport const mergeLegends = (arr1: Statistics, arr2: Statistics) => {\n  const map = new Map();\n\n  [...arr1, ...arr2].forEach((item) => {\n    map.set(item.key, item.value);\n  });\n\n  return Array.from(map, ([key, value]) => ({ key, value }));\n};\n","import { ValueOf } from '@redsift/design-system';\n\nexport type ChartDimensions = {\n  width: number;\n  height: number;\n};\n\nexport const ChartSize = {\n  small: 'small',\n  medium: 'medium',\n  large: 'large',\n} as const;\nexport type ChartSize = ValueOf<typeof ChartSize>;\n\nexport type MarginProps = {\n  top?: number;\n  right?: number;\n  bottom?: number;\n  left?: number;\n};\n","import { ValueOf } from '@redsift/design-system';\n\nexport const ColorTheme = {\n  default: 'default',\n  dark: 'dark',\n  darker: 'darker',\n  darkerer: 'darkerer',\n  light: 'light',\n  lighter: 'lighter',\n  lighterer: 'lighterer',\n  monochrome: 'monochrome',\n} as const;\nexport type ColorTheme = ValueOf<typeof ColorTheme>;\n\nexport type SuccessDangerColorTheme = {\n  success: string;\n  warning: string;\n  danger: string;\n  neutral?: string;\n};\n\nexport type CustomColorTheme = Record<string, string>;\n\nexport type ChartTheme =\n  | ColorTheme\n  | SuccessDangerColorTheme\n  | CustomColorTheme;\n"],"names":["useColor","_ref","data","colorTheme","category","theme","colorScale","useMemo","getColorScale","domain","map","d","getSortingMethod","sortingMethod","a","b","key","value","Array","isArray","indexOf","isValidDate","date","Date","isNaN","getTime","toISOString","startsWith","mergeLegends","arr1","arr2","Map","forEach","item","set","from","ChartSize","small","medium","large","ColorTheme","default","dark","darker","darkerer","light","lighter","lighterer","monochrome"],"mappings":"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"}

package/{components/Arc/types.d.ts → _internal/types.js}

@@ -1,7 +1,7 @@
 import { Arc } from 'd3';
+import { D as DataPointProps, S as StyledDataPointProps } from './types4.js';
 import { Theme } from '@redsift/design-system';
-import { DataPointProps, StyledDataPointProps } from '../DataPoint/types.js';
-import { ArcDatum } from '../../types/data.js';
+import { A as ArcDatum } from './data.js';
 
 /**
  * Component props.
@@ -17,4 +17,4 @@ type StyledArcProps = StyledDataPointProps & Omit<ArcProps, 'createArc'> & {
     $theme: Theme;
 };
 
-export { ArcProps, StyledArcProps };
+export { ArcProps as A, StyledArcProps as S };

package/{components/Bar/types.d.ts → _internal/types2.js}

@@ -1,7 +1,7 @@
 import { ScaleLinear, ScaleTime, ScalePoint } from 'd3';
 import { ValueOf, Theme } from '@redsift/design-system';
-import { BarDatum } from '../../types/data.js';
-import { DataPointProps, StyledDataPointProps } from '../DataPoint/types.js';
+import { D as DataPointProps, S as StyledDataPointProps } from './types4.js';
+import { B as BarDatum } from './data.js';
 
 /**
  * Component variant.
@@ -43,4 +43,4 @@ type StyledBarProps = StyledDataPointProps & Omit<BarProps, 'scale' | 'scalePosi
     $theme: Theme;
 };
 
-export { BarDirection, BarOrientation, BarProps, StyledBarProps };
+export { BarOrientation as B, StyledBarProps as S, BarDirection as a, BarProps as b };

package/{components/ChartContainer/types.d.ts → _internal/types3.js}

@@ -45,4 +45,4 @@ type StyledChartContainerProps = Omit<ChartContainerProps, 'theme'> & {
     $theme: Theme;
 };
 
-export { ChartContainerProps, StyledChartContainerProps };
+export { ChartContainerProps as C, StyledChartContainerProps as S };

package/{components/DataPoint/types.d.ts → _internal/types4.js}

@@ -1,7 +1,33 @@
 import { ComponentProps, ReactElement } from 'react';
-import { Theme } from '@redsift/design-system';
+import { ValueOf, Theme } from '@redsift/design-system';
 import { TooltipProps } from '@redsift/popovers';
-import { TooltipVariant } from '../../types/legend.js';
+
+/** TOOLTIP */
+declare const TooltipVariant: {
+    none: string;
+    label: string;
+    value: string;
+    percent: string;
+    custom: string;
+};
+type TooltipVariant = ValueOf<typeof TooltipVariant>;
+/** LEGEND */
+declare const LegendVariant: {
+    readonly none: "none";
+    readonly label: "label";
+    readonly value: "value";
+    readonly percent: "percent";
+    readonly custom: "custom";
+};
+type LegendVariant = ValueOf<typeof LegendVariant>;
+declare const LabelVariant: {
+    readonly none: "none";
+    readonly label: "label";
+    readonly value: "value";
+    readonly percent: "percent";
+    readonly custom: "custom";
+};
+type LabelVariant = LegendVariant;
 
 type AnchorProps = ComponentProps<'a'> & {
     as?: any;
@@ -57,4 +83,4 @@ type StyledDataPointProps = Omit<DataPointProps<any>, 'data' | 'dataset'> & {
     $clickable: boolean;
 };
 
-export { AnchorProps, DataPointProps, StyledDataPointProps };
+export { AnchorProps as A, DataPointProps as D, LegendVariant as L, StyledDataPointProps as S, TooltipVariant as T, LabelVariant as a };

package/{components/Dot/types.d.ts → _internal/types5.js}

@@ -1,7 +1,7 @@
 import { ScaleLinear, ScaleTime, ScalePoint } from 'd3';
+import { D as DataPointProps, S as StyledDataPointProps } from './types4.js';
 import { ValueOf, Theme } from '@redsift/design-system';
-import { DotDatum } from '../../types/data.js';
-import { DataPointProps, StyledDataPointProps } from '../DataPoint/types.js';
+import { m as DotDatum } from './data.js';
 
 /**
  * Component's variant.
@@ -27,4 +27,4 @@ type StyledDotProps = StyledDataPointProps & Omit<DotProps, 'scaleX' | 'scaleY'>
     $theme: Theme;
 };
 
-export { DotProps, DotVariant, StyledDotProps };
+export { DotVariant as D, StyledDotProps as S, DotProps as a };

package/{components/Legend/types.d.ts → _internal/types6.js}

@@ -1,8 +1,8 @@
 import { ComponentProps, ReactElement } from 'react';
+import { L as LegendItemProps } from './types7.js';
 import { ContainerProps } from '@redsift/design-system';
-import { Statistic, LegendItemDatum } from '../../types/data.js';
-import { LegendItemProps } from '../LegendItem/types.js';
-import { LegendVariant } from '../../types/legend.js';
+import { S as Statistic, p as LegendItemDatum } from './data.js';
+import { L as LegendVariant } from './types4.js';
 
 /**
  * Component props.
@@ -41,4 +41,4 @@ type StyledLegendProps = Omit<LegendProps, 'data'> & {
     $width?: LegendProps['width'];
 };
 
-export { LegendProps, StyledLegendProps };
+export { LegendProps as L, StyledLegendProps as S };

package/{components/LegendItem/types.d.ts → _internal/types7.js}

@@ -1,7 +1,7 @@
 import { ComponentProps, ReactElement } from 'react';
-import { LegendItemDatum } from '../../types/data.js';
-import { LegendVariant } from '../../types/legend.js';
-import { DataPointProps } from '../DataPoint/types.js';
+import { D as DataPointProps, L as LegendVariant, S as StyledDataPointProps } from './types4.js';
+import { Theme } from '@redsift/design-system';
+import { p as LegendItemDatum } from './data.js';
 
 /**
  * Component props.
@@ -16,5 +16,9 @@ interface LegendItemProps extends Pick<DataPointProps<LegendItemDatum>, 'color'
     /** Variant. */
     variant?: LegendVariant;
 }
+type StyledLegendItemProps = Pick<StyledDataPointProps, '$clickable'> & Omit<LegendItemProps, 'data' | 'dataset'> & {
+    $variant: LegendItemProps['variant'];
+    $theme: Theme;
+};
 
-export { LegendItemProps };
+export { LegendItemProps as L, StyledLegendItemProps as S };

package/{hooks → _internal}/useFormatCategoricalData.js

@@ -1,7 +1,6 @@
-import { objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
+import { b as _objectSpread2 } from './_rollupPluginBabelHelpers.js';
 import { useMemo } from 'react';
-import { useColor } from './useColor.js';
-import { getSortingMethod } from '../utils/index.js';
+import { g as getSortingMethod, u as useColor } from './theme.js';
 
 const useFormatCategoricalData = _ref => {
   let {
@@ -53,5 +52,5 @@ const useFormatCategoricalData = _ref => {
   };
 };
 
-export { useFormatCategoricalData };
+export { useFormatCategoricalData as u };
 //# sourceMappingURL=useFormatCategoricalData.js.map

package/{hooks → _internal}/useFormatCategoricalData.js.map

@@ -1 +1 @@
-{"version":3,"file":"useFormatCategoricalData.js","sources":["../../src/hooks/useFormatCategoricalData.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport { CategoryData, ChartTheme } from '../types';\nimport { useColor } from './useColor';\nimport { SortingMethod, getSortingMethod } from '../utils';\nimport { Theme } from '@redsift/design-system';\n\nexport interface UseFormatCategoricalDataProps {\n  /** Dataset to use to generate the chart, should be a list of objects containing a key and a value. */\n  data: CategoryData;\n  /** Color palette to use. */\n  colorTheme: ChartTheme;\n  /** Define how to sort categories. */\n  sortingMethod: SortingMethod;\n  /** Number of categories to use, the rest being put into a new category called \"Others\". */\n  caping?: number;\n  /** Whether a category should be displayed for categories that has been removed by the caping option. Optionaly, this prop can be used to change the label of this category. */\n  others?: boolean | string;\n  /** Theme */\n  theme: Theme;\n}\n\nexport const useFormatCategoricalData = ({\n  data,\n  caping,\n  sortingMethod,\n  others,\n  colorTheme,\n  theme,\n}: UseFormatCategoricalDataProps) => {\n  const computedData = useMemo(() => {\n    let computedData;\n\n    if (data === undefined || data === null) {\n      return undefined;\n    }\n\n    computedData = [...data!].sort(getSortingMethod(sortingMethod));\n\n    if (caping) {\n      if (typeof others === 'boolean' && !others) {\n        computedData = computedData.slice(0, caping);\n      } else {\n        computedData = computedData.reduce<CategoryData>((acc, curr, index) => {\n          if (index < caping) {\n            acc[index] = curr;\n          } else if (index === caping) {\n            acc[index] = {\n              key: typeof others === 'string' ? others : 'Others',\n              value: curr.value,\n            };\n          } else {\n            acc[caping] = {\n              ...acc[caping],\n              value: acc[caping].value + curr.value,\n            };\n          }\n          return acc;\n        }, []);\n      }\n    }\n\n    return computedData;\n  }, [data, caping]);\n\n  const colorScale = useColor({ data: computedData!, colorTheme, category: 'key', theme });\n\n  return { data: computedData as CategoryData, colorScale };\n};\n"],"names":["useFormatCategoricalData","_ref","data","caping","sortingMethod","others","colorTheme","theme","computedData","useMemo","undefined","sort","getSortingMethod","slice","reduce","acc","curr","index","key","value","_objectSpread","colorScale","useColor","category"],"mappings":";;;;;AAqBaA,MAAAA,wBAAwB,GAAGC,IAAA,IAOH;EAAA,IAPI;IACvCC,IAAI;IACJC,MAAM;IACNC,aAAa;IACbC,MAAM;IACNC,UAAU;AACVC,IAAAA,KAAAA;AAC6B,GAAC,GAAAN,IAAA,CAAA;AAC9B,EAAA,MAAMO,YAAY,GAAGC,OAAO,CAAC,MAAM;AACjC,IAAA,IAAID,YAAY,CAAA;AAEhB,IAAA,IAAIN,IAAI,KAAKQ,SAAS,IAAIR,IAAI,KAAK,IAAI,EAAE;AACvC,MAAA,OAAOQ,SAAS,CAAA;AAClB,KAAA;AAEAF,IAAAA,YAAY,GAAG,CAAC,GAAGN,IAAK,CAAC,CAACS,IAAI,CAACC,gBAAgB,CAACR,aAAa,CAAC,CAAC,CAAA;AAE/D,IAAA,IAAID,MAAM,EAAE;AACV,MAAA,IAAI,OAAOE,MAAM,KAAK,SAAS,IAAI,CAACA,MAAM,EAAE;QAC1CG,YAAY,GAAGA,YAAY,CAACK,KAAK,CAAC,CAAC,EAAEV,MAAM,CAAC,CAAA;AAC9C,OAAC,MAAM;QACLK,YAAY,GAAGA,YAAY,CAACM,MAAM,CAAe,CAACC,GAAG,EAAEC,IAAI,EAAEC,KAAK,KAAK;UACrE,IAAIA,KAAK,GAAGd,MAAM,EAAE;AAClBY,YAAAA,GAAG,CAACE,KAAK,CAAC,GAAGD,IAAI,CAAA;AACnB,WAAC,MAAM,IAAIC,KAAK,KAAKd,MAAM,EAAE;YAC3BY,GAAG,CAACE,KAAK,CAAC,GAAG;cACXC,GAAG,EAAE,OAAOb,MAAM,KAAK,QAAQ,GAAGA,MAAM,GAAG,QAAQ;cACnDc,KAAK,EAAEH,IAAI,CAACG,KAAAA;aACb,CAAA;AACH,WAAC,MAAM;YACLJ,GAAG,CAACZ,MAAM,CAAC,GAAAiB,cAAA,CAAAA,cAAA,CACNL,EAAAA,EAAAA,GAAG,CAACZ,MAAM,CAAC,CAAA,EAAA,EAAA,EAAA;cACdgB,KAAK,EAAEJ,GAAG,CAACZ,MAAM,CAAC,CAACgB,KAAK,GAAGH,IAAI,CAACG,KAAAA;aACjC,CAAA,CAAA;AACH,WAAA;AACA,UAAA,OAAOJ,GAAG,CAAA;SACX,EAAE,EAAE,CAAC,CAAA;AACR,OAAA;AACF,KAAA;AAEA,IAAA,OAAOP,YAAY,CAAA;AACrB,GAAC,EAAE,CAACN,IAAI,EAAEC,MAAM,CAAC,CAAC,CAAA;EAElB,MAAMkB,UAAU,GAAGC,QAAQ,CAAC;AAAEpB,IAAAA,IAAI,EAAEM,YAAa;IAAEF,UAAU;AAAEiB,IAAAA,QAAQ,EAAE,KAAK;AAAEhB,IAAAA,KAAAA;AAAM,GAAC,CAAC,CAAA;EAExF,OAAO;AAAEL,IAAAA,IAAI,EAAEM,YAA4B;AAAEa,IAAAA,UAAAA;GAAY,CAAA;AAC3D;;;;"}
+{"version":3,"file":"useFormatCategoricalData.js","sources":["../../src/hooks/useFormatCategoricalData.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport { CategoryData, ChartTheme } from '../types';\nimport { useColor } from './useColor';\nimport { SortingMethod, getSortingMethod } from '../utils';\nimport { Theme } from '@redsift/design-system';\n\nexport interface UseFormatCategoricalDataProps {\n  /** Dataset to use to generate the chart, should be a list of objects containing a key and a value. */\n  data: CategoryData;\n  /** Color palette to use. */\n  colorTheme: ChartTheme;\n  /** Define how to sort categories. */\n  sortingMethod: SortingMethod;\n  /** Number of categories to use, the rest being put into a new category called \"Others\". */\n  caping?: number;\n  /** Whether a category should be displayed for categories that has been removed by the caping option. Optionaly, this prop can be used to change the label of this category. */\n  others?: boolean | string;\n  /** Theme */\n  theme: Theme;\n}\n\nexport const useFormatCategoricalData = ({\n  data,\n  caping,\n  sortingMethod,\n  others,\n  colorTheme,\n  theme,\n}: UseFormatCategoricalDataProps) => {\n  const computedData = useMemo(() => {\n    let computedData;\n\n    if (data === undefined || data === null) {\n      return undefined;\n    }\n\n    computedData = [...data!].sort(getSortingMethod(sortingMethod));\n\n    if (caping) {\n      if (typeof others === 'boolean' && !others) {\n        computedData = computedData.slice(0, caping);\n      } else {\n        computedData = computedData.reduce<CategoryData>((acc, curr, index) => {\n          if (index < caping) {\n            acc[index] = curr;\n          } else if (index === caping) {\n            acc[index] = {\n              key: typeof others === 'string' ? others : 'Others',\n              value: curr.value,\n            };\n          } else {\n            acc[caping] = {\n              ...acc[caping],\n              value: acc[caping].value + curr.value,\n            };\n          }\n          return acc;\n        }, []);\n      }\n    }\n\n    return computedData;\n  }, [data, caping]);\n\n  const colorScale = useColor({ data: computedData!, colorTheme, category: 'key', theme });\n\n  return { data: computedData as CategoryData, colorScale };\n};\n"],"names":["useFormatCategoricalData","_ref","data","caping","sortingMethod","others","colorTheme","theme","computedData","useMemo","undefined","sort","getSortingMethod","slice","reduce","acc","curr","index","key","value","_objectSpread","colorScale","useColor","category"],"mappings":";;;;AAqBaA,MAAAA,wBAAwB,GAAGC,IAAA,IAOH;EAAA,IAPI;IACvCC,IAAI;IACJC,MAAM;IACNC,aAAa;IACbC,MAAM;IACNC,UAAU;AACVC,IAAAA,KAAAA;AAC6B,GAAC,GAAAN,IAAA,CAAA;AAC9B,EAAA,MAAMO,YAAY,GAAGC,OAAO,CAAC,MAAM;AACjC,IAAA,IAAID,YAAY,CAAA;AAEhB,IAAA,IAAIN,IAAI,KAAKQ,SAAS,IAAIR,IAAI,KAAK,IAAI,EAAE;AACvC,MAAA,OAAOQ,SAAS,CAAA;AAClB,KAAA;AAEAF,IAAAA,YAAY,GAAG,CAAC,GAAGN,IAAK,CAAC,CAACS,IAAI,CAACC,gBAAgB,CAACR,aAAa,CAAC,CAAC,CAAA;AAE/D,IAAA,IAAID,MAAM,EAAE;AACV,MAAA,IAAI,OAAOE,MAAM,KAAK,SAAS,IAAI,CAACA,MAAM,EAAE;QAC1CG,YAAY,GAAGA,YAAY,CAACK,KAAK,CAAC,CAAC,EAAEV,MAAM,CAAC,CAAA;AAC9C,OAAC,MAAM;QACLK,YAAY,GAAGA,YAAY,CAACM,MAAM,CAAe,CAACC,GAAG,EAAEC,IAAI,EAAEC,KAAK,KAAK;UACrE,IAAIA,KAAK,GAAGd,MAAM,EAAE;AAClBY,YAAAA,GAAG,CAACE,KAAK,CAAC,GAAGD,IAAI,CAAA;AACnB,WAAC,MAAM,IAAIC,KAAK,KAAKd,MAAM,EAAE;YAC3BY,GAAG,CAACE,KAAK,CAAC,GAAG;cACXC,GAAG,EAAE,OAAOb,MAAM,KAAK,QAAQ,GAAGA,MAAM,GAAG,QAAQ;cACnDc,KAAK,EAAEH,IAAI,CAACG,KAAAA;aACb,CAAA;AACH,WAAC,MAAM;YACLJ,GAAG,CAACZ,MAAM,CAAC,GAAAiB,cAAA,CAAAA,cAAA,CACNL,EAAAA,EAAAA,GAAG,CAACZ,MAAM,CAAC,CAAA,EAAA,EAAA,EAAA;cACdgB,KAAK,EAAEJ,GAAG,CAACZ,MAAM,CAAC,CAACgB,KAAK,GAAGH,IAAI,CAACG,KAAAA;aACjC,CAAA,CAAA;AACH,WAAA;AACA,UAAA,OAAOJ,GAAG,CAAA;SACX,EAAE,EAAE,CAAC,CAAA;AACR,OAAA;AACF,KAAA;AAEA,IAAA,OAAOP,YAAY,CAAA;AACrB,GAAC,EAAE,CAACN,IAAI,EAAEC,MAAM,CAAC,CAAC,CAAA;EAElB,MAAMkB,UAAU,GAAGC,QAAQ,CAAC;AAAEpB,IAAAA,IAAI,EAAEM,YAAa;IAAEF,UAAU;AAAEiB,IAAAA,QAAQ,EAAE,KAAK;AAAEhB,IAAAA,KAAAA;AAAM,GAAC,CAAC,CAAA;EAExF,OAAO;AAAEL,IAAAA,IAAI,EAAEM,YAA4B;AAAEa,IAAAA,UAAAA;GAAY,CAAA;AAC3D;;;;"}

package/index.js

@@ -1,43 +1,129 @@
-export { empty, getColorScale, monochrome, scheme, successDangerScheme } from './scheme.js';
-export { getSortingMethod, isValidDate, mergeLegends } from './utils/index.js';
-export { useBrush } from './hooks/useBrush.js';
-export { useColor } from './hooks/useColor.js';
-export { useFormatCategoricalData } from './hooks/useFormatCategoricalData.js';
-export { useZoom } from './hooks/useZoom.js';
-export { LabelVariant, LegendVariant, TooltipVariant } from './types/legend.js';
-export { ChartSize } from './types/size.js';
-export { ColorTheme } from './types/theme.js';
-export { Arc } from './components/Arc/Arc.js';
-export { StyledArc } from './components/Arc/styles.js';
-export { Arcs } from './components/Arcs/Arcs.js';
-export { StyledArcs } from './components/Arcs/styles.js';
-export { Axis, getAxisType } from './components/Axis/Axis.js';
-export { AxisPosition, AxisVariant } from './components/Axis/types.js';
-export { StyledAxis } from './components/Axis/styles.js';
-export { Bar } from './components/Bar/Bar.js';
-export { BarDirection, BarOrientation } from './components/Bar/types.js';
-export { StyledBar } from './components/Bar/styles.js';
-export { BarChart, BaseBarChart } from './components/BarChart/BarChart.js';
-export { BarChartLegendVariant } from './components/BarChart/types.js';
-export { StyledBarChart, StyledBarChartBars, StyledBarChartEmptyText, StyledBarChartSection } from './components/BarChart/styles.js';
-export { ChartContainer, ChartContainerDescription, ChartContainerTitle } from './components/ChartContainer/ChartContainer.js';
-export { StyledChartContainer, StyledChartContainerCaption, StyledChartContainerTitle } from './components/ChartContainer/styles.js';
-export { DataPoint } from './components/DataPoint/DataPoint.js';
-export { StyledDataPoint } from './components/DataPoint/styles.js';
-export { Dot } from './components/Dot/Dot.js';
-export { DotVariant } from './components/Dot/types.js';
-export { StyledDot } from './components/Dot/styles.js';
-export { Legend } from './components/Legend/Legend.js';
-export { StyledLegend } from './components/Legend/styles.js';
-export { Line } from './components/Line/Line.js';
-export { StyledLine } from './components/Line/styles.js';
-export { LineChart } from './components/LineChart/LineChart.js';
-export { LineChartLegendVariant } from './components/LineChart/types.js';
-export { StyledLineChart, StyledLineChartEmptyText } from './components/LineChart/styles.js';
-export { PieChart } from './components/PieChart/PieChart.js';
-export { PieChartLegendVariant, PieChartVariant } from './components/PieChart/types.js';
-export { StyledPieChart, StyledPieChartCenterText, StyledPieChartEmptyText } from './components/PieChart/styles.js';
-export { ScatterPlot } from './components/ScatterPlot/ScatterPlot.js';
-export { ScatterPlotLegendVariant, ScatterPlotVariant } from './components/ScatterPlot/types.js';
-export { StyledScatterPlot, StyledScatterPlotEmptyText } from './components/ScatterPlot/styles.js';
-//# sourceMappingURL=index.js.map
+import { BrushBehavior, ScaleLinear, ScaleOrdinal } from 'd3';
+import { Theme } from '@redsift/design-system';
+import { C as ChartTheme, S as SortingMethod } from './index2.js';
+export { a as ChartDimensions, b as ChartSize, C as ChartTheme, c as ColorTheme, e as CustomColorTheme, M as MarginProps, S as SortingMethod, d as SuccessDangerColorTheme, g as getSortingMethod, i as isValidDate, m as mergeLegends } from './index2.js';
+export { A as Arc, S as StyledArc } from './_internal/styles.js';
+export { A as ArcProps, S as StyledArcProps } from './_internal/types.js';
+export { A as Arcs, a as ArcsProps, b as StyledArcs, S as StyledArcsProps } from './_internal/styles2.js';
+export { A as Axis, S as StyledAxis, g as getAxisType } from './_internal/styles3.js';
+export { A as AnyScale, l as AxisPosition, m as AxisProps, k as AxisVariant, C as Coordinates, N as NumericValue, i as Scale, f as ScaleBand, b as ScaleLinear, c as ScaleLog, e as ScalePoint, d as ScaleSymlog, g as ScaleTime, h as ScaleTypeToScale, a as ScaleValue, j as ScaleWithBandwidth, S as StringValue, n as StyledAxisProps, T as TicksSpec } from './_internal/scale.js';
+export { B as Bar, S as StyledBar } from './_internal/styles4.js';
+export { a as BarDirection, B as BarOrientation, b as BarProps, S as StyledBarProps } from './_internal/types2.js';
+export { a as BarChart, h as BarChartBarsProps, c as BarChartDimensions, b as BarChartLegendVariant, d as BarChartProps, f as BarChartSectionProps, e as BarChartState, B as BaseBarChart, C as ComputedBarProps, R as RenderedLinearBarChartProps, j as StyledBarChart, l as StyledBarChartBars, i as StyledBarChartBarsProps, m as StyledBarChartEmptyText, S as StyledBarChartProps, k as StyledBarChartSection, g as StyledBarChartSectionProps, X as XScaleType } from './_internal/styles5.js';
+export { C as ChartContainer, b as ChartContainerDescription, a as ChartContainerTitle, S as StyledChartContainer, d as StyledChartContainerCaption, c as StyledChartContainerTitle } from './_internal/styles6.js';
+export { C as ChartContainerProps, S as StyledChartContainerProps } from './_internal/types3.js';
+export { D as DataPoint, S as StyledDataPoint } from './_internal/styles7.js';
+export { A as AnchorProps, D as DataPointProps, a as LabelVariant, L as LegendVariant, S as StyledDataPointProps, T as TooltipVariant } from './_internal/types4.js';
+export { D as Dot, S as StyledDot } from './_internal/styles8.js';
+export { a as DotProps, D as DotVariant, S as StyledDotProps } from './_internal/types5.js';
+export { L as Legend, S as StyledLegend } from './_internal/styles9.js';
+export { L as LegendProps, S as StyledLegendProps } from './_internal/types6.js';
+export { L as Line, a as LineProps, b as StyledLine, S as StyledLineProps } from './_internal/styles10.js';
+export { L as LineChart, b as LineChartDimensions, a as LineChartLegendVariant, c as LineChartProps, d as StyledLineChart, e as StyledLineChartEmptyText, S as StyledLineChartProps } from './_internal/styles11.js';
+export { P as PieChart, c as PieChartDimensions, b as PieChartLegendVariant, d as PieChartProps, a as PieChartVariant, e as StyledPieChart, f as StyledPieChartCenterText, g as StyledPieChartEmptyText, S as StyledPieChartProps } from './_internal/styles12.js';
+export { S as ScatterPlot, c as ScatterPlotDimensions, b as ScatterPlotLegendVariant, d as ScatterPlotProps, a as ScatterPlotVariant, f as StyledScatterPlot, g as StyledScatterPlotEmptyText, e as StyledScatterPlotProps } from './_internal/styles13.js';
+import { MutableRefObject } from 'react';
+import { J as JSONArray, a as JSONObject, C as CategoryData } from './_internal/data.js';
+export { A as ArcDatum, B as BarDatum, d as CategoricalOrLinearDim, C as CategoryData, f as CategoryDatum, c as CategoryDim, l as CoordinatesCategoryData, i as CoordinatesCategoryDatum, e as CoordinatesCategoryDim, D as Datum, m as DotDatum, E as EmptyDatum, J as JSONArray, a as JSONObject, b as JSONValue, p as LegendItemDatum, n as LinePointDatum, j as LinearData, g as LinearDatum, L as LinearDim, S as Statistic, o as Statistics, k as TwoCategoryData, h as TwoCategoryDatum, T as TwoCategoryDim } from './_internal/data.js';
+import * as d3_scale from 'd3-scale';
+export { C as ChartAxesProps } from './_internal/axis2.js';
+import 'styled-components';
+import '@react-spring/web';
+import './_internal/types7.js';
+import '@redsift/popovers';
+import 'd3-shape';
+
+interface UseBrushProps {
+    brushRef: MutableRefObject<BrushBehavior<unknown> | undefined>;
+    svgRef: MutableRefObject<SVGSVGElement | SVGGElement | undefined>;
+    extent?: [[number, number], [number, number]];
+    scaleX: ScaleLinear<number, number>;
+    scaleY: ScaleLinear<number, number>;
+    isBrushable?: boolean;
+    isGridded?: boolean;
+    onBrush?: (selection: [[number, number], [number, number]] | null, scaleX: ScaleLinear<number, number>, scaleY: ScaleLinear<number, number>) => void;
+    onBrushEnd?: (selection: [[number, number], [number, number]] | null, scaleX: ScaleLinear<number, number>, scaleY: ScaleLinear<number, number>) => void;
+}
+declare const useBrush: ({ brushRef: propsBrushRef, svgRef, extent, scaleX, scaleY, isBrushable, isGridded, onBrush, onBrushEnd, }: UseBrushProps) => void;
+
+interface UseColorProps {
+    /** Dataset to use to generate the chart. */
+    data: JSONArray;
+    /** Color palette to use. */
+    colorTheme: ChartTheme;
+    /** Name of the field that will be used to categorize the data. */
+    category: string | ((d: JSONObject) => string);
+    /** Theme */
+    theme: Theme;
+}
+declare const useColor: ({ data, colorTheme, category, theme }: UseColorProps) => ScaleOrdinal<string, string, never>;
+
+interface UseFormatCategoricalDataProps {
+    /** Dataset to use to generate the chart, should be a list of objects containing a key and a value. */
+    data: CategoryData;
+    /** Color palette to use. */
+    colorTheme: ChartTheme;
+    /** Define how to sort categories. */
+    sortingMethod: SortingMethod;
+    /** Number of categories to use, the rest being put into a new category called "Others". */
+    caping?: number;
+    /** Whether a category should be displayed for categories that has been removed by the caping option. Optionaly, this prop can be used to change the label of this category. */
+    others?: boolean | string;
+    /** Theme */
+    theme: Theme;
+}
+declare const useFormatCategoricalData: ({ data, caping, sortingMethod, others, colorTheme, theme, }: UseFormatCategoricalDataProps) => {
+    data: CategoryData;
+    colorScale: d3_scale.ScaleOrdinal<string, string, never>;
+};
+
+interface UseZoomProps {
+    svgRef: MutableRefObject<SVGSVGElement | undefined>;
+    scaleX: ScaleLinear<number, number>;
+    scaleY: ScaleLinear<number, number>;
+    defaultTransform?: {
+        k: number;
+        x: number;
+        y: number;
+    };
+    size?: any;
+    onZoom?: () => void;
+}
+declare const useZoom: ({ svgRef, scaleX, scaleY, defaultTransform, size, onZoom, }: UseZoomProps) => {
+    transform: {
+        k: number;
+        x: number;
+        y: number;
+    };
+    scaleX: ScaleLinear<number, number, never>;
+    scaleY: ScaleLinear<number, number, never>;
+};
+
+declare const monochrome = "#73C5EB";
+declare const empty = "#BFBFBF";
+declare const scheme: {
+    default: string[];
+    dark: string[];
+    darker: string[];
+    darkerer: string[];
+    light: string[];
+    lighter: string[];
+    lighterer: string[];
+    monochrome: string[];
+    empty: string[];
+};
+declare const successDangerScheme: {
+    success: string;
+    warning: string;
+    danger: string;
+    neutralLight: string;
+    neutralDark: string;
+};
+declare const getColorScale: ({ colorTheme, domain, isEmpty, theme, }: {
+    colorTheme: ChartTheme;
+    domain?: string[] | undefined;
+    isEmpty?: boolean | undefined;
+    theme: Theme;
+}) => ScaleOrdinal<string, string>;
+
+export { UseBrushProps, UseColorProps, UseFormatCategoricalDataProps, UseZoomProps, empty, getColorScale, monochrome, scheme, successDangerScheme, useBrush, useColor, useFormatCategoricalData, useZoom };

package/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;"}

package/index2.js

@@ -0,0 +1,49 @@
+import { ValueOf } from '@redsift/design-system';
+import { f as CategoryDatum, o as Statistics } from './_internal/data.js';
+
+type ChartDimensions = {
+    width: number;
+    height: number;
+};
+declare const ChartSize: {
+    readonly small: "small";
+    readonly medium: "medium";
+    readonly large: "large";
+};
+type ChartSize = ValueOf<typeof ChartSize>;
+type MarginProps = {
+    top?: number;
+    right?: number;
+    bottom?: number;
+    left?: number;
+};
+
+declare const ColorTheme: {
+    readonly default: "default";
+    readonly dark: "dark";
+    readonly darker: "darker";
+    readonly darkerer: "darkerer";
+    readonly light: "light";
+    readonly lighter: "lighter";
+    readonly lighterer: "lighterer";
+    readonly monochrome: "monochrome";
+};
+type ColorTheme = ValueOf<typeof ColorTheme>;
+type SuccessDangerColorTheme = {
+    success: string;
+    warning: string;
+    danger: string;
+    neutral?: string;
+};
+type CustomColorTheme = Record<string, string>;
+type ChartTheme = ColorTheme | SuccessDangerColorTheme | CustomColorTheme;
+
+type SortingMethod = 'none' | 'asc-key' | 'desc-key' | 'asc-value' | 'desc-value' | string[] | ((a: CategoryDatum, b: CategoryDatum) => 1 | -1);
+declare const getSortingMethod: (sortingMethod: SortingMethod) => (a: CategoryDatum, b: CategoryDatum) => 1 | -1;
+declare const isValidDate: (value: string) => boolean;
+declare const mergeLegends: (arr1: Statistics, arr2: Statistics) => {
+    key: any;
+    value: any;
+}[];
+
+export { ChartTheme as C, MarginProps as M, SortingMethod as S, ChartDimensions as a, ChartSize as b, ColorTheme as c, SuccessDangerColorTheme as d, CustomColorTheme as e, getSortingMethod as g, isValidDate as i, mergeLegends as m };