@fattureincloud/fic-design-system 0.4.19 → 0.4.22

package/CHANGELOG.md

@@ -0,0 +1,468 @@
+# Changelog
+
+## v0.4.22 - 02/08/2022
+
+- Fixato placeholder nel componente DatePicker, che ora prende il valore dalle props oppure assume quello del giorno corrente
+- I giorni non selezionabili del DatePicker ora si distinguono per colore
+- Piccolo fix grafico alle voci della sidebar che contengono un badge
+
+## v0.4.21 - 26/07/2022
+
+- Refactor component Toast
+
+## v0.4.20 - 13/07/2022
+
+- Bugfix di useUpDownKeyNavigation, premendo ENTER venivano intercettati altri comportamenti in altri componenti
+
+## v0.4.19 - 28/06/2022
+
+- Aggiunta la possibilità di usare le frecce per selezionare una riga nella Table o un'opzione nel Dropdown
+- Aggiunto export del componente Spinner
+
+## v0.4.18
+
+- Rimossa prop disabled dal componente Select perché ridondante
+
+## v0.4.17
+
+- Fixato l'hook useFormattedDate del componente DatePicker
+
+## v0.4.16 - 18/05/2022
+
+### 🚀 Added
+
+- Implementata prop "fixedHeight" in componente FileUploader
+
+### 🚀 Bugfix
+
+- Modificato il border bottom dell’header in maniera che sia più chiaro, sistemato le icone di ordinamento
+- Fixato stile Dropdown
+- Fixato font in storybook usando "Inter UI"
+
+## v0.4.15 - 17/05/2022
+
+### 🚀 Bugfix
+
+- Fixed style "min-height" if prop isSmall is true on component ConfirmationModal
+
+## v0.4.14 - 12/05/2022
+
+### 🚀 Added
+
+- Added new prop pageSize on component Table
+
+## v0.4.13 - 05/05/2022
+
+### 🚀 Added
+
+- Added new prop maxFileSize on component FileUploader
+
+### 🐛 Bug Fix
+
+- Fix placeholder in Select component style bug
+
+## v0.4.12 - 03/05/2022
+
+### 🐛 Bug Fix
+
+- Fix placeholder in Select component, the cursor was at the end of the placeholder
+- Fix Table LoadingCell
+
+## v0.4.11 - 12/04/2022
+
+### 🐛 Bug Fix
+
+- Fix text color to 900 in component InlineMessage
+
+## v.0.4.10 - 08/04/2022
+
+### 🚀 Added
+
+- Added new component DatePicker
+- Added new features in component Table
+- Added backgroundColor in palette for component FileUploader and fixed file type mappings to manage "p7m" extension
+
+## v0.4.9 - 23/02/2022
+
+### 🐛 Bug Fix
+
+- Fix FontAwesome version
+
+## v0.4.8 - 23/02/2022
+
+### 🐛 Bug Fix
+
+- Downgrade FontAwesome to v5 due to browser compatibility issues
+
+## v0.4.7 - 22/02/2022
+
+### 🚀 Added
+
+- Add new FileUploader component
+- Add new Table component
+
+### 🐛 Bug Fix
+
+- Fix appearance of multiline (long) Select Options
+
+## v0.4.6 - 15/02/2022
+
+### 🚀 Added
+
+- Add `customHeader` and `customFooter` props to Modal
+- Add `isPrefilled` prop to InputText, TextArea and Select components
+- Add `isTransparent` prop to Select and InputText components
+- Add `customStyles` prop to Select component
+- Add UnitDropdown to InputText
+- Add `ref` prop to InputText component
+- Add Select `simpleValue` prop and `useSelectSimpleValue` hook
+
+### 🐛 Bug Fix
+
+- Fix Accordion graphical appearance (CSS)
+
+### 💅 Enhancement
+
+- Add `JSX.Element` to label prop type in form components
+- Remove up and down arrows on `input[type=number]`
+
+## v0.4.5 - 08/02/2022
+
+- Update FontAwesome to v6.0.0 (Downgraded to v5 in v0.4.8)
+
+## v0.4.4 - 25/01/2022
+
+### 🐛 Bug Fix
+
+- Move SidebarItem Dropdown on the left in Safari
+
+## v0.4.3 - 21/01/2022
+
+### 🐛 Bug Fix
+
+- Remove the Checkbox `Label` tag when prop `text` is missing
+
+### 💅 Enhancement
+
+- Change Button `text` prop from `string | JSX.Element` to `ReactText | JSX.Element`
+
+## v0.4.2 - 19/01/2022
+
+### 🐛 Bug Fix
+
+- Fix Dropdown content appearance animation in Safari (animation removed)
+- Fix absent Select typings
+- Fix Select Option multiline appearance
+
+### 💅 Enhancement
+
+- Change all occurrences of `isDisabled` prop to `disabled` for "form" components
+
+## 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,3 +1,4 @@
+/// <reference types="react" />
 export interface Props {
     className?: string;
 }

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { DropdownProps } from './types';
 declare const DropdownImpl: ({ className, content, fullWidth, maxWidth, minWidthAsTrigger, placement, renderContent, renderTrigger, triggerStyles, title, forceOpen, disableArrowNavigation, maxHeight, isSmall, }: DropdownProps) => JSX.Element;
 export default DropdownImpl;

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export interface DropdownTriggerProps {
     title: string;
 }

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { DropdownItemProps } from '../types';
 import { DropdownItemStyles } from '../utils';
 declare const Item: ({ active, className, componentId, icon, isDisabled, onClick, rowHasFocus, shortcut, text, ...rest }: DropdownItemProps & {

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

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

package/dist/components/form/datepicker/DatePicker.d.ts

@@ -1,5 +1,12 @@
-import { LabelProps } from '../label';
-import { DatePickerImplProps } from './DatePickerImpl';
-export declare type DatePickerProps = LabelProps & DatePickerImplProps;
+/// <reference types="react" />
+import { DatePickerProps } from './types';
+/**
+ * Component Props:
+ * @param {Date | null} date selected date
+ * @param {function} placeholderText text to show as placeholder
+ * @param {string|ReactNode} minDate minimum selectable date
+ * @param {string|ReactNode} maxDate maximum selectable date
+ * @others ReactDatePickerProps
+ */
 declare const DatePicker: (props: DatePickerProps) => JSX.Element;
 export default DatePicker;

package/dist/components/form/datepicker/DatePickerImpl.d.ts

@@ -1,25 +1,4 @@
-import { Dispatch, ReactChild, SetStateAction } from 'react';
-import { ReactDatePickerProps } from 'react-datepicker';
-import { CommonFormTypes } from '../common/types';
-export declare type RenderCustomFooterType = (props: RenderCustomFooterProps) => ReactChild;
-export declare type CustomButtonProps = {
-    text: string;
-    onClick: (props: RenderCustomFooterProps) => void;
-};
-export interface DatePickerImplProps extends Omit<ReactDatePickerProps, 'onChange'>, CommonFormTypes {
-    date: Date | null;
-    setDate: Dispatch<SetStateAction<Date | null>>;
-    allowMonthView?: boolean;
-    allowYearView?: boolean;
-    yearsDisplayed?: number;
-    hasTodayButton?: boolean;
-    customButtons?: CustomButtonProps[];
-    renderCustomFooter?: RenderCustomFooterType;
-    isPrefilled?: boolean;
-}
-export interface RenderCustomFooterProps extends DatePickerImplProps {
-    isOpen: boolean;
-    setIsOpen: Dispatch<SetStateAction<boolean>>;
-}
+/// <reference types="react" />
+import { DatePickerImplProps } from './types';
 declare const DatePickerImpl: (props: DatePickerImplProps) => JSX.Element;
 export default DatePickerImpl;

package/dist/components/form/datepicker/components/CustomButton.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 interface Props {
     onClick: () => void;
     selected?: boolean;

package/dist/components/form/datepicker/components/DatePickerHeader.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { ReactDatePickerCustomHeaderProps } from 'react-datepicker';
 export interface DatePickerHeaderProps extends ReactDatePickerCustomHeaderProps {
     allowMonthView: boolean;

package/dist/components/form/datepicker/components/MonthPicker.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { ReactDatePickerCustomHeaderProps } from 'react-datepicker';
 declare type Props = Pick<ReactDatePickerCustomHeaderProps, 'changeMonth' | 'date'>;
 declare const MonthPicker: ({ changeMonth, date }: Props) => JSX.Element;

package/dist/components/form/datepicker/components/YearPicker.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { ReactDatePickerCustomHeaderProps } from 'react-datepicker';
 interface Props extends Pick<ReactDatePickerCustomHeaderProps, 'date' | 'changeYear'> {
     yearsDisplayed: number;

package/dist/components/form/datepicker/components/hooks/useDatePickerHeaderShowLogic.d.ts

@@ -1,7 +1,7 @@
-import { datePickerStatus } from '../../types';
+import { DatePickerStatus } from '../../types';
 import { DatePickerHeaderProps } from '../DatePickerHeader';
 interface ReturnType {
-    status: datePickerStatus;
+    status: DatePickerStatus;
     title: string;
     leftArrowOnClick: () => void;
     leftArrowIsDisabled: boolean;

package/dist/components/form/datepicker/datePickerPalette.d.ts

@@ -1,20 +1,20 @@
 import { colorsPalette } from '../../../common/types/colorsPalette';
 import { paletteColor } from '../../../styles/types';
-declare type itemStatus = 'normal' | 'active' | 'normalHover' | 'activeHover';
+declare type ItemStatus = 'normal' | 'active' | 'normalHover' | 'activeHover' | 'disabled';
 declare type DayPalette = {
     borderRadius: string;
     today: {
-        [k in itemStatus]: colorsPalette;
+        [k in Exclude<ItemStatus, 'disabled'>]: colorsPalette;
     };
     inMonth: {
-        [k in itemStatus]: colorsPalette;
+        [k in ItemStatus]: colorsPalette;
     };
     outMonth: {
-        [k in Exclude<itemStatus, 'active' | 'activeHover'>]: colorsPalette;
+        [k in Exclude<ItemStatus, 'active' | 'activeHover' | 'disabled'>]: colorsPalette;
     };
 };
 declare type ItemStatusPalette = {
-    [k in itemStatus]: colorsPalette;
+    [k in ItemStatus]: colorsPalette;
 };
 interface ItemPalette extends ItemStatusPalette {
     borderRadius: string;

package/dist/components/form/datepicker/datepicker.stories.d.ts

@@ -1,5 +1,5 @@
 import { Meta, Story } from '@storybook/react';
-import { DatePickerProps } from './DatePicker';
+import { DatePickerProps } from './types';
 export declare const Normal: Story<DatePickerProps>;
 export declare const WithCustomButton: Story<DatePickerProps>;
 declare const DatePickerStories: Meta<DatePickerProps>;

package/dist/components/form/datepicker/index.d.ts

@@ -1,5 +1,5 @@
-import DatePicker, { DatePickerProps } from './DatePicker';
-import datePickerPalette, { DatePickerPalette } from './datePickerPalette';
-import useFormattedDate from './hooks/useFormattedDate';
-import { timeConversionOptions } from './utils';
-export { datePickerPalette, DatePickerProps, DatePickerPalette, DatePicker, useFormattedDate, timeConversionOptions };
+export { default as DatePicker } from './DatePicker';
+export { default as datePickerPalette, DatePickerPalette } from './datePickerPalette';
+export { default as useFormattedDate } from './hooks/useFormattedDate';
+export { DatePickerProps } from './types';
+export { timeConversionOptions } from './utils';

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

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

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

@@ -1,4 +1,29 @@
-export declare type datePickerStatus = 'dayPicker' | 'monthPicker' | 'yearPicker';
+import { Dispatch, ReactChild, SetStateAction } from 'react';
+import { ReactDatePickerProps } from 'react-datepicker';
+import { CommonFormTypes } from '../common/types';
+import { LabelProps } from '../label';
+export declare type DatePickerStatus = 'dayPicker' | 'monthPicker' | 'yearPicker';
 export declare const dateFormatsArray: [string, ...string[]];
-export declare type dateFormat = typeof dateFormatsArray[number];
-export declare type DateFormats = [dateFormat, ...dateFormat[]];
+export declare type DateFormat = typeof dateFormatsArray[number];
+export declare type DateFormats = [DateFormat, ...DateFormat[]];
+export declare type RenderCustomFooterType = (props: RenderCustomFooterProps) => ReactChild;
+export declare type CustomButtonProps = {
+    text: string;
+    onClick: (props: RenderCustomFooterProps) => void;
+};
+export interface RenderCustomFooterProps extends DatePickerImplProps {
+    isOpen: boolean;
+    setIsOpen: Dispatch<SetStateAction<boolean>>;
+}
+export interface DatePickerImplProps extends Omit<ReactDatePickerProps, 'onChange'>, CommonFormTypes {
+    date: Date | null;
+    setDate: Dispatch<SetStateAction<Date | null>>;
+    allowMonthView?: boolean;
+    allowYearView?: boolean;
+    yearsDisplayed?: number;
+    hasTodayButton?: boolean;
+    customButtons?: CustomButtonProps[];
+    renderCustomFooter?: RenderCustomFooterType;
+    isPrefilled?: boolean;
+}
+export declare type DatePickerProps = LabelProps & DatePickerImplProps;

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { FileRejection } from 'react-dropzone';
 import { CustomPalette, FileType, FileUploaderSize, FileUploaderStatus } from './types';
 export declare type fileUploaderOnDrop = (acceptedFiles: File[], rejectedFiles: FileRejection[]) => void;

package/dist/components/form/inputText/components/StatusIcon.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { statusType } from '../../common/types';
 interface Props {
     status: statusType;

package/dist/components/form/inputText/components/UnitDropdown.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { DropdownProps } from '../../../dropdown/types';
 import { Unit } from './unitDropdown/UnitDropdownTrigger';
 export interface UnitDropdownProps extends Pick<DropdownProps, 'renderContent' | 'placement' | 'className' | 'triggerStyles' | 'content' | 'maxWidth' | 'minWidthAsTrigger' | 'forceOpen'> {

package/dist/components/form/inputText/components/unitDropdown/UnitDropdownTrigger.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export interface Unit {
     name: string;
     shortName?: string;