@coinbase/cds-mobile-visualization 0.0.0 → 3.4.0-beta.1

package/dts/sparkline/sparkline-interactive/SparklineInteractive.d.ts

@@ -0,0 +1,184 @@
+import React from 'react';
+import { type StyleProp, type ViewStyle } from 'react-native';
+import type { ThemeVars } from '@coinbase/cds-common/core/theme';
+import type { Placement } from '@coinbase/cds-common/types';
+import type {
+  ChartData,
+  ChartFormatAmount,
+  ChartFormatDate,
+  ChartScrubParams,
+  ChartTimeseries,
+} from '@coinbase/cds-common/types/Chart';
+export * from '@coinbase/cds-common/types/Chart';
+export type SparklineInteractiveBaseProps<Period extends string> = {
+  /**
+   * Type of fill to use for the area
+   * @default 'gradient'
+   */
+  fillType?: 'dotted' | 'gradient';
+  /**
+   * Chart data bucketed by Period. Period is a string key
+   */
+  data?: Record<Period, ChartData>;
+  /**
+   * A list of periods that the chart will use. label is what is shown in the bottom of the chart and the value is the key.
+   */
+  periods: {
+    label: string;
+    value: Period;
+  }[];
+  /**
+   * default period value that the chart will use
+   */
+  defaultPeriod: Period;
+  /**
+   * Callback when the user selects a new period.
+   */
+  onPeriodChanged?: (period: Period) => void;
+  /**
+   * Callback when the user starts scrubbing
+   */
+  onScrubStart?: () => void;
+  /**
+   * Callback when a user finishes scrubbing
+   */
+  onScrubEnd?: () => void;
+  /**
+   * Callback used when the user is scrubbing. This will be called for every data point change.
+   */
+  onScrub?: (params: ChartScrubParams<Period>) => void;
+  /**
+   * Disables the scrub user interaction from the chart
+   *
+   * @default false
+   */
+  disableScrubbing?: boolean;
+  /**
+   * function used to format the date that is shown in the bottom of the chart as the user scrubs
+   */
+  formatDate: ChartFormatDate<Period>;
+  /**
+   * Color of the line*
+   */
+  strokeColor: string;
+  /**
+   * Fallback shown in the chart when data is not available. This is usually a loading state.
+   */
+  fallback?: React.ReactNode;
+  /**
+   * If you use the default fallback then this specifies if the fallback line is decreasing or increasing
+   */
+  fallbackType?: 'positive' | 'negative';
+  /**
+   * Show the chart in compact height
+   *
+   * @default false
+   */
+  compact?: boolean;
+  /**
+   * Hides the period selector at the bottom of the chart
+   *
+   * @default false
+   */
+  hidePeriodSelector?: boolean;
+  /**
+   * Adds an area fill to the Sparkline
+   *
+   * @default true
+   */
+  fill?: boolean;
+  /**
+     Formats the date above the chart as you scrub. Omit this if you don't want to show the date as the user scrubs
+     */
+  formatHoverDate?: (date: Date, period: Period) => string;
+  /**
+     Formats the price above the chart as you scrub. Omit this if you don't want to show the price as the user scrubs
+     */
+  formatHoverPrice?: (price: number) => string;
+  /**
+   * Adds a header node above the chart. It will be placed next to the period selector on web.
+   */
+  headerNode?: React.ReactNode;
+  /**
+   *  Optional data to show on hover/scrub instead of the original sparkline. This allows multiple timeseries lines.
+   *
+   *  Period => timeseries list
+   */
+  hoverData?: Record<Period, ChartTimeseries[]>;
+  /**
+   * Optional gutter to add to the Period selector. This is useful if you choose to use the full screen width for the chart
+   */
+  timePeriodGutter?: ThemeVars.Space;
+  /**
+   * Optional placement prop that position the period selector component above or below the chart
+   */
+  periodSelectorPlacement?: Extract<Placement, 'above' | 'below'>;
+  /** Scales the sparkline to show more or less variance. Use a number less than 1 for less variance and a number greater than 1 for more variance. If you use a number greater than 1 it may clip the boundaries of the sparkline. */
+  yAxisScalingFactor?: number;
+};
+export type SparklineInteractiveDefaultFallback = Pick<
+  SparklineInteractiveBaseProps<string>,
+  'fallbackType' | 'compact'
+>;
+export type SparklineInteractiveHoverDateRefProps<Period extends string> = {
+  update: (params: ChartScrubParams<Period>) => void;
+};
+export type SparklineInteractiveProps<Period extends string> =
+  SparklineInteractiveBaseProps<Period> & {
+    /**
+     * Hides the min and max label
+     *
+     * @default false
+     */
+    hideMinMaxLabel?: boolean;
+    /**
+     * function used to format the amount of money used in the minMaxLabel
+     */
+    formatMinMaxLabel?: ChartFormatAmount;
+    /**
+     * The amount of padding to apply to the left and right of the chart. The chart width is calculated by (screen width - 2* gutter).
+     *
+     * @default 3
+     */
+    gutter?: ThemeVars.Space;
+    /**
+     * The chart applies horizontal padding by default which is specified by the gutter.
+     * If the chart is placed in a container with padding then you can disable horizontal padding and set the gutter
+     * to match the container padding.
+     *
+     */
+    disableHorizontalPadding?: boolean;
+    /**
+     * Allows continuous gestures on the Sparkline chart to continue outside the bounds of the chart element.
+     */
+    allowOverflowGestures?: boolean;
+    /**
+     * Custom style for the root element.
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Custom styles for the component.
+     */
+    styles?: {
+      /**
+       * Custom style for the header node.
+       */
+      header?: StyleProp<ViewStyle>;
+      /**
+       * Custom style for the root element.
+       */
+      root?: StyleProp<ViewStyle>;
+    };
+    /** Test ID for the header */
+    headerTestID?: string;
+  };
+declare function SparklineInteractiveWithGeneric<Period extends string>({
+  compact,
+  gutter,
+  ...props
+}: SparklineInteractiveProps<Period>): import('react/jsx-runtime').JSX.Element;
+/**
+ * @deprecated Use LineChart instead.
+ */
+export declare const SparklineInteractive: typeof SparklineInteractiveWithGeneric;
+//# sourceMappingURL=SparklineInteractive.d.ts.map

package/dts/sparkline/sparkline-interactive/SparklineInteractive.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SparklineInteractive.d.ts","sourceRoot":"","sources":["../../../src/sparkline/sparkline-interactive/SparklineInteractive.tsx"],"names":[],"mappings":"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"}

package/dts/sparkline/sparkline-interactive/SparklineInteractiveAnimatedPath.d.ts

@@ -0,0 +1,25 @@
+import React from 'react';
+import { type SparklineFillType } from '../Sparkline';
+export type SparklineInteractiveAnimatedPathProps = {
+  d: string;
+  color: string;
+  area?: string;
+  selectedPeriod: string;
+  fillType?: SparklineFillType;
+  yAxisScalingFactor?: number;
+  initialPath?: string;
+  initialArea?: string;
+};
+export declare const SparklineInteractiveAnimatedPath: React.MemoExoticComponent<
+  ({
+    d,
+    color,
+    selectedPeriod,
+    area,
+    fillType,
+    yAxisScalingFactor,
+    initialPath,
+    initialArea,
+  }: SparklineInteractiveAnimatedPathProps) => import('react/jsx-runtime').JSX.Element
+>;
+//# sourceMappingURL=SparklineInteractiveAnimatedPath.d.ts.map

package/dts/sparkline/sparkline-interactive/SparklineInteractiveAnimatedPath.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SparklineInteractiveAnimatedPath.d.ts","sourceRoot":"","sources":["../../../src/sparkline/sparkline-interactive/SparklineInteractiveAnimatedPath.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwD,MAAM,OAAO,CAAC;AAK7E,OAAO,EAAa,KAAK,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAOjE,MAAM,MAAM,qCAAqC,GAAG;IAClD,CAAC,EAAE,MAAM,CAAC;IACV,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,cAAc,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,gCAAgC,0HAUxC,qCAAqC,6CAkHzC,CAAC"}

package/dts/sparkline/sparkline-interactive/SparklineInteractiveHoverDate.d.ts

@@ -0,0 +1,28 @@
+import React from 'react';
+import { Animated } from 'react-native';
+import type { ChartScrubParams } from '@coinbase/cds-common/types/Chart';
+import type { SparklineInteractiveBaseProps } from './SparklineInteractive';
+type Props<Period extends string> = Pick<
+  SparklineInteractiveBaseProps<Period>,
+  'formatHoverDate'
+> & {
+  shouldTakeUpHeight: boolean;
+};
+export declare function setTransform(
+  x: number,
+  elWidth: number,
+  containerWidth: number,
+  transform: Animated.ValueXY,
+  gutter: number,
+): void;
+export type SparklineInteractiveHoverDateRefProps<Period extends string> = {
+  update: (params: ChartScrubParams<Period>) => void;
+};
+type ForwardRefWithPeriod<Period extends string> = React.ForwardRefExoticComponent<
+  Props<Period> & {
+    ref?: React.Ref<SparklineInteractiveHoverDateRefProps<Period>>;
+  }
+>;
+export declare const SparklineInteractiveHoverDate: ForwardRefWithPeriod<any>;
+export {};
+//# sourceMappingURL=SparklineInteractiveHoverDate.d.ts.map

package/dts/sparkline/sparkline-interactive/SparklineInteractiveHoverDate.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SparklineInteractiveHoverDate.d.ts","sourceRoot":"","sources":["../../../src/sparkline/sparkline-interactive/SparklineInteractiveHoverDate.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2D,MAAM,OAAO,CAAC;AAChF,OAAO,EAAE,QAAQ,EAAyB,MAAM,cAAc,CAAC;AAC/D,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AAGzE,OAAO,KAAK,EAAE,6BAA6B,EAAE,MAAM,wBAAwB,CAAC;AAI5E,KAAK,KAAK,CAAC,MAAM,SAAS,MAAM,IAAI,IAAI,CACtC,6BAA6B,CAAC,MAAM,CAAC,EACrC,iBAAiB,CAClB,GAAG;IACF,kBAAkB,EAAE,OAAO,CAAC;CAC7B,CAAC;AAEF,wBAAgB,YAAY,CAC1B,CAAC,EAAE,MAAM,EACT,OAAO,EAAE,MAAM,EACf,cAAc,EAAE,MAAM,EACtB,SAAS,EAAE,QAAQ,CAAC,OAAO,EAC3B,MAAM,EAAE,MAAM,QAOf;AAiBD,MAAM,MAAM,qCAAqC,CAAC,MAAM,SAAS,MAAM,IAAI;IACzE,MAAM,EAAE,CAAC,MAAM,EAAE,gBAAgB,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC;CACpD,CAAC;AA8GF,KAAK,oBAAoB,CAAC,MAAM,SAAS,MAAM,IAAI,KAAK,CAAC,yBAAyB,CAChF,KAAK,CAAC,MAAM,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,qCAAqC,CAAC,MAAM,CAAC,CAAC,CAAA;CAAE,CACnF,CAAC;AAEF,eAAO,MAAM,6BAA6B,EACI,oBAAoB,CAAC,GAAG,CAAC,CAAC"}

package/dts/sparkline/sparkline-interactive/SparklineInteractiveLineVertical.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+type SparklineInteractiveLineVerticalMobileProps = {
+  color: string;
+  showHoverDate: boolean;
+};
+export declare const SparklineInteractiveLineVertical: React.MemoExoticComponent<
+  ({
+    color,
+    showHoverDate,
+  }: SparklineInteractiveLineVerticalMobileProps) => import('react/jsx-runtime').JSX.Element
+>;
+export {};
+//# sourceMappingURL=SparklineInteractiveLineVertical.d.ts.map

package/dts/sparkline/sparkline-interactive/SparklineInteractiveLineVertical.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SparklineInteractiveLineVertical.d.ts","sourceRoot":"","sources":["../../../src/sparkline/sparkline-interactive/SparklineInteractiveLineVertical.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAW7C,KAAK,2CAA2C,GAAG;IACjD,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,OAAO,CAAC;CACxB,CAAC;AAuFF,eAAO,MAAM,gCAAgC,uDAChB,2CAA2C,6CAgBvE,CAAC"}

package/dts/sparkline/sparkline-interactive/SparklineInteractiveMarkerDates.d.ts

@@ -0,0 +1,17 @@
+import type { ThemeVars } from '@coinbase/cds-common/core/theme';
+import type { ChartFormatDate, ChartGetMarker } from './SparklineInteractive';
+export type SparklineInteractiveMarkerDatesProps<Period extends string> = {
+  getMarker: ChartGetMarker;
+  formatDate: ChartFormatDate<Period>;
+  selectedPeriod: Period;
+  timePeriodGutter?: ThemeVars.Space;
+};
+declare function SparklineInteractiveMarkerDatesWithGeneric<Period extends string>({
+  formatDate,
+  selectedPeriod,
+  getMarker,
+  timePeriodGutter,
+}: SparklineInteractiveMarkerDatesProps<Period>): import('react/jsx-runtime').JSX.Element;
+export declare const SparklineInteractiveMarkerDates: typeof SparklineInteractiveMarkerDatesWithGeneric;
+export {};
+//# sourceMappingURL=SparklineInteractiveMarkerDates.d.ts.map

package/dts/sparkline/sparkline-interactive/SparklineInteractiveMarkerDates.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SparklineInteractiveMarkerDates.d.ts","sourceRoot":"","sources":["../../../src/sparkline/sparkline-interactive/SparklineInteractiveMarkerDates.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAOjE,OAAO,KAAK,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AA2C9E,MAAM,MAAM,oCAAoC,CAAC,MAAM,SAAS,MAAM,IAAI;IACxE,SAAS,EAAE,cAAc,CAAC;IAC1B,UAAU,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IACpC,cAAc,EAAE,MAAM,CAAC;IACvB,gBAAgB,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;CACpC,CAAC;AAEF,iBAAS,0CAA0C,CAAC,MAAM,SAAS,MAAM,EAAE,EACzE,UAAU,EACV,cAAc,EACd,SAAS,EACT,gBAAgB,GACjB,EAAE,oCAAoC,CAAC,MAAM,CAAC,2CAkC9C;AAED,eAAO,MAAM,+BAA+B,EAEvC,OAAO,0CAA0C,CAAC"}

package/dts/sparkline/sparkline-interactive/SparklineInteractiveMinMax.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import type { ChartDataPoint, ChartFormatAmount, ChartXFunction } from '@coinbase/cds-common/types';
+export type SparklineInteractiveMinMaxProps = {
+  dataPoint: ChartDataPoint | undefined;
+  formatMinMaxLabel: ChartFormatAmount;
+  xFunction: ChartXFunction;
+};
+export declare const SparklineInteractiveMinMax: React.FunctionComponent<
+  React.PropsWithChildren<SparklineInteractiveMinMaxProps>
+>;
+//# sourceMappingURL=SparklineInteractiveMinMax.d.ts.map

package/dts/sparkline/sparkline-interactive/SparklineInteractiveMinMax.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SparklineInteractiveMinMax.d.ts","sourceRoot":"","sources":["../../../src/sparkline/sparkline-interactive/SparklineInteractiveMinMax.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6C,MAAM,OAAO,CAAC;AAGlE,OAAO,KAAK,EAAE,cAAc,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AA0EpG,MAAM,MAAM,+BAA+B,GAAG;IAC5C,SAAS,EAAE,cAAc,GAAG,SAAS,CAAC;IACtC,iBAAiB,EAAE,iBAAiB,CAAC;IACrC,SAAS,EAAE,cAAc,CAAC;CAC3B,CAAC;AAEF,eAAO,MAAM,0BAA0B,EAAE,KAAK,CAAC,iBAAiB,CAC9D,KAAK,CAAC,iBAAiB,CAAC,+BAA+B,CAAC,CAwBxD,CAAC"}

package/dts/sparkline/sparkline-interactive/SparklineInteractivePanGestureHandler.d.ts

@@ -0,0 +1,26 @@
+import React from 'react';
+import type { ChartGetMarker, ChartScrubParams } from '@coinbase/cds-common/types/Chart';
+import { type SparklineInteractiveProps } from './SparklineInteractive';
+export type SparklineInteractivePanGestureHandlerProps<Period extends string> = Pick<
+  SparklineInteractiveProps<Period>,
+  'allowOverflowGestures'
+> & {
+  onScrub?: (params: ChartScrubParams<Period>) => void;
+  getMarker: ChartGetMarker;
+  selectedPeriod: Period;
+  onScrubEnd?: () => void;
+  onScrubStart?: () => void;
+  disabled?: boolean;
+  children: React.ReactNode;
+};
+export declare const SparklineInteractivePanGestureHandler: <Period extends string>({
+  onScrubEnd,
+  onScrubStart,
+  onScrub,
+  getMarker,
+  selectedPeriod,
+  children,
+  disabled,
+  allowOverflowGestures,
+}: SparklineInteractivePanGestureHandlerProps<Period>) => import('react/jsx-runtime').JSX.Element;
+//# sourceMappingURL=SparklineInteractivePanGestureHandler.d.ts.map

package/dts/sparkline/sparkline-interactive/SparklineInteractivePanGestureHandler.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SparklineInteractivePanGestureHandler.d.ts","sourceRoot":"","sources":["../../../src/sparkline/sparkline-interactive/SparklineInteractivePanGestureHandler.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAI3C,OAAO,KAAK,EAAE,cAAc,EAAE,gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AAIzF,OAAO,EAAE,KAAK,yBAAyB,EAAE,MAAM,wBAAwB,CAAC;AAMxE,MAAM,MAAM,0CAA0C,CAAC,MAAM,SAAS,MAAM,IAAI,IAAI,CAClF,yBAAyB,CAAC,MAAM,CAAC,EACjC,uBAAuB,CACxB,GAAG;IACF,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,gBAAgB,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC;IACrD,SAAS,EAAE,cAAc,CAAC;IAC1B,cAAc,EAAE,MAAM,CAAC;IACvB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAIF,eAAO,MAAM,qCAAqC,GAChD,MAAM,SAAS,MAAM,EACrB,8GASC,0CAA0C,CAAC,MAAM,CAAC,4CA0FpD,CAAC"}

package/dts/sparkline/sparkline-interactive/SparklineInteractivePaths.d.ts

@@ -0,0 +1,25 @@
+import type { SparklineInteractiveBaseProps } from './SparklineInteractive';
+export type SparklineInteractivePathsProps<Period extends string> = Pick<
+  SparklineInteractiveBaseProps<Period>,
+  'fill' | 'fillType' | 'yAxisScalingFactor' | 'strokeColor' | 'hoverData' | 'compact'
+> & {
+  showHoverData: boolean;
+  path: string;
+  area: string;
+  selectedPeriod: Period;
+};
+declare function SparklineInteractivePathsWithGeneric<Period extends string>({
+  showHoverData,
+  fill,
+  fillType,
+  path,
+  area,
+  selectedPeriod,
+  yAxisScalingFactor,
+  strokeColor,
+  hoverData,
+  compact,
+}: SparklineInteractivePathsProps<Period>): import('react/jsx-runtime').JSX.Element;
+export declare const SparklineInteractivePaths: typeof SparklineInteractivePathsWithGeneric;
+export {};
+//# sourceMappingURL=SparklineInteractivePaths.d.ts.map

package/dts/sparkline/sparkline-interactive/SparklineInteractivePaths.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SparklineInteractivePaths.d.ts","sourceRoot":"","sources":["../../../src/sparkline/sparkline-interactive/SparklineInteractivePaths.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,6BAA6B,EAAE,MAAM,wBAAwB,CAAC;AAQ5E,MAAM,MAAM,8BAA8B,CAAC,MAAM,SAAS,MAAM,IAAI,IAAI,CACtE,6BAA6B,CAAC,MAAM,CAAC,EACrC,MAAM,GAAG,UAAU,GAAG,oBAAoB,GAAG,aAAa,GAAG,WAAW,GAAG,SAAS,CACrF,GAAG;IACF,aAAa,EAAE,OAAO,CAAC;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,cAAc,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF,iBAAS,oCAAoC,CAAC,MAAM,SAAS,MAAM,EAAE,EACnE,aAAa,EACb,IAAI,EACJ,QAAqB,EACrB,IAAI,EACJ,IAAI,EACJ,cAAc,EACd,kBAAkB,EAClB,WAAW,EACX,SAAS,EACT,OAAO,GACR,EAAE,8BAA8B,CAAC,MAAM,CAAC,2CA0CxC;AAED,eAAO,MAAM,yBAAyB,EAEjC,OAAO,oCAAoC,CAAC"}

package/dts/sparkline/sparkline-interactive/SparklineInteractivePeriodSelector.d.ts

@@ -0,0 +1,25 @@
+export type SparklineInteractivePeriodSelectorProps<Period extends string> = {
+  selectedPeriod: Period;
+  setSelectedPeriod: (period: Period) => void;
+  periods: {
+    label: string;
+    value: Period;
+  }[];
+  color: string;
+};
+export type SparklineInteractivePeriodProps<Period extends string> = {
+  period: {
+    label: string;
+    value: Period;
+  };
+  selectedPeriod: Period;
+  setSelectedPeriod: SparklineInteractivePeriodSelectorProps<Period>['setSelectedPeriod'];
+  color: string;
+};
+export declare const SparklineInteractivePeriodSelector: <Period extends string>({
+  selectedPeriod,
+  setSelectedPeriod,
+  periods,
+  color,
+}: SparklineInteractivePeriodSelectorProps<Period>) => import('react/jsx-runtime').JSX.Element;
+//# sourceMappingURL=SparklineInteractivePeriodSelector.d.ts.map

package/dts/sparkline/sparkline-interactive/SparklineInteractivePeriodSelector.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SparklineInteractivePeriodSelector.d.ts","sourceRoot":"","sources":["../../../src/sparkline/sparkline-interactive/SparklineInteractivePeriodSelector.tsx"],"names":[],"mappings":"AAgBA,MAAM,MAAM,uCAAuC,CAAC,MAAM,SAAS,MAAM,IAAI;IAC3E,cAAc,EAAE,MAAM,CAAC;IACvB,iBAAiB,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,OAAO,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IAC5C,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,+BAA+B,CAAC,MAAM,SAAS,MAAM,IAAI;IACnE,MAAM,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;IACzC,cAAc,EAAE,MAAM,CAAC;IACvB,iBAAiB,EAAE,uCAAuC,CAAC,MAAM,CAAC,CAAC,mBAAmB,CAAC,CAAC;IACxF,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AA+EF,eAAO,MAAM,kCAAkC,GAAI,MAAM,SAAS,MAAM,EAAE,wDAKvE,uCAAuC,CAAC,MAAM,CAAC,4CAyDjD,CAAC"}

package/dts/sparkline/sparkline-interactive/SparklineInteractiveProvider.d.ts

@@ -0,0 +1,39 @@
+import React from 'react';
+import { Animated } from 'react-native';
+import type { SharedValue } from 'react-native-reanimated';
+import type { ThemeVars } from '@coinbase/cds-common/core/theme';
+type SparklineInteractiveProviderProps = {
+  children: React.ReactNode;
+  compact?: boolean;
+  gutter?: ThemeVars.Space;
+};
+type SparklineInteractiveContextInterface = {
+  isFallbackVisible: boolean;
+  markerXPosition: SharedValue<number>;
+  markerGestureState: SharedValue<0 | 1>;
+  showFallback: () => void;
+  hideFallback: () => void;
+  chartOpacity: Animated.Value;
+  animateChartIn: Animated.CompositeAnimation;
+  markerOpacity: Animated.Value;
+  animateMarkerIn: Animated.CompositeAnimation;
+  animateMarkerOut: Animated.CompositeAnimation;
+  minMaxOpacity: Animated.Value;
+  animateMinMaxIn: Animated.CompositeAnimation;
+  animateMinxMaxOut: Animated.CompositeAnimation;
+  hoverDateOpacity: Animated.Value;
+  animateHoverDateIn: Animated.CompositeAnimation;
+  animateHoverDateOut: Animated.CompositeAnimation;
+  compact: boolean;
+  gutter: ThemeVars.Space;
+};
+export declare const SparklineInteractiveProvider: React.MemoExoticComponent<
+  ({
+    children,
+    compact,
+    gutter: propGutter,
+  }: SparklineInteractiveProviderProps) => import('react/jsx-runtime').JSX.Element
+>;
+export declare function useSparklineInteractiveContext(): SparklineInteractiveContextInterface;
+export {};
+//# sourceMappingURL=SparklineInteractiveProvider.d.ts.map

package/dts/sparkline/sparkline-interactive/SparklineInteractiveProvider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SparklineInteractiveProvider.d.ts","sourceRoot":"","sources":["../../../src/sparkline/sparkline-interactive/SparklineInteractiveProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAQN,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AACxC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAE3D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAMjE,KAAK,iCAAiC,GAAG;IACvC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;CAC1B,CAAC;AAEF,KAAK,oCAAoC,GAAG;IAC1C,iBAAiB,EAAE,OAAO,CAAC;IAC3B,eAAe,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IACrC,kBAAkB,EAAE,WAAW,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;IACvC,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,YAAY,EAAE,QAAQ,CAAC,KAAK,CAAC;IAC7B,cAAc,EAAE,QAAQ,CAAC,kBAAkB,CAAC;IAC5C,aAAa,EAAE,QAAQ,CAAC,KAAK,CAAC;IAC9B,eAAe,EAAE,QAAQ,CAAC,kBAAkB,CAAC;IAC7C,gBAAgB,EAAE,QAAQ,CAAC,kBAAkB,CAAC;IAC9C,aAAa,EAAE,QAAQ,CAAC,KAAK,CAAC;IAC9B,eAAe,EAAE,QAAQ,CAAC,kBAAkB,CAAC;IAC7C,iBAAiB,EAAE,QAAQ,CAAC,kBAAkB,CAAC;IAC/C,gBAAgB,EAAE,QAAQ,CAAC,KAAK,CAAC;IACjC,kBAAkB,EAAE,QAAQ,CAAC,kBAAkB,CAAC;IAChD,mBAAmB,EAAE,QAAQ,CAAC,kBAAkB,CAAC;IACjD,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,SAAS,CAAC,KAAK,CAAC;CACzB,CAAC;AAuBF,eAAO,MAAM,4BAA4B,wEACa,iCAAiC,6CAoEtF,CAAC;AAEF,wBAAgB,8BAA8B,yCAE7C"}

package/dts/sparkline/sparkline-interactive/SparklineInteractiveTimeseriesPaths.d.ts

@@ -0,0 +1,31 @@
+import React from 'react';
+import type { ChartDataPoint, ChartTimeseries } from '@coinbase/cds-common/types';
+import type { Area, Line } from 'd3-shape';
+export type TimeseriesPathOnRenderParams = {
+  path: string;
+  area: string;
+};
+export type TimeseriesPathProps = {
+  lineFn: Line<ChartDataPoint>;
+  areaFn: Area<ChartDataPoint>;
+  timeseries: ChartTimeseries;
+  initialPath: string;
+  onRender?: ({ path, area }: TimeseriesPathOnRenderParams) => void;
+};
+export type SparklineInteractiveTimeseriesPathsProps = {
+  initialPath: string;
+  data: ChartTimeseries[];
+  width: number;
+  height: number;
+  onRender: ({ path, area }: TimeseriesPathOnRenderParams) => void;
+};
+export declare const SparklineInteractiveTimeseriesPaths: React.MemoExoticComponent<
+  ({
+    data,
+    width,
+    height,
+    initialPath,
+    onRender,
+  }: SparklineInteractiveTimeseriesPathsProps) => import('react/jsx-runtime').JSX.Element
+>;
+//# sourceMappingURL=SparklineInteractiveTimeseriesPaths.d.ts.map

package/dts/sparkline/sparkline-interactive/SparklineInteractiveTimeseriesPaths.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SparklineInteractiveTimeseriesPaths.d.ts","sourceRoot":"","sources":["../../../src/sparkline/sparkline-interactive/SparklineInteractiveTimeseriesPaths.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwD,MAAM,OAAO,CAAC;AAG7E,OAAO,KAAK,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAMlF,OAAO,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAI3C,MAAM,MAAM,4BAA4B,GAAG;IACzC,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,MAAM,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;IAC7B,MAAM,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;IAC7B,UAAU,EAAE,eAAe,CAAC;IAC5B,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,4BAA4B,KAAK,IAAI,CAAC;CACnE,CAAC;AA8EF,MAAM,MAAM,wCAAwC,GAAG;IACrD,WAAW,EAAE,MAAM,CAAC;IACpB,IAAI,EAAE,eAAe,EAAE,CAAC;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,4BAA4B,KAAK,IAAI,CAAC;CAClE,CAAC;AAEF,eAAO,MAAM,mCAAmC,6EACG,wCAAwC,6CA2B1F,CAAC"}

package/dts/sparkline/sparkline-interactive/__figma__/SparklineInteractive.figma.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=SparklineInteractive.figma.d.ts.map

package/dts/sparkline/sparkline-interactive/__figma__/SparklineInteractive.figma.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SparklineInteractive.figma.d.ts","sourceRoot":"","sources":["../../../../src/sparkline/sparkline-interactive/__figma__/SparklineInteractive.figma.tsx"],"names":[],"mappings":""}

package/dts/sparkline/sparkline-interactive/useInterruptiblePathAnimation.d.ts

@@ -0,0 +1,13 @@
+import { Animated } from 'react-native';
+type Params = {
+  animationListener: Animated.ValueListenerCallback;
+  onInterrupt: () => void;
+  ignoreMinMax?: boolean;
+};
+export declare const useInterruptiblePathAnimation: ({
+  animationListener,
+  onInterrupt,
+  ignoreMinMax,
+}: Params) => () => void;
+export {};
+//# sourceMappingURL=useInterruptiblePathAnimation.d.ts.map

package/dts/sparkline/sparkline-interactive/useInterruptiblePathAnimation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useInterruptiblePathAnimation.d.ts","sourceRoot":"","sources":["../../../src/sparkline/sparkline-interactive/useInterruptiblePathAnimation.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAWxC,KAAK,MAAM,GAAG;IACZ,iBAAiB,EAAE,QAAQ,CAAC,qBAAqB,CAAC;IAClD,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,CAAC;AAEF,eAAO,MAAM,6BAA6B,GAAI,mDAI3C,MAAM,eA4CR,CAAC"}

package/dts/sparkline/sparkline-interactive/useMinMaxTransform.d.ts

@@ -0,0 +1,16 @@
+import { Animated } from 'react-native';
+import type { LayoutRectangle } from 'react-native';
+type MinMaxTransformParams = {
+  minMaxLayout: LayoutRectangle;
+  x: number;
+  transform: Animated.ValueXY;
+  opacity: Animated.Value;
+};
+export declare function useMinMaxTransform({
+  minMaxLayout,
+  x,
+  transform,
+  opacity,
+}: MinMaxTransformParams): void;
+export {};
+//# sourceMappingURL=useMinMaxTransform.d.ts.map

package/dts/sparkline/sparkline-interactive/useMinMaxTransform.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMinMaxTransform.d.ts","sourceRoot":"","sources":["../../../src/sparkline/sparkline-interactive/useMinMaxTransform.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AACxC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAOpD,KAAK,qBAAqB,GAAG;IAC3B,YAAY,EAAE,eAAe,CAAC;IAC9B,CAAC,EAAE,MAAM,CAAC;IACV,SAAS,EAAE,QAAQ,CAAC,OAAO,CAAC;IAC5B,OAAO,EAAE,QAAQ,CAAC,KAAK,CAAC;CACzB,CAAC;AAEF,wBAAgB,kBAAkB,CAAC,EAAE,YAAY,EAAE,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,EAAE,qBAAqB,QAiDhG"}

package/dts/sparkline/sparkline-interactive/useOpacityAnimation.d.ts

@@ -0,0 +1,6 @@
+import { Animated } from 'react-native';
+export declare function useOpacityAnimation(
+  initialValue?: number | undefined,
+  duration?: number | undefined,
+): [Animated.Value, Animated.CompositeAnimation, Animated.CompositeAnimation];
+//# sourceMappingURL=useOpacityAnimation.d.ts.map

package/dts/sparkline/sparkline-interactive/useOpacityAnimation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useOpacityAnimation.d.ts","sourceRoot":"","sources":["../../../src/sparkline/sparkline-interactive/useOpacityAnimation.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAGxC,wBAAgB,mBAAmB,CACjC,YAAY,GAAE,MAAM,GAAG,SAAa,EACpC,QAAQ,GAAE,MAAM,GAAG,SAAwB,GAC1C,CAAC,QAAQ,CAAC,KAAK,EAAE,QAAQ,CAAC,kBAAkB,EAAE,QAAQ,CAAC,kBAAkB,CAAC,CAwB5E"}

package/dts/sparkline/sparkline-interactive/useSparklineInteractiveConstants.d.ts

@@ -0,0 +1,22 @@
+type Props = {
+  compact?: boolean;
+};
+export declare function useSparklineInteractiveConstants({ compact }: Props): {
+  chartHorizontalGutter: number;
+  chartWidth: number;
+  chartHeight: number;
+  chartDimensionStyles: {
+    height: number;
+    width: number;
+  };
+  chartMarkerSize: number;
+  SparklineInteractiveMinMaxLabelHeight: number;
+  SparklineInteractiveMinMaxVerticalGutter: number;
+  chartVerticalLineWidth: number;
+  xRange: number[];
+  yRange: number[];
+  startX: number;
+  endX: number;
+};
+export {};
+//# sourceMappingURL=useSparklineInteractiveConstants.d.ts.map

package/dts/sparkline/sparkline-interactive/useSparklineInteractiveConstants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSparklineInteractiveConstants.d.ts","sourceRoot":"","sources":["../../../src/sparkline/sparkline-interactive/useSparklineInteractiveConstants.ts"],"names":[],"mappings":"AAWA,KAAK,KAAK,GAAG;IACX,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,wBAAgB,gCAAgC,CAAC,EAAE,OAAe,EAAE,EAAE,KAAK;;;;;;;;;;;;;;;;EAoC1E"}

package/dts/sparkline/sparkline-interactive/useSparklineInteractiveLineStyles.d.ts

@@ -0,0 +1,34 @@
+export declare function useSparklineInteractiveLineStyles(): {
+  dotStyle: (
+    | {
+        backgroundColor: string;
+        position?: undefined;
+        top?: undefined;
+        left?: undefined;
+        height?: undefined;
+        width?: undefined;
+        borderRadius?: undefined;
+        opacity?: undefined;
+      }
+    | {
+        position: string;
+        top: number;
+        left: number;
+        height: number;
+        width: number;
+        borderRadius: number;
+        opacity: number;
+        backgroundColor?: undefined;
+      }
+  )[];
+  lineProps: {
+    strokeWidth: number;
+    stroke: string;
+    x1: number;
+    x2: number;
+    y1: number;
+    y2: number;
+    strokeDasharray: number[];
+  };
+};
+//# sourceMappingURL=useSparklineInteractiveLineStyles.d.ts.map

package/dts/sparkline/sparkline-interactive/useSparklineInteractiveLineStyles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSparklineInteractiveLineStyles.d.ts","sourceRoot":"","sources":["../../../src/sparkline/sparkline-interactive/useSparklineInteractiveLineStyles.ts"],"names":[],"mappings":"AAYA,wBAAgB,iCAAiC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA4BhD"}