@coinbase/cds-web 8.66.2 → 9.0.0-rc.1

package/dts/visualizations/chart/point/DefaultPointLabel.d.ts

@@ -0,0 +1,10 @@
+import { type ChartTextProps } from '../text';
+import type { PointLabelProps } from './Point';
+export type DefaultPointLabelProps = PointLabelProps &
+  Omit<ChartTextProps, 'children' | 'x' | 'y' | 'horizontalAlignment' | 'verticalAlignment'>;
+/**
+ * DefaultPointLabel is the default label component for point labels.
+ * It renders text at the specified position relative to the point.
+ */
+export declare const DefaultPointLabel: import('react').NamedExoticComponent<DefaultPointLabelProps>;
+//# sourceMappingURL=DefaultPointLabel.d.ts.map

package/dts/visualizations/chart/point/DefaultPointLabel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DefaultPointLabel.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/point/DefaultPointLabel.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,SAAS,CAAC;AAGzD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE/C,MAAM,MAAM,sBAAsB,GAAG,eAAe,GAClD,IAAI,CAAC,cAAc,EAAE,UAAU,GAAG,GAAG,GAAG,GAAG,GAAG,qBAAqB,GAAG,mBAAmB,CAAC,CAAC;AAE7F;;;GAGG;AACH,eAAO,MAAM,iBAAiB,8DAwB7B,CAAC"}

package/dts/visualizations/chart/point/Point.d.ts

@@ -0,0 +1,225 @@
+import React, { type SVGProps } from 'react';
+import type { SharedProps } from '@coinbase/cds-common/types';
+import { type Transition } from 'framer-motion';
+import type { ChartTextChildren, ChartTextProps } from '../text/ChartText';
+import { type PointLabelPosition } from '../utils';
+export type PointBaseProps = SharedProps & {
+  /**
+   * X coordinate in data space (not pixel coordinates).
+   */
+  dataX: number;
+  /**
+   * Y coordinate in data space (not pixel coordinates).
+   */
+  dataY: number;
+  /**
+   * The fill color of the point.
+   * @default 'var(--color-fgPrimary)'
+   */
+  fill?: string;
+  /**
+   * Optional Y-axis id to specify which axis to plot along.
+   * @default first y-axis defined in chart props.
+   * @note Only used for axis selection when layout is 'vertical'. Horizontal layout supports a single y-axis.
+   */
+  yAxisId?: string;
+  /**
+   * Optional X-axis id to specify which axis to plot along.
+   * @default first x-axis defined in chart props.
+   * @note Only used for axis selection when layout is 'horizontal'. Vertical layout uses a single x-axis.
+   */
+  xAxisId?: string;
+  /**
+   * Radius of the point.
+   * @default 5
+   */
+  radius?: number;
+  /**
+   * Opacity of the point.
+   */
+  opacity?: number;
+  /**
+   * Color of the outer stroke around the point.
+   * @default 'var(--color-bg)'
+   */
+  stroke?: string;
+  /**
+   * Outer stroke width of the point.
+   * Set to  0 to remove the stroke.
+   * @default 2
+   */
+  strokeWidth?: number;
+  /**
+   * When set, overrides the chart's animation setting for this specific point.
+   */
+  animate?: boolean;
+  /**
+   * Custom component to render the label.
+   * @default DefaultPointLabel
+   */
+  LabelComponent?: PointLabelComponent;
+  /**
+   * Position of the label relative to the point.
+   * @default 'center'
+   */
+  labelPosition?: PointLabelPosition;
+  /**
+   * Distance in pixels to offset the label from the point.
+   * @default 2 * radius
+   */
+  labelOffset?: number;
+  /**
+   * Font style for the label text.
+   */
+  labelFont?: ChartTextProps['font'];
+};
+/**
+ * Props for point label components.
+ */
+export type PointLabelProps = {
+  /**
+   * X coordinate in SVG pixel space.
+   */
+  x: number;
+  /**
+   * Y coordinate in SVG pixel space.
+   */
+  y: number;
+  /**
+   * X coordinate in data space (usually same as index).
+   */
+  dataX: number;
+  /**
+   * Y coordinate in data space (same as value).
+   */
+  dataY: number;
+  /**
+   * Fill color for the point.
+   */
+  fill: string;
+  /**
+   * Position of the label relative to the point.
+   * @default 'center'
+   */
+  position?: PointLabelPosition;
+  /**
+   * Distance in pixels to offset the label from the point.
+   */
+  offset?: number;
+  /**
+   * Content to display in the label.
+   */
+  children: ChartTextChildren;
+};
+export type PointLabelComponent = React.FC<PointLabelProps>;
+export type PointProps = PointBaseProps &
+  Omit<
+    SVGProps<SVGCircleElement>,
+    | 'onClick'
+    | 'onAnimationStart'
+    | 'onAnimationEnd'
+    | 'onAnimationIteration'
+    | 'onAnimationStartCapture'
+    | 'onAnimationEndCapture'
+    | 'onAnimationIterationCapture'
+    | 'onDrag'
+    | 'onDragEnd'
+    | 'onDragStart'
+    | 'onDragCapture'
+    | 'onDragEndCapture'
+    | 'onDragStartCapture'
+    | 'cx'
+    | 'cy'
+    | 'r'
+    | 'fill'
+    | 'stroke'
+    | 'strokeWidth'
+    | 'opacity'
+    | 'className'
+    | 'style'
+    | 'aria-label'
+    | 'role'
+    | 'tabIndex'
+    | 'onKeyDown'
+  > & {
+    /**
+     * Simple text label to display at the point position.
+     * If provided, a label component will be automatically rendered.
+     */
+    label?: ChartTextChildren;
+    /**
+     * Handler for when the point is clicked.
+     */
+    onClick?: (
+      event: React.MouseEvent,
+      point: {
+        x: number;
+        y: number;
+        dataX: number;
+        dataY: number;
+      },
+    ) => void;
+    /**
+     * Custom class name for the point.
+     */
+    className?: string;
+    /**
+     * Custom styles for the point.
+     */
+    style?: React.CSSProperties;
+    /**
+     * Custom class names for the component.
+     */
+    classNames?: {
+      /**
+       * Custom class name for the point root element.
+       */
+      root?: string;
+      /**
+       * Custom class name for the inner circle element.
+       */
+      point?: string;
+    };
+    /**
+     * Custom styles for the component.
+     */
+    styles?: {
+      /**
+       * Custom styles for the point root element.
+       */
+      root?: React.CSSProperties;
+      /**
+       * Custom styles for the inner circle element.
+       */
+      point?: React.CSSProperties;
+    };
+    /**
+     * Accessibility label for screen readers to describe the point.
+     * If not provided, a default label will be generated using the data coordinates.
+     */
+    accessibilityLabel?: string;
+    /**
+     * Transition configuration for enter and update animations.
+     * @note Disable an animation by passing in null.
+     */
+    transitions?: {
+      /**
+       * Transition for the initial enter/reveal animation.
+       * Set to `null` to disable.
+       */
+      enter?: Transition | null;
+      /**
+       * Transition for subsequent data update animations.
+       * Set to `null` to disable.
+       */
+      update?: Transition | null;
+    };
+    /**
+     * Transition for updates.
+     * @deprecated Use `transitions.update` instead. This will be removed in a future major release.
+     * @deprecationExpectedRemoval v4
+     */
+    transition?: Transition;
+  };
+export declare const Point: React.NamedExoticComponent<PointProps>;
+//# sourceMappingURL=Point.d.ts.map

package/dts/visualizations/chart/point/Point.d.ts.map

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

package/dts/visualizations/chart/point/index.d.ts

@@ -0,0 +1,3 @@
+export * from './DefaultPointLabel';
+export * from './Point';
+//# sourceMappingURL=index.d.ts.map

package/dts/visualizations/chart/point/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/point/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAC;AACpC,cAAc,SAAS,CAAC"}

package/dts/visualizations/chart/scrubber/DefaultScrubberBeacon.d.ts

@@ -0,0 +1,39 @@
+import { type Transition } from 'framer-motion';
+import type { ScrubberBeaconProps, ScrubberBeaconRef } from './Scrubber';
+export type DefaultScrubberBeaconProps = ScrubberBeaconProps & {
+  /**
+   * Radius of the beacon circle.
+   * @default 5
+   */
+  radius?: number;
+  /**
+   * Stroke width of the beacon circle.
+   * @default 2
+   */
+  strokeWidth?: number;
+};
+export declare const DefaultScrubberBeacon: import('react').NamedExoticComponent<
+  import('@coinbase/cds-common').SharedProps &
+    import('./Scrubber').ScrubberBeaconBaseProps & {
+      transitions?: {
+        enter?: Transition | null;
+        update?: Transition | null;
+        pulse?: Transition;
+        pulseRepeatDelay?: number;
+      };
+      className?: string;
+      style?: React.CSSProperties;
+    } & {
+      /**
+       * Radius of the beacon circle.
+       * @default 5
+       */
+      radius?: number;
+      /**
+       * Stroke width of the beacon circle.
+       * @default 2
+       */
+      strokeWidth?: number;
+    } & import('react').RefAttributes<ScrubberBeaconRef>
+>;
+//# sourceMappingURL=DefaultScrubberBeacon.d.ts.map

package/dts/visualizations/chart/scrubber/DefaultScrubberBeacon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DefaultScrubberBeacon.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/scrubber/DefaultScrubberBeacon.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,KAAK,UAAU,EAGhB,MAAM,eAAe,CAAC;AAKvB,OAAO,KAAK,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAkBzE,MAAM,MAAM,0BAA0B,GAAG,mBAAmB,GAAG;IAC7D;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,qBAAqB;;aAkDL,CAAC;cAIQ,CAAC;aAKD,CAAC;wBAIiB,CAAC;;;;;IA3EvD;;;OAGG;aACM,MAAM;IACf;;;OAGG;kBACW,MAAM;qDAoKrB,CAAC"}

package/dts/visualizations/chart/scrubber/DefaultScrubberBeaconLabel.d.ts

@@ -0,0 +1,12 @@
+import { type ChartTextProps } from '../text';
+import type { ScrubberBeaconLabelProps } from './Scrubber';
+export type DefaultScrubberBeaconLabelProps = ScrubberBeaconLabelProps &
+  Pick<
+    ChartTextProps,
+    'background' | 'elevated' | 'borderRadius' | 'font' | 'verticalAlignment' | 'inset' | 'opacity'
+  >;
+/**
+ * DefaultScrubberBeaconLabel is a special instance of ChartText used to label a series' scrubber beacon (i.e. a point on the series pinned to the scrubber position).
+ */
+export declare const DefaultScrubberBeaconLabel: import('react').NamedExoticComponent<DefaultScrubberBeaconLabelProps>;
+//# sourceMappingURL=DefaultScrubberBeaconLabel.d.ts.map

package/dts/visualizations/chart/scrubber/DefaultScrubberBeaconLabel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DefaultScrubberBeaconLabel.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/scrubber/DefaultScrubberBeaconLabel.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzD,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,YAAY,CAAC;AAK3D,MAAM,MAAM,+BAA+B,GAAG,wBAAwB,GACpE,IAAI,CACF,cAAc,EACd,YAAY,GAAG,UAAU,GAAG,cAAc,GAAG,MAAM,GAAG,mBAAmB,GAAG,OAAO,GAAG,SAAS,CAChG,CAAC;AAEJ;;GAEG;AACH,eAAO,MAAM,0BAA0B,uEAsCtC,CAAC"}

package/dts/visualizations/chart/scrubber/DefaultScrubberLabel.d.ts

@@ -0,0 +1,11 @@
+import type { ScrubberLabelProps } from './Scrubber';
+export type DefaultScrubberLabelProps = ScrubberLabelProps;
+/**
+ * DefaultScrubberLabel is the default label component for the scrubber line.
+ * In vertical layout, it positions the label above the scrubber line.
+ * In horizontal layout, it centers the label in the chart's right inset.
+ */
+export declare const DefaultScrubberLabel: import('react').NamedExoticComponent<
+  import('..').ReferenceLineLabelComponentProps
+>;
+//# sourceMappingURL=DefaultScrubberLabel.d.ts.map

package/dts/visualizations/chart/scrubber/DefaultScrubberLabel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DefaultScrubberLabel.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/scrubber/DefaultScrubberLabel.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAErD,MAAM,MAAM,yBAAyB,GAAG,kBAAkB,CAAC;AAE3D;;;;GAIG;AACH,eAAO,MAAM,oBAAoB,qFAsBhC,CAAC"}