h2o-library 1.7.0 → 1.8.0

package/dist/esm/components/src/chart-line.d.ts

@@ -21,5 +21,6 @@ export interface LineChartProps {
     showXValue?: boolean;
     onXAxisTickClick?: (value: string | number) => void;
     onYAxisTickClick?: (value: string | number) => void;
+    onDataPointClick?: (point: LineChartDataPoint, index: number, dataKey: string) => void;
 }
-export declare const LineChart: ({ data, lines, showGrid, showLegend, showGradient, height, showXValue, onXAxisTickClick, onYAxisTickClick, }: LineChartProps) => React.JSX.Element;
+export declare const LineChart: ({ data, lines, showGrid, showLegend, showGradient, height, showXValue, onXAxisTickClick, onYAxisTickClick, onDataPointClick, }: LineChartProps) => React.JSX.Element;

package/dist/esm/components/src/chart-pie.d.ts

@@ -12,5 +12,6 @@ export interface PieChartProps {
     height?: number;
     showLabels?: boolean;
     showPercentageInTooltip?: boolean;
+    onSliceClick?: (dataPoint: PieChartDataPoint, index: number) => void;
 }
-export declare const PieChart: ({ data, variant, showLegend, height, showLabels, showPercentageInTooltip, }: PieChartProps) => React.JSX.Element;
+export declare const PieChart: ({ data, variant, showLegend, height, showLabels, showPercentageInTooltip, onSliceClick, }: PieChartProps) => React.JSX.Element;

package/dist/esm/components/src/checkbox.d.ts

@@ -2,6 +2,7 @@ import React from "react";
 export interface CheckboxProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "type"> {
     label?: string;
     className?: string;
+    labelClassName?: string;
     isCard?: boolean;
     isIndeterminate?: boolean;
 }

package/dist/esm/components/src/chip.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+import { IconType } from "../../types";
+type ChipProps = React.HTMLAttributes<HTMLDivElement> & {
+    className?: string;
+    label: string;
+    icon?: IconType;
+    variant?: "neutral" | "primary" | "success" | "warning" | "error";
+    iconStrokeWidth?: number;
+    iconClassName?: string;
+    iconSize?: number;
+};
+export declare const Chip: ({ className, label, icon, variant, iconStrokeWidth, iconClassName, iconSize, ...props }: ChipProps) => React.JSX.Element;
+export {};

package/dist/esm/components/src/expandable-table.d.ts

@@ -35,5 +35,6 @@ export interface ExpandableTableProps<T extends Record<string, any> & Expandable
     selectedRows?: T[];
     setSelectedRows?: (rows: T[]) => void;
     rowKey?: keyof T;
+    onRowClick?: (row: T, rowIndex: number) => void;
 }
-export declare function ExpandableTable<T extends Record<string, any> & ExpandableRow>({ columns, data, isLoading, className, rowHeight, sortKey, sortDirection, onSort, currentPage, totalPages, perPage, perPageOptions, onPageChange, onPerPageChange, maxHeight, containerClassName, selectedRows, setSelectedRows, rowKey, }: ExpandableTableProps<T>): React.JSX.Element;
+export declare function ExpandableTable<T extends Record<string, any> & ExpandableRow>({ columns, data, isLoading, className, rowHeight, sortKey, sortDirection, onSort, currentPage, totalPages, perPage, perPageOptions, onPageChange, onPerPageChange, maxHeight, containerClassName, selectedRows, setSelectedRows, rowKey, onRowClick, }: ExpandableTableProps<T>): React.JSX.Element;

package/dist/esm/components/src/icon.d.ts

@@ -3,7 +3,8 @@ import { IconType, TooltipPosition } from "../../types";
 export interface IconProps extends React.SVGProps<SVGSVGElement> {
     icon: IconType;
     size?: number;
-    tooltip?: string;
+    tooltip?: string | React.ReactNode;
     tooltipPosition?: TooltipPosition;
+    tooltipVariant?: "dark" | "light";
 }
-export declare const Icon: ({ icon, size, tooltip, tooltipPosition, ...props }: IconProps) => JSX.Element;
+export declare const Icon: ({ icon, size, tooltip, tooltipPosition, tooltipVariant, ...props }: IconProps) => JSX.Element;

package/dist/esm/components/src/message.d.ts

@@ -1,9 +1,12 @@
 import React from "react";
-export type MessageVariant = "info" | "muted" | "error" | "warning";
+export type MessageVariant = "info" | "muted" | "error" | "warning" | "success";
 interface MessageProps {
     variant: MessageVariant;
     className?: string;
+    iconSize?: number;
+    iconStrokeWidth?: number;
+    iconClassName?: string;
     message?: string | null;
 }
-export declare const Message: ({ variant, className, message }: MessageProps) => React.JSX.Element | null;
+export declare const Message: ({ variant, className, iconSize, iconStrokeWidth, iconClassName, message, }: MessageProps) => React.JSX.Element | null;
 export {};

package/dist/esm/components/src/modal.d.ts

@@ -6,5 +6,11 @@ export interface ModalProps {
     description?: string;
     children: React.ReactNode;
     className?: string;
+    titleContainerClassName?: string;
+    titleClassName?: string;
+    descriptionClassName?: string;
+    closeButtonClassName?: string;
+    headerClassName?: string;
+    contentClassName?: string;
 }
-export declare const Modal: ({ isOpen, onClose, title, description, children, className, }: ModalProps) => React.ReactPortal | null;
+export declare const Modal: ({ isOpen, onClose, title, description, children, className, titleContainerClassName, titleClassName, descriptionClassName, closeButtonClassName, headerClassName, contentClassName, }: ModalProps) => React.ReactPortal | null;

package/dist/esm/components/src/segmented-toggle.d.ts

@@ -0,0 +1,20 @@
+import React from "react";
+import { IconType } from "../../types";
+import type { IconProps as IconPropsType } from "./icon";
+export type SegmentedToggleOption = {
+    label: string;
+    value: string;
+    icon?: IconType;
+    iconProps?: Omit<IconPropsType, "icon">;
+    labelProps?: React.HTMLAttributes<HTMLSpanElement>;
+};
+export interface SegmentedToggleProps {
+    options: SegmentedToggleOption[];
+    size?: "sm" | "md" | "lg";
+    className?: string;
+    optionClassName?: string;
+    selected: string;
+    onChange: (value: string) => void;
+    disabled?: boolean;
+}
+export declare function SegmentedToggle({ options, size, className, optionClassName, selected, onChange, disabled, }: SegmentedToggleProps): React.JSX.Element;

package/dist/esm/components/src/side-panel.d.ts

@@ -2,9 +2,15 @@ import React from "react";
 export interface SidePanelProps {
     isOpen: boolean;
     onClose: () => void;
+    position?: "left" | "right";
     title?: string;
     description?: string;
     children: React.ReactNode;
     className?: string;
+    titleClassName?: string;
+    descriptionClassName?: string;
+    closeButtonClassName?: string;
+    headerClassName?: string;
+    contentClassName?: string;
 }
-export declare const SidePanel: ({ isOpen, onClose, title, description, children, className, }: SidePanelProps) => JSX.Element | null;
+export declare const SidePanel: ({ isOpen, onClose, position, title, description, children, className, titleClassName, descriptionClassName, closeButtonClassName, headerClassName, contentClassName, }: SidePanelProps) => JSX.Element | null;

package/dist/esm/components/src/textarea.d.ts

@@ -9,5 +9,7 @@ export interface TextareaProps extends Omit<React.TextareaHTMLAttributes<HTMLTex
     containerClassName?: string;
     tooltip?: string;
     tooltipPosition?: TooltipPosition;
+    maxLength?: number;
+    enableResize?: boolean;
 }
 export declare const Textarea: React.ForwardRefExoticComponent<TextareaProps & React.RefAttributes<HTMLTextAreaElement>>;

package/dist/esm/components/src/tooltip.d.ts

@@ -3,7 +3,9 @@ import { TooltipPosition } from "../../types";
 type BaseProps = {
     position?: TooltipPosition;
     className?: string;
+    contentClassName?: string;
     children: React.ReactNode;
+    variant?: "dark" | "light";
 };
 type TextTooltip = BaseProps & {
     text: string;

package/dist/esm/css/index.css

@@ -1 +1 @@
-:root{--primary-disabled:225 100% 88%;--primary-muted:221 100% 95%;--primary:225 91% 59%;--primary-200:225 100% 43%;--primary-300:225 91% 40%;--primary-400:225 91% 18%;--success-bg:143 26% 86%;--success:130 35% 46%;--success-200:130 76% 26%;--success-300:130 100% 18%;--warning-bg:45 100% 84%;--warning:45 100% 61%;--warning-200:45 100% 45%;--warning-300:45 100% 32%;--destructive-bg:357 100% 92%;--destructive:0 83% 60%;--destructive-200:0 100% 42%;--destructive-300:0 100% 29%;--muted-25:0 0 98%;--muted-50:0 0 96%;--muted:0 0 80%;--muted-200:0 0 67%;--radius-sm:0.25rem;--radius-md:0.375rem;--radius-lg:0.5rem;--radius-full:9999px}@import "./src/accordion.css";@import "./src/button.css";@import "./src/calendar.css";@import "./src/checkbox.css";@import "./src/content-switch.css";@import "./src/date-range-picker.css";@import "./src/dropdown.css";@import "./src/input.css";@import "./src/modal.css";@import "./src/multi-select.css";@import "./src/compact-multi-select.css";@import "./src/popover.css";@import "./src/radio.css";@import "./src/search.css";@import "./src/side-panel.css";@import "./src/status.css";@import "./src/tabs.css";@import "./src/tag.css";@import "./src/textarea.css";@import "./src/toggle.css";@import "./src/tooltip.css";@import "./src/pagination.css";@import "./src/table.css";@import "./src/toast.css";@import "./src/month-calendar.css";@import "./src/loader.css";@import "./src/message.css";@import "./src/multi-menu.css";@import "./src/charts.css";@import "./src/chart.css";@import "./src/legend.css";@import "./src/expandable-table.css";
+:root{--primary-disabled:225 100% 88%;--primary-muted:221 100% 95%;--primary:225 91% 59%;--primary-200:225 100% 43%;--primary-300:225 91% 40%;--primary-400:225 91% 18%;--success-bg:143 26% 86%;--success:130 35% 46%;--success-200:130 76% 26%;--success-300:130 100% 18%;--warning-bg:45 100% 84%;--warning:45 100% 61%;--warning-200:45 100% 45%;--warning-300:45 100% 32%;--destructive-bg:357 100% 92%;--destructive:0 83% 60%;--destructive-200:0 100% 42%;--destructive-300:0 100% 29%;--muted-25:0 0 98%;--muted-50:0 0 96%;--muted:0 0 80%;--muted-200:0 0 67%;--secondary-bg:0 0% 98%;--radius-sm:0.25rem;--radius-md:0.375rem;--radius-lg:0.5rem;--radius-full:9999px}@import "./src/accordion.css";@import "./src/button.css";@import "./src/calendar.css";@import "./src/checkbox.css";@import "./src/content-switch.css";@import "./src/date-range-picker.css";@import "./src/dropdown.css";@import "./src/input.css";@import "./src/modal.css";@import "./src/multi-select.css";@import "./src/compact-multi-select.css";@import "./src/popover.css";@import "./src/radio.css";@import "./src/search.css";@import "./src/side-panel.css";@import "./src/status.css";@import "./src/tabs.css";@import "./src/tag.css";@import "./src/textarea.css";@import "./src/toggle.css";@import "./src/tooltip.css";@import "./src/pagination.css";@import "./src/table.css";@import "./src/toast.css";@import "./src/month-calendar.css";@import "./src/loader.css";@import "./src/message.css";@import "./src/multi-menu.css";@import "./src/charts.css";@import "./src/chart.css";@import "./src/legend.css";@import "./src/expandable-table.css";@import "./src/chip.css";@import "./src/segmented-toggle.css";