@paygreen/pgui 2.1.3 → 2.2.0

package/dist/esm/types/components/ActionsButton/index.d.ts

@@ -1,6 +1,6 @@
-import React, { FC } from 'react';
+import { FC, PropsWithChildren } from 'react';
 import { IconButtonProps } from '@chakra-ui/react';
 export declare type ActionsButtonProps = Omit<IconButtonProps, 'aria-label'> & {
     label: string;
 };
-export declare const ActionsButton: FC<React.PropsWithChildren<ActionsButtonProps>>;
+export declare const ActionsButton: FC<PropsWithChildren<ActionsButtonProps>>;

package/dist/esm/types/components/Card/index.d.ts

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

package/dist/esm/types/components/ConfirmMenuItem/index.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import { HTMLChakraProps, MenuItemProps } from '@chakra-ui/react';
+export declare type StyledMenuItemProps = HTMLChakraProps<'button'>;
+export declare const MenuItem: import("@chakra-ui/react").ComponentWithAs<"button", MenuItemProps>;
+declare type ConfirmMenuItemProps = MenuItemProps & {
+    confirmDelay?: number;
+    confirmColorScheme?: string;
+    confirmContent?: React.ReactNode;
+    confirmText?: React.ReactNode;
+    confirmIcon?: React.FC<React.PropsWithChildren<unknown>>;
+};
+export declare const ConfirmMenuItem: import("@chakra-ui/react").ComponentWithAs<"button", ConfirmMenuItemProps>;
+export {};

package/dist/esm/types/components/DataList/index.d.ts

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { FC, PropsWithChildren } from 'react';
 import { AccordionProps, FlexProps } from '@chakra-ui/react';
 declare type DataListColumns = Record<string, DataListCellProps>;
 declare type DataListContextValue = {
@@ -30,13 +30,13 @@ export declare type DataListRowProps = FlexProps & {
     isVisible?: boolean | boolean[] | Record<string, boolean>;
     isDisabled?: boolean;
 };
-export declare const DataListRow: FC<React.PropsWithChildren<DataListRowProps>>;
+export declare const DataListRow: FC<PropsWithChildren<DataListRowProps>>;
 export declare type DataListHeaderProps = DataListRowProps;
-export declare const DataListHeader: FC<React.PropsWithChildren<DataListHeaderProps>>;
+export declare const DataListHeader: FC<PropsWithChildren<DataListHeaderProps>>;
 export declare type DataListFooterProps = DataListRowProps;
-export declare const DataListFooter: FC<React.PropsWithChildren<DataListFooterProps>>;
+export declare const DataListFooter: FC<PropsWithChildren<DataListFooterProps>>;
 export declare type DataListProps = AccordionProps & {
     isHover?: boolean;
 };
-export declare const DataList: FC<React.PropsWithChildren<DataListProps>>;
+export declare const DataList: FC<PropsWithChildren<DataListProps>>;
 export {};

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

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { FC, PropsWithChildren } from 'react';
 import { IconButtonProps, StackProps } from '@chakra-ui/react';
 export declare const getPaginationInfo: ({ page, pageSize, totalItems, }: {
     page?: number | undefined;
@@ -26,10 +26,10 @@ export declare type PaginationContextValue<PageType = number> = {
     lastItemOnPage: number;
 };
 export declare const PaginationContext: React.Context<PaginationContextValue<number>>;
-export declare const PaginationButtonFirstPage: FC<React.PropsWithChildren<Omit<IconButtonProps, 'aria-label'>>>;
-export declare const PaginationButtonPrevPage: FC<React.PropsWithChildren<Omit<IconButtonProps, 'aria-label'>>>;
-export declare const PaginationButtonLastPage: FC<React.PropsWithChildren<Omit<IconButtonProps, 'aria-label'>>>;
-export declare const PaginationButtonNextPage: FC<React.PropsWithChildren<Omit<IconButtonProps, 'aria-label'>>>;
+export declare const PaginationButtonFirstPage: FC<PropsWithChildren<Omit<IconButtonProps, 'aria-label'>>>;
+export declare const PaginationButtonPrevPage: FC<PropsWithChildren<Omit<IconButtonProps, 'aria-label'>>>;
+export declare const PaginationButtonLastPage: FC<PropsWithChildren<Omit<IconButtonProps, 'aria-label'>>>;
+export declare const PaginationButtonNextPage: FC<PropsWithChildren<Omit<IconButtonProps, 'aria-label'>>>;
 export declare const PaginationInfo: ({ ...rest }: {
     [x: string]: any;
 }) => JSX.Element;

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

@@ -1,4 +1,6 @@
 export * from './ActionsButton';
+export * from './Card';
+export * from './ConfirmMenuItem';
 export * from './DataList';
 export * from './DayPicker';
 export * from './FormGroup';

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

@@ -1,3 +1,4 @@
 export * from './components';
 export * from './layout';
 export * from './theme';
+export * from './utils';

package/dist/esm/types/layout/BottomBar/index.d.ts

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

package/dist/esm/types/layout/LayoutContainer/index.d.ts

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

package/dist/esm/types/layout/SideNav/index.d.ts

@@ -0,0 +1,16 @@
+/// <reference types="react" />
+import { ButtonProps, DrawerContentProps, FlexProps, StackProps } from '@chakra-ui/react';
+export declare type SideNavProps = {
+    isMobileMenuOpen: boolean;
+    onMobileMenuClose: () => void;
+} & FlexProps & DrawerContentProps;
+export declare type SideNavMenuItemProps = {
+    isActive?: boolean;
+} & ButtonProps;
+export declare const SideNav: ({ isMobileMenuOpen, onMobileMenuClose, children, ...props }: SideNavProps) => JSX.Element;
+export declare const SideNavContainer: (props: StackProps) => JSX.Element;
+export declare const SideNavHeader: ({ children, ...rest }: FlexProps) => JSX.Element;
+export declare const SideNavBody: ({ children, ...rest }: StackProps) => JSX.Element;
+export declare const SideNavFooter: ({ children, ...rest }: FlexProps) => JSX.Element;
+export declare const SideNavMenu: ({ title, children, ...rest }: StackProps) => JSX.Element;
+export declare const SideNavMenuItem: ({ isActive, children, ...rest }: SideNavMenuItemProps) => JSX.Element;

package/dist/esm/types/layout/TopBar/index.d.ts

@@ -4,7 +4,7 @@ export declare type TopBarBackActionProps = {
     backAction?: () => void;
     rightInformation?: ReactComponentElement<any>;
 } & FlexProps;
-export declare const TopBar: ({ ...props }: StackProps) => JSX.Element;
-export declare const TopBarFirstElement: ({ ...props }: FlexProps) => JSX.Element;
-export declare const TopBarLastElement: ({ ...props }: StackProps) => JSX.Element;
+export declare const TopBar: (props: StackProps) => JSX.Element;
+export declare const TopBarFirstElement: (props: FlexProps) => JSX.Element;
+export declare const TopBarLastElement: (props: StackProps) => JSX.Element;
 export declare const TopBarBackAction: ({ backAction, title, rightInformation, ...rest }: TopBarBackActionProps) => JSX.Element;

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

@@ -1 +1,4 @@
+export * from './BottomBar';
+export * from './LayoutContainer';
+export * from './SideNav';
 export * from './TopBar';

package/dist/esm/types/theme/components/drawer.d.ts

@@ -0,0 +1,6 @@
+declare const _default: {
+    sizes: {
+        nav: Partial<Record<"body" | "dialog" | "footer" | "header" | "overlay" | "dialogContainer" | "closeButton", import("@chakra-ui/styled-system").CSSObject>>;
+    };
+};
+export default _default;

package/dist/esm/types/theme/components/index.d.ts

@@ -1,4 +1,5 @@
 export { default as Badge } from './badge';
 export { default as Button } from './button';
+export { default as Drawer } from './drawer';
 export { default as Input } from './input';
 export { default as Tag } from './tag';

package/dist/esm/types/theme/foundations/index.d.ts

@@ -1,4 +1,24 @@
 declare const foundations: {
+    sizes: {
+        max: string;
+        min: string;
+        full: string;
+        '3xs': string;
+        '2xs': string;
+        xs: string;
+        nav: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+        '2xl': string;
+        '3xl': string;
+        '4xl': string;
+        '5xl': string;
+        '6xl': string;
+        '7xl': string;
+        '8xl': string;
+    };
     shadows: {
         xs: string;
         sm: string;
@@ -9,6 +29,17 @@ declare const foundations: {
         '2xl': string;
         layout: string;
     };
+    radii: {
+        none: string;
+        sm: string;
+        base: string;
+        md: string;
+        lg: string;
+        xl: string;
+        '2xl': string;
+        '3xl': string;
+        full: string;
+    };
     fonts: {
         heading: string;
         body: string;

package/dist/esm/types/theme/foundations/radius.d.ts

@@ -0,0 +1,11 @@
+export declare const radii: {
+    none: string;
+    sm: string;
+    base: string;
+    md: string;
+    lg: string;
+    xl: string;
+    '2xl': string;
+    '3xl': string;
+    full: string;
+};

package/dist/esm/types/theme/foundations/sizes.d.ts

@@ -0,0 +1,21 @@
+declare const _default: {
+    max: string;
+    min: string;
+    full: string;
+    '3xs': string;
+    '2xs': string;
+    xs: string;
+    nav: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+    '2xl': string;
+    '3xl': string;
+    '4xl': string;
+    '5xl': string;
+    '6xl': string;
+    '7xl': string;
+    '8xl': string;
+};
+export default _default;

package/dist/esm/types/theme/rawStyle/chakraStyle.d.ts

@@ -0,0 +1,2 @@
+import { Styles } from '@chakra-ui/theme-tools';
+export declare const chakraStyle: Styles['global'];

package/dist/esm/types/theme/{externals → rawStyle}/index.d.ts

@@ -1 +1,2 @@
+export { chakraStyle } from './chakraStyle';
 export { reactDayPicker } from './reactDayPicker';

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

@@ -0,0 +1,2 @@
+export * from './date';
+export * from './responsive';

package/dist/esm/types/utils/responsive.d.ts

@@ -0,0 +1 @@
+export declare const useIsMobile: (currentBreakpoint: string) => boolean;

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
-import React, { FC, ReactNode, Dispatch, SetStateAction, ReactComponentElement } from 'react';
+import React, { FC, PropsWithChildren, ReactNode, Dispatch, SetStateAction, ReactComponentElement } from 'react';
 import * as _chakra_ui_react from '@chakra-ui/react';
-import { IconButtonProps, FlexProps, AccordionProps, FormControlProps, PopoverProps, InputProps, StackProps, BoxProps } from '@chakra-ui/react';
+import { IconButtonProps, FlexProps, HTMLChakraProps, MenuItemProps, AccordionProps, FormControlProps, PopoverProps, InputProps, StackProps, BoxProps, DrawerContentProps, ButtonProps } from '@chakra-ui/react';
 import { DayPickerProps, DaySelectionMode, DayPickerSingleProps } from 'react-day-picker';
 import * as react_select_dist_declarations_src_useStateManager from 'react-select/dist/declarations/src/useStateManager';
 import * as react_select from 'react-select';
@@ -13,7 +13,20 @@ import * as react_select_dist_declarations_src_Select from 'react-select/dist/de
 declare type ActionsButtonProps = Omit<IconButtonProps, 'aria-label'> & {
     label: string;
 };
-declare const ActionsButton: FC<React.PropsWithChildren<ActionsButtonProps>>;
+declare const ActionsButton: FC<PropsWithChildren<ActionsButtonProps>>;
+
+declare const Card: (props: FlexProps) => JSX.Element;
+
+declare type StyledMenuItemProps = HTMLChakraProps<'button'>;
+declare const MenuItem: _chakra_ui_react.ComponentWithAs<"button", MenuItemProps>;
+declare type ConfirmMenuItemProps = MenuItemProps & {
+    confirmDelay?: number;
+    confirmColorScheme?: string;
+    confirmContent?: React.ReactNode;
+    confirmText?: React.ReactNode;
+    confirmIcon?: React.FC<React.PropsWithChildren<unknown>>;
+};
+declare const ConfirmMenuItem: _chakra_ui_react.ComponentWithAs<"button", ConfirmMenuItemProps>;
 
 declare type DataListColumns = Record<string, DataListCellProps>;
 declare type DataListContextValue = {
@@ -45,15 +58,15 @@ declare type DataListRowProps = FlexProps & {
     isVisible?: boolean | boolean[] | Record<string, boolean>;
     isDisabled?: boolean;
 };
-declare const DataListRow: FC<React.PropsWithChildren<DataListRowProps>>;
+declare const DataListRow: FC<PropsWithChildren<DataListRowProps>>;
 declare type DataListHeaderProps = DataListRowProps;
-declare const DataListHeader: FC<React.PropsWithChildren<DataListHeaderProps>>;
+declare const DataListHeader: FC<PropsWithChildren<DataListHeaderProps>>;
 declare type DataListFooterProps = DataListRowProps;
-declare const DataListFooter: FC<React.PropsWithChildren<DataListFooterProps>>;
+declare const DataListFooter: FC<PropsWithChildren<DataListFooterProps>>;
 declare type DataListProps = AccordionProps & {
     isHover?: boolean;
 };
-declare const DataList: FC<React.PropsWithChildren<DataListProps>>;
+declare const DataList: FC<PropsWithChildren<DataListProps>>;
 
 declare const DayPicker: (props: DayPickerProps) => JSX.Element;
 
@@ -108,10 +121,10 @@ declare type PaginationContextValue<PageType = number> = {
     lastItemOnPage: number;
 };
 declare const PaginationContext: React.Context<PaginationContextValue<number>>;
-declare const PaginationButtonFirstPage: FC<React.PropsWithChildren<Omit<IconButtonProps, 'aria-label'>>>;
-declare const PaginationButtonPrevPage: FC<React.PropsWithChildren<Omit<IconButtonProps, 'aria-label'>>>;
-declare const PaginationButtonLastPage: FC<React.PropsWithChildren<Omit<IconButtonProps, 'aria-label'>>>;
-declare const PaginationButtonNextPage: FC<React.PropsWithChildren<Omit<IconButtonProps, 'aria-label'>>>;
+declare const PaginationButtonFirstPage: FC<PropsWithChildren<Omit<IconButtonProps, 'aria-label'>>>;
+declare const PaginationButtonPrevPage: FC<PropsWithChildren<Omit<IconButtonProps, 'aria-label'>>>;
+declare const PaginationButtonLastPage: FC<PropsWithChildren<Omit<IconButtonProps, 'aria-label'>>>;
+declare const PaginationButtonNextPage: FC<PropsWithChildren<Omit<IconButtonProps, 'aria-label'>>>;
 declare const PaginationInfo: ({ ...rest }: {
     [x: string]: any;
 }) => JSX.Element;
@@ -248,15 +261,38 @@ declare const Select: <Option, IsMulti extends boolean = false, Group extends Gr
     tabSelectsValue?: boolean | undefined;
 } & {}> & react_select_dist_declarations_src_useStateManager.StateManagerAdditionalProps<Option> & Omit<BoxProps, "defaultValue"> & React.RefAttributes<HTMLElement>) => React.ReactElement | null;
 
+declare const BottomBar: (props: FlexProps) => JSX.Element;
+
+declare const LayoutContainer: (props: FlexProps) => JSX.Element;
+
+declare type SideNavProps = {
+    isMobileMenuOpen: boolean;
+    onMobileMenuClose: () => void;
+} & FlexProps & DrawerContentProps;
+declare type SideNavMenuItemProps = {
+    isActive?: boolean;
+} & ButtonProps;
+declare const SideNav: ({ isMobileMenuOpen, onMobileMenuClose, children, ...props }: SideNavProps) => JSX.Element;
+declare const SideNavContainer: (props: StackProps) => JSX.Element;
+declare const SideNavHeader: ({ children, ...rest }: FlexProps) => JSX.Element;
+declare const SideNavBody: ({ children, ...rest }: StackProps) => JSX.Element;
+declare const SideNavFooter: ({ children, ...rest }: FlexProps) => JSX.Element;
+declare const SideNavMenu: ({ title, children, ...rest }: StackProps) => JSX.Element;
+declare const SideNavMenuItem: ({ isActive, children, ...rest }: SideNavMenuItemProps) => JSX.Element;
+
 declare type TopBarBackActionProps = {
     backAction?: () => void;
     rightInformation?: ReactComponentElement<any>;
 } & FlexProps;
-declare const TopBar: ({ ...props }: StackProps) => JSX.Element;
-declare const TopBarFirstElement: ({ ...props }: FlexProps) => JSX.Element;
-declare const TopBarLastElement: ({ ...props }: StackProps) => JSX.Element;
+declare const TopBar: (props: StackProps) => JSX.Element;
+declare const TopBarFirstElement: (props: FlexProps) => JSX.Element;
+declare const TopBarLastElement: (props: StackProps) => JSX.Element;
 declare const TopBarBackAction: ({ backAction, title, rightInformation, ...rest }: TopBarBackActionProps) => JSX.Element;
 
 declare const theme: any;
 
-export { ActionsButton, ActionsButtonProps, DataList, DataListAccordion, DataListAccordionButton, DataListAccordionIcon, DataListAccordionPanel, DataListCell, DataListCellProps, DataListContext, DataListFooter, DataListFooterProps, DataListHeader, DataListHeaderContext, DataListHeaderProps, DataListProps, DataListRow, DataListRowProps, DayPicker, FormGroup, FormGroupProps, InputDayPicker, InputDayPickerProps, Pagination, PaginationButtonFirstPage, PaginationButtonLastPage, PaginationButtonNextPage, PaginationButtonPrevPage, PaginationContext, PaginationContextValue, PaginationInfo, PaginationProps, SearchInput, Select, SelectProps, SingleDayPickerProps, TopBar, TopBarBackAction, TopBarBackActionProps, TopBarFirstElement, TopBarLastElement, getPaginationInfo, theme };
+declare const dateFormat = "dd/MM/yyyy";
+
+declare const useIsMobile: (currentBreakpoint: string) => boolean;
+
+export { ActionsButton, ActionsButtonProps, BottomBar, Card, ConfirmMenuItem, DataList, DataListAccordion, DataListAccordionButton, DataListAccordionIcon, DataListAccordionPanel, DataListCell, DataListCellProps, DataListContext, DataListFooter, DataListFooterProps, DataListHeader, DataListHeaderContext, DataListHeaderProps, DataListProps, DataListRow, DataListRowProps, DayPicker, FormGroup, FormGroupProps, InputDayPicker, InputDayPickerProps, LayoutContainer, MenuItem, Pagination, PaginationButtonFirstPage, PaginationButtonLastPage, PaginationButtonNextPage, PaginationButtonPrevPage, PaginationContext, PaginationContextValue, PaginationInfo, PaginationProps, SearchInput, Select, SelectProps, SideNav, SideNavBody, SideNavContainer, SideNavFooter, SideNavHeader, SideNavMenu, SideNavMenuItem, SideNavMenuItemProps, SideNavProps, SingleDayPickerProps, StyledMenuItemProps, TopBar, TopBarBackAction, TopBarBackActionProps, TopBarFirstElement, TopBarLastElement, dateFormat, getPaginationInfo, theme, useIsMobile };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@paygreen/pgui",
-  "version": "2.1.3",
+  "version": "2.2.0",
   "description": "PGUI is the design system coming from Paygreen.",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",