@paygreen/pgui 2.14.10 → 3.0.0-beta

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (155) hide show
  1. package/README.md +125 -59
  2. package/dist/components/actions-button/actions-button.d.ts +20 -0
  3. package/dist/components/data-list/datalist.d.ts +88 -0
  4. package/dist/components/data-table/data-table.d.ts +67 -0
  5. package/dist/components/date-picker/date-picker.d.ts +44 -0
  6. package/dist/components/field-wrapper/field-wrapper.d.ts +50 -0
  7. package/dist/components/index.d.ts +15 -0
  8. package/dist/components/input/input.d.ts +24 -0
  9. package/dist/components/input-mask/input-mask.d.ts +27 -0
  10. package/dist/components/input-phone/input-phone.d.ts +62 -0
  11. package/dist/components/input-phone/partials/search-on-list.d.ts +61 -0
  12. package/dist/components/loader/loader.d.ts +23 -0
  13. package/dist/components/logos/logoPaygreenByLemonway.d.ts +26 -0
  14. package/dist/components/modal/modal.d.ts +42 -0
  15. package/dist/components/pagination/pagination.d.ts +31 -0
  16. package/dist/components/select/select.d.ts +44 -0
  17. package/dist/components/sidebar/sidebar.d.ts +103 -0
  18. package/dist/components/ui/color-mode.d.ts +21 -0
  19. package/dist/hooks/scroll-shadow.d.ts +7 -0
  20. package/dist/hooks/use-data-table.d.ts +12 -0
  21. package/dist/index.d.ts +2 -352
  22. package/dist/index.js +48 -0
  23. package/dist/index.mjs +8355 -0
  24. package/dist/pgui.css +1 -0
  25. package/dist/theme/index.d.ts +1 -0
  26. package/dist/theme/recipes/card-recipe.d.ts +18 -0
  27. package/dist/theme/recipes/index.d.ts +21 -0
  28. package/dist/theme/recipes/text-recipe.d.ts +2 -0
  29. package/dist/theme/semanticTokens/colors.d.ts +46 -0
  30. package/dist/theme/semanticTokens/index.d.ts +48 -0
  31. package/dist/theme/tokens/colors.d.ts +35 -0
  32. package/dist/theme/tokens/font-sizes.d.ts +42 -0
  33. package/dist/theme/tokens/fonts.d.ts +12 -0
  34. package/dist/theme/tokens/gradients.d.ts +6 -0
  35. package/dist/theme/tokens/index.d.ts +188 -0
  36. package/dist/theme/tokens/radii.d.ts +39 -0
  37. package/dist/theme/tokens/sizes.d.ts +57 -0
  38. package/package.json +94 -103
  39. package/src/components/date-picker/date-picker.css +206 -0
  40. package/src/components/select/select.css +75 -0
  41. package/src/styles/index.css +12 -0
  42. package/dist/cjs/index.js +0 -60887
  43. package/dist/cjs/index.js.map +0 -1
  44. package/dist/cjs/types/components/ActionsButton/index.d.ts +0 -6
  45. package/dist/cjs/types/components/Card/index.d.ts +0 -3
  46. package/dist/cjs/types/components/ConfirmMenuItem/index.d.ts +0 -13
  47. package/dist/cjs/types/components/DataList/index.d.ts +0 -42
  48. package/dist/cjs/types/components/FormGroup/index.d.ts +0 -12
  49. package/dist/cjs/types/components/InputDayPicker/index.d.ts +0 -20
  50. package/dist/cjs/types/components/InputPhone/SearchOnList.d.ts +0 -19
  51. package/dist/cjs/types/components/InputPhone/index.d.ts +0 -12
  52. package/dist/cjs/types/components/InputRangePicker/index.d.ts +0 -25
  53. package/dist/cjs/types/components/ModalResponsive/index.d.ts +0 -5
  54. package/dist/cjs/types/components/Pagination/index.d.ts +0 -43
  55. package/dist/cjs/types/components/SearchInput/index.d.ts +0 -12
  56. package/dist/cjs/types/components/Select/index.d.ts +0 -120
  57. package/dist/cjs/types/components/Textarea/index.d.ts +0 -8
  58. package/dist/cjs/types/components/index.d.ts +0 -12
  59. package/dist/cjs/types/hooks/useClickOutside.d.ts +0 -3
  60. package/dist/cjs/types/index.d.ts +0 -4
  61. package/dist/cjs/types/layout/BottomBar/index.d.ts +0 -3
  62. package/dist/cjs/types/layout/LayoutContainer/index.d.ts +0 -3
  63. package/dist/cjs/types/layout/SideNav/index.d.ts +0 -21
  64. package/dist/cjs/types/layout/TopBar/index.d.ts +0 -10
  65. package/dist/cjs/types/layout/index.d.ts +0 -4
  66. package/dist/cjs/types/theme/components/alert.d.ts +0 -9
  67. package/dist/cjs/types/theme/components/badge.d.ts +0 -9
  68. package/dist/cjs/types/theme/components/button.d.ts +0 -163
  69. package/dist/cjs/types/theme/components/checkbox.d.ts +0 -11
  70. package/dist/cjs/types/theme/components/drawer.d.ts +0 -6
  71. package/dist/cjs/types/theme/components/form.d.ts +0 -8
  72. package/dist/cjs/types/theme/components/index.d.ts +0 -16
  73. package/dist/cjs/types/theme/components/input.d.ts +0 -58
  74. package/dist/cjs/types/theme/components/menu.d.ts +0 -9
  75. package/dist/cjs/types/theme/components/number-input.d.ts +0 -54
  76. package/dist/cjs/types/theme/components/pin-input.d.ts +0 -42
  77. package/dist/cjs/types/theme/components/radio.d.ts +0 -6
  78. package/dist/cjs/types/theme/components/slider.d.ts +0 -6
  79. package/dist/cjs/types/theme/components/switch.d.ts +0 -6
  80. package/dist/cjs/types/theme/components/tag.d.ts +0 -14
  81. package/dist/cjs/types/theme/components/textarea.d.ts +0 -54
  82. package/dist/cjs/types/theme/components/tooltip.d.ts +0 -8
  83. package/dist/cjs/types/theme/foundations/colors.d.ts +0 -66
  84. package/dist/cjs/types/theme/foundations/index.d.ts +0 -129
  85. package/dist/cjs/types/theme/foundations/radius.d.ts +0 -11
  86. package/dist/cjs/types/theme/foundations/shadows.d.ts +0 -10
  87. package/dist/cjs/types/theme/foundations/sizes.d.ts +0 -21
  88. package/dist/cjs/types/theme/foundations/typography.d.ts +0 -21
  89. package/dist/cjs/types/theme/index.d.ts +0 -1
  90. package/dist/cjs/types/theme/rawStyle/chakraStyle.d.ts +0 -2
  91. package/dist/cjs/types/theme/rawStyle/index.d.ts +0 -3
  92. package/dist/cjs/types/theme/rawStyle/reactDayPicker.d.ts +0 -23
  93. package/dist/cjs/types/theme/rawStyle/scrollbarStyles.d.ts +0 -11
  94. package/dist/cjs/types/theme/styles.d.ts +0 -2
  95. package/dist/cjs/types/theme/theme.d.ts +0 -1
  96. package/dist/cjs/types/utils/date.d.ts +0 -1
  97. package/dist/cjs/types/utils/index.d.ts +0 -2
  98. package/dist/cjs/types/utils/responsive.d.ts +0 -1
  99. package/dist/esm/index.js +0 -60814
  100. package/dist/esm/index.js.map +0 -1
  101. package/dist/esm/types/components/ActionsButton/index.d.ts +0 -6
  102. package/dist/esm/types/components/Card/index.d.ts +0 -3
  103. package/dist/esm/types/components/ConfirmMenuItem/index.d.ts +0 -13
  104. package/dist/esm/types/components/DataList/index.d.ts +0 -42
  105. package/dist/esm/types/components/FormGroup/index.d.ts +0 -12
  106. package/dist/esm/types/components/InputDayPicker/index.d.ts +0 -20
  107. package/dist/esm/types/components/InputPhone/SearchOnList.d.ts +0 -19
  108. package/dist/esm/types/components/InputPhone/index.d.ts +0 -12
  109. package/dist/esm/types/components/InputRangePicker/index.d.ts +0 -25
  110. package/dist/esm/types/components/ModalResponsive/index.d.ts +0 -5
  111. package/dist/esm/types/components/Pagination/index.d.ts +0 -43
  112. package/dist/esm/types/components/SearchInput/index.d.ts +0 -12
  113. package/dist/esm/types/components/Select/index.d.ts +0 -120
  114. package/dist/esm/types/components/Textarea/index.d.ts +0 -8
  115. package/dist/esm/types/components/index.d.ts +0 -12
  116. package/dist/esm/types/hooks/useClickOutside.d.ts +0 -3
  117. package/dist/esm/types/index.d.ts +0 -4
  118. package/dist/esm/types/layout/BottomBar/index.d.ts +0 -3
  119. package/dist/esm/types/layout/LayoutContainer/index.d.ts +0 -3
  120. package/dist/esm/types/layout/SideNav/index.d.ts +0 -21
  121. package/dist/esm/types/layout/TopBar/index.d.ts +0 -10
  122. package/dist/esm/types/layout/index.d.ts +0 -4
  123. package/dist/esm/types/theme/components/alert.d.ts +0 -9
  124. package/dist/esm/types/theme/components/badge.d.ts +0 -9
  125. package/dist/esm/types/theme/components/button.d.ts +0 -163
  126. package/dist/esm/types/theme/components/checkbox.d.ts +0 -11
  127. package/dist/esm/types/theme/components/drawer.d.ts +0 -6
  128. package/dist/esm/types/theme/components/form.d.ts +0 -8
  129. package/dist/esm/types/theme/components/index.d.ts +0 -16
  130. package/dist/esm/types/theme/components/input.d.ts +0 -58
  131. package/dist/esm/types/theme/components/menu.d.ts +0 -9
  132. package/dist/esm/types/theme/components/number-input.d.ts +0 -54
  133. package/dist/esm/types/theme/components/pin-input.d.ts +0 -42
  134. package/dist/esm/types/theme/components/radio.d.ts +0 -6
  135. package/dist/esm/types/theme/components/slider.d.ts +0 -6
  136. package/dist/esm/types/theme/components/switch.d.ts +0 -6
  137. package/dist/esm/types/theme/components/tag.d.ts +0 -14
  138. package/dist/esm/types/theme/components/textarea.d.ts +0 -54
  139. package/dist/esm/types/theme/components/tooltip.d.ts +0 -8
  140. package/dist/esm/types/theme/foundations/colors.d.ts +0 -66
  141. package/dist/esm/types/theme/foundations/index.d.ts +0 -129
  142. package/dist/esm/types/theme/foundations/radius.d.ts +0 -11
  143. package/dist/esm/types/theme/foundations/shadows.d.ts +0 -10
  144. package/dist/esm/types/theme/foundations/sizes.d.ts +0 -21
  145. package/dist/esm/types/theme/foundations/typography.d.ts +0 -21
  146. package/dist/esm/types/theme/index.d.ts +0 -1
  147. package/dist/esm/types/theme/rawStyle/chakraStyle.d.ts +0 -2
  148. package/dist/esm/types/theme/rawStyle/index.d.ts +0 -3
  149. package/dist/esm/types/theme/rawStyle/reactDayPicker.d.ts +0 -23
  150. package/dist/esm/types/theme/rawStyle/scrollbarStyles.d.ts +0 -11
  151. package/dist/esm/types/theme/styles.d.ts +0 -2
  152. package/dist/esm/types/theme/theme.d.ts +0 -1
  153. package/dist/esm/types/utils/date.d.ts +0 -1
  154. package/dist/esm/types/utils/index.d.ts +0 -2
  155. package/dist/esm/types/utils/responsive.d.ts +0 -1
package/dist/index.d.ts CHANGED
@@ -1,352 +1,2 @@
1
- import React, { FC, PropsWithChildren, ReactNode, Dispatch, SetStateAction, ReactComponentElement } from 'react';
2
- import { IconButtonProps, CardProps, HTMLChakraProps, MenuItemProps, FlexProps, AccordionProps, FormControlProps, ModalProps, DrawerProps, StackProps, InputProps, BoxProps, DrawerContentProps, ButtonProps, TextProps } from '@chakra-ui/react';
3
- import * as _chakra_ui_system_dist_system_types from '@chakra-ui/system/dist/system.types';
4
- import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.js';
5
- import * as react_select_dist_declarations_src_useStateManager from 'react-select/dist/declarations/src/useStateManager';
6
- import * as react_select_dist_declarations_src_filters from 'react-select/dist/declarations/src/filters';
7
- import * as react_select from 'react-select';
8
- import { GroupBase, Props } from 'react-select';
9
- import * as react_select_dist_declarations_src_components from 'react-select/dist/declarations/src/components';
10
- import * as react_select_dist_declarations_src_Select from 'react-select/dist/declarations/src/Select';
11
-
12
- type ActionsButtonProps = Omit<IconButtonProps, 'aria-label'> & {
13
- label: string;
14
- };
15
- declare const ActionsButton: FC<PropsWithChildren<ActionsButtonProps>>;
16
-
17
- declare const Card: (props: CardProps) => React.JSX.Element;
18
-
19
- type StyledMenuItemProps = HTMLChakraProps<'button'>;
20
- declare const MenuItem: _chakra_ui_system_dist_system_types.ComponentWithAs<"button", MenuItemProps>;
21
- type ConfirmMenuItemProps = MenuItemProps & {
22
- confirmDelay?: number;
23
- confirmColorScheme?: string;
24
- confirmContent?: React.ReactNode;
25
- confirmText?: React.ReactNode;
26
- confirmIcon?: React.FC<React.PropsWithChildren<unknown>>;
27
- };
28
- declare const ConfirmMenuItem: _chakra_ui_system_dist_system_types.ComponentWithAs<"button", ConfirmMenuItemProps>;
29
-
30
- type DataListColumns = Record<string, DataListCellProps>;
31
- type DataListContextValue = {
32
- setColumns: React.Dispatch<React.SetStateAction<DataListColumns>>;
33
- columns: DataListColumns;
34
- isHover: boolean;
35
- };
36
- declare const DataListContext: React.Context<DataListContextValue>;
37
- declare const DataListHeaderContext: React.Context<boolean>;
38
- type DataListCellProps = FlexProps & {
39
- colName?: string;
40
- colWidth?: string | number | Record<string, string | number>;
41
- isVisible?: boolean | boolean[] | Record<string, boolean>;
42
- };
43
- declare const DataListCell: ({ children, colName, colWidth, isVisible, ...rest }: DataListCellProps) => React.JSX.Element | null;
44
- declare const DataListAccordion: ({ ...rest }: {
45
- [x: string]: any;
46
- }) => React.JSX.Element;
47
- declare const DataListAccordionButton: ({ ...rest }: {
48
- [x: string]: any;
49
- }) => React.JSX.Element;
50
- declare const DataListAccordionIcon: ({ ...rest }: {
51
- [x: string]: any;
52
- }) => React.JSX.Element;
53
- declare const DataListAccordionPanel: ({ ...rest }: {
54
- [x: string]: any;
55
- }) => React.JSX.Element;
56
- type DataListRowProps = FlexProps & {
57
- isVisible?: boolean | boolean[] | Record<string, boolean>;
58
- isDisabled?: boolean;
59
- };
60
- declare const DataListRow: FC<PropsWithChildren<DataListRowProps>>;
61
- type DataListHeaderProps = DataListRowProps;
62
- declare const DataListHeader: FC<PropsWithChildren<DataListHeaderProps>>;
63
- type DataListFooterProps = DataListRowProps;
64
- declare const DataListFooter: FC<PropsWithChildren<DataListFooterProps>>;
65
- type DataListProps = AccordionProps & {
66
- isHover?: boolean;
67
- };
68
- declare const DataList: FC<PropsWithChildren<DataListProps>>;
69
-
70
- type FormGroupProps = Omit<FormControlProps, 'onChange' | 'defaultValue' | 'label'> & {
71
- children?: ReactNode;
72
- errorMessage?: ReactNode;
73
- helper?: ReactNode;
74
- id?: string;
75
- isRequired?: boolean;
76
- label?: ReactNode;
77
- showError?: boolean;
78
- };
79
- declare const FormGroup: ({ children, errorMessage, helper, id, isRequired, label, showError, ...props }: FormGroupProps) => React.JSX.Element;
80
-
81
- type InputDayPickerProps = {
82
- name: string;
83
- placeholder?: string;
84
- onChange: Dispatch<SetStateAction<Date | null>>;
85
- value: Date | null;
86
- locale?: 'fr' | 'en';
87
- variant?: 'filled' | 'outline';
88
- withTime?: boolean;
89
- minDate?: Date | null | undefined;
90
- maxDate?: Date | null | undefined;
91
- isDisabled?: boolean;
92
- inputProps?: any;
93
- dayPickerProps?: any;
94
- isOpen?: boolean;
95
- onOpen?: () => void;
96
- onClose?: () => void;
97
- };
98
- declare const InputDayPicker: ({ value, onChange, placeholder, name, isDisabled, withTime, locale, minDate, maxDate, variant, inputProps, dayPickerProps, isOpen: isOpenProp, onOpen: onOpenProp, onClose: onCloseProp, }: InputDayPickerProps) => React.JSX.Element;
99
-
100
- var css_248z = "/* CSS variables. */\r\n:root {\r\n\t--PhoneInput-color--focus: #03b2cb;\r\n\t--PhoneInputInternationalIconPhone-opacity: 0.8;\r\n\t--PhoneInputInternationalIconGlobe-opacity: 0.65;\r\n\t--PhoneInputCountrySelect-marginRight: 0.35em;\r\n\t--PhoneInputCountrySelectArrow-width: 0.3em;\r\n\t--PhoneInputCountrySelectArrow-marginLeft: var(--PhoneInputCountrySelect-marginRight);\r\n\t--PhoneInputCountrySelectArrow-borderWidth: 1px;\r\n\t--PhoneInputCountrySelectArrow-opacity: 0.45;\r\n\t--PhoneInputCountrySelectArrow-color: currentColor;\r\n\t--PhoneInputCountrySelectArrow-color--focus: var(--PhoneInput-color--focus);\r\n\t--PhoneInputCountrySelectArrow-transform: rotate(45deg);\r\n\t--PhoneInputCountryFlag-aspectRatio: 1.5;\r\n\t--PhoneInputCountryFlag-height: 1em;\r\n\t--PhoneInputCountryFlag-borderWidth: 1px;\r\n\t--PhoneInputCountryFlag-borderColor: rgba(0,0,0,0.5);\r\n\t--PhoneInputCountryFlag-borderColor--focus: var(--PhoneInput-color--focus);\r\n\t--PhoneInputCountryFlag-backgroundColor--loading: rgba(0,0,0,0.1);\r\n}\r\n\r\n.PhoneInput {\r\n\t/* This is done to stretch the contents of this component. */\r\n\tdisplay: flex;\r\n\talign-items: center;\r\n}\r\n\r\n.PhoneInputInput {\r\n\t/* The phone number input stretches to fill all empty space */\r\n\tflex: 1;\r\n\t/* The phone number input should shrink\r\n\t to make room for the extension input */\r\n\tmin-width: 0;\r\n}\r\n\r\n.PhoneInputCountryIcon {\r\n\twidth: calc(var(--PhoneInputCountryFlag-height) * var(--PhoneInputCountryFlag-aspectRatio));\r\n\theight: var(--PhoneInputCountryFlag-height);\r\n}\r\n\r\n.PhoneInputCountryIcon--square {\r\n\twidth: var(--PhoneInputCountryFlag-height);\r\n}\r\n\r\n.PhoneInputCountryIcon--border {\r\n\t/* Removed `background-color` because when an `<img/>` was still loading\r\n\t it would show a dark gray rectangle. */\r\n\t/* For some reason the `<img/>` is not stretched to 100% width and height\r\n\t and sometime there can be seen white pixels of the background at top and bottom. */\r\n\tbackground-color: var(--PhoneInputCountryFlag-backgroundColor--loading);\r\n\t/* Border is added via `box-shadow` because `border` interferes with `width`/`height`. */\r\n\t/* For some reason the `<img/>` is not stretched to 100% width and height\r\n\t and sometime there can be seen white pixels of the background at top and bottom,\r\n\t so an additional \"inset\" border is added. */\r\n\tbox-shadow: 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor),\r\n\t\tinset 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor);\r\n}\r\n\r\n.PhoneInputCountryIconImg {\r\n\t/* Fixes weird vertical space above the flag icon. */\r\n\t/* https://gitlab.com/catamphetamine/react-phone-number-input/-/issues/7#note_348586559 */\r\n\tdisplay: block;\r\n\t/* 3rd party <SVG/> flag icons won't stretch if they have `width` and `height`.\r\n\t Also, if an <SVG/> icon's aspect ratio was different, it wouldn't fit too. */\r\n\twidth: 100%;\r\n\theight: 100%;\r\n}\r\n\r\n.PhoneInputInternationalIconPhone {\r\n\topacity: var(--PhoneInputInternationalIconPhone-opacity);\r\n}\r\n\r\n.PhoneInputInternationalIconGlobe {\r\n\topacity: var(--PhoneInputInternationalIconGlobe-opacity);\r\n}\r\n\r\n/* Styling native country `<select/>`. */\r\n\r\n.PhoneInputCountry {\r\n\tposition: relative;\r\n\talign-self: stretch;\r\n\tdisplay: flex;\r\n\talign-items: center;\r\n\tmargin-right: var(--PhoneInputCountrySelect-marginRight);\r\n}\r\n\r\n.PhoneInputCountrySelect {\r\n\tposition: absolute;\r\n\ttop: 0;\r\n\tleft: 0;\r\n\theight: 100%;\r\n\twidth: 100%;\r\n\tz-index: 1;\r\n\tborder: 0;\r\n\topacity: 0;\r\n\tcursor: pointer;\r\n}\r\n\r\n.PhoneInputCountrySelect[disabled],\r\n.PhoneInputCountrySelect[readonly] {\r\n\tcursor: default;\r\n}\r\n\r\n.PhoneInputCountrySelectArrow {\r\n\tdisplay: block;\r\n\tcontent: '';\r\n\twidth: var(--PhoneInputCountrySelectArrow-width);\r\n\theight: var(--PhoneInputCountrySelectArrow-width);\r\n\tmargin-left: var(--PhoneInputCountrySelectArrow-marginLeft);\r\n\tborder-style: solid;\r\n\tborder-color: var(--PhoneInputCountrySelectArrow-color);\r\n\tborder-top-width: 0;\r\n\tborder-bottom-width: var(--PhoneInputCountrySelectArrow-borderWidth);\r\n\tborder-left-width: 0;\r\n\tborder-right-width: var(--PhoneInputCountrySelectArrow-borderWidth);\r\n\ttransform: var(--PhoneInputCountrySelectArrow-transform);\r\n\topacity: var(--PhoneInputCountrySelectArrow-opacity);\r\n}\r\n\r\n.PhoneInputCountrySelect:focus + .PhoneInputCountryIcon + .PhoneInputCountrySelectArrow {\r\n\topacity: 1;\r\n\tcolor: var(--PhoneInputCountrySelectArrow-color--focus);\r\n}\r\n\r\n.PhoneInputCountrySelect:focus + .PhoneInputCountryIcon--border {\r\n\tbox-shadow: 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor--focus),\r\n\t\tinset 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor--focus);\r\n}\r\n\r\n.PhoneInputCountrySelect:focus + .PhoneInputCountryIcon .PhoneInputInternationalIconGlobe {\r\n\topacity: 1;\r\n\tcolor: var(--PhoneInputCountrySelectArrow-color--focus);\r\n}";
101
- styleInject(css_248z);
102
-
103
- type InputPhoneProps = {
104
- locale?: string;
105
- value?: string;
106
- placeholder?: string;
107
- isDisabled?: boolean;
108
- inputProps?: object;
109
- };
110
- declare const isValidPhone: (val: string) => boolean;
111
- declare const formatPhoneIntl: (val: string) => string;
112
- declare const InputPhone: ({ locale, value, placeholder, isDisabled, inputProps, ...props }: InputPhoneProps) => React.JSX.Element;
113
-
114
- type InputRangePickerProps = {
115
- name: string;
116
- placeholder?: string;
117
- onChange: Dispatch<SetStateAction<{
118
- from: Date | null;
119
- to: Date | null;
120
- } | null>>;
121
- value?: {
122
- from: Date | null;
123
- to: Date | null;
124
- } | null;
125
- locale?: 'fr' | 'en';
126
- variant?: 'filled' | 'outline';
127
- withTime?: boolean;
128
- minStartDate?: Date | null | undefined;
129
- maxStartDate?: Date | null | undefined;
130
- minEndDate?: Date | null | undefined;
131
- maxEndDate?: Date | null | undefined;
132
- isDisabled?: boolean;
133
- breakpoint?: 'base' | 'sm' | 'md' | 'lg';
134
- inputProps?: any;
135
- dayPickerProps?: any;
136
- };
137
- declare const InputRangePicker: ({ value, onChange, placeholder, name, isDisabled, withTime, locale, minStartDate, maxStartDate, minEndDate, maxEndDate, variant, breakpoint, inputProps, dayPickerProps, }: InputRangePickerProps) => React.JSX.Element;
138
-
139
- type ModalResponsiveProps = ModalProps & DrawerProps;
140
- declare const ModalResponsive: ({ isOpen, onClose, finalFocusRef, children, ...rest }: ModalResponsiveProps) => React.JSX.Element;
141
-
142
- declare const getPaginationInfo: ({ page, pageSize, totalItems, }: {
143
- page?: number | undefined;
144
- pageSize?: number | undefined;
145
- totalItems?: number | undefined;
146
- }) => {
147
- firstPage: number;
148
- lastPage: number;
149
- firstItemOnPage: number;
150
- lastItemOnPage: number;
151
- isFirstPage: boolean;
152
- isLastPage: boolean;
153
- };
154
- type PaginationContextValue<PageType = number> = {
155
- page: PageType;
156
- setPage: (page: PageType) => void;
157
- firstPage: PageType;
158
- isFirstPage: boolean;
159
- lastPage: PageType;
160
- isLastPage: boolean;
161
- totalItems: number;
162
- isLoadingPage: boolean;
163
- pageSize: number;
164
- firstItemOnPage: number;
165
- lastItemOnPage: number;
166
- };
167
- declare const PaginationContext: React.Context<PaginationContextValue<number>>;
168
- declare const PaginationButtonFirstPage: FC<PropsWithChildren<Omit<IconButtonProps, 'aria-label'>>>;
169
- declare const PaginationButtonPrevPage: FC<PropsWithChildren<Omit<IconButtonProps, 'aria-label'>>>;
170
- declare const PaginationButtonLastPage: FC<PropsWithChildren<Omit<IconButtonProps, 'aria-label'>>>;
171
- declare const PaginationButtonNextPage: FC<PropsWithChildren<Omit<IconButtonProps, 'aria-label'>>>;
172
- declare const PaginationInfo: ({ ...rest }: {
173
- [x: string]: any;
174
- }) => React.JSX.Element;
175
- type PaginationProps = StackProps & {
176
- setPage: (page: number) => void;
177
- page?: number;
178
- pageSize?: number;
179
- totalItems?: number;
180
- isLoadingPage?: boolean;
181
- };
182
- declare const Pagination: ({ setPage, page, pageSize, totalItems, isLoadingPage, children, ...rest }: PaginationProps) => React.JSX.Element;
183
-
184
- type CustomProps = {
185
- value?: string;
186
- defaultValue?: string;
187
- onChange?(value?: string): void;
188
- delay?: number;
189
- clearLabel?: string;
190
- inputProps?: object;
191
- };
192
- type SearchInputProps = Overwrite<InputProps, CustomProps>;
193
- declare const SearchInput: _chakra_ui_system_dist_system_types.ComponentWithAs<"input", SearchInputProps>;
194
-
195
- declare module 'react' {
196
- function forwardRef<T, P = {}>(render: (props: P, ref: React.Ref<T>) => React.ReactElement | null): (props: P & React.RefAttributes<T>) => React.ReactElement | null;
197
- }
198
- type SelectProps<Option, IsMulti extends boolean = false, Group extends GroupBase<Option> = GroupBase<Option>> = {
199
- isAsync?: boolean;
200
- isCreatable?: boolean;
201
- isError?: boolean;
202
- size?: string;
203
- formatCreateLabel?: (inputValue: string) => ReactNode;
204
- loadOptions?: (input: unknown) => TODO;
205
- defaultOptions?: unknown | boolean;
206
- debounceDelay?: number;
207
- variant?: 'filled' | 'outline';
208
- } & Props<Option, IsMulti, Group> & Omit<BoxProps, 'defaultValue'>;
209
- declare const Select: <Option, IsMulti extends boolean = false, Group extends GroupBase<Option> = GroupBase<Option>>(props: {
210
- isAsync?: boolean | undefined;
211
- isCreatable?: boolean | undefined;
212
- isError?: boolean | undefined;
213
- size?: string | undefined;
214
- formatCreateLabel?: ((inputValue: string) => ReactNode) | undefined;
215
- loadOptions?: ((input: unknown) => TODO) | undefined;
216
- defaultOptions?: unknown | boolean;
217
- debounceDelay?: number | undefined;
218
- variant?: "outline" | "filled" | undefined;
219
- } & Omit<Pick<react_select_dist_declarations_src_Select.Props<Option, IsMulti, Group>, "aria-label" | "form" | "name" | "value" | "autoFocus" | "className" | "id" | "aria-errormessage" | "aria-invalid" | "aria-labelledby" | "onFocus" | "onBlur" | "onChange" | "onKeyDown" | "required" | "inputValue" | "ariaLiveMessages" | "classNamePrefix" | "delimiter" | "formatOptionLabel" | "hideSelectedOptions" | "inputId" | "instanceId" | "isClearable" | "isOptionSelected" | "menuPortalTarget" | "onInputChange" | "onMenuOpen" | "onMenuClose" | "onMenuScrollToTop" | "onMenuScrollToBottom" | "theme"> & {
220
- tabIndex?: number | undefined;
221
- 'aria-live'?: "off" | "assertive" | "polite" | undefined;
222
- isLoading?: boolean | undefined;
223
- isDisabled?: boolean | undefined;
224
- components?: Partial<react_select_dist_declarations_src_components.SelectComponents<Option, IsMulti, Group>> | undefined;
225
- placeholder?: React.ReactNode;
226
- options?: react_select.OptionsOrGroups<Option, Group> | undefined;
227
- pageSize?: number | undefined;
228
- backspaceRemovesValue?: boolean | undefined;
229
- blurInputOnSelect?: boolean | undefined;
230
- captureMenuScroll?: boolean | undefined;
231
- classNames?: react_select.ClassNamesConfig<Option, IsMulti, Group> | undefined;
232
- closeMenuOnSelect?: boolean | undefined;
233
- closeMenuOnScroll?: boolean | ((event: Event) => boolean) | undefined;
234
- controlShouldRenderValue?: boolean | undefined;
235
- escapeClearsValue?: boolean | undefined;
236
- filterOption?: ((option: react_select_dist_declarations_src_filters.FilterOptionOption<Option>, inputValue: string) => boolean) | null | undefined;
237
- formatGroupLabel?: ((group: Group) => React.ReactNode) | undefined;
238
- getOptionLabel?: react_select.GetOptionLabel<Option> | undefined;
239
- getOptionValue?: react_select.GetOptionValue<Option> | undefined;
240
- isOptionDisabled?: ((option: Option, selectValue: react_select.Options<Option>) => boolean) | undefined;
241
- isMulti?: IsMulti | undefined;
242
- isRtl?: boolean | undefined;
243
- isSearchable?: boolean | undefined;
244
- loadingMessage?: ((obj: {
245
- inputValue: string;
246
- }) => React.ReactNode) | undefined;
247
- minMenuHeight?: number | undefined;
248
- maxMenuHeight?: number | undefined;
249
- menuIsOpen?: boolean | undefined;
250
- menuPlacement?: react_select.MenuPlacement | undefined;
251
- menuPosition?: react_select.MenuPosition | undefined;
252
- menuShouldBlockScroll?: boolean | undefined;
253
- menuShouldScrollIntoView?: boolean | undefined;
254
- noOptionsMessage?: ((obj: {
255
- inputValue: string;
256
- }) => React.ReactNode) | undefined;
257
- openMenuOnFocus?: boolean | undefined;
258
- openMenuOnClick?: boolean | undefined;
259
- screenReaderStatus?: ((obj: {
260
- count: number;
261
- }) => string) | undefined;
262
- styles?: react_select.StylesConfig<Option, IsMulti, Group> | undefined;
263
- tabSelectsValue?: boolean | undefined;
264
- unstyled?: boolean | undefined;
265
- } & {}, "value" | "onChange" | "inputValue" | "menuIsOpen" | "onInputChange" | "onMenuOpen" | "onMenuClose"> & Partial<Pick<react_select_dist_declarations_src_Select.Props<Option, IsMulti, Group>, "aria-label" | "form" | "name" | "value" | "autoFocus" | "className" | "id" | "aria-errormessage" | "aria-invalid" | "aria-labelledby" | "onFocus" | "onBlur" | "onChange" | "onKeyDown" | "required" | "inputValue" | "ariaLiveMessages" | "classNamePrefix" | "delimiter" | "formatOptionLabel" | "hideSelectedOptions" | "inputId" | "instanceId" | "isClearable" | "isOptionSelected" | "menuPortalTarget" | "onInputChange" | "onMenuOpen" | "onMenuClose" | "onMenuScrollToTop" | "onMenuScrollToBottom" | "theme"> & {
266
- tabIndex?: number | undefined;
267
- 'aria-live'?: "off" | "assertive" | "polite" | undefined;
268
- isLoading?: boolean | undefined;
269
- isDisabled?: boolean | undefined;
270
- components?: Partial<react_select_dist_declarations_src_components.SelectComponents<Option, IsMulti, Group>> | undefined;
271
- placeholder?: React.ReactNode;
272
- options?: react_select.OptionsOrGroups<Option, Group> | undefined;
273
- pageSize?: number | undefined;
274
- backspaceRemovesValue?: boolean | undefined;
275
- blurInputOnSelect?: boolean | undefined;
276
- captureMenuScroll?: boolean | undefined;
277
- classNames?: react_select.ClassNamesConfig<Option, IsMulti, Group> | undefined;
278
- closeMenuOnSelect?: boolean | undefined;
279
- closeMenuOnScroll?: boolean | ((event: Event) => boolean) | undefined;
280
- controlShouldRenderValue?: boolean | undefined;
281
- escapeClearsValue?: boolean | undefined;
282
- filterOption?: ((option: react_select_dist_declarations_src_filters.FilterOptionOption<Option>, inputValue: string) => boolean) | null | undefined;
283
- formatGroupLabel?: ((group: Group) => React.ReactNode) | undefined;
284
- getOptionLabel?: react_select.GetOptionLabel<Option> | undefined;
285
- getOptionValue?: react_select.GetOptionValue<Option> | undefined;
286
- isOptionDisabled?: ((option: Option, selectValue: react_select.Options<Option>) => boolean) | undefined;
287
- isMulti?: IsMulti | undefined;
288
- isRtl?: boolean | undefined;
289
- isSearchable?: boolean | undefined;
290
- loadingMessage?: ((obj: {
291
- inputValue: string;
292
- }) => React.ReactNode) | undefined;
293
- minMenuHeight?: number | undefined;
294
- maxMenuHeight?: number | undefined;
295
- menuIsOpen?: boolean | undefined;
296
- menuPlacement?: react_select.MenuPlacement | undefined;
297
- menuPosition?: react_select.MenuPosition | undefined;
298
- menuShouldBlockScroll?: boolean | undefined;
299
- menuShouldScrollIntoView?: boolean | undefined;
300
- noOptionsMessage?: ((obj: {
301
- inputValue: string;
302
- }) => React.ReactNode) | undefined;
303
- openMenuOnFocus?: boolean | undefined;
304
- openMenuOnClick?: boolean | undefined;
305
- screenReaderStatus?: ((obj: {
306
- count: number;
307
- }) => string) | undefined;
308
- styles?: react_select.StylesConfig<Option, IsMulti, Group> | undefined;
309
- tabSelectsValue?: boolean | undefined;
310
- unstyled?: boolean | undefined;
311
- } & {}> & react_select_dist_declarations_src_useStateManager.StateManagerAdditionalProps<Option> & Omit<BoxProps, "defaultValue"> & React.RefAttributes<HTMLElement>) => React.ReactElement | null;
312
-
313
- declare const BottomBar: (props: FlexProps) => React.JSX.Element;
314
-
315
- declare const LayoutContainer: (props: FlexProps) => React.JSX.Element;
316
-
317
- type SideNavProps = {
318
- isOpen: boolean;
319
- onClose: () => void;
320
- onToggle?: () => void;
321
- breakpoint?: any[] | Partial<Record<string, any>>;
322
- } & FlexProps & DrawerContentProps;
323
- type SideNavMenuItemProps = {
324
- isActive?: boolean;
325
- } & ButtonProps;
326
- type SideNavMenuProps = {
327
- textProps?: TextProps;
328
- } & StackProps;
329
- declare const SideNav: ({ isOpen, onClose, onToggle, breakpoint, children, ...props }: SideNavProps) => React.JSX.Element;
330
- declare const SideNavContainer: (props: StackProps) => React.JSX.Element;
331
- declare const SideNavHeader: ({ children, ...rest }: FlexProps) => React.JSX.Element;
332
- declare const SideNavBody: ({ children, ...rest }: StackProps) => React.JSX.Element;
333
- declare const SideNavFooter: ({ children, ...rest }: FlexProps) => React.JSX.Element;
334
- declare const SideNavMenu: ({ title, children, textProps, ...rest }: SideNavMenuProps) => React.JSX.Element;
335
- declare const SideNavMenuItem: ({ isActive, children, ...rest }: SideNavMenuItemProps) => React.JSX.Element;
336
-
337
- type TopBarBackActionProps = {
338
- backAction?: () => void;
339
- rightInformation?: ReactComponentElement<any>;
340
- } & FlexProps;
341
- declare const TopBar: (props: StackProps) => React.JSX.Element;
342
- declare const TopBarFirstElement: (props: FlexProps) => React.JSX.Element;
343
- declare const TopBarLastElement: (props: StackProps) => React.JSX.Element;
344
- declare const TopBarBackAction: ({ backAction, title, rightInformation, ...rest }: TopBarBackActionProps) => React.JSX.Element;
345
-
346
- declare const theme: Record<string, any>;
347
-
348
- declare const dateFormat = "dd/MM/yyyy";
349
-
350
- declare const useIsMobile: (currentBreakpoint: string) => boolean;
351
-
352
- export { ActionsButton, ActionsButtonProps, BottomBar, Card, ConfirmMenuItem, DataList, DataListAccordion, DataListAccordionButton, DataListAccordionIcon, DataListAccordionPanel, DataListCell, DataListCellProps, DataListContext, DataListFooter, DataListFooterProps, DataListHeader, DataListHeaderContext, DataListHeaderProps, DataListProps, DataListRow, DataListRowProps, FormGroup, FormGroupProps, InputDayPicker, InputDayPickerProps, InputPhone, InputPhoneProps, InputRangePicker, InputRangePickerProps, LayoutContainer, MenuItem, ModalResponsive, Pagination, PaginationButtonFirstPage, PaginationButtonLastPage, PaginationButtonNextPage, PaginationButtonPrevPage, PaginationContext, PaginationContextValue, PaginationInfo, PaginationProps, SearchInput, Select, SelectProps, SideNav, SideNavBody, SideNavContainer, SideNavFooter, SideNavHeader, SideNavMenu, SideNavMenuItem, SideNavMenuItemProps, SideNavMenuProps, SideNavProps, StyledMenuItemProps, TopBar, TopBarBackAction, TopBarBackActionProps, TopBarFirstElement, TopBarLastElement, dateFormat, formatPhoneIntl, getPaginationInfo, isValidPhone, theme, useIsMobile };
1
+ export * from './components';
2
+ export * from './theme';