@true-engineering/true-react-common-ui-kit 1.0.2 → 1.1.0

package/dist/components/Modal/Modal.styles.d.ts

@@ -1,239 +1,239 @@
 import { ComponentStyles } from '../../types';
 export declare const styles: {
-  root: {};
-  fixedPosition: {
-    position: string;
-    top: number;
-    right: number;
-    bottom: number;
-    left: number;
-    zIndex: number;
-    overflowX: string;
-    '-webkit-overflow-scrolling': string;
-    '& $innerOverlay': {
-      display: string;
-      width: string;
-      minHeight: string;
-      boxSizing: string;
-    };
-  };
-  innerOverlay: {};
-  sideBar: {
-    '& $modal': {
-      borderRadius: number;
-      margin: number;
-      minHeight: string;
-    };
-  };
-  'position-static': {};
-  'position-left': {};
-  'position-right': {
-    justifyContent: string;
-  };
-  'position-center': {
-    padding: number[];
-  };
-  overlay: {
-    backgroundColor: string;
-  };
-  modal: {
-    backgroundColor: '#ffffff';
-    borderRadius: 16;
-    boxShadow: string;
-    margin: string;
-    position: string;
-    maxWidth: string;
-  };
-  title: {
-    fontSize: number;
-    lineHeight: number;
-    marginTop: number;
-  };
-  titleWithCloseButton: {
-    paddingRight: number;
-  };
-  close: {
-    position: string;
-  };
-  content: {};
-  footer: {
-    display: string;
-    gap: number;
-  };
-  stickyFooterWrapper: {
-    position: string;
-    bottom: number;
-    marginTop: string;
-    zIndex: number;
-  };
-  stickyFooter: {
-    borderTop: (string | number)[];
-    padding: number[];
-    borderBottomLeftRadius: 16;
-    borderBottomRightRadius: 16;
-    backgroundColor: '#ffffff';
-  };
-  'buttons-left': {
-    justifyContent: string;
-  };
-  'buttons-center': {
-    justifyContent: string;
-  };
-  'buttons-right': {
-    justifyContent: string;
-  };
-  withoutFooter: {};
-  withStickyFooter: {
-    display: string;
-    flexDirection: string;
-    '& $content': {
-      position: string;
-      zIndex: number;
-    };
-  };
-  footerWrapper: {};
-  l: {
-    '& $modal': {
-      padding: number[];
-      fontSize: number;
-      width: number;
-      '&$withStickyFooter': {
-        paddingBottom: number;
-      };
-    };
-    '& $withoutFooter': {
-      paddingBottom: number;
-    };
-    '& $title': {
-      fontSize: number;
-      marginBottom: number;
-    };
-    '& $close': {
-      right: number;
-      top: number;
-    };
-    '& $footerWrapper': {
-      paddingTop: number;
-    };
-    '& $stickyFooter': {
-      paddingLeft: number;
-      paddingRight: number;
-      marginLeft: number;
-      marginRight: number;
-    };
-  };
-  m: {
-    '& $modal': {
-      padding: number[];
-      width: number;
-      '&$withStickyFooter': {
-        paddingBottom: number;
-      };
-    };
-    '& $withoutFooter': {
-      paddingBottom: number;
-    };
-    '& $title': {
-      fontSize: number;
-      marginBottom: number;
-    };
-    '& $close': {
-      right: number;
-      top: number;
-    };
-    '& $footerWrapper': {
-      paddingTop: number;
-    };
-    '& $stickyFooter': {
-      paddingLeft: number;
-      paddingRight: number;
-      marginLeft: number;
-      marginRight: number;
-    };
-  };
-  s: {
-    '& $modal': {
-      padding: number[];
-      fontSize: number;
-      width: number;
-      '&$withStickyFooter': {
-        paddingBottom: number;
-      };
-    };
-    '& $withoutFooter': {
-      paddingBottom: number;
-    };
-    '& $title': {
-      fontSize: number;
-      marginBottom: number;
-    };
-    '& $close': {
-      right: number;
-      top: number;
-    };
-    '& $footerWrapper': {
-      paddingTop: number;
-    };
-    '& $stickyFooter': {
-      paddingLeft: number;
-      paddingRight: number;
-      marginLeft: number;
-      marginRight: number;
-    };
-  };
-  modalWrapper: {
-    display: string;
-    width: string;
-  };
-  animationEnd: {
-    '& $modal': {
-      opacity: number;
-    };
-    '& $position-center $modal': {
-      transform: string;
-    };
-    '& $position-right $modal': {
-      transform: string;
-    };
-    '& $position-left $modal': {
-      transform: string;
-    };
-    '& $overlay': {
-      opacity: number;
-    };
-  };
-  animationStart: {
-    '& $modal': {
-      opacity: number;
-      transition: string;
-      transitionProperty: string;
-    };
-    '& $position-center $modal': {
-      transform: string;
-    };
-    '& $position-right $modal': {
-      transform: string;
-    };
-    '& $position-left $modal': {
-      transform: string;
-    };
-    '& $overlay': {
-      opacity: number;
-      transition: string;
-    };
-  };
-  'modal-enter': {
-    extend: string;
-  };
-  'modal-enter-active': {
-    extend: string;
-  };
-  'modal-exit': {
-    extend: string;
-  };
-  'modal-exit-active': {
-    extend: string;
-  };
-  tweakCloseButton: {};
+    root: {};
+    fixedPosition: {
+        position: string;
+        top: number;
+        right: number;
+        bottom: number;
+        left: number;
+        zIndex: number;
+        overflowX: string;
+        '-webkit-overflow-scrolling': string;
+        '& $innerOverlay': {
+            display: string;
+            width: string;
+            minHeight: string;
+            boxSizing: string;
+        };
+    };
+    innerOverlay: {};
+    sideBar: {
+        '& $modal': {
+            borderRadius: number;
+            margin: number;
+            minHeight: string;
+        };
+    };
+    'position-static': {};
+    'position-left': {};
+    'position-right': {
+        justifyContent: string;
+    };
+    'position-center': {
+        padding: number[];
+    };
+    overlay: {
+        backgroundColor: string;
+    };
+    modal: {
+        backgroundColor: "#ffffff";
+        borderRadius: 16;
+        boxShadow: string;
+        margin: string;
+        position: string;
+        maxWidth: string;
+    };
+    title: {
+        fontSize: number;
+        lineHeight: number;
+        marginTop: number;
+    };
+    titleWithCloseButton: {
+        paddingRight: number;
+    };
+    close: {
+        position: string;
+    };
+    content: {};
+    footer: {
+        display: string;
+        gap: number;
+    };
+    stickyFooterWrapper: {
+        position: string;
+        bottom: number;
+        marginTop: string;
+        zIndex: number;
+    };
+    stickyFooter: {
+        borderTop: (string | number)[];
+        padding: number[];
+        borderBottomLeftRadius: 16;
+        borderBottomRightRadius: 16;
+        backgroundColor: "#ffffff";
+    };
+    'buttons-left': {
+        justifyContent: string;
+    };
+    'buttons-center': {
+        justifyContent: string;
+    };
+    'buttons-right': {
+        justifyContent: string;
+    };
+    withoutFooter: {};
+    withStickyFooter: {
+        display: string;
+        flexDirection: string;
+        '& $content': {
+            position: string;
+            zIndex: number;
+        };
+    };
+    footerWrapper: {};
+    l: {
+        '& $modal': {
+            padding: number[];
+            fontSize: number;
+            width: number;
+            '&$withStickyFooter': {
+                paddingBottom: number;
+            };
+        };
+        '& $withoutFooter': {
+            paddingBottom: number;
+        };
+        '& $title': {
+            fontSize: number;
+            marginBottom: number;
+        };
+        '& $close': {
+            right: number;
+            top: number;
+        };
+        '& $footerWrapper': {
+            paddingTop: number;
+        };
+        '& $stickyFooter': {
+            paddingLeft: number;
+            paddingRight: number;
+            marginLeft: number;
+            marginRight: number;
+        };
+    };
+    m: {
+        '& $modal': {
+            padding: number[];
+            width: number;
+            '&$withStickyFooter': {
+                paddingBottom: number;
+            };
+        };
+        '& $withoutFooter': {
+            paddingBottom: number;
+        };
+        '& $title': {
+            fontSize: number;
+            marginBottom: number;
+        };
+        '& $close': {
+            right: number;
+            top: number;
+        };
+        '& $footerWrapper': {
+            paddingTop: number;
+        };
+        '& $stickyFooter': {
+            paddingLeft: number;
+            paddingRight: number;
+            marginLeft: number;
+            marginRight: number;
+        };
+    };
+    s: {
+        '& $modal': {
+            padding: number[];
+            fontSize: number;
+            width: number;
+            '&$withStickyFooter': {
+                paddingBottom: number;
+            };
+        };
+        '& $withoutFooter': {
+            paddingBottom: number;
+        };
+        '& $title': {
+            fontSize: number;
+            marginBottom: number;
+        };
+        '& $close': {
+            right: number;
+            top: number;
+        };
+        '& $footerWrapper': {
+            paddingTop: number;
+        };
+        '& $stickyFooter': {
+            paddingLeft: number;
+            paddingRight: number;
+            marginLeft: number;
+            marginRight: number;
+        };
+    };
+    modalWrapper: {
+        display: string;
+        width: string;
+    };
+    animationEnd: {
+        '& $modal': {
+            opacity: number;
+        };
+        '& $position-center $modal': {
+            transform: string;
+        };
+        '& $position-right $modal': {
+            transform: string;
+        };
+        '& $position-left $modal': {
+            transform: string;
+        };
+        '& $overlay': {
+            opacity: number;
+        };
+    };
+    animationStart: {
+        '& $modal': {
+            opacity: number;
+            transition: string;
+            transitionProperty: string;
+        };
+        '& $position-center $modal': {
+            transform: string;
+        };
+        '& $position-right $modal': {
+            transform: string;
+        };
+        '& $position-left $modal': {
+            transform: string;
+        };
+        '& $overlay': {
+            opacity: number;
+            transition: string;
+        };
+    };
+    'modal-enter': {
+        extend: string;
+    };
+    'modal-enter-active': {
+        extend: string;
+    };
+    'modal-exit': {
+        extend: string;
+    };
+    'modal-exit-active': {
+        extend: string;
+    };
+    tweakCloseButton: {};
 };
 export declare type ModalStyles = ComponentStyles<typeof styles>;

package/dist/components/MoreMenu/MoreMenu.d.ts

@@ -3,12 +3,12 @@ import { ICommonProps } from '../../types';
 import { IListItem } from '../List';
 import { MoreMenuStyles } from './MoreMenu.styles';
 export interface IMoreMenuProps extends ICommonProps {
-  tweakStyles?: MoreMenuStyles;
-  items: IListItem[];
-  isDisabled?: boolean;
-  hasDefaultStateBackground?: boolean;
-  testId?: string;
-  onMenuOpen?(): void;
-  onMenuClose?(): void;
+    tweakStyles?: MoreMenuStyles;
+    items: IListItem[];
+    isDisabled?: boolean;
+    hasDefaultStateBackground?: boolean;
+    testId?: string;
+    onMenuOpen?(): void;
+    onMenuClose?(): void;
 }
 export declare const MoreMenu: FC<IMoreMenuProps>;

package/dist/components/MoreMenu/MoreMenu.styles.d.ts

@@ -1,54 +1,54 @@
 import { ComponentStyles } from '../../types';
 export declare const styles: {
-  root: {
-    position: string;
-  };
-  hasCircle: {};
-  button: {
-    display: string;
-    alignItems: string;
-    justifyContent: string;
-    width: number;
-    height: number;
-    backgroundColor: string;
-    color: '#505f79';
-    padding: number;
-    borderRadius: string;
-    border: string;
-    cursor: string;
-    transition: string;
-    '&$hasCircle': {
-      backgroundColor: string;
+    root: {
+        position: string;
     };
-    '&:hover': {
-      backgroundColor: string;
+    hasCircle: {};
+    button: {
+        display: string;
+        alignItems: string;
+        justifyContent: string;
+        width: number;
+        height: number;
+        backgroundColor: string;
+        color: "#505f79";
+        padding: number;
+        borderRadius: string;
+        border: string;
+        cursor: string;
+        transition: string;
+        '&$hasCircle': {
+            backgroundColor: string;
+        };
+        '&:hover': {
+            backgroundColor: string;
+        };
+        '&:focus': {
+            backgroundColor: string;
+        };
+        '&:active, &$active': {
+            backgroundColor: string;
+        };
+        '&$disabled': {
+            backgroundColor: string;
+            color: "#d0d6e1";
+        };
     };
-    '&:focus': {
-      backgroundColor: string;
+    icon: {
+        width: number;
+        height: number;
     };
-    '&:active, &$active': {
-      backgroundColor: string;
+    active: {};
+    disabled: {
+        cursor: string;
     };
-    '&$disabled': {
-      backgroundColor: string;
-      color: '#d0d6e1';
+    menu: {
+        position: string;
+        zIndex: number;
+        top: string;
+        right: number;
+        marginTop: number;
     };
-  };
-  icon: {
-    width: number;
-    height: number;
-  };
-  active: {};
-  disabled: {
-    cursor: string;
-  };
-  menu: {
-    position: string;
-    zIndex: number;
-    top: string;
-    right: number;
-    marginTop: number;
-  };
-  tweakList: {};
+    tweakList: {};
 };
 export declare type MoreMenuStyles = ComponentStyles<typeof styles>;

package/dist/components/MultiSelect/MultiSelect.d.ts

@@ -1,34 +1,19 @@
 /// <reference types="react" />
 import { IMultiSelectListValues } from '../MultiSelectList';
-import {
-  IMultiSelectLocale,
-  IMultiSelectLocaleKey,
-} from '../MultiSelectList/locales';
+import { IMultiSelectLocale, IMultiSelectLocaleKey } from '../MultiSelectList/locales';
 import { MultiSelectStyles } from './MultiSelect.styles';
 export declare type THorizontalCornerConnection = 'full' | 'left' | 'right';
 export interface IMultiSelectProps<Value = string> {
-  tweakStyles?: MultiSelectStyles;
-  value?: IMultiSelectListValues<Value>;
-  corners?: THorizontalCornerConnection;
-  isInvalid?: boolean;
-  isRequired?: boolean;
-  isDisabled?: boolean;
-  placeholder?: string;
-  localeKey?: IMultiSelectLocaleKey;
-  locale?: IMultiSelectLocale;
-  onChange: (value?: IMultiSelectListValues<Value>) => void;
-  fetchOptions: (value?: string, page?: number) => Promise<Value[]>;
+    tweakStyles?: MultiSelectStyles;
+    value?: IMultiSelectListValues<Value>;
+    corners?: THorizontalCornerConnection;
+    isInvalid?: boolean;
+    isRequired?: boolean;
+    isDisabled?: boolean;
+    placeholder?: string;
+    localeKey?: IMultiSelectLocaleKey;
+    locale?: IMultiSelectLocale;
+    onChange: (value?: IMultiSelectListValues<Value>) => void;
+    fetchOptions: (value?: string, page?: number) => Promise<Value[]>;
 }
-export declare function MultiSelect<Value = string>({
-  value,
-  corners,
-  isInvalid,
-  isRequired,
-  isDisabled,
-  placeholder,
-  localeKey,
-  locale,
-  onChange,
-  fetchOptions,
-  tweakStyles,
-}: IMultiSelectProps<Value>): JSX.Element;
+export declare function MultiSelect<Value = string>({ value, corners, isInvalid, isRequired, isDisabled, placeholder, localeKey, locale, onChange, fetchOptions, tweakStyles, }: IMultiSelectProps<Value>): JSX.Element;