@hexure/ui 1.6.10 → 1.8.0

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 (28) hide show
  1. package/dist/cjs/index.js +3642 -2802
  2. package/dist/cjs/index.js.map +1 -1
  3. package/dist/cjs/types/components/ButtonMenu/ButtonMenu.d.ts +12 -0
  4. package/dist/cjs/types/components/ButtonMenu/index.d.ts +1 -0
  5. package/dist/cjs/types/components/Field/Field.d.ts +3 -0
  6. package/dist/cjs/types/components/FileUpload/FileUpload.d.ts +19 -19
  7. package/dist/cjs/types/components/Input/Input.d.ts +17 -1
  8. package/dist/cjs/types/components/MoreMenu/MoreMenu.d.ts +1 -1
  9. package/dist/cjs/types/components/PageHeader/PageHeader.d.ts +24 -0
  10. package/dist/cjs/types/components/PageHeader/index.d.ts +1 -0
  11. package/dist/cjs/types/components/Tooltip/Tooltip.d.ts +11 -0
  12. package/dist/cjs/types/components/Tooltip/index.d.ts +1 -0
  13. package/dist/cjs/types/index.d.ts +1 -0
  14. package/dist/esm/index.js +3612 -2773
  15. package/dist/esm/index.js.map +1 -1
  16. package/dist/esm/types/components/ButtonMenu/ButtonMenu.d.ts +12 -0
  17. package/dist/esm/types/components/ButtonMenu/index.d.ts +1 -0
  18. package/dist/esm/types/components/Field/Field.d.ts +3 -0
  19. package/dist/esm/types/components/FileUpload/FileUpload.d.ts +19 -19
  20. package/dist/esm/types/components/Input/Input.d.ts +17 -1
  21. package/dist/esm/types/components/MoreMenu/MoreMenu.d.ts +1 -1
  22. package/dist/esm/types/components/PageHeader/PageHeader.d.ts +24 -0
  23. package/dist/esm/types/components/PageHeader/index.d.ts +1 -0
  24. package/dist/esm/types/components/Tooltip/Tooltip.d.ts +11 -0
  25. package/dist/esm/types/components/Tooltip/index.d.ts +1 -0
  26. package/dist/esm/types/index.d.ts +1 -0
  27. package/dist/index.d.ts +111 -82
  28. package/package.json +1 -1
@@ -0,0 +1,12 @@
1
+ import { FC } from 'react';
2
+ import { MenuItemProps } from '../MoreMenu/MoreMenu';
3
+ export interface ButtonMenuProps {
4
+ disabled?: boolean;
5
+ label: string;
6
+ small?: boolean;
7
+ menuItems: Array<MenuItemProps>;
8
+ maxHeight?: string | number;
9
+ position?: 'left' | 'right';
10
+ }
11
+ declare const ButtonMenu: FC<ButtonMenuProps>;
12
+ export default ButtonMenu;
@@ -0,0 +1 @@
1
+ export { default } from './ButtonMenu';
@@ -1,4 +1,5 @@
1
1
  import { FC, ReactNode } from 'react';
2
+ import { TooltipProps } from '../Tooltip/Tooltip';
2
3
  import { AccessibleProps } from '../../utils/Accessibility';
3
4
  interface ActionProps {
4
5
  label: string;
@@ -18,6 +19,8 @@ export interface FieldProps extends AccessibleProps {
18
19
  label: string;
19
20
  /** It is used to give description to input. */
20
21
  description?: string;
22
+ /** Display a tooltip next to the label */
23
+ tooltip?: TooltipProps;
21
24
  }
22
25
  declare const Field: FC<FieldProps>;
23
26
  export default Field;
@@ -1,23 +1,23 @@
1
1
  import { FC } from 'react';
2
- import { AccessibleProps } from '../../utils/Accessibility';
3
- export interface FileUploadProps extends AccessibleProps {
4
- /** It is used to get the array of files. */
5
- onChange: (e: any) => void;
6
- /** It is used to get the delete file. */
7
- onFileDelete: (e: any) => void;
8
- /** It is used to get max file size in MBs. */
9
- maxFileSize: number;
10
- /** It is used to whether the progress bar should be shown or not. */
11
- progress: boolean;
12
- /** It is used to set the upload progress value from 0 to 100. */
13
- UploadProgress?: {
14
- index: number;
15
- progress: number;
16
- };
17
- /** It is used to set the value of multile file upload in boolean. */
18
- multiple: boolean;
19
- /** It is used to set the value of acceptable files. Example ".jpg, .jpeg, .pdf"*/
20
- acceptFiles: string;
2
+ export interface FileUploadProps {
3
+ /** A method to call when files are added/removed. Return the new file or array of files. */
4
+ onChange?: (files: Array<File>) => void;
5
+ /** A method to call when files are rejected. Returns an array of files and their errors */
6
+ onError?: (errors: Array<ErrorObject>) => void;
7
+ /** The maximum number of files that be added. */
8
+ maxFiles?: number;
9
+ /** The maximum file size allowed, in MBs. */
10
+ maxSize?: number;
11
+ /** Display a message in the dropzone area */
12
+ message?: string;
13
+ /** A string of comma separated file types */
14
+ accept?: string;
15
+ /** A method that will be run against each file to determine if it's valid before being added. Must return a boolean. */
16
+ validateFile?: (file: File) => boolean;
17
+ }
18
+ interface ErrorObject {
19
+ file: File;
20
+ message: string;
21
21
  }
22
22
  declare const FileUpload: FC<FileUploadProps>;
23
23
  export default FileUpload;
@@ -4,21 +4,37 @@ export interface styleProps {
4
4
  width?: number | string;
5
5
  }
6
6
  export interface InputProps extends AccessibleProps {
7
+ /** Force a specific format/mask for the Input value */
7
8
  format?: 'phone' | 'currency' | 'currency_decimal' | 'ssn';
9
+ /** Set the height of the textarea. This should only be used with textarea */
8
10
  height?: string;
11
+ /** Display a read only suffix. Example: kg, lbs, etc */
9
12
  suffix?: string;
13
+ /** Display the input as invalid, with a red border and red text */
10
14
  invalid?: boolean;
15
+ /** Use with a number input to define the max allowed number */
11
16
  max?: string;
17
+ /** Use with a text input to define the max number of characters */
12
18
  maxLength?: number;
19
+ /** Use with a number input to define the min allowed number */
13
20
  min?: string;
21
+ /** A method to be called when the changes focus away from the input */
14
22
  onBlur?: (e?: any) => void;
23
+ /** A method to be called when the value of the input changes */
15
24
  onChange?: (e?: any) => void;
25
+ /** A method to be called when the use presses a key */
16
26
  onKeyDown?: (e?: any) => void;
27
+ /** Display placeholder text in the input */
17
28
  placeholder?: string;
29
+ /** Display the input as read only, preventing the user from inteacting with it */
18
30
  readOnly?: boolean;
31
+ /** Use with a number input to define how the number increments */
19
32
  step?: number;
33
+ /** Set the css of the wrapping div */
20
34
  style?: styleProps;
21
- type?: 'date' | 'email' | 'number' | 'password' | 'tel' | 'text' | 'url' | 'textarea';
35
+ /** Define the type of input to be displayed */
36
+ type?: 'date' | 'email' | 'number' | 'password' | 'tel' | 'text' | 'url' | 'textarea' | 'search';
37
+ /** Set the value of the input. This should be used by the parent component to control the input's value. */
22
38
  value?: string;
23
39
  }
24
40
  declare const Input: FC<InputProps>;
@@ -1,6 +1,6 @@
1
1
  import { FC } from 'react';
2
2
  import { AccessibleProps } from '../../utils/Accessibility';
3
- interface MenuItemProps extends AccessibleProps {
3
+ export interface MenuItemProps extends AccessibleProps {
4
4
  icon?: string;
5
5
  label?: string;
6
6
  onClick: (e?: any) => void;
@@ -0,0 +1,24 @@
1
+ import { FC } from 'react';
2
+ import { MenuItemProps } from '../MoreMenu/MoreMenu';
3
+ export interface PageHeaderProps {
4
+ title?: string;
5
+ breadcrumbs?: Array<{
6
+ label: string;
7
+ onClick?: (e: any) => void;
8
+ }>;
9
+ actions?: Array<{
10
+ disabled?: boolean;
11
+ format?: 'primary' | 'secondary' | 'red';
12
+ icon?: string;
13
+ label: string;
14
+ onClick?: (e: any) => void;
15
+ }>;
16
+ buttonMenu?: {
17
+ disabled?: boolean;
18
+ icon?: string;
19
+ label: string;
20
+ menuItems: Array<MenuItemProps>;
21
+ };
22
+ }
23
+ declare const PageHeader: FC<PageHeaderProps>;
24
+ export default PageHeader;
@@ -0,0 +1 @@
1
+ export { default } from './PageHeader';
@@ -0,0 +1,11 @@
1
+ import { FC } from 'react';
2
+ export interface TooltipProps {
3
+ /** It is used to give label to tag. */
4
+ children: string;
5
+ /** It is callback function called when user wants to close the tag. */
6
+ position?: 'right-top' | 'right-bottom' | 'right-center' | 'left-top' | 'left-bottom' | 'left-center';
7
+ /** Override the default content width of 240px */
8
+ width?: string;
9
+ }
10
+ declare const Tooltip: FC<TooltipProps>;
11
+ export default Tooltip;
@@ -0,0 +1 @@
1
+ export { default } from './Tooltip';
@@ -25,4 +25,5 @@ export { default as Table } from './components/Table';
25
25
  export { default as Tabs } from './components/Tabs';
26
26
  export { default as Tag } from './components/Tag';
27
27
  export { default as Toggle } from './components/Toggle';
28
+ export { default as Tooltip } from './components/Tooltip';
28
29
  export { default as ZeroState } from './components/ZeroState';