@veeqo/ui 6.0.1 → 6.2.0

package/dist/components/DataTable/DataTable.d.ts

@@ -4,7 +4,7 @@ import { ColumnMenu } from './components/ColumnMenu';
 import { SelectionCell } from './components/SelectionCell';
 import { SelectionHeader } from './components/SelectionHeader';
 export declare const DataTable: {
-    ({ ActionBarSlot, borderMode, columns: initialColumns, emptyState, expandedRowIds, loading, loadingRowCount, onChangeSort, rows, disabledRowIds, selectionMode, selectionState, setExpanded, sortState, stripingMode, enableStickyHeader, resizeableColumns, }: DataTableProps): React.JSX.Element;
+    ({ ActionBarSlot, borderMode, columns: initialColumns, emptyState, expandedRowIds, loading, loadingRowCount, onChangeSort, rows, disabledRowIds, selectionMode, selectionState, setExpanded, sortState, stripingMode, enableStickyHeader, resizeableColumns, onResizeColumns, }: DataTableProps): React.JSX.Element;
     defaultProps: {
         loading: boolean;
         loadingRowCount: number;

package/dist/components/DataTable/components/ColumnDivider.d.ts

@@ -3,9 +3,10 @@ import { ColumnId, ColumnWidthHandler } from '../types';
 export type ColumnDividerProps = {
     columnId: ColumnId;
     setColumnWidth?: ColumnWidthHandler;
+    minWidth?: number;
 };
 export type CalculateWidthProps = {
     event: MouseEvent;
 };
 export declare const ResizerBar: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const ColumnDivider: ({ columnId, setColumnWidth }: ColumnDividerProps) => React.JSX.Element;
+export declare const ColumnDivider: ({ columnId, setColumnWidth, minWidth }: ColumnDividerProps) => React.JSX.Element;

package/dist/components/DataTable/hooks/useColumns.d.ts

@@ -1,6 +1,6 @@
 import { RefObject } from 'react';
-import { ColumnConfigs } from '../types';
-export declare function useColumns(columns: ColumnConfigs, tableRef: RefObject<HTMLElement>): {
+import { ColumnConfigs, ColumnWidthState, ResizeColumnData } from '../types';
+export declare function useColumns(columns: ColumnConfigs, tableRef: RefObject<HTMLElement>, onResizeColumns?: (columnWidths: ResizeColumnData) => void): {
     visible: {
         width: import("../types").ColumnWidth | import("../types").ColumnWidthBounded | undefined;
         id: import("../types").ColumnId;
@@ -13,6 +13,7 @@ export declare function useColumns(columns: ColumnConfigs, tableRef: RefObject<H
         span?: number | undefined;
         title?: string | undefined;
         tooltip?: string | undefined;
+        resizeMinWidth?: number | undefined;
         renderCell: import("../types").CellRenderer;
         renderFooter?: import("../types").FooterRenderer | undefined;
         renderHeader?: import("../types").HeaderRenderer | undefined;
@@ -30,6 +31,7 @@ export declare function useColumns(columns: ColumnConfigs, tableRef: RefObject<H
         span?: number | undefined;
         title?: string | undefined;
         tooltip?: string | undefined;
+        resizeMinWidth?: number | undefined;
         renderCell: import("../types").CellRenderer;
         renderFooter?: import("../types").FooterRenderer | undefined;
         renderHeader?: import("../types").HeaderRenderer | undefined;
@@ -47,10 +49,11 @@ export declare function useColumns(columns: ColumnConfigs, tableRef: RefObject<H
         span?: number | undefined;
         title?: string | undefined;
         tooltip?: string | undefined;
+        resizeMinWidth?: number | undefined;
         renderCell: import("../types").CellRenderer;
         renderFooter?: import("../types").FooterRenderer | undefined;
         renderHeader?: import("../types").HeaderRenderer | undefined;
         renderNestedCell?: import("../types").NestedCellRenderer | undefined;
     }[];
-    setColumnWidth: import("../types").ColumnWidthHandler;
+    setColumnWidth: ({ columnId, width }: ColumnWidthState) => void;
 };

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

@@ -30,6 +30,7 @@ export type ColumnConfig = {
     title?: string;
     tooltip?: string;
     width?: ColumnWidthFixed | ColumnWidthBounded;
+    resizeMinWidth?: number;
     renderCell: CellRenderer;
     renderFooter?: FooterRenderer;
     renderHeader?: HeaderRenderer;
@@ -103,26 +104,49 @@ export type SelectionMode = 'single' | 'multiple';
 export type SelectionState = [RowId[], (rowIds: RowId[]) => void];
 export type StripingMode = 'row' | 'nested';
 export interface DataTableProps {
+    /** slot for the action bar above the table */
     ActionBarSlot?: ReactNode;
+    /** Type of border for the table */
     borderMode?: BorderMode;
+    /** Columns for the table */
     columns: ColumnConfigs;
+    /** Disable specific rows of the table */
     disabledRowIds?: Array<RowId>;
+    /** Enable sticky header */
     enableStickyHeader?: boolean;
+    /** Render a custom empty state for the table */
     emptyState?: CustomState;
+    /** The rows that can be expanded to show more information */
     expandedRowIds?: Array<RowId>;
+    /** Renders a loading indicator inside the table */
     loading?: boolean;
+    /** Number of rows to display when loading */
     loadingRowCount?: number;
+    /** OnChange handler for sorting functionality */
     onChangeSort?: SortChangeHandler;
+    /** Rows of data to be displayed in the table */
     rows: TableRows;
+    /** Decide how many rows can be selected */
     selectionMode?: SelectionMode;
+    /** The current selected rows */
     selectionState?: SelectionState;
+    /** Handler to expand specific row */
     setExpanded?: SetExpandedAction;
+    /** State of each column's sorting  */
     sortState?: SortState;
+    /** Renders alternate row a slightly different colour */
     stripingMode?: StripingMode;
+    /** Enable column resizing */
     resizeableColumns?: boolean;
+    /** Callback for when columns are resized */
+    onResizeColumns?: (columnWidths: ResizeColumnData) => void;
 }
 export type ColumnWidthsType = {
     [key: ColumnId]: ColumnWidthType;
 };
 export type ColumnWidthType = ColumnWidthFixed | ColumnWidthBounded | undefined;
+export type ResizeColumnData = {
+    id: ColumnId;
+    columnWidth?: ColumnWidth | ColumnWidthBounded;
+}[];
 export {};

package/dist/components/DataTable/utils/getColumnWidth.d.ts

@@ -0,0 +1,2 @@
+import { ColumnConfigs, ColumnId, ColumnWidthsType } from '../types';
+export declare function getColumnWidth(columnId: ColumnId, columnWidths: ColumnWidthsType, columns: ColumnConfigs): string | number | import("../types").ColumnWidthBounded | undefined;

package/dist/components/DateRangePicker/DateRangePicker.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
 import { DateRangePickerProps } from './types';
-export declare const DateRangePicker: ({ className, style, isDisabled, isMultiMonth, showDatePresets, onReset, disabledRanges, selectedPreset, setSelectedPreset, selectedRange, setSelectedRange, "aria-describedby": ariaDescribedBy, "aria-label": ariaLabel, ...previousPeriodProps }: DateRangePickerProps) => React.JSX.Element;
+export declare const DateRangePicker: ({ className, style, isDisabled, showDatePresets, onReset, disabledRanges, selectedPreset, setSelectedPreset, selectedRange, setSelectedRange, "aria-describedby": ariaDescribedBy, "aria-label": ariaLabel, ...previousPeriodProps }: DateRangePickerProps) => React.JSX.Element;

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

@@ -7,7 +7,6 @@ export type DateRangePickerProps = {
     style?: CSSProperties;
     className?: string;
     isDisabled?: boolean;
-    isMultiMonth?: boolean;
     showDatePresets?: boolean;
     onReset?: () => void;
     disabledRanges?: CalendarDate[][];

package/dist/components/RangeCalendar/RangeCalendar.d.ts

@@ -1,10 +1,12 @@
 import React from 'react';
+import type { DateRange, DateValue, RangeCalendarProps } from 'react-aria-components';
 import { CalendarDate } from '@internationalized/date';
-import type { DateValue, RangeCalendarProps } from 'react-aria-components';
-export type CalendarProps = RangeCalendarProps<DateValue> & React.RefAttributes<HTMLDivElement> & {
+export type CalendarProps = RangeCalendarProps<DateValue> & {
+    value: DateRange | null | undefined;
+    onChange?: RangeCalendarProps<DateValue>['onChange'];
+} & React.RefAttributes<HTMLDivElement> & {
     'aria-label': string;
-    isMultiMonth?: boolean;
     disabledRanges?: CalendarDate[][];
     disallowWeekends?: boolean;
 };
-export declare const RangeCalendar: ({ disabledRanges, disallowWeekends, isMultiMonth, ...props }: CalendarProps) => React.JSX.Element;
+export declare const RangeCalendar: ({ disabledRanges, disallowWeekends, value, onChange, ...props }: CalendarProps) => React.JSX.Element;

package/dist/components/RangeCalendar/components/CalendarGrid/CalendarGrid.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { CalendarLevel } from '../../types';
+type CalendarGridProps = {
+    level: CalendarLevel;
+    currentYear: number;
+    onFocusYear: (year: number) => () => void;
+    onFocusMonth: (month: number) => () => void;
+};
+export declare const CalendarGrid: ({ level, currentYear, onFocusMonth, onFocusYear, }: CalendarGridProps) => React.JSX.Element;
+export {};

package/dist/components/RangeCalendar/components/CalendarGrid/index.d.ts

@@ -0,0 +1 @@
+export { CalendarGrid } from './CalendarGrid';

package/dist/components/RangeCalendar/components/CalendarGrid/subCalendars/DodecadeCalendar.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+type DodecadeCalendarProps = {
+    currentYear: number;
+    onFocusYear: (year: number) => () => void;
+};
+export declare const DodecadeCalendar: ({ currentYear, onFocusYear }: DodecadeCalendarProps) => React.JSX.Element;
+export {};

package/dist/components/RangeCalendar/components/CalendarGrid/subCalendars/DodecadeCalendar.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/RangeCalendar/components/{CalendarGrid.d.ts → CalendarGrid/subCalendars/MonthCalendar.d.ts}

@@ -1,3 +1,3 @@
 import React from 'react';
 import { CalendarGridProps } from 'react-aria-components';
-export declare const CalendarGrid: (props: CalendarGridProps) => React.JSX.Element;
+export declare const MonthCalendar: (props: CalendarGridProps) => React.JSX.Element;

package/dist/components/RangeCalendar/components/CalendarGrid/subCalendars/YearCalendar.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+type MonthCalendarProps = {
+    onFocusMonth: (monthIndex: number) => () => void;
+};
+export declare const YearCalendar: ({ onFocusMonth }: MonthCalendarProps) => React.JSX.Element;
+export {};

package/dist/components/RangeCalendar/components/CalendarGrid/subCalendars/YearCalendar.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/RangeCalendar/components/CalendarGrid/subCalendars/index.d.ts

@@ -0,0 +1,3 @@
+export { DodecadeCalendar } from './DodecadeCalendar';
+export { YearCalendar } from './YearCalendar';
+export { MonthCalendar } from './MonthCalendar';

package/dist/components/RangeCalendar/components/CalendarGrid/subCalendars/styled.d.ts

@@ -0,0 +1 @@
+export declare const SubCalendarOption: import("styled-components").StyledComponent<"button", any, {}, never>;

package/dist/components/RangeCalendar/components/CalendarGrid/subCalendars/utils.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Gets a range of years around a given year.
+ * @param year The year to get the range around.
+ * @returns An array of years around the given year.
+ */
+export declare const getYearsAround: (year: number) => number[];

package/dist/components/RangeCalendar/components/CalendarHeader.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { CalendarLevel } from '../types';
+type CalendarHeaderProps = {
+    level: CalendarLevel;
+    currentYear: number;
+    handleSwitchLevel: () => void;
+};
+export declare const CalendarHeader: ({ level, currentYear, handleSwitchLevel }: CalendarHeaderProps) => React.JSX.Element;
+export {};

package/dist/components/RangeCalendar/components/CalendarHeading.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import type { HeadingProps } from 'react-aria-components';
+import { CalendarLevel } from '../types';
+export declare const CalendarHeading: React.ForwardRefExoticComponent<HeadingProps & {
+    level: CalendarLevel;
+    currentYear: number;
+} & React.RefAttributes<HTMLHeadingElement>>;

package/dist/components/RangeCalendar/components/utils.d.ts

@@ -1,2 +1,8 @@
 import type { TextStyles } from '../../../theme/modules/text';
 export declare const getTextStyles: (textTheme: TextStyles) => string;
+/**
+ * Replaces all words with the first three letter of that word. All numbers are left alone.
+ *
+ * @example "January 2023" => "Jan 2023"
+ */
+export declare const trimMonths: (dateString: string) => string;

package/dist/components/RangeCalendar/data/constants.d.ts

@@ -0,0 +1,4 @@
+import { DateDuration } from '@internationalized/date';
+import { CalendarLevel } from '../types';
+export declare const visibleDurationMap: Record<CalendarLevel, DateDuration>;
+export declare const levelMoveLabelMap: Record<CalendarLevel, string>;

package/dist/components/RangeCalendar/data/useRangeCalendar.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import { CalendarDate } from '@internationalized/date';
+import { DateRange, DateValue } from 'react-aria-components';
+import { CalendarLevel } from '../types';
+export declare const useRangeCalendarState: (initialValue: DateRange | null | undefined, disabledRanges: CalendarDate[][], disallowWeekends: boolean) => {
+    level: CalendarLevel;
+    focusedDate: CalendarDate | import("@internationalized/date").CalendarDateTime | import("@internationalized/date").ZonedDateTime;
+    setFocusedDate: import("react").Dispatch<import("react").SetStateAction<CalendarDate | import("@internationalized/date").CalendarDateTime | import("@internationalized/date").ZonedDateTime>>;
+    currentYear: number;
+    isDateUnavailable: (date: DateValue) => boolean;
+    onFocusMonth: (monthIndex: number) => () => void;
+    onFocusYear: (year: number) => () => void;
+    handleSwitchLevel: () => void;
+};

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

@@ -0,0 +1,5 @@
+export declare enum CalendarLevel {
+    DODECADE = 0,
+    YEAR = 1,
+    MONTH = 2
+}