h2o-library 1.7.1 → 2.0.0

package/dist/css/src/radio.css

@@ -1,146 +0,0 @@
-.radio-label {
-  position: relative;
-  display: inline-flex;
-  align-items: center;
-  cursor: pointer;
-  user-select: none;
-}
-
-.radio-label input {
-  position: absolute;
-  opacity: 0;
-  width: 0;
-  height: 0;
-}
-
-.radio-button {
-  position: relative;
-  display: inline-block;
-  width: 20px;
-  height: 20px;
-  border: 2px solid hsl(var(--muted));
-  border-radius: 50%;
-  transition: all 0.2s;
-}
-
-.radio-label:not(:has(input:disabled)):hover .radio-button {
-  border-color: hsl(var(--primary));
-}
-
-.radio-button::after {
-  content: "";
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  width: 8px;
-  height: 8px;
-  border-radius: 50%;
-  background-color: white;
-  transform: translate(-50%, -50%) scale(0);
-  transition: transform 0.2s;
-}
-
-.radio-label:not(:has(input:disabled)):hover input:checked + .radio-button {
-  border-color: hsl(var(--primary-300));
-  background-color: hsl(var(--primary-300));
-}
-
-.radio-label input:checked + .radio-button::after {
-  transform: translate(-50%, -50%) scale(1);
-}
-
-.radio-label:has(input:disabled) {
-  cursor: not-allowed;
-}
-
-.radio-label input:disabled + .radio-button {
-  border-color: hsl(var(--muted));
-}
-
-.radio-label input:disabled + .radio-button + .radio-text {
-  color: hsl(var(--muted));
-}
-
-.radio-label input:checked + .radio-button {
-  border-color: hsl(var(--primary));
-  background-color: hsl(var(--primary));
-}
-
-.radio-label input:checked:disabled + .radio-button {
-  opacity: 0.5;
-}
-
-.radio-text {
-  margin-left: 8px;
-  color: hsl(var(--foreground));
-}
-
-/* Radio Group */
-
-.radio-group {
-  display: flex;
-  width: fit-content;
-  border-radius: var(--radius-md);
-  overflow: hidden;
-  border: 1px solid hsl(var(--muted));
-}
-
-.radio-group-option {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  gap: 0.5rem;
-  padding: 0 1rem;
-  height: 2.5rem;
-  background: none;
-  border: none;
-  cursor: pointer;
-  transition: all 0.3s ease-in-out;
-  color: hsl(var(--foreground));
-}
-
-.radio-group-option:not(:last-child) {
-  border-right: 1px solid hsl(var(--muted));
-}
-
-.radio-group-option:hover {
-  background-color: hsl(var(--primary-disabled));
-}
-
-.radio-group-option-selected {
-  background-color: hsl(var(--primary));
-  color: white;
-  font-weight: 500;
-}
-
-.radio-group-option-selected:hover {
-  background-color: hsl(var(--primary-200));
-  color: white;
-}
-
-.radio-group-option-icon {
-  color: currentColor;
-}
-
-.radio-group-option-dot {
-  width: 0.8rem;
-  aspect-ratio: 1/1;
-  border-radius: 50%;
-  flex-shrink: 0;
-}
-
-.radio-group-option-dot--active {
-  background-color: hsl(var(--success-bg));
-}
-
-.radio-group-option-dot--inactive {
-  background-color: hsl(var(--destructive-bg));
-}
-
-.radio-group-option-selected > .radio-group-option-dot--active {
-  background-color: hsl(var(--success));
-}
-
-.radio-group-option-selected > .radio-group-option-dot--inactive {
-  background-color: hsl(var(--destructive));
-}

package/dist/css/src/search.css

@@ -1,148 +0,0 @@
-.expandable-search {
-  position: relative;
-  width: fit-content;
-  overflow: hidden;
-  border: 1px solid transparent;
-  border-radius: 8px;
-  transition: border-color 0.3s ease-in-out;
-}
-
-.expandable-search.expanded {
-  border: 1px solid hsl(var(--primary));
-}
-
-.expandable-search.expanded
-  .expandable-search-container
-  .expandable-search-button:hover {
-  background-color: transparent;
-  color: hsl(var(--primary-300));
-  transition: background-color 0.3s ease-in-out;
-}
-
-.expandable-search-container {
-  position: relative;
-  display: flex;
-  align-items: center;
-  justify-content: flex-end;
-  border-radius: 8px;
-  transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
-  width: 40px;
-  overflow: hidden;
-}
-
-.expandable-search-button {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 40px;
-  height: 40px;
-  border: none;
-  border-radius: 8px;
-  background-color: transparent;
-  color: hsl(var(--primary));
-  cursor: pointer;
-  flex-shrink: 0;
-  position: relative;
-  z-index: 2;
-}
-
-.expandable-search-button:hover {
-  background-color: hsl(var(--primary-disabled));
-  transition: background-color 0.3s ease-in-out;
-}
-
-/* Magic Icon Animation */
-.magic-icon-search {
-  position: relative;
-  display: inline-block;
-  width: 20px;
-  height: 20px;
-  transform-origin: center;
-  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
-}
-
-.magic-icon-search::before {
-  content: "";
-  position: absolute;
-  width: 2px;
-  height: 8px;
-  background: currentColor;
-  left: 70%;
-  top: 80%;
-  transform-origin: top center;
-  transform: translate(-50%, -50%) rotate(-45deg);
-  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
-}
-
-.magic-icon-search::after {
-  content: "";
-  position: absolute;
-  width: 14px;
-  height: 14px;
-  border: 2px solid currentColor;
-  border-radius: 50%;
-  top: 40%;
-  left: 40%;
-  transform-origin: center;
-  transform: translate(-50%, -50%);
-  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
-}
-
-.magic-icon-search.close {
-  transform: rotate(90deg);
-}
-
-.magic-icon-search.close::before {
-  height: 18px;
-  left: 82%;
-  top: 60%;
-  transform: translate(-50%, -50%) rotate(45deg);
-}
-
-.magic-icon-search.close::after {
-  width: 18px;
-  height: 2px;
-  border: none;
-  border-radius: 0;
-  background: currentColor;
-  left: 50%;
-  top: 45%;
-  transform: translate(-50%, -50%) rotate(45deg);
-}
-
-.expandable-search-button:hover {
-  color: hsl(var(--primary));
-}
-
-.expandable-search-input {
-  position: absolute;
-  top: 0;
-  right: 40px;
-  width: 200px;
-  height: 40px;
-  padding: 0 16px;
-  border: none;
-  outline: none;
-  background: transparent;
-  color: hsl(var(--foreground));
-  font-size: 1rem;
-  transform: translateX(100%);
-  opacity: 0;
-  visibility: hidden;
-  pointer-events: none;
-  transition: transform 0.1s cubic-bezier(0.4, 0, 0.2, 1),
-    opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1), visibility 0s linear 0.3s;
-}
-
-.expandable-search.expanded .expandable-search-container {
-  width: calc(200px + 40px);
-}
-
-.expandable-search.expanded .expandable-search-input {
-  transform: translateX(0);
-  opacity: 1;
-  visibility: visible;
-  pointer-events: all;
-  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0.1s,
-    opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0.1s, visibility 0s linear 0.1s;
-}

package/dist/css/src/status.css

@@ -1,31 +0,0 @@
-.status {
-  display: inline-flex;
-  align-items: center;
-  gap: 0.5rem;
-  padding: 0.25rem 0.75rem;
-  border-radius: 1rem;
-  font-size: 0.875rem;
-  font-weight: 500;
-}
-
-.status.active {
-  background-color: hsl(var(--success-bg));
-  color: hsl(var(--success));
-}
-
-.status.muted {
-  background-color: hsl(var(--muted-25));
-  color: hsl(var(--muted-200));
-}
-
-.status.destructive {
-  background-color: hsl(var(--destructive-bg));
-  color: hsl(var(--destructive));
-}
-
-.status-dot {
-  width: 0.5rem;
-  height: 0.5rem;
-  border-radius: 50%;
-  background-color: currentColor;
-}

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

@@ -1,13 +0,0 @@
-import React from "react";
-export interface AccordionProps {
-    title: string;
-    isOpen: boolean;
-    setIsOpen: (isOpen: boolean) => void;
-    children: React.ReactNode;
-    description?: string;
-    className?: string;
-    containerClassName?: string;
-    titleClassName?: string;
-    descriptionClassName?: string;
-}
-export declare const Accordion: ({ title, isOpen, setIsOpen, children, description, containerClassName, className, titleClassName, descriptionClassName, }: AccordionProps) => React.JSX.Element;

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

@@ -1,15 +0,0 @@
-import { IconType, TooltipPosition } from "../../types";
-import React from "react";
-export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
-    variant?: "primary" | "secondary" | "ghost" | "danger" | "warning" | "success";
-    size?: "sm" | "md" | "lg";
-    label?: string;
-    iconStrokeWidth?: number;
-    icon?: IconType;
-    iconOnly?: boolean;
-    isLoading?: boolean;
-    tooltip?: string;
-    tooltipPosition?: TooltipPosition;
-    className?: string;
-}
-export declare function Button({ variant, size, label, icon, iconStrokeWidth, iconOnly, isLoading, tooltip, tooltipPosition, className, disabled, children, ...props }: ButtonProps): React.JSX.Element;

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

@@ -1,19 +0,0 @@
-/// <reference types="react" />
-type CalendarMode = "single" | "range";
-interface CalendarProps {
-    mode?: CalendarMode;
-    value?: Date | [Date | null, Date | null];
-    onChange?: (value: Date | [Date | null, Date | null]) => void;
-    minDate?: Date;
-    maxDate?: Date;
-    forceWeek?: boolean;
-    disabledDates?: Date[];
-    month?: Date;
-    hideHeader?: boolean;
-    hideOutsideDays?: boolean;
-    hoverDate?: Date | null;
-    onDayMouseEnter?: (date: Date) => void;
-    onDayMouseLeave?: () => void;
-}
-declare const Calendar: ({ mode, value, onChange, minDate, maxDate, forceWeek, disabledDates, month, hideHeader, hideOutsideDays, hoverDate: externalHoverDate, onDayMouseEnter, onDayMouseLeave, }: CalendarProps) => JSX.Element | null;
-export { Calendar };

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

@@ -1,26 +0,0 @@
-import React from 'react';
-export interface BarChartDataPoint {
-    name: string;
-    [key: string]: number | string;
-}
-export interface BarProps {
-    dataKey: string;
-    fill: string;
-    label: string;
-    unit?: string;
-    displayName?: string;
-}
-export interface BarChartProps {
-    data: BarChartDataPoint[];
-    bars: BarProps[];
-    layout?: 'single' | 'grouped' | 'stacked';
-    orientation?: 'vertical' | 'horizontal';
-    showGrid?: boolean;
-    showLegend?: boolean;
-    height?: number;
-    rotateLabels?: boolean;
-    wrapLabels?: boolean;
-    onXAxisTickClick?: (value: string | number) => void;
-    onYAxisTickClick?: (value: string | number) => void;
-}
-export declare const BarChart: ({ data, bars, layout, orientation, showGrid, showLegend, height, rotateLabels, wrapLabels, onXAxisTickClick, onYAxisTickClick, }: BarChartProps) => React.JSX.Element;

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

@@ -1,20 +0,0 @@
-import React from "react";
-export interface HeatmapDataPoint {
-    value: number;
-    percentage: number;
-}
-export interface HeatmapData {
-    rows: string[];
-    columns: string[];
-    data: HeatmapDataPoint[][];
-}
-export interface HeatmapChartProps {
-    data: HeatmapData;
-    showPercentage?: boolean;
-    height?: string | number;
-    showValue?: boolean;
-    showPercentageInTooltip?: boolean;
-    onRowClick?: (row: string) => void;
-    onColumnClick?: (column: string) => void;
-}
-export declare const HeatmapChart: ({ data, showPercentage, height, showValue, showPercentageInTooltip, onRowClick, onColumnClick, }: HeatmapChartProps) => React.JSX.Element;

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

@@ -1,25 +0,0 @@
-import React from "react";
-export interface LineChartDataPoint {
-    name: string;
-    [key: string]: number | string | undefined;
-}
-export interface LineProps {
-    dataKey: string;
-    displayName?: string;
-    stroke: string;
-    dashed?: boolean;
-    unit?: string;
-    lineWidth?: number;
-}
-export interface LineChartProps {
-    data: LineChartDataPoint[];
-    lines: LineProps[];
-    showGrid?: boolean;
-    showLegend?: boolean;
-    showGradient?: boolean;
-    height?: number;
-    showXValue?: boolean;
-    onXAxisTickClick?: (value: string | number) => void;
-    onYAxisTickClick?: (value: string | number) => void;
-}
-export declare const LineChart: ({ data, lines, showGrid, showLegend, showGradient, height, showXValue, onXAxisTickClick, onYAxisTickClick, }: LineChartProps) => React.JSX.Element;

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

@@ -1,16 +0,0 @@
-import React from "react";
-export interface PieChartDataPoint {
-    name: string;
-    value: number;
-    color: string;
-    unit?: string;
-}
-export interface PieChartProps {
-    data: PieChartDataPoint[];
-    variant?: "pie" | "donut";
-    showLegend?: boolean;
-    height?: number;
-    showLabels?: boolean;
-    showPercentageInTooltip?: boolean;
-}
-export declare const PieChart: ({ data, variant, showLegend, height, showLabels, showPercentageInTooltip, }: PieChartProps) => React.JSX.Element;

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

@@ -1,20 +0,0 @@
-import React from 'react';
-export interface StatChartDataPoint {
-    name: string;
-    value: number;
-    total: number;
-}
-export interface StatChartBarProps {
-    dataKey: string;
-    fill: string;
-    stackId: string;
-}
-export interface StatChartProps {
-    data: StatChartDataPoint[];
-    compareData?: StatChartDataPoint[];
-    barColor?: string;
-    totalBarColor?: string;
-    unit?: string;
-    showDifference?: boolean;
-}
-export declare const StatChart: ({ data, compareData, barColor, totalBarColor, unit, showDifference, }: StatChartProps) => React.JSX.Element | null;

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

@@ -1,36 +0,0 @@
-import React from "react";
-import { BarChartDataPoint } from "./chart-bar";
-import { LineChartDataPoint } from "./chart-line";
-import { PieChartDataPoint } from "./chart-pie";
-import { HeatmapData } from "./chart-heatmap";
-export type ChartKPI = {
-    label: string;
-    value: string | number;
-};
-type BaseChartData = {
-    bar: BarChartDataPoint[];
-    line: LineChartDataPoint[];
-    pie: PieChartDataPoint[];
-    heatmap: HeatmapData;
-};
-export type ChartType = keyof BaseChartData;
-interface BaseChartProps {
-    type: ChartType;
-    title?: string;
-    tooltip?: string;
-    description?: string;
-    kpis?: ChartKPI[];
-    height?: number;
-}
-type BarChartSpecificProps = {
-    layout?: 'single' | 'grouped' | 'stacked';
-    orientation?: 'vertical' | 'horizontal';
-    rotateLabels?: boolean;
-    wrapLabels?: boolean;
-};
-type ChartTypeSpecificProps<T extends ChartType> = T extends 'bar' ? BarChartSpecificProps : {};
-type ChartProps<T extends ChartType> = BaseChartProps & {
-    data: BaseChartData[T];
-} & ChartTypeSpecificProps<T>;
-export declare const Chart: <T extends keyof BaseChartData>({ type, title, tooltip, description, kpis, data, height, ...chartSpecificProps }: ChartProps<T>) => React.JSX.Element;
-export {};

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

@@ -1,18 +0,0 @@
-import React from "react";
-export interface CheckboxProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "type"> {
-    label?: string;
-    className?: string;
-    labelClassName?: string;
-    isCard?: boolean;
-    isIndeterminate?: boolean;
-}
-export declare const Checkbox: React.FC<CheckboxProps>;
-export interface CheckboxGroupProps {
-    label: string;
-    children: React.ReactNode;
-    className?: string;
-    checked?: boolean;
-    indeterminate?: boolean;
-    onChange?: (checked: boolean) => void;
-}
-export declare const CheckboxGroup: React.FC<CheckboxGroupProps>;

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

@@ -1,13 +0,0 @@
-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/compact-multi-select.d.ts

@@ -1,25 +0,0 @@
-import React from "react";
-import { TooltipPosition } from "../../types";
-export interface CompactMultiSelectOption {
-    label: string;
-    value: string;
-    disabled?: boolean;
-}
-export interface CompactMultiSelectProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange" | "value"> {
-    size?: "sm" | "md" | "lg";
-    label?: string;
-    showClear?: boolean;
-    note?: string;
-    error?: string;
-    containerClassName?: string;
-    options: CompactMultiSelectOption[];
-    placeholder?: string;
-    value?: CompactMultiSelectOption[];
-    onChange?: (value: CompactMultiSelectOption[]) => void;
-    disabled?: boolean;
-    enableSearch?: boolean;
-    maxSelections?: number;
-    tooltip?: string;
-    tooltipPosition?: TooltipPosition;
-}
-export declare const CompactMultiSelect: React.ForwardRefExoticComponent<CompactMultiSelectProps & React.RefAttributes<HTMLDivElement>>;

package/dist/esm/components/src/content-switch.d.ts

@@ -1,15 +0,0 @@
-import React from "react";
-type ContentSwitchProps = {
-    options: {
-        label: string;
-        value: string;
-    }[];
-    variant?: "primary" | "secondary";
-    className?: string;
-    optionClassName?: string;
-    selected: string;
-    onChange: (value: string) => void;
-    disabled?: boolean;
-};
-export declare const ContentSwitch: ({ options, selected, onChange, variant, className, optionClassName, disabled, }: ContentSwitchProps) => React.JSX.Element;
-export {};

package/dist/esm/components/src/date-range-picker.d.ts

@@ -1,12 +0,0 @@
-import React from "react";
-type PresetDirection = "last" | "next";
-interface DateRangePickerProps {
-    value?: [Date | null, Date | null];
-    onChange?: (value: [Date | null, Date | null]) => void;
-    minDate?: Date;
-    maxDate?: Date;
-    disabledDates?: Date[];
-    presetDirection?: PresetDirection;
-}
-export declare const DateRangePicker: ({ value, onChange, presetDirection, ...calendarProps }: DateRangePickerProps) => React.JSX.Element;
-export {};

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

@@ -1,22 +0,0 @@
-import React from "react";
-export interface DropdownOption {
-    label: string;
-    value: string;
-    disabled?: boolean;
-}
-export interface DropdownProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "size" | "value" | "onChange"> {
-    size?: "sm" | "md" | "lg";
-    label?: string;
-    showClear?: boolean;
-    note?: string;
-    error?: string;
-    containerClassName?: string;
-    options: DropdownOption[];
-    placeholder?: string;
-    value?: string;
-    onChange?: (value: string) => void;
-    enableSearch?: boolean;
-    direction?: "top" | "bottom" | "auto";
-    arrowClassName?: string;
-}
-export declare const Dropdown: React.ForwardRefExoticComponent<DropdownProps & React.RefAttributes<HTMLButtonElement>>;

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

@@ -1,39 +0,0 @@
-import React from "react";
-import { SortDirection } from "./table";
-export interface ExpandableTableColumn<T> {
-    key: string;
-    label: string;
-    sortable?: boolean;
-    minWidth?: string;
-    maxWidth?: string;
-    width?: string;
-    render?: (value: any, row: T) => React.ReactNode;
-}
-export interface ExpandableRow {
-    expandableContent?: React.ReactNode;
-}
-export interface ExpandableTableProps<T extends Record<string, any> & ExpandableRow> {
-    columns: ExpandableTableColumn<T>[];
-    data: T[];
-    isLoading?: boolean;
-    className?: string;
-    containerClassName?: string;
-    rowHeight?: string;
-    sortKey?: string;
-    sortDirection?: SortDirection;
-    currentPage?: number;
-    totalPages?: number;
-    perPage?: number;
-    perPageOptions?: {
-        label: string;
-        value: string;
-    }[];
-    onSort?: (key: string, direction: SortDirection) => void;
-    onPageChange?: (page: number) => void;
-    onPerPageChange?: (perPage: string) => void;
-    maxHeight?: string;
-    selectedRows?: T[];
-    setSelectedRows?: (rows: T[]) => void;
-    rowKey?: keyof T;
-}
-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;

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

@@ -1,9 +0,0 @@
-import React from "react";
-export interface ExpandableSearchProps {
-    onSearch?: (value: string) => void;
-    onChange?: (value: string) => void;
-    placeholder?: string;
-    className?: string;
-    value?: string;
-}
-export declare const ExpandableSearch: ({ onSearch, onChange, placeholder, className, value, }: ExpandableSearchProps) => React.JSX.Element;