@ssa-ui-kit/core 3.4.0 → 3.6.0

package/dist/components/Charts/BarGaugeChart/types.d.ts

@@ -21,7 +21,7 @@ export interface GaugeBarProps {
     max?: number;
 }
 export interface BarGaugeChartProps {
-    title?: string;
+    title?: React.ReactNode;
     widgetCardProps?: WidgetCardProps;
     bars?: GaugeBarProps[];
     features?: BarGaugeChartFeature[];

package/dist/components/Charts/BarLineComplexChart/constants.d.ts

@@ -1,16 +1 @@
 export declare const FONT_FAMILY = "Manrope, sans-serif";
-export declare const TITLE_PADDING_LEFT: {
-    mobile: number;
-    md: number;
-    other: number;
-};
-export declare const TITLE_PADDING_TOP: {
-    mobile: number;
-    md: number;
-    other: number;
-};
-export declare const TITLE_FONT_SIZE: {
-    mobile: number;
-    md: number;
-    other: number;
-};

package/dist/components/Charts/BarLineComplexChart/types.d.ts

@@ -15,7 +15,7 @@ export interface BarLineComplexChartProps extends Omit<PlotParams, 'layout'> {
     lineShape?: Plotly.ScatterLine['shape'];
     width?: string;
     height?: string;
-    title?: string;
+    title?: React.ReactNode;
     maxVisibleBars?: number;
     maxVisibleLines?: number;
     container?: Element | DocumentFragment;

package/dist/components/Charts/BigNumberChart/BigNumberChart.d.ts

@@ -6,7 +6,7 @@ type Datum = LineSeries['data'][number];
 export interface BigNumberChartProps {
     data: Datum[];
     interactive?: boolean;
-    title?: string;
+    title?: React.ReactNode;
     widgetCardProps?: WidgetCardProps;
     trendLineProps?: Omit<TrendLineProps, 'data' | 'height' | 'width'>;
     features?: BigNumberChartFeatures[];

package/dist/components/Charts/CandlestickChart/CandlestickChart.d.ts

@@ -5,7 +5,7 @@ export type CandlestickChartFeatures = 'header' | 'fullscreenMode';
 export interface CandlestickChartProps extends Partial<Omit<PlotParams, 'data' | 'style'>> {
     data: CandlestickChartData;
     style?: CandlestickStyle;
-    title?: string;
+    title?: React.ReactNode;
     features?: CandlestickChartFeatures[];
     widgetCardProps?: WidgetCardProps;
 }

package/dist/components/Charts/GaugeChart/GaugeChart.d.ts

@@ -5,7 +5,7 @@ export interface GaugeChartProps extends Pick<GaugeChartLabelsProps, 'maxLabel'
     minValue: number;
     maxValue: number;
     value: number;
-    title?: string;
+    title?: React.ReactNode;
     segments?: {
         value: number;
         id?: string;

package/dist/components/Charts/RadarChart/RadarChart.d.ts

@@ -4,7 +4,7 @@ declare const ResponsiveRadar: <D extends Record<string, unknown>>(props: import
 export type RadarChartFeatures = 'header' | 'fullscreenMode';
 type ResponsiveRadarProps<D extends Record<string, unknown>> = ComponentProps<typeof ResponsiveRadar<D>>;
 export interface RadarChartProps<D extends Record<string, unknown>> extends Omit<ResponsiveRadarProps<D>, 'legends'> {
-    title?: string;
+    title?: React.ReactNode;
     legends?: Partial<NonNullable<ResponsiveRadarProps<D>['legends']>[number]>[];
     features?: RadarChartFeatures[];
     widgetCardProps?: WidgetCardProps;

package/dist/components/Charts/TreeMapChart/TreeMapChart.d.ts

@@ -10,7 +10,7 @@ export type TreeMapChartFeature = 'header' | 'fullscreenMode';
 type NivoTreeMapChartProps = React.ComponentProps<typeof ResponsiveTreeMap<TreeNode>>;
 export interface TreeMapChartProps extends Omit<NivoTreeMapChartProps, 'data'> {
     data: TreeNode;
-    title?: string;
+    title?: React.ReactNode;
     fullScreen?: boolean;
     features?: TreeMapChartFeature[];
     widgetCardProps?: WidgetCardProps;

package/dist/components/Counter/Counter.d.ts

@@ -0,0 +1,60 @@
+import { CounterProps } from './types';
+/**
+ * Counter - Compact numeric indicator for displaying counts or notification badges.
+ *
+ * ### Sizing
+ * Accepts `'small' | 'medium' | 'large'` via the `size` prop (default `'medium'`).
+ * When `count` is omitted the counter shrinks to a small dot (`dot` size) — useful
+ * as a presence indicator with no number shown.
+ *
+ * ### Color
+ * Background is driven by `theme.palette[variant].main` for the five semantic variants.
+ * Pass `color` to override: a `theme.colors` key resolves to the design token value,
+ * any other string is used as a raw CSS color.
+ *
+ * ### CSS override
+ * Pass `css` to apply one-off Emotion styles on top of all internal styles
+ * (size → variant → color → css). Useful for margins, positioning, or shape tweaks.
+ *
+ * ### Overflow
+ * Values above 99 are automatically clamped to `"99+"`.
+ *
+ * @example
+ * ```tsx
+ * // Basic usage — primary variant, medium size
+ * <Counter count={5} />
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Overflow label
+ * <Counter count={120} variant={CounterVariants.error} size="large" />
+ * // renders "99+"
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Raw hex color override
+ * <Counter count={3} color="#F7931A" />
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // theme.colors key as color
+ * <Counter count={7} color="purple" />
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Empty dot indicator (no count)
+ * <Counter variant={CounterVariants.error} />
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // CSS override for layout / shape
+ * <Counter count={3} css={{ marginLeft: 8, borderRadius: 4 }} />
+ * ```
+ */
+export declare const Counter: ({ count, variant, size, color, className, css, ref, }: CounterProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export default Counter;

package/dist/components/Counter/index.d.ts

@@ -0,0 +1 @@
+export * from './Counter';

package/dist/components/Counter/styles.d.ts

@@ -0,0 +1,15 @@
+import { VariantStyle, CounterSizes } from './types';
+import { Theme, SerializedStyles } from '@emotion/react';
+import { ColorsKeys } from '../../types/emotion';
+export declare const variantStyles: VariantStyle;
+export declare const sizeStyles: CounterSizes;
+/**
+ * Builds a background override from a `color` string.
+ * If `color` matches a key in `theme.colors` the design token is used;
+ * otherwise the value is passed through as a raw CSS color string.
+ */
+export declare const makeColorOverride: (theme: Theme, color: ColorsKeys | string) => SerializedStyles;
+export declare const CounterBase: import("@emotion/styled").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/dist/components/Counter/types.d.ts

@@ -0,0 +1,57 @@
+import React from 'react';
+import { MainSizes } from '../../types/global';
+import { ColorsKeys } from '../../types/emotion';
+import { Interpolation, SerializedStyles, Theme } from '@emotion/react';
+export declare enum CounterVariants {
+    primary = "primary",
+    secondary = "secondary",
+    error = "error",
+    warning = "warning",
+    success = "success"
+}
+export type VariantStyle = {
+    [k in CounterVariants]: (theme: Theme) => SerializedStyles;
+};
+/**
+ * Extends `MainSizes` with a `dot` slot used internally when `count` is
+ * undefined — renders a small dot with no label as a presence indicator.
+ */
+export type CounterSizes = MainSizes & {
+    dot: SerializedStyles;
+};
+export type CounterProps = {
+    /**
+     * The numeric value to display. Values above 99 are clamped to `"99+"`.
+     * When omitted, the counter renders as a dot with no label.
+     */
+    count?: number;
+    /**
+     * Visual style variant. Drives the background color from `theme.palette`.
+     * @default CounterVariants.primary
+     */
+    variant?: CounterVariants;
+    /**
+     * Size of the counter.
+     * Ignored when `count` is undefined — the component uses `dot` automatically.
+     * @default 'medium'
+     */
+    size?: keyof MainSizes;
+    /**
+     * Optional color override. Accepts a `theme.colors` key or any valid CSS color string.
+     * When provided, overrides the variant background.
+     */
+    color?: ColorsKeys | string;
+    /**
+     * Custom CSS class name.
+     */
+    className?: string;
+    /**
+     * Emotion CSS override applied after all internal styles.
+     * Use for one-off layout adjustments (e.g. margins, positioning).
+     */
+    css?: Interpolation<Theme>;
+    /**
+     * Ref forwarded to the root `<div>` element.
+     */
+    ref?: React.Ref<HTMLDivElement>;
+};

package/dist/components/index.d.ts

@@ -70,6 +70,8 @@ export * from './Typography';
 export type * from './Typography/types';
 export { default as Badge } from './Badge';
 export type * from './Badge/types';
+export * from './Counter';
+export type * from './Counter/types';
 export { default as Tag } from './Tag';
 export * from './Tag';
 export type * from './Tag/types';