@agregio-solutions/design-system 1.76.3 → 1.77.0

package/dist/packages/components/ChartLegend/ChartLegend.d.ts

@@ -1,4 +1,6 @@
 import { ButtonProps } from 'react-aria-components';
+export declare const chartLegendIcons: readonly ["line", "plainline", "dottedline", "square", "rect", "circle", "cross", "diamond", "star", "triangle", "wye"];
+export type ChartLegendIcon = (typeof chartLegendIcons)[number];
 export type Props = Omit<ButtonProps, "onPress" | "isDisabled" | "children"> & {
     /**
      * Button text, required.
@@ -8,13 +10,29 @@ export type Props = Omit<ButtonProps, "onPress" | "isDisabled" | "children"> & {
      * Color of the related chart element.
      */
     chartColor: string;
+    /**
+     * Color of the outline of the bullet (default to white).
+     * Can be useful if the color is not visible enough on the background.
+     * Only applied if the icon is "circle".
+     */
+    circleOutlineColor?: string;
     /**
      * Handler that is called when the press is released over the target.
+     * If not provided, the legend item will not render as a button but instead as a simple legend item (no interaction).
      */
     onClick?: () => void;
     /**
      * Whether the legend item is selected.
      */
     isSelected?: boolean;
+    /**
+     * The icon to display to represent the legend color.
+     * @default "circle".
+     */
+    icon?: ChartLegendIcon;
+    /**
+     * The custom icon to display (like a CSS shape or an SVG icon) to replace the default icon.
+     */
+    customIcon?: React.ReactNode;
 };
-export default function ChartLegend({ text, chartColor, onClick, isSelected, ...reactAriaButtonProps }: Props): import("react/jsx-runtime").JSX.Element;
+export default function ChartLegend({ text, chartColor, onClick, isSelected, icon, customIcon, circleOutlineColor, ...reactAriaButtonProps }: Props): import("react/jsx-runtime").JSX.Element;

package/dist/packages/components/ChartTooltip/ChartTooltip.d.ts

@@ -0,0 +1,51 @@
+import { default as React } from 'react';
+export interface ChartTooltipItem {
+    /**
+     * Text to display in the tooltip
+     */
+    text: string;
+    /**
+     * Color of the bullet
+     */
+    color: string;
+    /**
+     * Color of the outline of the bullet (default to the color).
+     * Can be useful if the color is not visible enough on the background.
+     */
+    outlineColor?: string;
+}
+export interface Props {
+    /**
+     * Main title displayed at the top of the tooltip
+     */
+    title: string;
+    /**
+     * List of label-value pairs with an associated bullet color
+     */
+    items: ChartTooltipItem[];
+    /**
+     * Additional description of the tooltip, placed under the items
+     */
+    description?: string;
+    /**
+     * Title of middle section.
+     */
+    bodyTitle?: string;
+    /**
+     * Text content of middle section.
+     */
+    bodyContent?: string;
+    /**
+     * Custom content for the footer area. Must be read-only (i.e. no interactivity like buttons, links, etc.)
+     */
+    footerSlot?: React.ReactNode;
+    /**
+     * Additional CSS class for customizing the root container
+     */
+    className?: string;
+    /**
+     * Additional styles for the root container
+     */
+    style?: React.CSSProperties;
+}
+export default function ChartTooltip({ title, items, description, bodyTitle, bodyContent, footerSlot, ...props }: Props): import("react/jsx-runtime").JSX.Element;

package/dist/packages/index.d.ts

@@ -4,6 +4,7 @@ import { default as Breadcrumbs } from './components/Breadcrumbs';
 import { default as Button } from './components/Button';
 import { default as Calendar, CalendarCell } from './components/Calendar/Calendar';
 import { default as ChartLegend } from './components/ChartLegend/ChartLegend';
+import { default as ChartTooltip } from './components/ChartTooltip/ChartTooltip';
 import { default as Checkbox } from './components/Checkbox';
 import { default as CheckboxGroup } from './components/CheckboxGroup';
 import { default as Chip } from './components/Chip';
@@ -68,5 +69,5 @@ import { default as createMuiTheme } from './mui/mui-theme.ts';
 import { tokens, fontSize, lineHeight } from './ds-design-tokens/index';
 import { I18nProvider } from 'react-aria';
 import { toast } from 'sonner';
-export { Accordion, Badge, Breadcrumbs, Button, Calendar, CalendarCell, ChartLegend, Checkbox, CheckboxGroup, Chip, Combobox, createMuiTheme, DataTable, DataTableCell, DataTableHeader, DataTableRoot, DataTableRow, DatePicker, DateRangePicker, Drawer, Dropdown, DropdownListItem, EmptyState, FileUpload, Filter, fontSize, Header, I18nProvider, Icon, Label, LinearProgressBar, lineHeight, Link, List, Loader, Menu, MenuItem, Message, Modal, ModalContent, ModalActions, ModalForm, Navigation, NavigationItem, Notifications, NotificationCard, PageLayout, Pagination, Popover, PopoverTrigger, Radio, RouterProvider, SearchBar, SegmentedControl, SegmentedControlButton, SegmentedControlList, SegmentedControlPanel, Select, SelectItem, Skeleton, Slider, Stepper, Step, Switch, Tab, TabList, TabPanel, Tabs, Tag, TextInput, TimeField, Timeline, toast, Toaster, Tooltip, TooltipTrigger, tokens, YearMonthPicker, };
+export { Accordion, Badge, Breadcrumbs, Button, Calendar, CalendarCell, ChartLegend, ChartTooltip, Checkbox, CheckboxGroup, Chip, Combobox, createMuiTheme, DataTable, DataTableCell, DataTableHeader, DataTableRoot, DataTableRow, DatePicker, DateRangePicker, Drawer, Dropdown, DropdownListItem, EmptyState, FileUpload, Filter, fontSize, Header, I18nProvider, Icon, Label, LinearProgressBar, lineHeight, Link, List, Loader, Menu, MenuItem, Message, Modal, ModalContent, ModalActions, ModalForm, Navigation, NavigationItem, Notifications, NotificationCard, PageLayout, Pagination, Popover, PopoverTrigger, Radio, RouterProvider, SearchBar, SegmentedControl, SegmentedControlButton, SegmentedControlList, SegmentedControlPanel, Select, SelectItem, Skeleton, Slider, Stepper, Step, Switch, Tab, TabList, TabPanel, Tabs, Tag, TextInput, TimeField, Timeline, toast, Toaster, Tooltip, TooltipTrigger, tokens, YearMonthPicker, };
 export type { TypeTableColumnWithFilter };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@agregio-solutions/design-system",
-  "version": "1.76.3",
+  "version": "1.77.0",
   "description": "React Component library and Storybook that is part of the Design System for Agregio Solutions",
   "type": "module",
   "module": "dist/design-system.js",