@fattureincloud/fic-design-system 1.0.6 → 1.0.8

Sign up to get free protection for your applications and to get access to all the features.
Files changed (49) hide show
  1. package/dist/common/components/typography/types.d.ts +1 -1
  2. package/dist/common/types/index.d.ts +4 -0
  3. package/dist/common/types/misc.d.ts +7 -0
  4. package/dist/common/utils/dsUtils.d.ts +2 -0
  5. package/dist/components/buttons/button/types.d.ts +5 -5
  6. package/dist/components/drawer/drawer.d.ts +1 -0
  7. package/dist/components/dropdown/types.d.ts +4 -4
  8. package/dist/components/editableInput/EditableInput.d.ts +3 -2
  9. package/dist/components/editableInput/components/CustomInput.d.ts +2 -1
  10. package/dist/components/editableInput/components/TextAreaPopup.d.ts +2 -1
  11. package/dist/components/editableInput/editableInput.stories.d.ts +7 -0
  12. package/dist/components/floatingBadge/types.d.ts +2 -0
  13. package/dist/components/form/checkbox/styled.d.ts +2 -2
  14. package/dist/components/form/checkbox/types.d.ts +1 -0
  15. package/dist/components/form/fileUploader/components/FileUploaderContent.d.ts +2 -2
  16. package/dist/components/form/fileUploader/fileUploaderPalette.d.ts +2 -2
  17. package/dist/components/form/fileUploader/types.d.ts +3 -3
  18. package/dist/components/form/inputHelper/types.d.ts +2 -2
  19. package/dist/components/form/textArea/types.d.ts +1 -0
  20. package/dist/components/icon/Icon.d.ts +0 -1
  21. package/dist/components/icon/components/iconBackground/IconBackground.d.ts +2 -3
  22. package/dist/components/icon/components/iconBackground/iconBackgroundPalette.d.ts +2 -3
  23. package/dist/components/icon/icon.stories.d.ts +5 -5
  24. package/dist/components/icon/iconPalette.d.ts +4 -3
  25. package/dist/components/icon/utils.d.ts +2 -2
  26. package/dist/components/layout/sidebarItem/styled.d.ts +1 -0
  27. package/dist/components/layout/sidebarItem/types.d.ts +12 -5
  28. package/dist/components/newTable/styled.d.ts +1 -4
  29. package/dist/components/toast/styled.d.ts +0 -1
  30. package/dist/components/toast/toast.stories.d.ts +1 -0
  31. package/dist/components/verticalTabs/VerticalTabs.d.ts +4 -0
  32. package/dist/components/verticalTabs/components/verticalTabsSelector/VerticalTabsSelector.d.ts +4 -0
  33. package/dist/components/verticalTabs/components/verticalTabsSelector/index.d.ts +2 -0
  34. package/dist/components/verticalTabs/components/verticalTabsSelector/styled.d.ts +6 -0
  35. package/dist/components/verticalTabs/components/verticalTabsSelector/types.d.ts +14 -0
  36. package/dist/components/verticalTabs/components/verticalTabsSelector/utils.d.ts +7 -0
  37. package/dist/components/verticalTabs/index.d.ts +3 -0
  38. package/dist/components/verticalTabs/styled.d.ts +8 -0
  39. package/dist/components/verticalTabs/types.d.ts +33 -0
  40. package/dist/components/verticalTabs/verticalTabs.stories.d.ts +5 -0
  41. package/dist/components/verticalTabs/verticalTabsPalette.d.ts +3 -0
  42. package/dist/index.d.ts +1 -1
  43. package/dist/index.esm.js +8 -8
  44. package/dist/index.esm.js.map +1 -1
  45. package/dist/index.js +8 -8
  46. package/dist/index.js.map +1 -1
  47. package/dist/styles/theme.d.ts +28 -28
  48. package/dist/styles/types.d.ts +4 -4
  49. package/package.json +1 -2
@@ -5,7 +5,7 @@ import { paletteColor } from '../../../styles/types';
5
5
  export type TextProps = {
6
6
  bold?: boolean;
7
7
  centered?: boolean;
8
- children: React.ReactNode | React.ReactNode[] | undefined | null;
8
+ children: React.ReactNode | React.ReactNode[];
9
9
  clamp?: number;
10
10
  className?: string;
11
11
  color?: colors | paletteColor;
@@ -0,0 +1,4 @@
1
+ export * from './colorsPalette';
2
+ export * from './dateTypes';
3
+ export * from './label';
4
+ export * from './misc';
@@ -0,0 +1,7 @@
1
+ export declare enum ComponentType {
2
+ ERROR = "error",
3
+ INFO = "info",
4
+ STANDARD = "standard",
5
+ SUCCESS = "success",
6
+ WARNING = "warning"
7
+ }
@@ -1,3 +1,5 @@
1
+ export declare const HEX_REGEX: RegExp;
2
+ export declare const isHexColor: (value: string) => boolean;
1
3
  export declare const isNumber: (n: number | string | undefined) => boolean;
2
4
  export declare const parseDimension: (d: number | string) => string;
3
5
  export declare const pixelToNumber: (s: string) => number;
@@ -1,15 +1,15 @@
1
1
  import { MouseEventHandler } from 'react';
2
2
  import { ButtonParts } from './buttonPalette';
3
3
  export declare const buttonSizesArray: readonly ["large", "medium"];
4
- export type buttonSizes = typeof buttonSizesArray[number];
4
+ export type buttonSizes = (typeof buttonSizesArray)[number];
5
5
  export declare const buttonTypesArray: readonly ["primary", "secondary", "text"];
6
- export type buttonTypes = typeof buttonTypesArray[number];
6
+ export type buttonTypes = (typeof buttonTypesArray)[number];
7
7
  export declare const buttonColorsArray: readonly ["blue", "red", "green", "grey", "yellow"];
8
- export type buttonColors = typeof buttonColorsArray[number];
8
+ export type buttonColors = (typeof buttonColorsArray)[number];
9
9
  export declare const buttonDisableColorArray: readonly ["disabled"];
10
- export type buttonDisableColor = typeof buttonDisableColorArray[number];
10
+ export type buttonDisableColor = (typeof buttonDisableColorArray)[number];
11
11
  export declare const buttonPartsArray: readonly ["normal", "hover", "active", "text", "textHover"];
12
- export type buttonParts = typeof buttonPartsArray[number];
12
+ export type buttonParts = (typeof buttonPartsArray)[number];
13
13
  export interface WrapperProps {
14
14
  isDisabled: boolean;
15
15
  fullWidth?: boolean;
@@ -9,6 +9,7 @@ export interface DrawerProps {
9
9
  children?: ReactNode;
10
10
  fullscreen?: boolean;
11
11
  onFullscreen?: (fullscreen: boolean) => void;
12
+ showTooltip?: boolean;
12
13
  }
13
14
  declare const Drawer: React.FC<DrawerProps>;
14
15
  export default Drawer;
@@ -1,15 +1,15 @@
1
1
  import { Placement } from '@popperjs/core/lib/enums';
2
- import React, { CSSProperties, MouseEventHandler } from 'react';
2
+ import React, { CSSProperties, MouseEventHandler, ReactNode } from 'react';
3
3
  import { IconProps } from '../icon';
4
4
  export type TitleProps = {
5
5
  text: string;
6
6
  };
7
7
  export type closeDropdownType = () => void;
8
- export type renderContentType = (closeDropdown: closeDropdownType) => React.ReactNode;
8
+ export type renderContentType = (closeDropdown: closeDropdownType) => ReactNode;
9
9
  export type DropdownProps = {
10
10
  className?: string;
11
11
  title?: string;
12
- renderTrigger?: () => React.ReactNode;
12
+ renderTrigger?: () => ReactNode;
13
13
  triggerStyles?: CSSProperties;
14
14
  content?: DropdownItemProps[];
15
15
  renderContent?: renderContentType;
@@ -38,7 +38,7 @@ export interface DropdownItemProps {
38
38
  onClick?: MouseEventHandler;
39
39
  maxWidth?: DropdownProps['maxWidth'];
40
40
  fullWidth?: DropdownProps['fullWidth'];
41
- children?: React.ReactNode;
41
+ children?: ReactNode;
42
42
  isDisabled?: boolean;
43
43
  type?: DropdownItemType;
44
44
  onMouseEnter?: () => void;
@@ -1,5 +1,5 @@
1
1
  /// <reference types="react" />
2
- interface Props {
2
+ export interface EditableInputProps {
3
3
  hover: boolean;
4
4
  content: string | number | null;
5
5
  unitSymbol?: string | undefined;
@@ -7,6 +7,7 @@ interface Props {
7
7
  rowId: number;
8
8
  onOpen?: () => void;
9
9
  onClose?: () => void;
10
+ maxContentLength?: number;
10
11
  }
11
- declare const EditableInput: ({ hover, content, unitSymbol, onChange, rowId, onOpen, onClose }: Props) => JSX.Element;
12
+ declare const EditableInput: ({ hover, content, unitSymbol, onChange, rowId, onOpen, onClose, maxContentLength, }: EditableInputProps) => JSX.Element;
12
13
  export default EditableInput;
@@ -7,6 +7,7 @@ interface Props {
7
7
  rowId: number;
8
8
  onOpen?: () => void;
9
9
  onClose?: () => void;
10
+ maxContentLength?: number;
10
11
  }
11
- declare const CustomInput: ({ hover, onChange, unitSymbol, content, rowId, onOpen, onClose }: Props) => JSX.Element;
12
+ declare const CustomInput: ({ hover, onChange, unitSymbol, content, rowId, onOpen, onClose, maxContentLength, }: Props) => JSX.Element;
12
13
  export default CustomInput;
@@ -7,6 +7,7 @@ interface Props {
7
7
  rowId: number;
8
8
  onClose?: () => void;
9
9
  focus: boolean;
10
+ maxContentLength?: number;
10
11
  }
11
- declare const TextAreaPopup: ({ onChange, content, onBlur, rowId, onClose, focus }: Props) => JSX.Element;
12
+ declare const TextAreaPopup: ({ onChange, content, onBlur, rowId, onClose, focus, maxContentLength }: Props) => JSX.Element;
12
13
  export default TextAreaPopup;
@@ -0,0 +1,7 @@
1
+ /// <reference types="react" />
2
+ import { Meta } from '@storybook/react';
3
+ import { EditableInputProps } from './EditableInput';
4
+ declare const EditableInputStories: Meta<EditableInputProps>;
5
+ export declare const Default: () => JSX.Element;
6
+ export declare const WithMaxContentLength: () => JSX.Element;
7
+ export default EditableInputStories;
@@ -10,6 +10,8 @@ export interface WithBadgeProps extends FloatingBadgeProps {
10
10
  children: React.ReactNode;
11
11
  }
12
12
  export declare enum BadgeSize {
13
+ EXTRA_EXTRA_SMALL = "extra-extra-small",
14
+ EXTRA_SMALL = "extra-small",
13
15
  SMALL = "small",
14
16
  MEDIUM = "medium",
15
17
  LARGE = "large"
@@ -1,3 +1,3 @@
1
1
  import { CheckboxInputProps, CheckboxStyles } from './types';
2
- declare const Input: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, CheckboxStyles & CheckboxInputProps, keyof CheckboxStyles>;
3
- export default Input;
2
+ export declare const Input: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, CheckboxStyles & CheckboxInputProps, keyof CheckboxStyles>;
3
+ export declare const RequiredAsterisk: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
@@ -38,6 +38,7 @@ export interface CheckboxImplProps extends Omit<CheckboxInputProps, 'hasError'>,
38
38
  className?: string;
39
39
  onChange?: InputHTMLAttributes<HTMLInputElement>['onChange'];
40
40
  textColor?: paletteColor;
41
+ required?: boolean;
41
42
  }
42
43
  export interface CheckboxProps extends Omit<CheckboxImplProps, 'value'> {
43
44
  value: CheckboxImplProps['value'] | boolean;
@@ -4,8 +4,8 @@ import { FileUploaderSize, statuses } from '../types';
4
4
  interface Props {
5
5
  icon: IconProps | null;
6
6
  status: statuses;
7
- text?: React.ReactNode | null;
8
- caption?: React.ReactNode | null;
7
+ text?: React.ReactNode;
8
+ caption?: React.ReactNode;
9
9
  size: FileUploaderSize;
10
10
  }
11
11
  declare const FileUploaderContent: ({ icon, status, text, caption, size }: Props) => JSX.Element;
@@ -7,8 +7,8 @@ export type FileUploaderParts = {
7
7
  borderColor: paletteColor;
8
8
  color: paletteColor;
9
9
  secondaryColor: paletteColor;
10
- text: React.ReactNode | null;
11
- caption: React.ReactNode | null;
10
+ text: React.ReactNode;
11
+ caption: React.ReactNode;
12
12
  icon: IconProps | null;
13
13
  };
14
14
  export type FileUploaderPalette = {
@@ -1,11 +1,11 @@
1
1
  import { FileUploaderParts } from './fileUploaderPalette';
2
2
  export declare const uploaderStatusesArray: readonly ["default", "uploading", "success", "error", "disabled"];
3
- export type FileUploaderStatus = typeof uploaderStatusesArray[number];
3
+ export type FileUploaderStatus = (typeof uploaderStatusesArray)[number];
4
4
  export type statuses = FileUploaderStatus | 'dragging';
5
5
  export declare const uploaderSize: readonly ["small", "normal"];
6
- export type FileUploaderSize = typeof uploaderSize[number];
6
+ export type FileUploaderSize = (typeof uploaderSize)[number];
7
7
  export declare const typesArray: readonly ["unknown", "pdf", "image", "zip", "archive", "text", "document", "spreadsheet", "presentation", "xml", "p7m", "csv"];
8
- export type FileType = typeof typesArray[number];
8
+ export type FileType = (typeof typesArray)[number];
9
9
  type TypeDefinition = {
10
10
  mimeTypes: string[];
11
11
  extensions: string[];
@@ -1,2 +1,2 @@
1
- export declare const inputHelperStatusesArray: string[];
2
- export type inputHelperStatus = typeof inputHelperStatusesArray[number];
1
+ export declare const inputHelperStatusesArray: readonly ["normal", "error", "warning", "info", "success"];
2
+ export type inputHelperStatus = (typeof inputHelperStatusesArray)[number];
@@ -8,4 +8,5 @@ export interface TextAreaElementProps extends CommonFormTypes, CharCounterOption
8
8
  showCounter?: boolean;
9
9
  isResizable?: boolean;
10
10
  isPrefilled?: boolean;
11
+ maxContentLength?: number;
11
12
  }
@@ -6,5 +6,4 @@ export interface IconProps extends Omit<FontAwesomeIconProps, 'color'> {
6
6
  isDisabled?: boolean;
7
7
  }
8
8
  declare const Icon: ({ onClick, isDisabled, ...props }: IconProps) => JSX.Element;
9
- export type StyledIconProps = IconProps;
10
9
  export default Icon;
@@ -1,13 +1,12 @@
1
1
  import { SizeProp } from '@fortawesome/fontawesome-svg-core';
2
2
  import React from 'react';
3
- import { paletteColor } from '../../../../styles/types';
4
- import { iconColors } from '../../iconPalette';
3
+ import { AllColors, paletteColor } from '../../../../styles/types';
5
4
  interface Props extends WrapperProps {
6
5
  children: React.ReactNode;
7
6
  }
8
7
  declare const IconBackground: ({ children, ...rest }: Props) => JSX.Element;
9
8
  interface WrapperProps {
10
- color: iconColors;
9
+ color: AllColors;
11
10
  size: SizeProp;
12
11
  backgroundColor?: paletteColor;
13
12
  className?: string;
@@ -1,7 +1,6 @@
1
- import { paletteColor } from '../../../../styles/types';
2
- import { iconColors } from '../../iconPalette';
1
+ import { AllColors, paletteColor } from '../../../../styles/types';
3
2
  export type IconBackgroundPalette = {
4
- [key in iconColors]: paletteColor;
3
+ [key in AllColors]: paletteColor;
5
4
  };
6
5
  declare const iconBackgroundPalette: IconBackgroundPalette;
7
6
  export default iconBackgroundPalette;
@@ -1,9 +1,9 @@
1
+ /// <reference types="react" />
1
2
  import { Meta } from '@storybook/react';
2
- import React from 'react';
3
3
  import { IconProps } from './Icon';
4
- export declare const Normal: () => React.JSX.Element;
5
- export declare const WithBackground: () => React.JSX.Element;
6
- export declare const DuotoneColored: () => React.JSX.Element;
7
- export declare const _CustomIcon: () => React.JSX.Element;
4
+ export declare const Normal: () => JSX.Element;
5
+ export declare const WithBackground: () => JSX.Element;
6
+ export declare const DuotoneColored: () => JSX.Element;
7
+ export declare const _CustomIcon: () => JSX.Element;
8
8
  declare const IconStories: Meta<IconProps>;
9
9
  export default IconStories;
@@ -1,11 +1,12 @@
1
- import { Palette, paletteColor } from '../../index';
2
- export type iconColors = keyof Palette;
1
+ import { paletteColor } from '../../index';
2
+ import { AllColors } from '../../styles/types';
3
+ export type iconColors = AllColors | string;
3
4
  type iconParts = 'primary' | 'secondary';
4
5
  export type IconColorPalette = {
5
6
  [k in iconParts]: paletteColor;
6
7
  };
7
8
  export type IconPalette = {
8
- [k in iconColors]: IconColorPalette;
9
+ [k in AllColors]: IconColorPalette;
9
10
  };
10
11
  declare const iconPalette: IconPalette;
11
12
  export default iconPalette;
@@ -1,7 +1,7 @@
1
1
  import { DefaultTheme } from 'styled-components';
2
- import { StyledIconProps } from './Icon';
2
+ import { IconProps } from './Icon';
3
3
  import { IconColorPalette } from './iconPalette';
4
- interface GetIconStylesParams extends Pick<StyledIconProps, 'color'> {
4
+ interface GetIconStylesParams extends IconProps {
5
5
  theme: DefaultTheme;
6
6
  }
7
7
  export declare const getIconStyles: ({ theme, color }: GetIconStylesParams) => IconColorPalette;
@@ -5,6 +5,7 @@ export interface WrapperProps {
5
5
  isActive: boolean;
6
6
  isDisabled: boolean;
7
7
  customColor?: paletteColor;
8
+ withoutPadding: boolean;
8
9
  }
9
10
  export declare const sidebarItemHeight = 44;
10
11
  export declare const Dropdown: import("styled-components").StyledComponent<({ className, content, forceOpen }: import("./types").SidebarItemDropdownProps) => JSX.Element, import("styled-components").DefaultTheme, {}, never>;
@@ -1,8 +1,8 @@
1
1
  import React, { MouseEventHandler } from 'react';
2
- import { colorsPalette } from '../../../common/types/colorsPalette';
2
+ import { colorsPalette } from '../../../common/types';
3
3
  import { paletteColor } from '../../../styles/types';
4
- import { DropdownItemProps } from '../../dropdown/types';
5
- import { BadgeSize, FloatingBadgeType } from '../../floatingBadge/types';
4
+ import { DropdownItemProps } from '../../dropdown';
5
+ import { BadgeSize, FloatingBadgeType } from '../../floatingBadge';
6
6
  import { IconProps } from '../../icon';
7
7
  export interface SidebarItemProps {
8
8
  icon?: IconProps;
@@ -23,6 +23,7 @@ export interface SidebarItemProps {
23
23
  export interface CustomSidebarItemProps {
24
24
  color?: paletteColor;
25
25
  renderContent?: React.FC<SidebarItemProps>;
26
+ avoidSpaceFillOnElementsHidden?: boolean;
26
27
  }
27
28
  export interface SidebarItemDropdownProps {
28
29
  content: DropdownItemProps[];
@@ -32,7 +33,8 @@ export interface SidebarItemDropdownProps {
32
33
  export declare enum SidebarBadgeConfigType {
33
34
  COUNTER = 0,
34
35
  ICON = 1,
35
- DOT = 2
36
+ DOT = 2,
37
+ COUNTER_ICON = 3
36
38
  }
37
39
  type BadgeBaseConfig = {
38
40
  size?: BadgeSize;
@@ -49,7 +51,12 @@ interface BadgeIconConfig extends BadgeBaseConfig {
49
51
  interface BadgeDotConfig extends BadgeBaseConfig {
50
52
  type: SidebarBadgeConfigType.DOT;
51
53
  }
52
- export type SidebarBadgeConfigProps = BadgeCounterConfig | BadgeIconConfig | BadgeDotConfig;
54
+ interface BadgeCounterIconConfig extends BadgeBaseConfig {
55
+ type: SidebarBadgeConfigType.COUNTER_ICON;
56
+ icon: IconProps;
57
+ counter: number | string;
58
+ }
59
+ export type SidebarBadgeConfigProps = BadgeCounterConfig | BadgeIconConfig | BadgeDotConfig | BadgeCounterIconConfig;
53
60
  type StatusType = 'normal' | 'active' | 'disabled';
54
61
  export interface SidebarItemStyles extends colorsPalette {
55
62
  hoverColor: paletteColor;
@@ -2,8 +2,5 @@
2
2
  export declare const Container: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
3
3
  export declare const ScrollableContent: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
4
4
  export declare const TableWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
5
- export declare const SortIndicator: import("styled-components").StyledComponent<({ onClick, isDisabled, ...props }: import("../icon").IconProps) => JSX.Element, import("styled-components").DefaultTheme, {
6
- isSorted: boolean;
7
- isSortedDesc: boolean;
8
- }, never>;
5
+ export declare const SortIndicator: import("styled-components").StyledComponent<({ onClick, isDisabled, ...props }: import("../icon").IconProps) => JSX.Element, import("styled-components").DefaultTheme, {}, never>;
9
6
  export declare const PaginationContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
@@ -1,5 +1,4 @@
1
1
  /// <reference types="react" />
2
- import 'react-toastify/dist/ReactToastify.css';
3
2
  import { ToastContainerProps } from './types';
4
3
  export declare const ToastContainer: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("react-toastify").ToastContainerProps & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {
5
4
  closeButton: false;
@@ -1,3 +1,4 @@
1
+ import 'react-toastify/dist/ReactToastify.css';
1
2
  import { Meta, StoryFn } from '@storybook/react';
2
3
  import { ToastContainerProps, ToastProps } from './types';
3
4
  export declare const WithKnobs: StoryFn<ToastProps>;
@@ -0,0 +1,4 @@
1
+ /// <reference types="react" />
2
+ import { VerticalTabsProps } from './types';
3
+ declare const VerticalTabs: ({ className, editMode, style, tabs }: VerticalTabsProps) => JSX.Element;
4
+ export default VerticalTabs;
@@ -0,0 +1,4 @@
1
+ /// <reference types="react" />
2
+ import { VerticalTabsSelectorProps } from './types';
3
+ declare const VerticalTabsSelector: ({ active, counter, editMode, icon, onClick, text, type, }: VerticalTabsSelectorProps) => JSX.Element;
4
+ export default VerticalTabsSelector;
@@ -0,0 +1,2 @@
1
+ export { default as VerticalTabsSelector } from './VerticalTabsSelector';
2
+ export { VerticalTabsSelectorProps } from './types';
@@ -0,0 +1,6 @@
1
+ /// <reference types="react" />
2
+ import { MappedWrapperProps } from './types';
3
+ export declare const VerticalTabsSelectorWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, MappedWrapperProps & Required<Pick<import("./types").VerticalTabsSelectorProps, "type" | "active">>, keyof MappedWrapperProps>;
4
+ export declare const TextContainer: import("styled-components").StyledComponent<({ children, type, ...otherProps }: import("../../../../common/components/typography/types").TextProps & import("react").HTMLAttributes<HTMLDivElement>) => JSX.Element, import("styled-components").DefaultTheme, {
5
+ fade: boolean;
6
+ }, never>;
@@ -0,0 +1,14 @@
1
+ import { paletteColor } from '../../../../styles/types';
2
+ import { VerticalTabsHeaderProps } from '../../types';
3
+ export type VerticalTabsSelectorProps = VerticalTabsHeaderProps & {
4
+ active: boolean;
5
+ editMode: boolean;
6
+ onClick: () => void;
7
+ };
8
+ export type WrapperProps = Required<Pick<VerticalTabsSelectorProps, 'active' | 'type'>>;
9
+ export type MappedWrapperProps = {
10
+ color: paletteColor;
11
+ background: paletteColor;
12
+ hoverBackground: paletteColor;
13
+ activeBackground: paletteColor;
14
+ };
@@ -0,0 +1,7 @@
1
+ import { DefaultTheme } from 'styled-components';
2
+ import { MappedWrapperProps, WrapperProps } from './types';
3
+ type Params = WrapperProps & {
4
+ theme: DefaultTheme;
5
+ };
6
+ export declare const mapColors: ({ active, theme, type }: Params) => MappedWrapperProps;
7
+ export {};
@@ -0,0 +1,3 @@
1
+ export { default as VerticalTabs } from './VerticalTabs';
2
+ export * from './types';
3
+ export { default as verticalTabsPalette } from './verticalTabsPalette';
@@ -0,0 +1,8 @@
1
+ /// <reference types="react" />
2
+ export declare const VerticalTabsWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../card").StyledCardProps & {
3
+ children: import("react").ReactNode | import("react").ReactNode[];
4
+ className?: string | undefined;
5
+ style?: import("react").CSSProperties | undefined;
6
+ } & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {}, never>;
7
+ export declare const VerticalTabsSelectorsWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
8
+ export declare const VerticalTabsContentWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
@@ -0,0 +1,33 @@
1
+ import { CSSProperties, ReactNode } from 'react';
2
+ import { ComponentType } from '../../common/types';
3
+ import { paletteColor } from '../../styles/types';
4
+ import { IconProps } from '../icon';
5
+ export type VerticalTabsHeaderProps = {
6
+ counter?: number;
7
+ icon?: IconProps;
8
+ text: ReactNode;
9
+ type?: ComponentType;
10
+ };
11
+ export type VerticalTabsItem = {
12
+ active?: boolean;
13
+ content: ReactNode | (() => JSX.Element);
14
+ header: VerticalTabsHeaderProps;
15
+ };
16
+ export interface VerticalTabsProps {
17
+ className?: string;
18
+ editMode?: boolean;
19
+ style?: CSSProperties;
20
+ tabs: VerticalTabsItem[];
21
+ }
22
+ type VerticalTabsPalettePart = {
23
+ color: paletteColor;
24
+ background: paletteColor;
25
+ hoverBackground: paletteColor;
26
+ activeBackground: paletteColor;
27
+ };
28
+ type VerticalTabsPaletteType = {
29
+ active: VerticalTabsPalettePart;
30
+ normal: VerticalTabsPalettePart;
31
+ };
32
+ export type VerticalTabsPalette = Record<ComponentType, VerticalTabsPaletteType>;
33
+ export {};
@@ -0,0 +1,5 @@
1
+ import { Meta, Story } from '@storybook/react';
2
+ import { VerticalTabsProps } from './types';
3
+ export declare const Template: Story<VerticalTabsProps>;
4
+ declare const VerticalTabStories: Meta<VerticalTabsProps>;
5
+ export default VerticalTabStories;
@@ -0,0 +1,3 @@
1
+ import { VerticalTabsPalette } from './types';
2
+ declare const verticalTabsPalette: VerticalTabsPalette;
3
+ export default verticalTabsPalette;
package/dist/index.d.ts CHANGED
@@ -44,7 +44,7 @@ export { ThemeProvider } from './components/themeProvider';
44
44
  export { ShortcutTip, ShortcutTipProps, Tip, TipPalette, TipProps, TipType } from './components/tip';
45
45
  export { Toast, ToastPalette, toastPalette, ToastProps, ToastType } from './components/toast';
46
46
  export { Tooltip, TooltipPalette, TooltipProps } from './components/tooltip';
47
- export { VerticalTab, VerticalTabSelector, VerticalTabSelectorPalette, VerticalTabSelectorStatus, } from './components/verticalTab';
47
+ export { VerticalTabs, VerticalTabsHeaderProps, VerticalTabsItem, VerticalTabsPalette, VerticalTabsProps, } from './components/verticalTabs';
48
48
  export { autocompleteYellow } from './styles/defaultPalette/colors/others';
49
49
  export { Theme } from './styles/theme';
50
50
  export { Palette, bwColor, paletteColor } from './styles/types';