@agilekit/ui 0.1.0-alpha.3 → 0.1.0-alpha.32

package/lib/src/components/Button/Button.d.ts

@@ -16,6 +16,7 @@ export interface IButtonProps extends React.HTMLAttributes<HTMLButtonElement> {
     type?: 'button' | 'submit' | 'reset';
     ariaLabel?: string;
     startIcon?: React.ReactNode;
+    endIcon?: React.ReactNode;
     onClick?(event: React.MouseEvent<HTMLButtonElement>): void;
 }
 declare const Button: React.FC<IButtonProps>;

package/lib/src/components/ButtonGroup/ButtonGroup.d.ts

@@ -0,0 +1,23 @@
+import * as React from 'react';
+export interface IButtonGroupItem {
+    value: string;
+    label?: string;
+    disabled?: boolean;
+    startIcon?: React.ReactNode;
+    endIcon?: React.ReactNode;
+    onClick?(event: React.MouseEvent<HTMLButtonElement>): void;
+}
+export interface IButtonGroupProps extends React.HTMLAttributes<HTMLDivElement> {
+    items: IButtonGroupItem[];
+    selectedValues: string[];
+    onSelectionChange: (values: string[]) => void;
+    selectionMode: 'single' | 'multiple';
+    type?: 'primary' | 'secondary' | 'success' | 'danger' | 'subtle';
+    size?: 'small' | 'medium' | 'large' | 'xlarge';
+    outline?: boolean;
+    orientation?: 'horizontal' | 'vertical';
+    disabled?: boolean;
+    fullWidth?: boolean;
+}
+declare const ButtonGroup: React.FC<IButtonGroupProps>;
+export default ButtonGroup;

package/lib/src/components/ButtonGroup/index.d.ts

@@ -0,0 +1,2 @@
+export { default as ButtonGroup } from './ButtonGroup';
+export type { IButtonGroupItem, IButtonGroupProps } from './ButtonGroup';

package/lib/src/components/ButtonGroup/tests/ButtonGroup.test.d.ts

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

package/lib/src/components/DatePicker/DatePicker.d.ts

@@ -0,0 +1,28 @@
+import React from 'react';
+import type { Placement } from 'popper.js';
+import type { CalendarProps } from 'react-calendar';
+export type DatePickerValue = Date | null | [Date | null, Date | null];
+export interface DatePickerTriggerProps {
+    open: boolean;
+    onClick: (event: React.MouseEvent<any>) => void;
+    'aria-haspopup': 'dialog';
+    'aria-expanded': boolean;
+}
+export interface DatePickerProps {
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    value?: DatePickerValue;
+    defaultValue?: DatePickerValue;
+    onChange?: (value: DatePickerValue, event: React.MouseEvent<HTMLButtonElement>) => void;
+    renderTrigger: (props: DatePickerTriggerProps) => React.ReactElement<any>;
+    selectRange?: boolean;
+    locale?: string;
+    closeOnSelect?: boolean;
+    placement?: Placement;
+    isPortal?: boolean;
+    zIndex?: number;
+    calendarProps?: Omit<CalendarProps, 'value' | 'defaultValue' | 'onChange' | 'selectRange' | 'locale'>;
+}
+declare const DatePicker: React.FC<DatePickerProps>;
+export default DatePicker;

package/lib/src/components/DatePicker/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './DatePicker';
+export type { DatePickerProps, DatePickerTriggerProps, DatePickerValue } from './DatePicker';

package/lib/src/components/DatePicker/tests/DatePicker.test.d.ts

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

package/lib/src/components/Drawer/Drawer.d.ts

@@ -15,6 +15,7 @@ export interface IDrawerProps {
     large?: boolean;
     limitHeight?: boolean;
     bodyStyle?: Record<string, any>;
+    className?: string;
     onClose(): void;
     onTransitionEnd?(): void;
     transitionDuration?: number | {

package/lib/src/components/IconButton/IconButton.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+export type IconButtonVariant = 'basic' | 'primary' | 'success' | 'danger' | 'subtle';
+export type IconButtonSize = 'small' | 'medium' | 'large' | 'xlarge';
+export interface IIconButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'aria-label' | 'children'> {
+    ariaLabel: string;
+    icon: React.ReactNode;
+    variant?: IconButtonVariant;
+    size?: IconButtonSize;
+}
+declare const IconButton: React.FC<IIconButtonProps>;
+export default IconButton;

package/lib/src/components/IconButton/index.d.ts

@@ -0,0 +1,2 @@
+export { default as IconButton } from './IconButton';
+export type { IIconButtonProps, IconButtonSize, IconButtonVariant } from './IconButton';

package/lib/src/components/IconButton/tests/IconButton.test.d.ts

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

package/lib/src/components/InputDuration/InputDuration.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import type { IInputDurationProps } from './InputDuration.types';
+export type { DurationValue, IInputDurationProps } from './InputDuration.types';
+declare const InputDuration: React.FC<IInputDurationProps>;
+export default InputDuration;

package/lib/src/components/InputDuration/InputDuration.styles.d.ts

@@ -0,0 +1 @@
+export declare const useInputDurationStyles: (props?: any) => import("@material-ui/styles").ClassNameMap<"divider" | "root" | "helperText" | "secondaryLabel" | "inputLabel" | "inputLabelFocused" | "asteriskRequired" | "inputContainer" | "inputContainerFocus" | "inputContainerDisabled" | "inputContainerError" | "sizeMd" | "sizeSm" | "segmentContainer" | "iconWrapper" | "iconMd" | "iconSm" | "numberContainer" | "numberInput" | "numberInputDisabled" | "unitLabel">;

package/lib/src/components/InputDuration/InputDuration.types.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { BasicTextFieldProps } from '../TextField';
+export interface DurationValue {
+    hours: number | '';
+    minutes: number | '';
+}
+export interface IInputDurationProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange' | 'defaultValue' | 'onBlur' | 'onFocus'>, BasicTextFieldProps {
+    value?: DurationValue;
+    onChange?(value: DurationValue): void;
+    size?: 'md' | 'sm';
+    name?: string;
+    onFocus?: React.FocusEventHandler<HTMLInputElement>;
+    onBlur?: React.FocusEventHandler<HTMLInputElement>;
+}

package/lib/src/components/InputDuration/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './InputDuration';
+export type { DurationValue, IInputDurationProps } from './InputDuration.types';

package/lib/src/components/InputDuration/tests/InputDuration.test.d.ts

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

package/lib/src/components/MultiTextField/MultiTextField.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { BasicTextFieldProps } from '../TextField/TextField';
+import { BasicTextFieldProps } from '../TextField';
 interface Option {
     readonly label: string;
     readonly value: string;

package/lib/src/components/MultiselectGroup/MultiselectGroup.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+export interface MultiselectGroupProps extends React.HTMLAttributes<HTMLDivElement> {
+    items: string[];
+    selectedItems?: string[];
+    consolidated?: boolean;
+    collapsed?: boolean;
+    onSelectionChange?: (newSelected: string[]) => void;
+    isRange?: boolean;
+    disabled?: boolean;
+    'data-testid'?: string;
+}
+declare const MultiselectGroup: React.FC<MultiselectGroupProps>;
+export default MultiselectGroup;

package/lib/src/components/MultiselectGroup/MultiselectGroup.test.d.ts

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

package/lib/src/components/MultiselectGroup/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './MultiselectGroup';
+export type { MultiselectGroupProps } from './MultiselectGroup';

package/lib/src/components/NumberStepper/NumberStepper.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import type { NumberStepperProps } from './NumberStepper.types';
+export type { NumberStepperProps, NumberStepperValue } from './NumberStepper.types';
+declare const NumberStepper: React.FC<NumberStepperProps>;
+export default NumberStepper;

package/lib/src/components/NumberStepper/NumberStepper.styles.d.ts

@@ -0,0 +1 @@
+export declare const useNumberStepperStyles: (props?: any) => import("@material-ui/styles").ClassNameMap<"input" | "root" | "helperText" | "secondaryLabel" | "inputLabel" | "inputLabelFocused" | "asteriskRequired" | "inputContainer" | "inputContainerFocus" | "inputContainerDisabled" | "inputContainerError" | "inputDisabled" | "sizeMd" | "sizeSm" | "actionButton" | "actionButtonLeft" | "actionButtonRight" | "actionButtonLeftMd" | "actionButtonRightMd" | "actionButtonSm" | "actionButtonDisabled" | "actionIconMd" | "actionIconSm" | "valueSegment" | "valueSegmentMd" | "valueSegmentSm" | "valueSegmentFocus" | "valueSegmentDisabled">;

package/lib/src/components/NumberStepper/NumberStepper.types.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import { BasicTextFieldProps } from '../TextField';
+export type NumberStepperValue = number | '';
+export interface NumberStepperProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange' | 'defaultValue' | 'onBlur' | 'onFocus'>, BasicTextFieldProps {
+    value?: NumberStepperValue;
+    defaultValue?: NumberStepperValue;
+    onValueChange?(nextValue: NumberStepperValue): void;
+    onChange?(event: React.ChangeEvent<HTMLInputElement>): void;
+    min?: number;
+    max?: number;
+    step?: number;
+    size?: 'md' | 'sm';
+    decrementDisabled?: boolean;
+    incrementDisabled?: boolean;
+    name?: string;
+    onFocus?: React.FocusEventHandler<HTMLInputElement>;
+    onBlur?: React.FocusEventHandler<HTMLInputElement>;
+}

package/lib/src/components/NumberStepper/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './NumberStepper';
+export type { NumberStepperProps, NumberStepperValue } from './NumberStepper.types';

package/lib/src/components/NumberStepper/tests/NumberStepper.test.d.ts

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

package/lib/src/components/SectionMessage/SectionMessage.d.ts

@@ -8,7 +8,7 @@ export interface SectionMessageAction {
     rel?: string;
 }
 export interface SectionMessageProps {
-    title: string;
+    title?: string;
     appearance?: 'information' | 'success' | 'warning' | 'error' | 'discovery';
     size?: 'small' | 'medium';
     children?: React.ReactNode;

package/lib/src/components/Select/Select.d.ts

@@ -2,6 +2,8 @@ import React from 'react';
 import { NativeSelectProps } from '@material-ui/core';
 export interface ISelectProps extends NativeSelectProps {
     inputRef?: any;
+    prepend?: React.ReactNode;
+    append?: React.ReactNode;
     label?: string;
     labelHidden?: boolean;
     disabled?: boolean;

package/lib/src/components/Select/Select.styles.d.ts

@@ -1,2 +1,2 @@
-declare const useSelectStyles: (props?: any) => import("@material-ui/styles").ClassNameMap<"icon" | "select" | "asteriskRequired" | "containerNotFull">;
+declare const useSelectStyles: (props?: any) => import("@material-ui/styles").ClassNameMap<"icon" | "slot" | "select" | "inputBase" | "asteriskRequired" | "containerNotFull" | "append" | "prepend" | "selectWithPrepend" | "selectWithAppend" | "slotDisabled">;
 export default useSelectStyles;

package/lib/src/components/Select/tests/Select.test.d.ts

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

package/lib/src/components/TextField/TextField.d.ts

@@ -1,58 +1,5 @@
 import React from 'react';
-import { NumberFormatValues } from 'react-number-format';
-import 'react-calendar/dist/Calendar.css';
-export interface BasicTextFieldProps {
-    disabled?: boolean;
-    label?: string;
-    labelHidden?: boolean;
-    secondaryLabel?: React.ReactNode;
-    error?: Error | boolean | string;
-    helperText?: React.ReactNode;
-    placeholder?: string;
-    id?: string;
-    displayRequired?: boolean;
-}
-export interface ITextFieldProps extends React.HTMLAttributes<HTMLInputElement>, BasicTextFieldProps {
-    inputRef?: any;
-    prepend?: React.ReactNode;
-    append?: React.ReactNode;
-    startAdornment?: React.ReactNode;
-    endAdornment?: React.ReactNode;
-    value?: string | number | undefined;
-    readOnly?: boolean;
-    autoFocus?: boolean;
-    autoComplete?: string;
-    focused?: boolean;
-    multiline?: boolean;
-    datePicker?: boolean;
-    dateRange?: boolean;
-    colorPicker?: boolean | number;
-    type?: string;
-    mask?: string;
-    name?: string;
-    iconLeft?: React.ReactNode;
-    iconRight?: React.ReactNode;
-    inputProps?: Record<string, any>;
-    inputSize?: 'medium' | 'large';
-    onFocus?: any;
-    onBlur?: any;
-    color?: 'primary' | 'secondary' | undefined;
-    rows?: string | number;
-    rowsMax?: string | number;
-    rowsMin?: string | number;
-    onChange?(e: React.ChangeEvent<any> | string, id?: string): void;
-    mode?: string;
-    decimalScale?: number;
-    fixedDecimalScale?: boolean;
-    allowNegative?: boolean;
-    prefix?: string;
-    suffix?: string;
-    defaultValue?: string | number;
-    isNumericString?: boolean;
-    format?: string;
-    allowEmptyFormatting?: boolean;
-    isAllowed?: (values: NumberFormatValues) => boolean;
-    locale?: string;
-}
+import type { ITextFieldProps } from './TextField.types';
+export type { BasicTextFieldProps, ITextFieldProps } from './TextField.types';
 declare const TextField: React.FC<ITextFieldProps>;
 export default TextField;

package/lib/src/components/TextField/TextField.helpers.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+export declare const createInputChangeEvent: (value: string | number, name?: string) => React.ChangeEvent<HTMLInputElement>;
+export declare const formatDatePickerValue: (value: any, dateRange: boolean, locale: string) => string;
+export interface TimePickerOption {
+    label: string;
+    value: string;
+}
+export declare const getTimePickerOptions: (inputProps?: Record<string, any>, timePickerFormat?: '12h' | '24h') => TimePickerOption[];

package/lib/src/components/TextField/TextField.renderers.d.ts

@@ -0,0 +1,72 @@
+import React from 'react';
+import { ColorResult } from 'react-color';
+import { DatePickerValue } from '../DatePicker/DatePicker';
+import type { TextFieldCalendarProps } from './TextField.types';
+interface AdornmentParams {
+    startAdornment?: React.ReactNode;
+    endAdornment?: React.ReactNode;
+    iconLeft?: React.ReactNode;
+    iconRight?: React.ReactNode;
+    datePicker?: boolean;
+    dateRange?: boolean;
+    timePicker?: boolean;
+    timePickerDisabled?: boolean;
+    datePickerAdornment?: React.ReactNode;
+    classes: any;
+    handleTimePickerClick: (event: React.MouseEvent<any>) => void;
+}
+interface DatePickerAdornmentParams {
+    open: boolean;
+    datePicker?: boolean;
+    dateRange?: boolean;
+    locale: string;
+    calendarProps?: TextFieldCalendarProps;
+    classes: any;
+    handleDatePickerOpenChange: (open: boolean) => void;
+    handleDatePicker: (value: DatePickerValue) => void;
+}
+interface ColorPickerButtonParams {
+    classes: any;
+    value?: string | number;
+    handlePopoverClick: (event: React.MouseEvent<any>) => void;
+}
+interface ColorPickerPopoverParams {
+    name?: string;
+    open: boolean;
+    anchorEl: HTMLElement | null;
+    classes: any;
+    value?: string | number;
+    colorPickerMode: 'free' | 'predefined';
+    predefinedColors?: string[];
+    handlePopoverClose: () => void;
+    handleColorPicker: (color: ColorResult) => void;
+    handlePredefinedColorPicker: (color: ColorResult) => void;
+}
+interface TimePickerPopoverParams {
+    open: boolean;
+    anchorEl: HTMLElement | null;
+    timePicker?: boolean;
+    classes: any;
+    value?: string | number;
+    options: {
+        label: string;
+        value: string;
+    }[];
+    handlePopoverClose: () => void;
+    handleTimePickerSelect: (value: string) => void;
+}
+interface HelperTextParams {
+    error?: Error | boolean | string;
+    helperText?: React.ReactNode;
+    classes: any;
+}
+export declare const getTextFieldAdornments: ({ startAdornment, endAdornment, iconLeft, iconRight, datePicker, dateRange, timePicker, timePickerDisabled, datePickerAdornment, classes, handleTimePickerClick, }: AdornmentParams) => {
+    finalStartAdornment: React.ReactNode;
+    finalEndAdornment: React.ReactNode;
+};
+export declare const renderDatePickerAdornment: ({ open, datePicker, dateRange, locale, calendarProps, classes, handleDatePickerOpenChange, handleDatePicker, }: DatePickerAdornmentParams) => React.ReactNode;
+export declare const renderColorPickerButton: ({ classes, value, handlePopoverClick, }: ColorPickerButtonParams) => React.ReactNode;
+export declare const renderColorPickerPopover: ({ name, open, anchorEl, classes, value, colorPickerMode, predefinedColors, handlePopoverClose, handleColorPicker, handlePredefinedColorPicker, }: ColorPickerPopoverParams) => React.ReactNode;
+export declare const renderTimePickerPopover: ({ open, anchorEl, timePicker, classes, value, options, handlePopoverClose, handleTimePickerSelect, }: TimePickerPopoverParams) => React.ReactNode;
+export declare const renderHelperText: ({ error, helperText, classes }: HelperTextParams) => React.ReactNode;
+export {};

package/lib/src/components/TextField/TextField.styles.d.ts

@@ -12,5 +12,5 @@ interface HelperTextStyles {
 }
 export declare const inputLabelStyles: (theme: ThemeAgile) => InputLabelStyles;
 export declare const helperTextStyles: (theme: ThemeAgile) => HelperTextStyles;
-export declare const useTextFieldStyles: (props?: any) => import("@material-ui/styles").ClassNameMap<"helperText" | "secondaryLabel" | "inputBase" | "inputLabel" | "inputLabelFocused" | "asteriskRequired" | "inputContainer" | "inputContainerFocus" | "inputContainerDisabled" | "inputContainerError" | "multilineContainer" | "inputDisabled" | "inputAction" | "inputGroupAppend" | "inputBtn" | "withAppend" | "withIconLeft" | "sideIcon" | "colorPickerButton" | "colorPopover" | "withMask" | "append" | "edgeEnd">;
+export declare const useTextFieldStyles: (props?: any) => import("@material-ui/styles").ClassNameMap<"helperText" | "secondaryLabel" | "inputBase" | "inputLabel" | "inputLabelFocused" | "asteriskRequired" | "inputContainer" | "inputContainerFocus" | "inputContainerDisabled" | "inputContainerError" | "multilineContainer" | "inputDisabled" | "inputAction" | "inputGroupAppend" | "inputBtn" | "withAppend" | "withIconLeft" | "sideIcon" | "colorPickerButton" | "colorPopover" | "predefinedColorInput" | "timePickerInput" | "timePickerPopover" | "timePickerOptionList" | "timePickerOption" | "timePickerOptionSelected" | "withMask" | "append" | "edgeEnd">;
 export {};

package/lib/src/components/TextField/TextField.types.d.ts

@@ -0,0 +1,62 @@
+import React from 'react';
+import { NumberFormatValues } from 'react-number-format';
+import type { CalendarProps } from 'react-calendar';
+export type TextFieldCalendarProps = Omit<CalendarProps, 'value' | 'defaultValue' | 'onChange' | 'selectRange' | 'locale'>;
+export interface BasicTextFieldProps {
+    disabled?: boolean;
+    label?: string;
+    labelHidden?: boolean;
+    secondaryLabel?: React.ReactNode;
+    error?: Error | boolean | string;
+    helperText?: React.ReactNode;
+    placeholder?: string;
+    id?: string;
+    displayRequired?: boolean;
+}
+export interface ITextFieldProps extends React.HTMLAttributes<HTMLInputElement>, BasicTextFieldProps {
+    inputRef?: any;
+    prepend?: React.ReactNode;
+    append?: React.ReactNode;
+    startAdornment?: React.ReactNode;
+    endAdornment?: React.ReactNode;
+    value?: string | number | undefined;
+    readOnly?: boolean;
+    autoFocus?: boolean;
+    autoComplete?: string;
+    focused?: boolean;
+    multiline?: boolean;
+    datePicker?: boolean;
+    dateRange?: boolean;
+    timePicker?: boolean;
+    calendarProps?: TextFieldCalendarProps;
+    timePickerFormat?: '12h' | '24h';
+    colorPicker?: boolean | number;
+    colorPickerMode?: 'free' | 'predefined';
+    predefinedColors?: string[];
+    type?: string;
+    mask?: string;
+    name?: string;
+    iconLeft?: React.ReactNode;
+    iconRight?: React.ReactNode;
+    inputProps?: Record<string, any>;
+    inputSize?: 'medium' | 'large';
+    onFocus?: any;
+    onBlur?: any;
+    color?: 'primary' | 'secondary' | undefined;
+    rows?: string | number;
+    rowsMax?: string | number;
+    rowsMin?: string | number;
+    onChange?(e: React.ChangeEvent<any> | string, id?: string): void;
+    mode?: string;
+    decimalScale?: number;
+    fixedDecimalScale?: boolean;
+    allowNegative?: boolean;
+    prefix?: string;
+    suffix?: string;
+    defaultValue?: string | number;
+    isNumericString?: boolean;
+    format?: string;
+    allowEmptyFormatting?: boolean;
+    isAllowed?: (values: NumberFormatValues) => boolean;
+    locale?: string;
+}

package/lib/src/components/TextField/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './TextField';
+export type { BasicTextFieldProps, ITextFieldProps } from './TextField.types';

package/lib/src/components/TextField/tests/TextField.test.d.ts

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

package/lib/src/components/TextField/tests/TextFieldDatePicker.integration.test.d.ts

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

package/lib/src/components/TooltipBox/TooltipBox.d.ts

@@ -0,0 +1,21 @@
+import React from 'react';
+import { Placement } from 'popper.js';
+type TooltipBoxTrigger = 'click' | 'hover' | 'focus';
+type TooltipBoxTriggerValue = TooltipBoxTrigger | TooltipBoxTrigger[] | `${TooltipBoxTrigger} ${TooltipBoxTrigger}` | `${TooltipBoxTrigger} ${TooltipBoxTrigger} ${TooltipBoxTrigger}`;
+export type TooltipBoxTipPosition = 'none' | 'top-left' | 'top-center' | 'top-right' | 'left' | 'right' | 'bottom-left' | 'bottom-center' | 'bottom-right';
+export interface TooltipBoxProps extends React.HTMLAttributes<HTMLDivElement> {
+    className?: string;
+    copy?: React.ReactNode;
+    tip?: TooltipBoxTipPosition;
+    type?: 'dark' | 'light';
+    offset?: number | string;
+    children: React.ReactElement;
+    placement?: Placement;
+    isOpen?: boolean;
+    fullWidth?: boolean;
+    maxWidth?: number;
+    zIndex?: number;
+    trigger?: TooltipBoxTriggerValue;
+}
+declare const TooltipBox: React.FC<TooltipBoxProps>;
+export default TooltipBox;

package/lib/src/components/TooltipBox/index.d.ts

@@ -0,0 +1 @@
+export { default as TooltipBox } from './TooltipBox';

package/lib/src/index.d.ts

@@ -1,4 +1,3 @@
-import './assets/styles/global/styles.scss';
 export { makeStyles, useTheme, ThemeProvider, withStyles, StylesProvider, createGenerateClassName, } from '@material-ui/core/styles';
 export type { Theme } from '@material-ui/core/styles';
 export { useMediaQuery, FormControlLabel, Tooltip, CircularProgress, Table, TableBody, TableCell, TableContainer, TableHead, TablePagination, TableRow, TableSortLabel, Toolbar, Typography, Paper, } from '@material-ui/core';
@@ -12,6 +11,7 @@ export { default as AppProvider } from './components/AppProvider/AppProvider';
 export { default as Avatar } from './components/Avatar/Avatar';
 export { default as Box } from './components/Box/Box';
 export { default as Button } from './components/Button/Button';
+export { default as ButtonGroup } from './components/ButtonGroup/ButtonGroup';
 export { default as Breadcrumb } from './components/Breadcrumb/Breadcrumb';
 export { default as Calendar } from './components/Calendar/Calendar';
 export { default as Card } from './components/Card/Card';
@@ -19,6 +19,7 @@ export { default as Checkbox } from './components/Checkbox/Checkbox';
 export { default as Choice } from './components/Choice/Choice';
 export { default as ChoiceItem } from './components/ChoiceItem/ChoiceItem';
 export { default as CollapsibleItem } from './components/CollapsibleItem/CollapsibleItem';
+export { default as DatePicker, type DatePickerProps, type DatePickerValue } from './components/DatePicker';
 export { default as Col } from './components/Grid/components/Col/Col';
 export { default as DataTable } from './components/DataTable/DataTable';
 export { default as Drawer } from './components/Drawer/Drawer';
@@ -28,7 +29,10 @@ export { default as FileUpload, type FileUploadItemProps } from './components/Fi
 export { Gallery } from './components/Gallery/Gallery';
 export { default as Heading } from './components/Heading/Heading';
 export { default as Icon } from './components/Icon/Icon';
+export { default as IconButton } from './components/IconButton/IconButton';
 export { default as InputFile } from './components/InputFile/InputFile';
+export { default as InputDuration } from './components/InputDuration';
+export { default as NumberStepper } from './components/NumberStepper';
 export { default as Label } from './components/Label/Label';
 export { default as Labelled } from './components/Labelled/Labelled';
 export { default as Link } from './components/Link/Link';
@@ -36,6 +40,7 @@ export { default as Loader } from './components/Loader/Loader';
 export { default as Modal } from './components/Modal/Modal';
 export { default as MultiTextField } from './components/MultiTextField/MultiTextField';
 export { default as MultiSelect } from './components/MultiSelect/MultiSelect';
+export { default as MultiselectGroup } from './components/MultiselectGroup/MultiselectGroup';
 export { default as Navigation } from './components/Navigation/Navigation';
 export { default as Image } from './components/Image/Image';
 export { default as OutsideClickDetector } from './components/OutsideClickDetector/OutsideClickDetector';
@@ -50,6 +55,7 @@ export { default as Select } from './components/Select/Select';
 export { default as Skeleton } from './components/Skeleton/Skeleton';
 export { default as Slider } from './components/Slider/Slider';
 export { default as Switch } from './components/Switch/Switch';
+export { default as TooltipBox } from './components/TooltipBox/TooltipBox';
 export { default as Text } from './components/Text/Text';
 export { default as TableList } from './components/TableList/TableList';
 export { default as TableListCell } from './components/TableList/components/Cell/Cell';
@@ -60,10 +66,11 @@ export { default as TableListRow } from './components/TableList/components/Table
 export { default as TopBar } from './components/TopBar/TopBar';
 export { default as Tabs } from './components/Tabs/Tabs';
 export { default as Tag } from './components/Tag/Tag';
-export { default as TextField } from './components/TextField/TextField';
+export { default as TextField } from './components/TextField';
 export { default as UnstyledLink } from './components/UnstyledLink/UnstyledLink';
 export { default as SpinnerCube } from './components/SpinnerCube/SpinnerCube';
 export { default as StatusInline } from './components/StatusInline/StatusInline';
+export type { IIconButtonProps, IconButtonSize, IconButtonVariant } from './components/IconButton/IconButton';
 export type { IStepType } from './components/ProgressIndicator/ProgressIndicator';
 export type { ThemeAgile } from './Theme';
 export { default as defaultTheme, themeObject } from './Theme';

package/package.json

@@ -1,21 +1,21 @@
 {
   "name": "@agilekit/ui",
-  "version": "0.1.0-alpha.3",
+  "version": "0.1.0-alpha.32",
   "description": "Agile's product component library",
   "author": "Michael de Lima Alves <michaelalves@outlook.com>",
   "license": "MIT",
   "main": "lib/index",
+  "style": "lib/index.css",
   "types": "lib/src/index.d.ts",
-  "source": "src/index.ts",
+  "sideEffects": [
+    "*.css",
+    "*.scss"
+  ],
   "files": [
     "/lib",
     "/src/assets",
     "/src/components/utils"
   ],
-  "sideEffects": [
-    "**/*.css",
-    "**/*.scss"
-  ],
   "directories": {
     "lib": "lib",
     "test": "__tests__"
@@ -66,11 +66,12 @@
     "react-color": "^2.19.3",
     "react-dom": "18.2.0",
     "react-multi-select-component": "^4.2.3",
-    "react-router-dom": "^5.1.2",
     "react-scripts": "^3.4.3",
     "react-select": "^5.4.0"
   },
   "devDependencies": {
+    "@mdi/js": "^7.4.47",
+    "@mdi/react": "^1.6.1",
     "@babel/core": "^7.21.3",
     "@babel/plugin-proposal-nullish-coalescing-operator": "^7.18.6",
     "@babel/plugin-proposal-optional-chaining": "^7.21.0",
@@ -119,10 +120,12 @@
     "jest": "^29.5.0",
     "jest-axe": "^7.0.1",
     "jest-environment-jsdom": "^29.5.0",
+    "mini-css-extract-plugin": "^2.10.0",
     "postcss-loader": "^7.1.0",
     "prettier": "^2.8.4",
     "react-docgen-typescript-loader": "^3.7.2",
     "react-hook-form": "^7.57.0",
+    "react-router-dom": "^5.1.2",
     "react-input-mask": "^2.0.4",
     "react-number-format": "^4.9.1",
     "sass-loader": "^13.2.0",

package/src/components/utils/breakpoints.ts

@@ -1,3 +1,7 @@
+/**
+ * @file utils/breakpoints.ts
+ * @description Source module for `utils/breakpoints`.
+ */
 export const Breakpoints = {
   mobileXS: 374,
   // tslint:disable-next-line:object-literal-sort-keys

package/src/components/utils/browser.ts

@@ -1,3 +1,7 @@
+/**
+ * @file utils/browser.ts
+ * @description Source module for `utils/browser`.
+ */
 const isIE = (): boolean => {
   const ua = window.navigator.userAgent;
 

package/src/components/utils/findParentBySelector.ts

@@ -1,3 +1,7 @@
+/**
+ * @file utils/findParentBySelector.ts
+ * @description Source module for `utils/findParentBySelector`.
+ */
 function collectionHas(a, b) {
   for (let i = 0, len = a.length; i < len; i++) {
     if (a[i] === b) {