@fattureincloud/fic-design-system 1.0.7 → 1.0.8

package/dist/common/components/typography/types.d.ts

@@ -5,7 +5,7 @@ import { paletteColor } from '../../../styles/types';
 export type TextProps = {
     bold?: boolean;
     centered?: boolean;
-    children: React.ReactNode | React.ReactNode[] | undefined | null;
+    children: React.ReactNode | React.ReactNode[];
     clamp?: number;
     className?: string;
     color?: colors | paletteColor;

package/dist/common/types/index.d.ts

@@ -0,0 +1,4 @@
+export * from './colorsPalette';
+export * from './dateTypes';
+export * from './label';
+export * from './misc';

package/dist/common/types/misc.d.ts

@@ -0,0 +1,7 @@
+export declare enum ComponentType {
+    ERROR = "error",
+    INFO = "info",
+    STANDARD = "standard",
+    SUCCESS = "success",
+    WARNING = "warning"
+}

package/dist/common/utils/dsUtils.d.ts

@@ -1,3 +1,5 @@
+export declare const HEX_REGEX: RegExp;
+export declare const isHexColor: (value: string) => boolean;
 export declare const isNumber: (n: number | string | undefined) => boolean;
 export declare const parseDimension: (d: number | string) => string;
 export declare const pixelToNumber: (s: string) => number;

package/dist/components/buttons/button/types.d.ts

@@ -1,15 +1,15 @@
 import { MouseEventHandler } from 'react';
 import { ButtonParts } from './buttonPalette';
 export declare const buttonSizesArray: readonly ["large", "medium"];
-export type buttonSizes = typeof buttonSizesArray[number];
+export type buttonSizes = (typeof buttonSizesArray)[number];
 export declare const buttonTypesArray: readonly ["primary", "secondary", "text"];
-export type buttonTypes = typeof buttonTypesArray[number];
+export type buttonTypes = (typeof buttonTypesArray)[number];
 export declare const buttonColorsArray: readonly ["blue", "red", "green", "grey", "yellow"];
-export type buttonColors = typeof buttonColorsArray[number];
+export type buttonColors = (typeof buttonColorsArray)[number];
 export declare const buttonDisableColorArray: readonly ["disabled"];
-export type buttonDisableColor = typeof buttonDisableColorArray[number];
+export type buttonDisableColor = (typeof buttonDisableColorArray)[number];
 export declare const buttonPartsArray: readonly ["normal", "hover", "active", "text", "textHover"];
-export type buttonParts = typeof buttonPartsArray[number];
+export type buttonParts = (typeof buttonPartsArray)[number];
 export interface WrapperProps {
     isDisabled: boolean;
     fullWidth?: boolean;

package/dist/components/drawer/drawer.d.ts

@@ -9,6 +9,7 @@ export interface DrawerProps {
     children?: ReactNode;
     fullscreen?: boolean;
     onFullscreen?: (fullscreen: boolean) => void;
+    showTooltip?: boolean;
 }
 declare const Drawer: React.FC<DrawerProps>;
 export default Drawer;

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

@@ -1,15 +1,15 @@
 import { Placement } from '@popperjs/core/lib/enums';
-import React, { CSSProperties, MouseEventHandler } from 'react';
+import React, { CSSProperties, MouseEventHandler, ReactNode } from 'react';
 import { IconProps } from '../icon';
 export type TitleProps = {
     text: string;
 };
 export type closeDropdownType = () => void;
-export type renderContentType = (closeDropdown: closeDropdownType) => React.ReactNode;
+export type renderContentType = (closeDropdown: closeDropdownType) => ReactNode;
 export type DropdownProps = {
     className?: string;
     title?: string;
-    renderTrigger?: () => React.ReactNode;
+    renderTrigger?: () => ReactNode;
     triggerStyles?: CSSProperties;
     content?: DropdownItemProps[];
     renderContent?: renderContentType;
@@ -38,7 +38,7 @@ export interface DropdownItemProps {
     onClick?: MouseEventHandler;
     maxWidth?: DropdownProps['maxWidth'];
     fullWidth?: DropdownProps['fullWidth'];
-    children?: React.ReactNode;
+    children?: ReactNode;
     isDisabled?: boolean;
     type?: DropdownItemType;
     onMouseEnter?: () => void;

package/dist/components/editableInput/EditableInput.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-interface Props {
+export interface EditableInputProps {
     hover: boolean;
     content: string | number | null;
     unitSymbol?: string | undefined;
@@ -7,6 +7,7 @@ interface Props {
     rowId: number;
     onOpen?: () => void;
     onClose?: () => void;
+    maxContentLength?: number;
 }
-declare const EditableInput: ({ hover, content, unitSymbol, onChange, rowId, onOpen, onClose }: Props) => JSX.Element;
+declare const EditableInput: ({ hover, content, unitSymbol, onChange, rowId, onOpen, onClose, maxContentLength, }: EditableInputProps) => JSX.Element;
 export default EditableInput;

package/dist/components/editableInput/components/CustomInput.d.ts

@@ -7,6 +7,7 @@ interface Props {
     rowId: number;
     onOpen?: () => void;
     onClose?: () => void;
+    maxContentLength?: number;
 }
-declare const CustomInput: ({ hover, onChange, unitSymbol, content, rowId, onOpen, onClose }: Props) => JSX.Element;
+declare const CustomInput: ({ hover, onChange, unitSymbol, content, rowId, onOpen, onClose, maxContentLength, }: Props) => JSX.Element;
 export default CustomInput;

package/dist/components/editableInput/components/TextAreaPopup.d.ts

@@ -7,6 +7,7 @@ interface Props {
     rowId: number;
     onClose?: () => void;
     focus: boolean;
+    maxContentLength?: number;
 }
-declare const TextAreaPopup: ({ onChange, content, onBlur, rowId, onClose, focus }: Props) => JSX.Element;
+declare const TextAreaPopup: ({ onChange, content, onBlur, rowId, onClose, focus, maxContentLength }: Props) => JSX.Element;
 export default TextAreaPopup;

package/dist/components/editableInput/editableInput.stories.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { Meta } from '@storybook/react';
+import { EditableInputProps } from './EditableInput';
+declare const EditableInputStories: Meta<EditableInputProps>;
+export declare const Default: () => JSX.Element;
+export declare const WithMaxContentLength: () => JSX.Element;
+export default EditableInputStories;

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

@@ -10,6 +10,8 @@ export interface WithBadgeProps extends FloatingBadgeProps {
     children: React.ReactNode;
 }
 export declare enum BadgeSize {
+    EXTRA_EXTRA_SMALL = "extra-extra-small",
+    EXTRA_SMALL = "extra-small",
     SMALL = "small",
     MEDIUM = "medium",
     LARGE = "large"

package/dist/components/form/checkbox/styled.d.ts

@@ -1,3 +1,3 @@
 import { CheckboxInputProps, CheckboxStyles } from './types';
-declare const Input: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, CheckboxStyles & CheckboxInputProps, keyof CheckboxStyles>;
-export default Input;
+export declare const Input: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, CheckboxStyles & CheckboxInputProps, keyof CheckboxStyles>;
+export declare const RequiredAsterisk: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;

package/dist/components/form/checkbox/types.d.ts

@@ -38,6 +38,7 @@ export interface CheckboxImplProps extends Omit<CheckboxInputProps, 'hasError'>,
     className?: string;
     onChange?: InputHTMLAttributes<HTMLInputElement>['onChange'];
     textColor?: paletteColor;
+    required?: boolean;
 }
 export interface CheckboxProps extends Omit<CheckboxImplProps, 'value'> {
     value: CheckboxImplProps['value'] | boolean;

package/dist/components/form/fileUploader/components/FileUploaderContent.d.ts

@@ -4,8 +4,8 @@ import { FileUploaderSize, statuses } from '../types';
 interface Props {
     icon: IconProps | null;
     status: statuses;
-    text?: React.ReactNode | null;
-    caption?: React.ReactNode | null;
+    text?: React.ReactNode;
+    caption?: React.ReactNode;
     size: FileUploaderSize;
 }
 declare const FileUploaderContent: ({ icon, status, text, caption, size }: Props) => JSX.Element;

package/dist/components/form/fileUploader/fileUploaderPalette.d.ts

@@ -7,8 +7,8 @@ export type FileUploaderParts = {
     borderColor: paletteColor;
     color: paletteColor;
     secondaryColor: paletteColor;
-    text: React.ReactNode | null;
-    caption: React.ReactNode | null;
+    text: React.ReactNode;
+    caption: React.ReactNode;
     icon: IconProps | null;
 };
 export type FileUploaderPalette = {

package/dist/components/form/fileUploader/types.d.ts

@@ -1,11 +1,11 @@
 import { FileUploaderParts } from './fileUploaderPalette';
 export declare const uploaderStatusesArray: readonly ["default", "uploading", "success", "error", "disabled"];
-export type FileUploaderStatus = typeof uploaderStatusesArray[number];
+export type FileUploaderStatus = (typeof uploaderStatusesArray)[number];
 export type statuses = FileUploaderStatus | 'dragging';
 export declare const uploaderSize: readonly ["small", "normal"];
-export type FileUploaderSize = typeof uploaderSize[number];
+export type FileUploaderSize = (typeof uploaderSize)[number];
 export declare const typesArray: readonly ["unknown", "pdf", "image", "zip", "archive", "text", "document", "spreadsheet", "presentation", "xml", "p7m", "csv"];
-export type FileType = typeof typesArray[number];
+export type FileType = (typeof typesArray)[number];
 type TypeDefinition = {
     mimeTypes: string[];
     extensions: string[];

package/dist/components/form/inputHelper/types.d.ts

@@ -1,2 +1,2 @@
-export declare const inputHelperStatusesArray: string[];
-export type inputHelperStatus = typeof inputHelperStatusesArray[number];
+export declare const inputHelperStatusesArray: readonly ["normal", "error", "warning", "info", "success"];
+export type inputHelperStatus = (typeof inputHelperStatusesArray)[number];

package/dist/components/form/textArea/types.d.ts

@@ -8,4 +8,5 @@ export interface TextAreaElementProps extends CommonFormTypes, CharCounterOption
     showCounter?: boolean;
     isResizable?: boolean;
     isPrefilled?: boolean;
+    maxContentLength?: number;
 }

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

@@ -6,5 +6,4 @@ export interface IconProps extends Omit<FontAwesomeIconProps, 'color'> {
     isDisabled?: boolean;
 }
 declare const Icon: ({ onClick, isDisabled, ...props }: IconProps) => JSX.Element;
-export type StyledIconProps = IconProps;
 export default Icon;

package/dist/components/icon/components/iconBackground/IconBackground.d.ts

@@ -1,13 +1,12 @@
 import { SizeProp } from '@fortawesome/fontawesome-svg-core';
 import React from 'react';
-import { paletteColor } from '../../../../styles/types';
-import { iconColors } from '../../iconPalette';
+import { AllColors, paletteColor } from '../../../../styles/types';
 interface Props extends WrapperProps {
     children: React.ReactNode;
 }
 declare const IconBackground: ({ children, ...rest }: Props) => JSX.Element;
 interface WrapperProps {
-    color: iconColors;
+    color: AllColors;
     size: SizeProp;
     backgroundColor?: paletteColor;
     className?: string;

package/dist/components/icon/components/iconBackground/iconBackgroundPalette.d.ts

@@ -1,7 +1,6 @@
-import { paletteColor } from '../../../../styles/types';
-import { iconColors } from '../../iconPalette';
+import { AllColors, paletteColor } from '../../../../styles/types';
 export type IconBackgroundPalette = {
-    [key in iconColors]: paletteColor;
+    [key in AllColors]: paletteColor;
 };
 declare const iconBackgroundPalette: IconBackgroundPalette;
 export default iconBackgroundPalette;

package/dist/components/icon/icon.stories.d.ts

@@ -1,9 +1,9 @@
+/// <reference types="react" />
 import { Meta } from '@storybook/react';
-import React from 'react';
 import { IconProps } from './Icon';
-export declare const Normal: () => React.JSX.Element;
-export declare const WithBackground: () => React.JSX.Element;
-export declare const DuotoneColored: () => React.JSX.Element;
-export declare const _CustomIcon: () => React.JSX.Element;
+export declare const Normal: () => JSX.Element;
+export declare const WithBackground: () => JSX.Element;
+export declare const DuotoneColored: () => JSX.Element;
+export declare const _CustomIcon: () => JSX.Element;
 declare const IconStories: Meta<IconProps>;
 export default IconStories;

package/dist/components/icon/iconPalette.d.ts

@@ -1,11 +1,12 @@
-import { Palette, paletteColor } from '../../index';
-export type iconColors = keyof Palette;
+import { paletteColor } from '../../index';
+import { AllColors } from '../../styles/types';
+export type iconColors = AllColors | string;
 type iconParts = 'primary' | 'secondary';
 export type IconColorPalette = {
     [k in iconParts]: paletteColor;
 };
 export type IconPalette = {
-    [k in iconColors]: IconColorPalette;
+    [k in AllColors]: IconColorPalette;
 };
 declare const iconPalette: IconPalette;
 export default iconPalette;

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

@@ -1,7 +1,7 @@
 import { DefaultTheme } from 'styled-components';
-import { StyledIconProps } from './Icon';
+import { IconProps } from './Icon';
 import { IconColorPalette } from './iconPalette';
-interface GetIconStylesParams extends Pick<StyledIconProps, 'color'> {
+interface GetIconStylesParams extends IconProps {
     theme: DefaultTheme;
 }
 export declare const getIconStyles: ({ theme, color }: GetIconStylesParams) => IconColorPalette;

package/dist/components/layout/sidebarItem/styled.d.ts

@@ -5,6 +5,7 @@ export interface WrapperProps {
     isActive: boolean;
     isDisabled: boolean;
     customColor?: paletteColor;
+    withoutPadding: boolean;
 }
 export declare const sidebarItemHeight = 44;
 export declare const Dropdown: import("styled-components").StyledComponent<({ className, content, forceOpen }: import("./types").SidebarItemDropdownProps) => JSX.Element, import("styled-components").DefaultTheme, {}, never>;

package/dist/components/layout/sidebarItem/types.d.ts

@@ -1,8 +1,8 @@
 import React, { MouseEventHandler } from 'react';
-import { colorsPalette } from '../../../common/types/colorsPalette';
+import { colorsPalette } from '../../../common/types';
 import { paletteColor } from '../../../styles/types';
-import { DropdownItemProps } from '../../dropdown/types';
-import { BadgeSize, FloatingBadgeType } from '../../floatingBadge/types';
+import { DropdownItemProps } from '../../dropdown';
+import { BadgeSize, FloatingBadgeType } from '../../floatingBadge';
 import { IconProps } from '../../icon';
 export interface SidebarItemProps {
     icon?: IconProps;
@@ -23,6 +23,7 @@ export interface SidebarItemProps {
 export interface CustomSidebarItemProps {
     color?: paletteColor;
     renderContent?: React.FC<SidebarItemProps>;
+    avoidSpaceFillOnElementsHidden?: boolean;
 }
 export interface SidebarItemDropdownProps {
     content: DropdownItemProps[];
@@ -32,7 +33,8 @@ export interface SidebarItemDropdownProps {
 export declare enum SidebarBadgeConfigType {
     COUNTER = 0,
     ICON = 1,
-    DOT = 2
+    DOT = 2,
+    COUNTER_ICON = 3
 }
 type BadgeBaseConfig = {
     size?: BadgeSize;
@@ -49,7 +51,12 @@ interface BadgeIconConfig extends BadgeBaseConfig {
 interface BadgeDotConfig extends BadgeBaseConfig {
     type: SidebarBadgeConfigType.DOT;
 }
-export type SidebarBadgeConfigProps = BadgeCounterConfig | BadgeIconConfig | BadgeDotConfig;
+interface BadgeCounterIconConfig extends BadgeBaseConfig {
+    type: SidebarBadgeConfigType.COUNTER_ICON;
+    icon: IconProps;
+    counter: number | string;
+}
+export type SidebarBadgeConfigProps = BadgeCounterConfig | BadgeIconConfig | BadgeDotConfig | BadgeCounterIconConfig;
 type StatusType = 'normal' | 'active' | 'disabled';
 export interface SidebarItemStyles extends colorsPalette {
     hoverColor: paletteColor;

package/dist/components/newTable/styled.d.ts

@@ -2,8 +2,5 @@
 export declare const Container: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export declare const ScrollableContent: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export declare const TableWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const SortIndicator: import("styled-components").StyledComponent<({ onClick, isDisabled, ...props }: import("../icon").IconProps) => JSX.Element, import("styled-components").DefaultTheme, {
-    isSorted: boolean;
-    isSortedDesc: boolean;
-}, never>;
+export declare const SortIndicator: import("styled-components").StyledComponent<({ onClick, isDisabled, ...props }: import("../icon").IconProps) => JSX.Element, import("styled-components").DefaultTheme, {}, never>;
 export declare const PaginationContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;

package/dist/components/verticalTabs/VerticalTabs.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { VerticalTabsProps } from './types';
+declare const VerticalTabs: ({ className, editMode, style, tabs }: VerticalTabsProps) => JSX.Element;
+export default VerticalTabs;

package/dist/components/verticalTabs/components/verticalTabsSelector/VerticalTabsSelector.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { VerticalTabsSelectorProps } from './types';
+declare const VerticalTabsSelector: ({ active, counter, editMode, icon, onClick, text, type, }: VerticalTabsSelectorProps) => JSX.Element;
+export default VerticalTabsSelector;

package/dist/components/verticalTabs/components/verticalTabsSelector/index.d.ts

@@ -0,0 +1,2 @@
+export { default as VerticalTabsSelector } from './VerticalTabsSelector';
+export { VerticalTabsSelectorProps } from './types';

package/dist/components/verticalTabs/components/verticalTabsSelector/styled.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { MappedWrapperProps } from './types';
+export declare const VerticalTabsSelectorWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, MappedWrapperProps & Required<Pick<import("./types").VerticalTabsSelectorProps, "type" | "active">>, keyof MappedWrapperProps>;
+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, {
+    fade: boolean;
+}, never>;

package/dist/components/verticalTabs/components/verticalTabsSelector/types.d.ts

@@ -0,0 +1,14 @@
+import { paletteColor } from '../../../../styles/types';
+import { VerticalTabsHeaderProps } from '../../types';
+export type VerticalTabsSelectorProps = VerticalTabsHeaderProps & {
+    active: boolean;
+    editMode: boolean;
+    onClick: () => void;
+};
+export type WrapperProps = Required<Pick<VerticalTabsSelectorProps, 'active' | 'type'>>;
+export type MappedWrapperProps = {
+    color: paletteColor;
+    background: paletteColor;
+    hoverBackground: paletteColor;
+    activeBackground: paletteColor;
+};

package/dist/components/verticalTabs/components/verticalTabsSelector/utils.d.ts

@@ -0,0 +1,7 @@
+import { DefaultTheme } from 'styled-components';
+import { MappedWrapperProps, WrapperProps } from './types';
+type Params = WrapperProps & {
+    theme: DefaultTheme;
+};
+export declare const mapColors: ({ active, theme, type }: Params) => MappedWrapperProps;
+export {};

package/dist/components/verticalTabs/index.d.ts

@@ -0,0 +1,3 @@
+export { default as VerticalTabs } from './VerticalTabs';
+export * from './types';
+export { default as verticalTabsPalette } from './verticalTabsPalette';

package/dist/components/verticalTabs/styled.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+export declare const VerticalTabsWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../card").StyledCardProps & {
+    children: import("react").ReactNode | import("react").ReactNode[];
+    className?: string | undefined;
+    style?: import("react").CSSProperties | undefined;
+} & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {}, never>;
+export declare const VerticalTabsSelectorsWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+export declare const VerticalTabsContentWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;

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

@@ -0,0 +1,33 @@
+import { CSSProperties, ReactNode } from 'react';
+import { ComponentType } from '../../common/types';
+import { paletteColor } from '../../styles/types';
+import { IconProps } from '../icon';
+export type VerticalTabsHeaderProps = {
+    counter?: number;
+    icon?: IconProps;
+    text: ReactNode;
+    type?: ComponentType;
+};
+export type VerticalTabsItem = {
+    active?: boolean;
+    content: ReactNode | (() => JSX.Element);
+    header: VerticalTabsHeaderProps;
+};
+export interface VerticalTabsProps {
+    className?: string;
+    editMode?: boolean;
+    style?: CSSProperties;
+    tabs: VerticalTabsItem[];
+}
+type VerticalTabsPalettePart = {
+    color: paletteColor;
+    background: paletteColor;
+    hoverBackground: paletteColor;
+    activeBackground: paletteColor;
+};
+type VerticalTabsPaletteType = {
+    active: VerticalTabsPalettePart;
+    normal: VerticalTabsPalettePart;
+};
+export type VerticalTabsPalette = Record<ComponentType, VerticalTabsPaletteType>;
+export {};

package/dist/components/verticalTabs/verticalTabs.stories.d.ts

@@ -0,0 +1,5 @@
+import { Meta, Story } from '@storybook/react';
+import { VerticalTabsProps } from './types';
+export declare const Template: Story<VerticalTabsProps>;
+declare const VerticalTabStories: Meta<VerticalTabsProps>;
+export default VerticalTabStories;

package/dist/components/verticalTabs/verticalTabsPalette.d.ts

@@ -0,0 +1,3 @@
+import { VerticalTabsPalette } from './types';
+declare const verticalTabsPalette: VerticalTabsPalette;
+export default verticalTabsPalette;

package/dist/index.d.ts

@@ -44,7 +44,7 @@ export { ThemeProvider } from './components/themeProvider';
 export { ShortcutTip, ShortcutTipProps, Tip, TipPalette, TipProps, TipType } from './components/tip';
 export { Toast, ToastPalette, toastPalette, ToastProps, ToastType } from './components/toast';
 export { Tooltip, TooltipPalette, TooltipProps } from './components/tooltip';
-export { VerticalTab, VerticalTabSelector, VerticalTabSelectorPalette, VerticalTabSelectorStatus, } from './components/verticalTab';
+export { VerticalTabs, VerticalTabsHeaderProps, VerticalTabsItem, VerticalTabsPalette, VerticalTabsProps, } from './components/verticalTabs';
 export { autocompleteYellow } from './styles/defaultPalette/colors/others';
 export { Theme } from './styles/theme';
 export { Palette, bwColor, paletteColor } from './styles/types';