@innovaccer/design-system 2.5.0 → 2.7.0-0

package/css/src/utils/utility.css

@@ -1,28 +1,28 @@
 /** utility **/
 
 .hide-scroll-bar::-webkit-scrollbar {
-    height: 0px;
-    /* Remove scrollbar space */
-    background: transparent;
-    /* Optional: just make scrollbar invisible */
+  height: 0px;
+  /* Remove scrollbar space */
+  background: transparent;
+  /* Optional: just make scrollbar invisible */
 }
 
 .hide-scroll-bar {
-    -ms-overflow-style: none;
-    scrollbar-width: none;
+  -ms-overflow-style: none;
+  scrollbar-width: none;
 }
 
 .ellipsis {
-    overflow: hidden;
-    text-overflow: ellipsis;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
 
 .ellipsis--noWrap {
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
 
 .cursor-pointer {
-    cursor: pointer;
-}
+  cursor: pointer;
+}

package/css/src/variables/index.css

@@ -175,11 +175,14 @@
 
   /* 
   Grid columns
- Set the number of columns and specify the width of the gutters. 
- */
+  Set the number of columns and specify the width of the gutters. 
+  */
 
   --grid-columns: 12;
 
   /* Undefined colors */
-  --card-subdued-bg: #FCFAFA;
+  --card-subdued-bg: #fcfafa;
+
+  /* Transparancy (Opacity) */
+  --transparent-58: 0.58;
 }

package/dist/core/accessibility/utils/index.d.ts

@@ -0,0 +1,4 @@
+import isEnterKey from "./isEnterKey";
+import isSpaceKey from "./isSpaceKey";
+import useAccessibilityProps from "./useAccessibilityProps";
+export { isEnterKey, useAccessibilityProps, isSpaceKey };

package/dist/core/accessibility/utils/isEnterKey.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const isEnterKey: (e: React.KeyboardEvent) => boolean;
+export default isEnterKey;

package/dist/core/accessibility/utils/isSpaceKey.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const isSpaceKey: (e: React.KeyboardEvent) => boolean;
+export default isSpaceKey;

package/dist/core/accessibility/utils/useAccessibilityProps.d.ts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+interface IProps {
+    onClick?: (event: React.MouseEvent<HTMLElement>) => void;
+    onKeyDown?: (event: React.KeyboardEvent<HTMLElement>) => void;
+    role?: React.AriaRole;
+    'aria-label'?: React.AriaAttributes['aria-label'];
+}
+declare const useAccessibilityProps: ({ onClick, onKeyDown, role, ...rest }: IProps) => {
+    onClick: (event: React.MouseEvent<HTMLElement>) => void;
+    role: string & {};
+    tabIndex: number;
+    'aria-label': string | undefined;
+    onKeyDown: (e: React.SyntheticEvent<HTMLElement>) => void;
+} | {
+    role: "search" | "link" | "form" | "list" | "alert" | "article" | "button" | "dialog" | "figure" | "img" | "main" | "menu" | "menuitem" | "option" | "table" | "switch" | "tooltip" | (string & {}) | "none" | "alertdialog" | "application" | "banner" | "cell" | "checkbox" | "columnheader" | "combobox" | "complementary" | "contentinfo" | "definition" | "directory" | "document" | "feed" | "grid" | "gridcell" | "group" | "heading" | "listbox" | "listitem" | "log" | "marquee" | "math" | "menubar" | "menuitemcheckbox" | "menuitemradio" | "navigation" | "note" | "presentation" | "progressbar" | "radio" | "radiogroup" | "region" | "row" | "rowgroup" | "rowheader" | "scrollbar" | "searchbox" | "separator" | "slider" | "spinbutton" | "status" | "tab" | "tablist" | "tabpanel" | "term" | "textbox" | "timer" | "toolbar" | "tree" | "treegrid" | "treeitem" | undefined;
+    'aria-label': string | undefined;
+};
+export default useAccessibilityProps;

package/dist/core/common.type.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import { OverlayFooterProps } from "./components/molecules/overlayFooter";
+export declare type AccentAppearance = 'primary' | 'secondary' | 'alert' | 'warning' | 'success' | 'accent1' | 'accent2' | 'accent3' | 'accent4';
+export declare type HeadingAppearance = 'default' | 'subtle' | 'disabled' | 'white';
+export declare type MessageAppearance = 'default' | 'alert' | 'info' | 'success' | 'warning';
+export declare type FileStatus = 'uploading' | 'completed' | 'error';
+export declare type FooterOptions = {
+    actions: OverlayFooterProps['actions'];
+};
+export declare type AutoComplete = 'on' | 'off';
+export declare type NumberRange = [number, number];
+export declare type ChangeEvent = React.ChangeEvent<HTMLInputElement>;

package/dist/core/components/atoms/avatar/Avatar.d.ts

@@ -1,15 +1,15 @@
 import { BaseProps } from "../../../utils/types";
 import { TooltipProps } from "../../../index.type";
-export declare type Appearance = 'primary' | 'secondary' | 'alert' | 'warning' | 'success' | 'accent1' | 'accent2' | 'accent3' | 'accent4';
-export declare type Size = 'regular' | 'tiny';
+import { AccentAppearance } from "../../../common.type";
+export declare type AvatarSize = 'regular' | 'tiny';
 export interface AvatarProps extends BaseProps {
-    appearance?: Appearance;
+    appearance?: AccentAppearance;
     children?: string;
     firstName?: string;
     lastName?: string;
     withTooltip: boolean;
     tooltipPosition: TooltipProps['position'];
-    size: Size;
+    size: AvatarSize;
 }
 export declare const Avatar: {
     (props: AvatarProps): JSX.Element;

package/dist/core/components/atoms/avatarGroup/AvatarGroup.d.ts

@@ -1,12 +1,11 @@
 import { BaseProps } from "../../../utils/types";
 import { AvatarProps, PopoverProps } from "../../../index.type";
-export declare type Size = 'regular' | 'tiny';
 interface AvatarData extends Record<string, any> {
     firstName?: string;
     lastName?: string;
     appearance?: AvatarProps['appearance'];
 }
-interface PopperProps {
+interface AvatarPopperProps {
     popperRenderer?: (names: AvatarData[]) => JSX.Element;
     appendToBody?: PopoverProps['appendToBody'];
     dark?: PopoverProps['dark'];
@@ -19,7 +18,7 @@ export interface AvatarGroupProps extends BaseProps {
     list: AvatarData[];
     max: number;
     borderColor: string;
-    popoverOptions: PopperProps;
+    popoverOptions: AvatarPopperProps;
     tooltipPosition: PopoverProps['position'];
 }
 export declare const AvatarGroup: {

package/dist/core/components/atoms/badge/Badge.d.ts

@@ -1,8 +1,8 @@
 import * as React from 'react';
 import { BaseProps } from "../../../utils/types";
-export declare type Appearance = 'primary' | 'secondary' | 'alert' | 'warning' | 'success' | 'accent1' | 'accent2' | 'accent3' | 'accent4';
+import { AccentAppearance } from "../../../common.type";
 export interface BadgeProps extends BaseProps {
-    appearance: Appearance;
+    appearance: AccentAppearance;
     subtle?: boolean;
     children: React.ReactText;
 }

package/dist/core/components/atoms/button/Button.d.ts

@@ -1,20 +1,20 @@
 import * as React from 'react';
 import { BaseProps, BaseHtmlProps } from "../../../utils/types";
 export declare type ButtonType = 'button' | 'submit' | 'reset';
-export declare type Appearance = 'basic' | 'primary' | 'success' | 'alert' | 'transparent';
-export declare type Size = 'tiny' | 'regular' | 'large';
-export declare type Alignment = 'left' | 'right';
+export declare type ButtonAppearance = 'basic' | 'primary' | 'success' | 'alert' | 'transparent';
+export declare type ButtonSize = 'tiny' | 'regular' | 'large';
+export declare type ButtonAlignment = 'left' | 'right';
 export interface ButtonProps extends BaseProps, BaseHtmlProps<HTMLButtonElement> {
     type?: ButtonType;
-    size?: Size;
-    appearance?: Appearance;
+    size?: ButtonSize;
+    appearance?: ButtonAppearance;
     disabled?: boolean;
     expanded?: boolean;
     selected?: boolean;
     loading?: boolean;
     icon?: string;
     tooltip?: string;
-    iconAlign?: Alignment;
+    iconAlign?: ButtonAlignment;
     largeIcon?: boolean;
     children?: React.ReactText;
     tabIndex?: number;

package/dist/core/components/atoms/checkbox/Checkbox.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
 import { BaseProps, OmitNativeProps } from "../../../utils/types";
-export declare type Size = 'regular' | 'tiny';
-declare type ChangeEvent = React.ChangeEvent<HTMLInputElement>;
+import { ChangeEvent } from "../../../common.type";
+export declare type CheckBoxSize = 'regular' | 'tiny';
 export interface CheckboxProps extends BaseProps, OmitNativeProps<HTMLInputElement, 'onChange'> {
-    size?: Size;
+    size?: CheckBoxSize;
     defaultChecked?: boolean;
     checked?: boolean;
     indeterminate?: boolean;

package/dist/core/components/atoms/chip/Chip.d.ts

@@ -1,5 +1,5 @@
 import { BaseProps } from "../../../utils/types";
-export declare type Type = 'action' | 'selection' | 'input';
+export declare type ChipType = 'action' | 'selection' | 'input';
 export declare type Name = number | string;
 export interface ChipProps extends BaseProps {
     label: string;
@@ -7,7 +7,7 @@ export interface ChipProps extends BaseProps {
     clearButton?: boolean;
     disabled?: boolean;
     selected?: boolean;
-    type: Type;
+    type: ChipType;
     onClose?: (name: Name) => void;
     onClick?: (name: Name) => void;
     name: Name;

package/dist/core/components/atoms/divider/Divider.d.ts

@@ -0,0 +1,15 @@
+import { BaseProps } from "../../../utils/types";
+declare type DividerType = 'basic' | 'header';
+export interface DividerProps extends BaseProps {
+    vertical: boolean;
+    appearance: DividerType;
+}
+export declare const Divider: {
+    (props: DividerProps): JSX.Element;
+    displayName: string;
+    defaultProps: {
+        appearance: string;
+        vertical: boolean;
+    };
+};
+export default Divider;

package/dist/core/components/atoms/divider/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./Divider";
+export * from "./Divider";

package/dist/core/components/atoms/dropdown/Dropdown.d.ts

@@ -1,19 +1,20 @@
 import * as React from 'react';
-import { DropdownListProps, SelectAll, Selected, ChangeEvent } from "./DropdownList";
-import { OptionSchema as Option } from "./option";
+import { DropdownListProps, SelectAll, Selected } from "./DropdownList";
+import { OptionSchema } from "./option";
 import { BaseProps } from "../../../utils/types";
+import { ChangeEvent } from "../../../common.type";
 declare type fetchOptionsFunction = (searchTerm: string) => Promise<{
     searchTerm?: string;
     count: number;
-    options: Option[];
+    options: OptionSchema[];
 }>;
 export declare type EventType = 'select-option' | 'deselect-option' | 'select-all' | 'deselect-all' | 'clear-all' | 'apply-selected' | 'cancel-selected';
 interface ControlledProps {
-    selected?: Option[];
-    onUpdate?: (type: EventType, options?: Option | Option[], recentSelected?: Option[]) => void;
+    selected?: OptionSchema[];
+    onUpdate?: (type: EventType, options?: OptionSchema | OptionSchema[], recentSelected?: OptionSchema[]) => void;
 }
 interface SyncProps {
-    options: Option[];
+    options: OptionSchema[];
     loading?: boolean;
 }
 interface AsyncProps {
@@ -21,7 +22,7 @@ interface AsyncProps {
 }
 interface TriggerProps {
     labelLimit?: number;
-    customLabel?: (selected: number, totalOptions?: number, selectedOptions?: Option[]) => string;
+    customLabel?: (selected: number, totalOptions?: number, selectedOptions?: OptionSchema[]) => string;
     customTrigger?: (label: string) => React.ReactElement;
 }
 interface SharedDropdownProps extends DropdownListProps, BaseProps {
@@ -45,7 +46,7 @@ export declare type DropdownProps = ControlledDropdownProps & UncontrolledDropdo
 interface DropdownState {
     async: boolean;
     searchInit: boolean;
-    options: Option[];
+    options: OptionSchema[];
     loading?: boolean;
     optionsApplied: boolean;
     open?: boolean;
@@ -54,9 +55,9 @@ interface DropdownState {
     searchedOptionsLength: number;
     triggerLabel: string;
     selectAll: SelectAll;
-    selected: Option[];
-    tempSelected: Option[];
-    previousSelected: Option[];
+    selected: OptionSchema[];
+    tempSelected: OptionSchema[];
+    previousSelected: OptionSchema[];
 }
 export declare class Dropdown extends React.Component<DropdownProps, DropdownState> {
     staticLimit: number;
@@ -70,17 +71,17 @@ export declare class Dropdown extends React.Component<DropdownProps, DropdownSta
     constructor(props: DropdownProps);
     componentDidMount(): void;
     componentDidUpdate(prevProps: DropdownProps, prevState: DropdownState): void;
-    getDisabledOptions: (options?: Option[]) => Option[];
+    getDisabledOptions: (options?: OptionSchema[]) => OptionSchema[];
     fetchOptionsFunction: (searchTerm: string) => Promise<any>;
-    getUnSelectedOptions: (options: Option[], init: boolean) => Option[];
-    getSelectedOptions: (options: Option[], init: boolean) => Option[];
+    getUnSelectedOptions: (options: OptionSchema[], init: boolean) => OptionSchema[];
+    getSelectedOptions: (options: OptionSchema[], init: boolean) => OptionSchema[];
     updateOptions: (init: boolean, async?: boolean | undefined) => void;
     updateSearchTerm: (search: string) => void;
     updateOnPopperToggle: () => void;
     updateTriggerLabel: (selectedArray?: Selected[], totalOptions?: number | undefined) => string;
-    updateSelectedOptions: (selectedArray: Option[], isSingleSelect: boolean, isControlled?: boolean | undefined) => void;
-    onOptionSelect: (option: Option) => void;
-    onSelect: (option: Option, checked: boolean) => void;
+    updateSelectedOptions: (selectedArray: OptionSchema[], isSingleSelect: boolean, isControlled?: boolean | undefined) => void;
+    onOptionSelect: (option: OptionSchema) => void;
+    onSelect: (option: OptionSchema, checked: boolean) => void;
     onSelectAll: (event: ChangeEvent) => void;
     debounceSearch: import("throttle-debounce").throttle<() => void>;
     debounceClear: import("throttle-debounce").throttle<() => void>;

package/dist/core/components/atoms/dropdown/DropdownButton.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
-export declare type Size = 'tiny' | 'regular';
+export declare type DropDownButtonSize = 'tiny' | 'regular';
 export interface TriggerProps {
-    triggerSize?: Size;
+    triggerSize?: DropDownButtonSize;
     icon?: string;
     placeholder?: string;
     inlineLabel?: string;

package/dist/core/components/atoms/dropdown/DropdownList.d.ts

@@ -3,7 +3,7 @@ import { PopoverProps } from "../../../index.type";
 import { TriggerProps } from "./DropdownButton";
 import { OptionRendererProps, OptionSchema } from "./option";
 import { BaseProps } from "../../../utils/types";
-export declare type ChangeEvent = React.ChangeEvent<HTMLInputElement>;
+import { ChangeEvent } from "../../../common.type";
 export declare type DropdownAlign = 'left' | 'right';
 export declare type OptionType = 'DEFAULT' | 'WITH_ICON' | 'WITH_META' | 'ICON_WITH_META';
 export interface Selected {
@@ -19,8 +19,8 @@ interface PopoverOptions {
     hideOnReferenceEscape?: PopoverProps['hideOnReferenceEscape'];
     boundaryElement?: PopoverProps['boundaryElement'];
 }
-declare type ListProps = TriggerProps & OptionRendererProps;
-export interface DropdownListProps extends ListProps {
+declare type TriggerAndOptionProps = TriggerProps & OptionRendererProps;
+export interface DropdownListProps extends TriggerAndOptionProps {
     align?: DropdownAlign;
     noResultMessage?: string;
     selectAllLabel?: string;
@@ -40,6 +40,7 @@ export interface DropdownListProps extends ListProps {
     minWidth?: number;
     loadersCount?: number;
     popoverOptions?: PopoverOptions;
+    searchPlaceholder?: string;
 }
 interface OptionsProps extends DropdownListProps, BaseProps {
     listOptions: OptionSchema[];

package/dist/core/components/atoms/dropdown/option/index.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { MetaListProps, IconProps, TextProps } from "../../../../index.type";
 import { OptionType } from "../DropdownList";
-export declare type ChangeEvent = React.ChangeEvent<HTMLInputElement>;
+import { ChangeEvent } from "../../../../common.type";
 export declare type ClickEvent = React.MouseEvent<HTMLDivElement>;
 export interface OptionRendererProps {
     optionRenderer?: (props: OptionProps) => React.ReactElement;

package/dist/core/components/atoms/heading/Heading.d.ts

@@ -1,11 +1,11 @@
 import * as React from 'react';
 import { BaseHtmlProps, BaseProps } from "../../../utils/types";
-export declare type Size = 's' | 'm' | 'l' | 'xl' | 'xxl';
-export declare type Appearance = 'default' | 'subtle' | 'disabled' | 'white';
+import { HeadingAppearance } from "../../../common.type";
+export declare type HeadingSize = 's' | 'm' | 'l' | 'xl' | 'xxl';
 export interface HeadingProps extends BaseProps, BaseHtmlProps<HTMLHeadingElement> {
     children: React.ReactText;
-    appearance: Appearance;
-    size: Size;
+    appearance: HeadingAppearance;
+    size: HeadingSize;
 }
 export declare const Heading: {
     (props: HeadingProps): JSX.Element;

package/dist/core/components/atoms/icon/Icon.d.ts

@@ -1,14 +1,16 @@
 import * as React from 'react';
 import { BaseProps } from "../../../utils/types";
-export declare type Appearance = 'default' | 'destructive' | 'white' | 'subtle' | 'disabled' | 'info' | 'alert' | 'warning' | 'success' | 'primary_lighter' | 'primary' | 'primary_dark' | 'alert_lighter' | 'alert_dark' | 'warning_lighter' | 'warning_dark' | 'success_lighter' | 'success_dark' | 'accent1' | 'accent1_lighter' | 'accent1_dark' | 'accent2' | 'accent2_lighter' | 'accent2_dark' | 'accent3' | 'accent3_lighter' | 'accent3_dark' | 'accent4' | 'accent4_lighter' | 'accent4_dark' | 'inverse';
+export declare type IconAppearance = 'default' | 'destructive' | 'white' | 'subtle' | 'disabled' | 'info' | 'alert' | 'warning' | 'success' | 'primary_lighter' | 'primary' | 'primary_dark' | 'alert_lighter' | 'alert_dark' | 'warning_lighter' | 'warning_dark' | 'success_lighter' | 'success_dark' | 'accent1' | 'accent1_lighter' | 'accent1_dark' | 'accent2' | 'accent2_lighter' | 'accent2_dark' | 'accent3' | 'accent3_lighter' | 'accent3_dark' | 'accent4' | 'accent4_lighter' | 'accent4_dark' | 'inverse';
 export declare type IconType = 'filled' | 'outlined' | 'outline' | 'rounded' | 'round' | 'two-tone' | 'sharp';
 export interface IconProps extends BaseProps {
     name?: string;
     size: number;
     type?: IconType;
-    appearance?: Appearance;
-    onClick?: (e: React.MouseEvent<HTMLElement, MouseEvent>) => void;
+    appearance?: IconAppearance;
+    onClick?: (e: React.MouseEvent<HTMLElement>) => void;
+    onKeyDown?: (e: React.KeyboardEvent<HTMLElement>) => void;
     children?: React.ReactNode;
+    tabIndex?: React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>['tabIndex'];
 }
 export declare const Icon: {
     (props: IconProps): JSX.Element;

package/dist/core/components/atoms/input/Input.d.ts

@@ -1,16 +1,16 @@
 import * as React from 'react';
 import { IconProps } from "../../../index.type";
 import { BaseHtmlProps, BaseProps } from "../../../utils/types";
+import { AutoComplete } from "../../../common.type";
 export declare type InputType = 'text' | 'password' | 'number' | 'email' | 'tel' | 'url';
-export declare type AutoComplete = 'on' | 'off';
-export declare type Size = 'tiny' | 'regular' | 'large';
+export declare type InputSize = 'tiny' | 'regular' | 'large';
 export interface InputProps extends BaseProps, BaseHtmlProps<HTMLInputElement> {
     name?: string;
     type?: InputType;
     value?: string;
     defaultValue?: string;
     placeholder?: string;
-    size?: Size;
+    size?: InputSize;
     icon?: string;
     inlineLabel?: string;
     disabled?: boolean;
@@ -26,7 +26,7 @@ export interface InputProps extends BaseProps, BaseHtmlProps<HTMLInputElement> {
     error?: boolean;
     info?: string;
     minWidth?: string;
-    onClear?: (e: React.MouseEvent<HTMLElement>) => void;
+    onClear?: (e: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) => void;
     onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
     onClick?: (e: React.MouseEvent<HTMLInputElement>) => void;
     onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;

package/dist/core/components/atoms/legend/Legend.d.ts

@@ -1,10 +1,10 @@
 import * as React from 'react';
-import { Appearance as LabelAppearance } from "../text";
+import { TextAppearance } from "../text";
 import { BaseProps } from "../../../utils/types";
 export interface LegendProps extends BaseProps {
     children: React.ReactText;
     iconAppearance: string;
-    labelAppearance?: LabelAppearance;
+    labelAppearance?: TextAppearance;
     iconSize: number;
     labelWeight?: 'strong' | 'medium';
     onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;

package/dist/core/components/atoms/link/Link.d.ts

@@ -1,12 +1,12 @@
 import * as React from 'react';
 import { BaseProps, OmitNativeProps } from "../../../utils/types";
 declare type LinkTarget = '_blank' | '_self' | '_parent' | '_top';
-declare type Appearance = 'default' | 'subtle';
-declare type Size = 'regular' | 'tiny';
+declare type LinkAppearance = 'default' | 'subtle';
+declare type LinkSize = 'regular' | 'tiny';
 export interface LinkProps extends BaseProps, OmitNativeProps<HTMLLinkElement, 'onClick'> {
     id?: string;
-    appearance: Appearance;
-    size: Size;
+    appearance: LinkAppearance;
+    size: LinkSize;
     disabled: boolean;
     href?: string;
     target?: LinkTarget;

package/dist/core/components/atoms/message/Message.d.ts

@@ -1,8 +1,8 @@
 import * as React from 'react';
 import { BaseProps } from "../../../utils/types";
-export declare type Appearance = 'default' | 'alert' | 'info' | 'success' | 'warning';
+import { MessageAppearance } from "../../../common.type";
 export interface MessageProps extends BaseProps {
-    appearance: Appearance;
+    appearance: MessageAppearance;
     title?: string;
     children?: React.ReactNode;
     description: string;

package/dist/core/components/atoms/metricInput/MetricInput.d.ts

@@ -1,13 +1,13 @@
 import * as React from 'react';
 import { BaseHtmlProps, BaseProps } from "../../../utils/types";
-export declare type AutoComplete = 'on' | 'off';
-export declare type Size = 'regular' | 'large';
+import { AutoComplete } from "../../../common.type";
+export declare type MetricInputSize = 'regular' | 'large';
 export interface MetricInputProps extends BaseProps, BaseHtmlProps<HTMLInputElement> {
     name?: string;
     value?: React.ReactText;
     defaultValue?: React.ReactText;
     placeholder?: string;
-    size?: Size;
+    size?: MetricInputSize;
     icon?: string;
     prefix?: string;
     suffix?: string;

package/dist/core/components/atoms/multiSlider/SliderUtils.d.ts

@@ -6,4 +6,4 @@ export declare const clamp: (value: number, min: number, max: number) => number;
 export declare const arraysEqual: (oldValues: number[], newValues: number[]) => boolean | undefined;
 export declare function argMin<T>(values: T[], argFn: (value: T) => any): T | undefined;
 export declare function fillValues<T>(values: T[], startIndex: number, endIndex: number, fillValue: T): void;
-export declare function isElementOfType<P = {}>(element: any, _ComponentType: React.ComponentType<P>): element is React.ReactElement<P>;
+export declare function isElementOfType(element: React.ReactElement): boolean;

package/dist/core/components/atoms/multiSlider/index.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { BaseProps } from "../../../utils/types";
 import Handle, { HandleProps } from "./Handle";
-declare type NumberRange = [number, number];
+import { NumberRange } from "../../../common.type";
 export interface MultiSliderProps extends BaseProps {
     disabled?: boolean;
     labelStepSize: number;
@@ -47,13 +47,13 @@ export declare class MultiSlider extends React.Component<InternalMultiSliderProp
     getLabelPrecision: ({ labelPrecision, stepSize }: InternalMultiSliderProps) => number;
     getOffsetRatio: (value: number) => number;
     addHandleRef: (ref: Handle) => void;
-    getHandleValues: (props: React.PropsWithChildren<InternalMultiSliderProps>) => HandleProps[];
+    getHandleValues: (props: React.PropsWithChildren<InternalMultiSliderProps>) => any[];
     updateTickSize: () => void;
     getTrackFill: (start: HandleProps, end?: HandleProps | undefined) => boolean;
     nearestHandleForValue(handles: Handle[], getOffset: (handle: Handle) => number): Handle | undefined;
     maybeHandleTrackClick: (event: React.MouseEvent<HTMLDivElement>) => void;
     getLockedHandleIndex: (startIndex: number, endIndex: number) => number;
-    getNewHandleValues: (newValue: number, oldIndex: number) => number[];
+    getNewHandleValues: (newValue: number, oldIndex: number) => any[];
     onReleaseHandler: (newValue: number, index: number) => void;
     onChangeHandler: (newValue: number, index: number) => void;
     formatLabel: (value: number) => string;

package/dist/core/components/atoms/paragraph/Paragraph.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
 import { BaseHtmlProps, BaseProps } from "../../../utils/types";
-export declare type Appearance = 'default' | 'white' | 'destructive' | 'subtle' | 'disabled';
+export declare type ParagraphAppearance = 'default' | 'white' | 'destructive' | 'subtle' | 'disabled';
 export interface ParagraphProps extends BaseProps, BaseHtmlProps<HTMLParagraphElement> {
     children: React.ReactNode;
-    appearance: Appearance;
+    appearance: ParagraphAppearance;
 }
 export declare const Paragraph: {
     (props: ParagraphProps): JSX.Element;

package/dist/core/components/atoms/pills/Pills.d.ts

@@ -1,8 +1,8 @@
 import * as React from 'react';
 import { BaseProps } from "../../../utils/types";
-export declare type Appearance = 'primary' | 'secondary' | 'alert' | 'warning' | 'success' | 'accent1' | 'accent2' | 'accent3' | 'accent4';
+import { AccentAppearance } from "../../../common.type";
 export interface PillsProps extends BaseProps {
-    appearance: Appearance;
+    appearance: AccentAppearance;
     subtle?: boolean;
     children: React.ReactText;
 }

package/dist/core/components/atoms/placeholderImage/PlaceholderImage.d.ts

@@ -1,8 +1,8 @@
 import { BaseProps } from "../../../utils/types";
-export declare type Size = 'small' | 'medium' | 'large';
+export declare type PlaceholderImageSize = 'small' | 'medium' | 'large';
 export interface PlaceholderImageProps extends BaseProps {
     round?: boolean;
-    size: Size;
+    size: PlaceholderImageSize;
 }
 export declare const PlaceholderImage: {
     (props: PlaceholderImageProps): JSX.Element;

package/dist/core/components/atoms/placeholderParagraph/PlaceholderParagraph.d.ts

@@ -1,9 +1,9 @@
 import { BaseProps } from "../../../utils/types";
 export declare type Length = 'small' | 'medium' | 'large';
-export declare type Size = 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl' | 'xxxl';
+export declare type PlaceholderParagraphSize = 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl' | 'xxxl';
 export interface PlaceholderParagraphProps extends BaseProps {
     length: Length;
-    size?: Size;
+    size?: PlaceholderParagraphSize;
 }
 export declare const PlaceholderParagraph: {
     (props: PlaceholderParagraphProps): JSX.Element;