fis-component 0.0.34 → 0.0.36

package/dist/esm/types/src/assets/icons/ChevronLeftIcon.d.ts

@@ -0,0 +1,3 @@
+import { SvgIconProps } from "./SVGIconProps";
+declare function ChevronLeftIcon(props: SvgIconProps): import("react/jsx-runtime").JSX.Element;
+export default ChevronLeftIcon;

package/dist/esm/types/src/assets/icons/ChevronRightIcon.d.ts

@@ -0,0 +1,3 @@
+import { SvgIconProps } from "./SVGIconProps";
+declare function ChevronRightIcon(props: SvgIconProps): import("react/jsx-runtime").JSX.Element;
+export default ChevronRightIcon;

package/dist/esm/types/src/assets/icons/InfoIcon.d.ts

@@ -1,3 +1,2 @@
 import { SvgIconProps } from "./SVGIconProps";
-declare function InfoIcon(props: SvgIconProps): import("react/jsx-runtime").JSX.Element;
-export default InfoIcon;
+export default function InfoIcon(props: SvgIconProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/types/src/assets/icons/index.d.ts

@@ -37,3 +37,5 @@ export { default as MoreIcon } from "./MoreIcon";
 export { default as NoDataIcon } from "./NoDataIcon";
 export { default as NoResultIcon } from "./NoResultIcon";
 export { default as RemoveIcon } from "./RemoveIcon";
+export { default as ChevronLeftIcon } from "./ChevronLeftIcon";
+export { default as ChevronRightIcon } from "./ChevronRightIcon";

package/dist/esm/types/src/components/Breadcrumb/index.d.ts

@@ -3,7 +3,7 @@ export interface BreadcrumbItemProps extends ComponentPropsWithoutRef<"button">
     icon?: React.ReactNode;
     label?: string;
     active?: boolean;
-    onClick: () => void;
+    onClick?: () => void;
 }
 export type BreadcrumbProps = {
     items: BreadcrumbItemProps[];

package/dist/esm/types/src/components/MenuSelect/types.d.ts

@@ -4,7 +4,7 @@ export interface MenuItem {
     value: string;
 }
 export interface MenuGroup {
-    groupLabel: string;
+    groupLabel?: string;
     items: MenuItem[];
 }
 export type MenuSize = "md" | "lg";

package/dist/esm/types/src/components/Pagination/Pagination.stories.d.ts

@@ -0,0 +1,8 @@
+import type { Meta, StoryObj } from "@storybook/react";
+import { PaginationProps } from "./";
+declare const _default: Meta<PaginationProps>;
+export default _default;
+export declare const Default: StoryObj<PaginationProps>;
+export declare const Minimized: StoryObj<PaginationProps>;
+export declare const CustomTotal: StoryObj<PaginationProps>;
+export declare const WithRecordCounted: StoryObj<PaginationProps>;

package/dist/esm/types/src/components/Pagination/index.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { PaginationProps as AntdPaginationProps } from "antd";
+export interface PaginationProps extends AntdPaginationProps {
+    minimize?: boolean;
+    recordCounted?: boolean;
+    onIconPageRecordClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+}
+declare const FISPagination: React.FC<PaginationProps>;
+export default FISPagination;

package/dist/esm/types/src/components/Pagination/styles.d.ts

@@ -0,0 +1,25 @@
+export declare const PaginationAntdSC: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("antd").PaginationProps, {
+    $minimize?: boolean;
+}>> & string & Omit<import("react").FC<import("antd").PaginationProps>, keyof import("react").Component<any, {}, any>>;
+export declare const DivPaginationContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const DivPaginationContent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const SpanTotalSC: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
+export declare const SelectPageSizeSC: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<(Omit<Partial<import("../Input/InputLabel").InputLabelProps> & Omit<import("../MenuSelect/types").MenuProps, "size" | "onClickMenu" | "groups" | "multi" | "selectedValues" | "onChangeSelected"> & Omit<import("../SelectItem").SelectFieldProps, "onChange" | "value"> & {
+    options: import("../Select/types").SelectOption[];
+    message?: string;
+    placeholderSearch?: string;
+    positive?: boolean;
+    multiDisplayText?: (count: number) => string;
+    renderOption?: (option: import("../Select/types").SelectOption) => React.ReactNode;
+} & import("../Select/types").SingleSelect<string> & import("react").RefAttributes<HTMLInputElement>, "ref"> & {
+    ref?: ((instance: HTMLInputElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLInputElement> | null | undefined;
+}) | (Omit<Partial<import("../Input/InputLabel").InputLabelProps> & Omit<import("../MenuSelect/types").MenuProps, "size" | "onClickMenu" | "groups" | "multi" | "selectedValues" | "onChangeSelected"> & Omit<import("../SelectItem").SelectFieldProps, "onChange" | "value"> & {
+    options: import("../Select/types").SelectOption[];
+    message?: string;
+    placeholderSearch?: string;
+    positive?: boolean;
+    multiDisplayText?: (count: number) => string;
+    renderOption?: (option: import("../Select/types").SelectOption) => React.ReactNode;
+} & import("../Select/types").MultiSelect<string> & import("react").RefAttributes<HTMLInputElement>, "ref"> & {
+    ref?: ((instance: HTMLInputElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLInputElement> | null | undefined;
+}), import("styled-components/dist/types").BaseObject>> & string & Omit<import("react").ForwardRefExoticComponent<import("../Select/types").SelectProps<string> & import("react").RefAttributes<HTMLInputElement>>, keyof import("react").Component<any, {}, any>>;

package/dist/esm/types/src/components/Select/types.d.ts

@@ -1,8 +1,8 @@
-import { InputFieldProps } from "../Input/InputField";
 import { InputLabelProps } from "../Input/InputLabel";
 import { MenuProps } from "../MenuSelect/types";
+import { SelectFieldProps } from "../SelectItem";
 export interface SelectOption {
-    groupLabel: string;
+    groupLabel?: string;
     items: {
         label: string;
         description?: string;
@@ -21,7 +21,7 @@ export type MultiSelect<T> = {
     onChange: (value: T[]) => void;
     displayValue?: (value: SelectOption[]) => string;
 };
-export type SelectProps<T> = Omit<InputFieldProps, "value" | "onChange"> & Partial<InputLabelProps> & Omit<MenuProps, "groups" | "multi" | "selectedValues" | "onChangeSelected" | "onClickMenu"> & {
+export type SelectProps<T> = Partial<InputLabelProps> & Omit<MenuProps, "groups" | "multi" | "selectedValues" | "onChangeSelected" | "onClickMenu" | "size"> & Omit<SelectFieldProps, "value" | "onChange"> & {
     options: SelectOption[];
     message?: string;
     placeholderSearch?: string;

package/dist/esm/types/src/components/Select/utils.d.ts

@@ -0,0 +1,2 @@
+import { MenuSize } from "../MenuSelect/types";
+export declare function isMenuSize(value: any): value is MenuSize;

package/dist/esm/types/src/components/SelectItem/index.d.ts

@@ -1,6 +1,6 @@
 import { ComponentPropsWithoutRef, JSX } from "react";
 export type SelectSize = "xs" | "sm" | "md" | "lg";
-export interface SelectFieldProps extends Omit<ComponentPropsWithoutRef<"input">, "onClick"> {
+export interface SelectFieldProps extends Omit<ComponentPropsWithoutRef<"input">, "onClick" | "size"> {
     /**Control the size of the component*/
     size?: SelectSize;
     /**Prefix for filter value*/
@@ -11,10 +11,6 @@ export interface SelectFieldProps extends Omit<ComponentPropsWithoutRef<"input">
     actived?: boolean;
     /**active-dropdown for current field*/
     activeDropdown?: boolean;
-    /** onClickSuffix for current field Button */
-    onClickSuffix?: () => void;
-    /** onClickPrefix for current field Button */
-    onClickPrefix?: () => void;
 }
 declare const FISSelectItem: import("react").ForwardRefExoticComponent<SelectFieldProps & import("react").RefAttributes<HTMLInputElement>>;
 export default FISSelectItem;

package/dist/esm/types/src/components/Toast/ToastContext.d.ts

@@ -1,7 +1,8 @@
 import React from "react";
-import { ToastProps } from ".";
+import { ToastProps, ToastPositionType } from ".";
 interface ToastOptions extends ToastProps {
     duration?: number;
+    position?: ToastPositionType;
 }
 export interface ToastContextType {
     showToast: (options: ToastOptions) => void;

package/dist/esm/types/src/components/Toast/index.d.ts

@@ -2,6 +2,7 @@ import React from "react";
 export type ThemeType = "neutral" | "info" | "positive" | "caution" | "negative";
 export type ToastType = "link" | "button" | "no-action";
 export type PositionType = "inline" | "bottom";
+export type ToastPositionType = "top-center" | "bottom-center";
 export type ToastProps = {
     className?: string;
     theme?: ThemeType;

package/dist/esm/types/src/components/Toast/styles.d.ts

@@ -9,5 +9,7 @@ export declare const DivIconSC: import("styled-components/dist/types").IStyledCo
 export declare const PTitleSC: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, ToastProps>> & string;
 export declare const LinkSC: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, never>> & string;
 export declare const DivTitleWrap: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, ToastProps>> & string;
-export declare const ToastWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const ToastWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $position?: "top-center" | "bottom-center";
+}>> & string;
 export {};

package/dist/esm/types/src/components/Toast/useToast.d.ts

@@ -1,2 +1,3 @@
 import { ToastContextType } from "./ToastContext";
-export declare const useToast: () => ToastContextType;
+declare const useToast: () => ToastContextType;
+export default useToast;

package/dist/esm/types/src/index.d.ts

@@ -41,3 +41,8 @@ export { default as FISProgressLinear } from "./components/ProgressLinear";
 export { default as FISSplitButton } from "./components/SplitButton";
 export { default as FISSelect } from "./components/Select";
 export { default as FISSelectItem } from "./components/SelectItem";
+export { default as useNotification } from "./components/Notification/useNotification";
+export { default as useToast } from "./components/Toast/useToast";
+export { default as FISHeaderCell } from "./components/Table/HeaderCell";
+export { default as FISColumnCell } from "./components/Table/ColumnCell";
+export { default as FISPagination } from "./components/Pagination";

package/dist/index.d.ts

@@ -2,7 +2,8 @@ import * as React$1 from 'react';
 import React__default, { ComponentPropsWithoutRef, ReactNode, Ref, ForwardedRef, JSX, FC, DetailedHTMLProps, HTMLAttributes, ReactElement, ComponentType } from 'react';
 import { DefaultTheme } from 'styled-components';
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { TooltipProps as TooltipProps$1, CollapseProps, TableProps as TableProps$1 } from 'antd';
+import { TooltipProps as TooltipProps$1, CollapseProps, TableProps as TableProps$1, PaginationProps as PaginationProps$1 } from 'antd';
+import * as antd_es_notification_interface from 'antd/es/notification/interface';
 
 interface ThemeProviderProps {
     theme?: DefaultTheme;
@@ -3567,7 +3568,7 @@ interface BreadcrumbItemProps extends ComponentPropsWithoutRef<"button"> {
     icon?: React__default.ReactNode;
     label?: string;
     active?: boolean;
-    onClick: () => void;
+    onClick?: () => void;
 }
 type BreadcrumbProps = {
     items: BreadcrumbItemProps[];
@@ -3842,7 +3843,7 @@ interface MenuItem {
     value: string;
 }
 interface MenuGroup {
-    groupLabel: string;
+    groupLabel?: string;
     items: MenuItem[];
 }
 type MenuSize = "md" | "lg";
@@ -3957,6 +3958,7 @@ declare const FISCollapse: React.FC<CustomCollapseProps>;
 type ThemeType$1 = "neutral" | "info" | "positive" | "caution" | "negative";
 type ToastType = "link" | "button" | "no-action";
 type PositionType = "inline" | "bottom";
+type ToastPositionType = "top-center" | "bottom-center";
 type ToastProps = {
     className?: string;
     theme?: ThemeType$1;
@@ -4135,10 +4137,10 @@ declare namespace FISAlertBanner {
     var displayName: string;
 }
 
-type Variant$1 = "indeterminate" | "determinate";
+type Variant$2 = "indeterminate" | "determinate";
 type Size$1 = "xs" | "sm" | "md" | "lg";
 interface ProgressCircularProps {
-    variant: Variant$1;
+    variant: Variant$2;
     percent?: number;
     size?: Size$1;
     invert?: boolean;
@@ -4149,10 +4151,10 @@ declare namespace FISProgressCircular {
     var displayName: string;
 }
 
-type Variant = "indeterminate" | "determinate";
+type Variant$1 = "indeterminate" | "determinate";
 type Size = "xs" | "sm" | "md" | "lg";
 interface ProgressLinearProps {
-    variant: Variant;
+    variant: Variant$1;
     percent: number;
     size?: Size;
     invert?: boolean;
@@ -4182,8 +4184,23 @@ declare const FISSplitButton: React__default.ForwardRefExoticComponent<{
     className?: string;
 } & React__default.RefAttributes<HTMLDivElement>>;
 
+type SelectSize = "xs" | "sm" | "md" | "lg";
+interface SelectFieldProps extends Omit<ComponentPropsWithoutRef<"input">, "onClick" | "size"> {
+    /**Control the size of the component*/
+    size?: SelectSize;
+    /**Prefix for filter value*/
+    iconPrefix?: string | JSX.Element;
+    /**iconSuffix for filter value*/
+    iconSuffix?: string | JSX.Element;
+    /**actived for current field*/
+    actived?: boolean;
+    /**active-dropdown for current field*/
+    activeDropdown?: boolean;
+}
+declare const FISSelectItem: React$1.ForwardRefExoticComponent<SelectFieldProps & React$1.RefAttributes<HTMLInputElement>>;
+
 interface SelectOption {
-    groupLabel: string;
+    groupLabel?: string;
     items: {
         label: string;
         description?: string;
@@ -4202,7 +4219,7 @@ type MultiSelect<T> = {
     onChange: (value: T[]) => void;
     displayValue?: (value: SelectOption[]) => string;
 };
-type SelectProps<T> = Omit<InputFieldProps, "value" | "onChange"> & Partial<InputLabelProps> & Omit<MenuProps, "groups" | "multi" | "selectedValues" | "onChangeSelected" | "onClickMenu"> & {
+type SelectProps<T> = Partial<InputLabelProps> & Omit<MenuProps, "groups" | "multi" | "selectedValues" | "onChangeSelected" | "onClickMenu" | "size"> & Omit<SelectFieldProps, "value" | "onChange"> & {
     options: SelectOption[];
     message?: string;
     placeholderSearch?: string;
@@ -4213,24 +4230,55 @@ type SelectProps<T> = Omit<InputFieldProps, "value" | "onChange"> & Partial<Inpu
 
 declare const FISSelect: React$1.ForwardRefExoticComponent<SelectProps<string> & React$1.RefAttributes<HTMLInputElement>>;
 
-type SelectSize = "xs" | "sm" | "md" | "lg";
-interface SelectFieldProps extends Omit<ComponentPropsWithoutRef<"input">, "onClick"> {
-    /**Control the size of the component*/
-    size?: SelectSize;
-    /**Prefix for filter value*/
-    iconPrefix?: string | JSX.Element;
-    /**iconSuffix for filter value*/
-    iconSuffix?: string | JSX.Element;
-    /**actived for current field*/
-    actived?: boolean;
-    /**active-dropdown for current field*/
-    activeDropdown?: boolean;
-    /** onClickSuffix for current field Button */
-    onClickSuffix?: () => void;
-    /** onClickPrefix for current field Button */
-    onClickPrefix?: () => void;
+type NotificationBaseProps = {
+    title: string | React.ReactElement;
+    description: string | React.ReactElement;
+    duration?: number;
+    slot?: React.ReactNode;
+    cancelText?: string;
+    okText?: string;
+    moreOption?: boolean;
+    key?: string;
+    onCancel?: () => void;
+    onOk?: () => void;
+    onMoreClick?: () => void;
+    onClose?: () => void;
+};
+type SystemNotificationProps = NotificationBaseProps & {
+    imgUrl: string;
+};
+type InfoNotificationProps = NotificationBaseProps & {
+    icon?: string;
+    size?: IconSize;
+    variant?: Variant;
+    roundedIcon?: boolean;
+};
+type Variant = "neutral" | "info" | "positive" | "caution" | "negative";
+type IconSize = 24 | 28 | 36 | 44 | 56 | 68 | 84;
+
+declare const useNotification: () => {
+    api: antd_es_notification_interface.NotificationInstance;
+    contextHolder: React__default.ReactElement<unknown, string | React__default.JSXElementConstructor<any>>;
+    notificationWithImage: ({ key: keyProp, duration, onClose: onCloseProp, ...rest }: SystemNotificationProps) => void;
+    notificationWithFeature: ({ key: keyProp, duration, onClose: onCloseProp, ...rest }: InfoNotificationProps) => void;
+};
+
+interface ToastOptions extends ToastProps {
+    duration?: number;
+    position?: ToastPositionType;
 }
-declare const FISSelectItem: React$1.ForwardRefExoticComponent<SelectFieldProps & React$1.RefAttributes<HTMLInputElement>>;
+interface ToastContextType {
+    showToast: (options: ToastOptions) => void;
+}
+
+declare const useToast: () => ToastContextType;
+
+interface PaginationProps extends PaginationProps$1 {
+    minimize?: boolean;
+    recordCounted?: boolean;
+    onIconPageRecordClick?: (event: React__default.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+}
+declare const FISPagination: React__default.FC<PaginationProps>;
 
-export { FISAlertBanner, FISAvatar, FISBadge, FISBreadcrumb, FISButton, FISButtonGroup, FISCheckbox, FISCheckboxGroup, FISChipButton, FISCollapse, FISCombobox, FISDateRange, FISDivider, FISIconButton, FISInputArea, FISInputDate, FISInputField, FISInputLabel, FISInputStepper, FISInputText, FISInputTime, FISLinkButton, FISMenuItem, FISMenuSection, FISMenuSelect, FISProgressCircular, FISProgressLinear, FISRadio, RadioGroup as FISRadioGroup, FISSegmented, FISSelect, FISSelectItem, FISSorter, FISSplitButton, FISSwitch, FISTab, FISTable, FISColumnCell as FISTableColumn, FISHeaderCell as FISTableHeader, FISThemeProvider, FISToast, FISTooltip, SegmentedPanelItem, TabPanelItem };
+export { FISAlertBanner, FISAvatar, FISBadge, FISBreadcrumb, FISButton, FISButtonGroup, FISCheckbox, FISCheckboxGroup, FISChipButton, FISCollapse, FISColumnCell, FISCombobox, FISDateRange, FISDivider, FISHeaderCell, FISIconButton, FISInputArea, FISInputDate, FISInputField, FISInputLabel, FISInputStepper, FISInputText, FISInputTime, FISLinkButton, FISMenuItem, FISMenuSection, FISMenuSelect, FISPagination, FISProgressCircular, FISProgressLinear, FISRadio, RadioGroup as FISRadioGroup, FISSegmented, FISSelect, FISSelectItem, FISSorter, FISSplitButton, FISSwitch, FISTab, FISTable, FISColumnCell as FISTableColumn, FISHeaderCell as FISTableHeader, FISThemeProvider, FISToast, FISTooltip, SegmentedPanelItem, TabPanelItem, useNotification, useToast };
 export type { ThemeType$2 as ThemeType };

package/package.json

@@ -1,7 +1,7 @@
 {
   "homepage": "https://vietdiemtran.github.io/fis-component/",
   "name": "fis-component",
-  "version": "0.0.34",
+  "version": "0.0.36",
   "description": "",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",