@fattureincloud/fic-design-system 0.3.23 → 0.4.1

package/CHANGELOG.md

@@ -0,0 +1,310 @@
+# Changelog
+
+## v0.4.1 - 14/01/2022
+
+### 🐛 Bug Fix
+
+- Fix a bug during the update of SidebarItem
+
+## v0.4.0 - 15/12/2021
+
+### 💅 Enhancement
+
+- Update Storybook to v6
+- Update Rollup to v2
+  - Change build configs
+
+## v0.3.24 - 13/12/2021
+
+### 🐛 Bug Fix
+
+- Add preventDefault on Dropdown trigger click
+
+## v0.3.23 - 13/12/2021
+
+### 💅 Enhancement
+
+- Add href and cmd/ctrl+click on SidebarItem
+
+## v0.3.22 - 30/11/2021
+
+### 🐛 Bug Fix
+
+- Move `lint-staged` to devDependencies
+
+## v0.3.21 - 29/11/2021
+
+### 🐛 Bug Fix
+
+- Fix bug with Select usage
+
+## v0.3.20 - 22/11/2021
+
+### 🚀 Added
+
+- TextArea:
+  - Add isResizable prop
+  - Add characters counter
+- Add new `Select` components (`Select`, `CreatableSelect`, `AsyncSelect`, `AsyncCreatableSelect`)
+
+### 💅 Enhancement
+
+- `InputHelper`'s prop `message` changed type from `string` to `ReactChild`
+- Add `className` to TextArea wrapper
+- Remove `margin-bottom: 1em` from `InputText` and `TextArea` components
+- Update styled-components to v5
+- Add styled-components to `peerDependencies`
+
+### 🐛 Bug Fix
+
+- The cursor hovering an Icon will be `pointer` only if the icon has an `onClick` event
+- Fix Tabs component glitch
+
+## v0.3.19 - 02/11/2021
+
+### 🚀 Added
+
+- Add SidebarItem customization through `CustomSidebarItemProps` prop
+- Add exports for `SidebarItemProps`
+
+### 💅 Enhancement
+
+- Remove deprecated `alignRight` props from Dropdown component
+- The `text` prop in Badge is now a `ReactText`
+- Button `type=text` now supports icons and hover/active state
+
+### 🐛 Bug Fix
+
+- Fix click on SidebarItem's Dropdown 
+
+## v0.3.18 - 20/10/2021
+
+### 🚀 Added
+
+- Add new InputText component
+- Add new InputHelper component
+- Add new TextArea component
+
+### 💅 Enhancement
+
+- Add `isDisabled` prop to Icon component
+
+### 🐛 Bug Fix
+
+- Close the Tooltip dropdown on click outside
+- Better mobile event handling on Tooltip component (close on scroll page)
+- Add a maximum width to the tooltip dropdown
+
+## v0.3.17 - 06/10/2021
+
+### 🚀 Added
+
+- Added new `Stepper` component
+- Added prop `forceOpenDropdown` on SidebarItem component
+
+## v0.3.16 - 29/09/2021
+
+### 🚀 Added
+
+- Add new `forceOpen` prop to Dropdown
+
+### 💅 Enhancement
+
+- Change SidebarItem height from 40px to 44px
+
+### 🐛 Bug Fix
+
+- Fix Tooltip's arrow color
+
+## v0.3.15 - 21/09/2021
+
+### 🚀 Added
+
+- Add new SidebarItem component
+
+## v0.3.14 - 02/09/2021
+
+### 🚀 Added
+
+- Added new Tooltip component
+
+### 💅 Enhancement
+
+- Add `triggerStyles` Dropdown prop
+- Add new `IconBackground` component to support circle background behind icons 
+
+## v0.3.13 - 19/08/2021
+
+- Add `link` to DropdownItem `type`
+
+## v0.3.12 - 19/08/2021
+
+### 💅 Enhancement
+
+- Merged Dropdown interfaces `ContentOption` and `ItemProps` in `DropdownItemProps`
+- Add a part of DropdownPalette
+
+### 🐛 Bug Fix
+
+- Add `e.stopPropagation()` on Dropdown trigger click
+
+## v0.3.11 - 16/08/2021
+
+### 💅 Enhancement
+
+- DropdownItems doesn't highlight without an `onClick` prop anymore
+- Changed DropdownItems' shortcuts style
+
+## v0.3.10 - 28/07/2021
+
+### 🐛 Bug Fix
+
+- Export checkboxPalette interface
+- Added boolean-only support for Checkbox component
+
+### 💅 Enhancement
+
+- Change onClick prop type for Checkbox component
+
+## v0.3.9 - 28/07/2021
+
+### 💅 Enhancement
+
+- Added boolean values support to Checkbox 
+
+### 🐛 Bug Fix
+
+- Fix CustomSizeModal width on small screens
+
+## v0.3.8 - 26/07/2021
+
+### 🚀 Added
+
+- Added new Checkbox component with Checkbox Palette
+
+### 🐛 Bug Fix
+
+- Increased Toast z-index to make it visible while a modal is open
+
+## v0.3.7 - 25/06/2021
+
+### 🚀 Added
+
+- Added MicroTag palette
+- Added Icon palette
+
+### 💅 Enhancement
+
+- Refactor Palette structure
+  - Remove base palette part
+  - Use "transparent" css value instead of palette.base.transparent
+
+## v0.3.6 - 04/06/2021
+
+### 💅 Enhancement
+
+- Change project linting rules
+
+## v0.3.5 - 03/06/2021
+
+### 🚀 Added
+
+- Add export for `closeDropdownType`
+
+### 💅 Enhancement
+
+- Remove Dropdown padding with custom content
+
+## v0.3.4 - 26/05/2021
+
+### 🚀 Added
+
+- isDisabled prop on IconButton
+- IconButton default types (defaultColor, defaultType) in iconButtonPalette
+- Add `href` and `target` props on Button component
+
+### 💅 Enhancement
+
+- Fix buttons appearance on small screens
+
+## v0.3.2 - 19/05/2021
+
+### 🚀 Added
+
+- Add fullWidth prop on Button
+
+### 💅 Enhancement
+
+- Fix default buttonPalette colors
+- Align iconButton palette names to Button's one
+
+## v0.3.1 - 18/05/2021
+
+### 🚀 Added
+
+- New useDebounceClick hook
+- Add new theme object manual configuration
+- Add palette configuration object for:
+  - Tag
+  - Button
+  - IconButton
+
+### 💅 Enhancement
+
+- Switch default palette to DIC's palette
+- Button component redone from scratch
+  - TextButton merged with Button (type='text')
+- IconButton component redone from scratch
+- Refactor Tag component
+
+## v0.2.9 - 05/05/2021
+
+### 💅 Enhancement
+
+- The first render of the "not scrollable" Tabs component now
+  shows the scrollable version instead of an empty row with a dropdown
+- Split Tabs component in ScrollableTabs and DropdownTabs
+
+### 🐛 Bug Fix
+
+- Actually use the lateralPadding prop in Tabs component
+
+## v0.2.8 - 30/04/2021
+
+### 🐛 Bug Fix
+
+- Fixed Dropdowns in Internet Explorer
+
+## v0.2.7 - 07/04/2021
+
+### 🐛 Bug Fix
+
+- Fixed dropdown menu openings on Internet Explorer
+
+## v0.2.6 - 10/03/2021
+
+### 🐛 Bug Fix
+
+- Change Tag component "style" prop to "tagStyle" to prevent TypeScript error
+
+## v0.2.5 - 04/03/2021
+
+### 💅 Enhancement
+
+- Hide Tabs scrollbar if there's enough space for the elements
+
+### 🐛 Bug Fix
+
+- Force Tabs component to have height: 100% (prevent component/sidebar overlap)
+
+## v0.2.4 - 03/03/2021
+
+### 🐛 Bug Fix
+
+- Fixed Button appearance with empty text
+
+## v0.2.3 - 23/02/2021
+
+### 🐛 Bug Fix
+
+- Fixed an error in Tabs causing the page overflow in scrollable mode

package/dist/common/components/Spinner.d.ts

@@ -1,6 +1,5 @@
-/// <reference types="react" />
-export interface Props {
-    className?: string;
-}
-declare const Spinner: ({ className }: Props) => JSX.Element;
-export default Spinner;
+export interface Props {
+    className?: string;
+}
+declare const Spinner: ({ className }: Props) => JSX.Element;
+export default Spinner;

package/dist/common/cssFixes/inputTextFixes.d.ts

@@ -1,4 +1,3 @@
-import { inputSizeType } from '../../components/form/common/types';
-export declare const inputTextHTMLInputBootstrapFixes: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<{
-    inputSize: inputSizeType;
-}, import("styled-components").DefaultTheme>>;
+export declare const inputTextHTMLInputBootstrapFixes: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<{
+    inputSize?: string | undefined;
+}, import("styled-components").DefaultTheme>>;

package/dist/common/cssFixes/labelFixes.d.ts

@@ -1 +1 @@
-export declare const inputTextHTMLLabelBootstrapFixes: import("styled-components").FlattenSimpleInterpolation;
+export declare const inputTextHTMLLabelBootstrapFixes: import("styled-components").FlattenSimpleInterpolation;

package/dist/common/cssFixes/selectFixes.d.ts

@@ -1 +1 @@
-export declare const selectBootstrapFixes: import("styled-components").FlattenSimpleInterpolation;
+export declare const selectBootstrapFixes: import("styled-components").FlattenSimpleInterpolation;

package/dist/common/cssFixes/textAreaFixes.d.ts

@@ -1 +1 @@
-export declare const inputTextHTMLTextAreaBootstrapFixes: import("styled-components").FlattenSimpleInterpolation;
+export declare const inputTextHTMLTextAreaBootstrapFixes: import("styled-components").FlattenSimpleInterpolation;

package/dist/common/hooks/useDebounceClick.d.ts

@@ -1,8 +1,8 @@
-import React, { MouseEventHandler } from 'react';
-interface Params {
-    onClick?: MouseEventHandler;
-    manualLock?: boolean;
-    timeMs?: number;
-}
-declare const useDebounceClick: ({ manualLock, onClick, timeMs }: Params) => (event: React.MouseEvent<Element, MouseEvent>) => void;
-export default useDebounceClick;
+import { MouseEventHandler } from 'react';
+interface Params {
+    onClick?: MouseEventHandler;
+    manualLock?: boolean;
+    timeMs?: number;
+}
+declare const useDebounceClick: ({ manualLock, onClick, timeMs }: Params) => MouseEventHandler;
+export default useDebounceClick;

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

@@ -1,5 +1,5 @@
-import { paletteColor } from '../../styles/types';
-export declare type colorsPalette = {
-    color: paletteColor;
-    background: paletteColor;
-};
+import { paletteColor } from '../../styles/types';
+export declare type colorsPalette = {
+    color: paletteColor;
+    background: paletteColor;
+};

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

@@ -1,2 +1,3 @@
 import { IconProps } from '../../components/icon';
-export declare const getRandomIcon: () => IconProps;
+export declare const iconsMap: Record<string, IconProps>;
+export declare const iconsOptions: IconProps[];

package/dist/components/accordions/accordions.d.ts

@@ -1,9 +1,9 @@
-import { Component } from 'react';
-import { TAccordion, UnstyledAccordionProps, UnstyledAccordionState } from './types';
-export declare class UnstyledAccordion extends Component<UnstyledAccordionProps, UnstyledAccordionState> {
-    constructor(props: UnstyledAccordionProps);
-    handleOpenAccordion: () => void;
-    render(): JSX.Element;
-}
-declare const Accordion: TAccordion;
-export default Accordion;
+import { Component } from 'react';
+import { TAccordion, UnstyledAccordionProps, UnstyledAccordionState } from './types';
+export declare class UnstyledAccordion extends Component<UnstyledAccordionProps, UnstyledAccordionState> {
+    constructor(props: UnstyledAccordionProps);
+    handleOpenAccordion: () => void;
+    render(): JSX.Element;
+}
+declare const Accordion: TAccordion;
+export default Accordion;

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

@@ -1 +1,8 @@
-export {};
+import { Meta } from '@storybook/react';
+import { ComponentProps } from 'react';
+import { TAccordion } from './types';
+export declare const Normal: () => JSX.Element;
+export declare const NormalThemed: () => JSX.Element;
+export declare const ShowingBodyAtFirstRender: () => JSX.Element;
+declare const AccordionStories: Meta<ComponentProps<TAccordion>>;
+export default AccordionStories;

package/dist/components/accordions/components/styledAccordionWrapper.d.ts

@@ -1 +1 @@
-export declare const StyledAccordionWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledAccordionWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;

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

@@ -1,2 +1,2 @@
-import Accordion from './accordions';
-export { Accordion };
+import Accordion from './accordions';
+export { Accordion };

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

@@ -1,19 +1,19 @@
-/// <reference types="react" />
-interface Props {
-    title?: string;
-    renderTitle?: () => JSX.Element;
-    renderBody: () => JSX.Element;
-    renderLateralActions?: JSX.Element;
-    lateralActions?: Array<{
-        icon: JSX.Element;
-        action: () => void;
-    }>;
-    showBodyAtFirstRender?: boolean;
-}
-export declare type TAccordion = React.FunctionComponent<Props>;
-export interface UnstyledAccordionProps extends Props {
-}
-export interface UnstyledAccordionState {
-    show: boolean;
-}
-export {};
+/// <reference types="react" />
+interface Props {
+    title?: string;
+    renderTitle?: () => JSX.Element;
+    renderBody: () => JSX.Element;
+    renderLateralActions?: JSX.Element;
+    lateralActions?: Array<{
+        icon: JSX.Element;
+        action: () => void;
+    }>;
+    showBodyAtFirstRender?: boolean;
+}
+export declare type TAccordion = React.FunctionComponent<Props>;
+export interface UnstyledAccordionProps extends Props {
+}
+export interface UnstyledAccordionState {
+    show: boolean;
+}
+export {};

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

@@ -1,4 +1,4 @@
-/// <reference types="react" />
-import { AvatarProps } from './types';
-declare const Avatar: import("styled-components").StyledComponent<(props: AvatarProps) => JSX.Element, import("styled-components").DefaultTheme, {}, never>;
-export default Avatar;
+/// <reference types="react" />
+import { AvatarProps } from './types';
+declare const Avatar: import("styled-components").StyledComponent<(props: AvatarProps) => JSX.Element, import("styled-components").DefaultTheme, {}, never>;
+export default Avatar;

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

@@ -1 +1,9 @@
-export {};
+/// <reference types="react" />
+import { Meta } from '@storybook/react';
+import { AvatarProps } from './types';
+export declare const Generic: () => JSX.Element;
+export declare const Initials: () => JSX.Element;
+export declare const Placeholder: () => JSX.Element;
+export declare const Image: () => JSX.Element;
+declare const AvatarStories: Meta<AvatarProps>;
+export default AvatarStories;

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

@@ -1,2 +1,2 @@
-import Avatar from './Avatar';
-export { Avatar };
+import Avatar from './Avatar';
+export { Avatar };

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

@@ -1,8 +1,8 @@
-export interface AvatarProps {
-    className?: string;
-    initials?: string;
-    size: AvatarAllowedSizes;
-    placeholder?: string;
-    image?: string;
-}
-export declare type AvatarAllowedSizes = 'xs' | 's' | 'm' | 'l';
+export interface AvatarProps {
+    className?: string;
+    initials?: string;
+    size: AvatarAllowedSizes;
+    placeholder?: string;
+    image?: string;
+}
+export declare type AvatarAllowedSizes = 'xs' | 's' | 'm' | 'l';

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

@@ -1,3 +1,3 @@
-/// <reference types="react" />
-import { BadgeProps } from './types';
-export declare const Badge: (props: BadgeProps) => JSX.Element;
+/// <reference types="react" />
+import { BadgeProps } from './types';
+export declare const Badge: (props: BadgeProps) => JSX.Element;

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

@@ -1 +1,7 @@
-export {};
+/// <reference types="react" />
+import { Meta } from '@storybook/react';
+import { BadgeProps } from './types';
+export declare const Normal: () => JSX.Element;
+export declare const Advanced: () => JSX.Element;
+declare const BadgeStories: Meta<BadgeProps>;
+export default BadgeStories;

package/dist/components/badge/components/Body.d.ts

@@ -1,2 +1,2 @@
-import { BadgeProps } from '../types';
-export declare const Body: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, BadgeProps, never>;
+import { BadgeProps } from '../types';
+export declare const Body: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, BadgeProps, never>;

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

@@ -1,10 +1,10 @@
-import { ReactText } from 'react';
-import { IconProps } from '../icon';
-export interface BadgeProps {
-    text?: ReactText;
-    color?: 'red' | 'green';
-    imageUrl?: string;
-    leftIcon?: IconProps;
-    rightIcon?: IconProps;
-    handleRightIconClick?: () => void;
-}
+import { ReactText } from 'react';
+import { IconProps } from '../icon';
+export interface BadgeProps {
+    text?: ReactText;
+    color?: 'red' | 'green';
+    imageUrl?: string;
+    leftIcon?: IconProps;
+    rightIcon?: IconProps;
+    handleRightIconClick?: () => void;
+}

package/dist/components/banner/Banner.d.ts

@@ -1,11 +1,11 @@
-/// <reference types="react" />
-import { IconProps } from '../icon';
-export declare type bannerColorType = 'red' | 'blue' | 'yellow' | 'green' | 'grey' | undefined;
-export interface BannerProps {
-    color?: bannerColorType;
-    onClose?: () => void;
-    content: string | JSX.Element;
-    icon?: IconProps;
-}
-declare const Banner: ({ color, content, icon, onClose }: BannerProps) => JSX.Element;
-export default Banner;
+/// <reference types="react" />
+import { IconProps } from '../icon';
+export declare type bannerColorType = 'red' | 'blue' | 'yellow' | 'green' | 'grey' | undefined;
+export interface BannerProps {
+    color?: bannerColorType;
+    onClose?: () => void;
+    content: string | JSX.Element;
+    icon?: IconProps;
+}
+declare const Banner: ({ color, content, icon, onClose }: BannerProps) => JSX.Element;
+export default Banner;

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

@@ -1 +1,6 @@
-export {};
+/// <reference types="react" />
+import { Meta } from '@storybook/react';
+import { BannerProps } from './Banner';
+export declare const WithKnobs: () => JSX.Element;
+declare const BannerStories: Meta<BannerProps>;
+export default BannerStories;

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

@@ -1,2 +1,2 @@
-import Banner, { BannerProps } from './Banner';
-export { Banner, BannerProps };
+import Banner, { BannerProps } from './Banner';
+export { Banner, BannerProps };

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

@@ -1,8 +1,8 @@
-import { DefaultTheme } from 'styled-components';
-import { bannerColorType } from './Banner';
-interface MappedColors {
-    bgColor: string;
-    textColor: string;
-}
-export declare const mapColors: (theme: DefaultTheme, color: bannerColorType) => MappedColors;
-export {};
+import { DefaultTheme } from 'styled-components';
+import { bannerColorType } from './Banner';
+interface MappedColors {
+    bgColor: string;
+    textColor: string;
+}
+export declare const mapColors: (theme: DefaultTheme, color: bannerColorType) => MappedColors;
+export {};

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

@@ -1,11 +1,11 @@
-/// <reference types="react" />
-import { IconProps } from '../../icon';
-import { WrapperProps } from './types';
-export interface ButtonProps extends Partial<WrapperProps> {
-    text?: string | JSX.Element;
-    iconLeft?: IconProps;
-    iconRight?: IconProps;
-    isLoading?: boolean;
-}
-declare const Button: ({ className, color, fullWidth, href, iconLeft, iconRight, isDisabled, isLoading, onClick, size, target, text, type, }: ButtonProps) => JSX.Element;
-export default Button;
+/// <reference types="react" />
+import { IconProps } from '../../icon';
+import { WrapperProps } from './types';
+export interface ButtonProps extends Partial<WrapperProps> {
+    text?: string | JSX.Element;
+    iconLeft?: IconProps;
+    iconRight?: IconProps;
+    isLoading?: boolean;
+}
+declare const Button: ({ className, color, fullWidth, href, iconLeft, iconRight, isDisabled, isLoading, onClick, size, target, text, type, }: ButtonProps) => JSX.Element;
+export default Button;

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

@@ -1 +1,5 @@
-export {};
+import { Meta, Story } from '@storybook/react';
+import { ButtonProps } from '../index';
+export declare const Template: Story<ButtonProps>;
+declare const ButtonStories: Meta<ButtonProps>;
+export default ButtonStories;