@luscii-healthtech/web-ui 0.0.0-alpha.38b1613
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.
- package/README.md +109 -0
- package/dist/components/Accordion/Accordion.d.ts +10 -0
- package/dist/components/Accordion/AccordionItem.d.ts +9 -0
- package/dist/components/AccordionList/AccordionList.d.ts +42 -0
- package/dist/components/AccordionList/subcomponents/AccordionListActions.d.ts +18 -0
- package/dist/components/Badge/Badge.d.ts +7 -0
- package/dist/components/BaseList/BaseList.d.ts +7 -0
- package/dist/components/BaseList/BaseList.types.d.ts +55 -0
- package/dist/components/BaseList/BaseListEmptyState.d.ts +7 -0
- package/dist/components/BaseList/BaseListHeader.d.ts +4 -0
- package/dist/components/BaseList/BaseListIcon.d.ts +5 -0
- package/dist/components/BaseList/BaseListItem.d.ts +4 -0
- package/dist/components/BaseList/DraggableBaseList/DraggableBaseList.d.ts +4 -0
- package/dist/components/BaseList/DraggableBaseList/DraggableBaseListItem.d.ts +3 -0
- package/dist/components/BaseList/DraggableBaseList/index.d.ts +2 -0
- package/dist/components/BaseList/ListSkeleton/ListItemSkeleton.d.ts +2 -0
- package/dist/components/BaseList/ListSkeleton/ListSkeleton.d.ts +8 -0
- package/dist/components/BaseList/SortableBaseList/SortableBaseList.d.ts +4 -0
- package/dist/components/BaseList/SortableBaseList/SortableBaseListItem.d.ts +3 -0
- package/dist/components/BaseList/SortableBaseList/index.d.ts +2 -0
- package/dist/components/BaseList/index.d.ts +6 -0
- package/dist/components/BaseList/utils.d.ts +10 -0
- package/dist/components/Breadcrumbs/BreadcrumbItem.d.ts +4 -0
- package/dist/components/Breadcrumbs/Breadcrumbs.d.ts +3 -0
- package/dist/components/Breadcrumbs/Breadcrumbs.types.d.ts +14 -0
- package/dist/components/Breadcrumbs/index.d.ts +2 -0
- package/dist/components/Button/Button.d.ts +9 -0
- package/dist/components/Button/Button.types.d.ts +32 -0
- package/dist/components/Button/ButtonIcon.d.ts +7 -0
- package/dist/components/ButtonV2/ButtonProps.type.d.ts +49 -0
- package/dist/components/ButtonV2/ButtonV2.d.ts +3 -0
- package/dist/components/ButtonV2/PrimaryButton.d.ts +3 -0
- package/dist/components/ButtonV2/SecondaryButton.d.ts +3 -0
- package/dist/components/ButtonV2/TertiaryButton.d.ts +3 -0
- package/dist/components/Card/Card.d.ts +12 -0
- package/dist/components/Carousel/Carousel.d.ts +8 -0
- package/dist/components/Carousel/GliderContainer.d.ts +7 -0
- package/dist/components/CenteredHero/CenteredHero.d.ts +14 -0
- package/dist/components/CheckBoxListModal/CheckboxListModal.d.ts +30 -0
- package/dist/components/Checkbox/Checkbox.d.ts +19 -0
- package/dist/components/CheckboxList/CheckboxGroup.d.ts +3 -0
- package/dist/components/CheckboxList/CheckboxList.d.ts +5 -0
- package/dist/components/CheckboxList/CheckboxList.types.d.ts +52 -0
- package/dist/components/CheckboxList/CheckboxListItem.d.ts +3 -0
- package/dist/components/ConfirmationDialog/ConfirmationDialog.d.ts +3 -0
- package/dist/components/ConfirmationDialog/ConfirmationDialogChoices.d.ts +7 -0
- package/dist/components/ConfirmationDialog/ConfirmationDialogMessage.d.ts +4 -0
- package/dist/components/ConfirmationDialog/ConfirmationDialogTitle.d.ts +3 -0
- package/dist/components/ConfirmationDialog/types/ConfirmationDialog.types.d.ts +41 -0
- package/dist/components/Container/FlexColumn.d.ts +7 -0
- package/dist/components/Container/FlexContainer.d.ts +9 -0
- package/dist/components/Container/FlexRow.d.ts +7 -0
- package/dist/components/Container/types/FlexContainerProps.type.d.ts +26 -0
- package/dist/components/Divider/Divider.d.ts +6 -0
- package/dist/components/DragHandle/DragHandle.d.ts +7 -0
- package/dist/components/DragHandle/DragHandle.types.d.ts +6 -0
- package/dist/components/DragHandle/index.d.ts +2 -0
- package/dist/components/Dropzone/Dropzone.d.ts +6 -0
- package/dist/components/Dropzone/Dropzone.types.d.ts +33 -0
- package/dist/components/Dropzone/index.d.ts +2 -0
- package/dist/components/EmptyListMessage/EmptyListMessage.d.ts +14 -0
- package/dist/components/Form/Form.d.ts +30 -0
- package/dist/components/Form/FormFieldCheckbox.d.ts +9 -0
- package/dist/components/Form/FormFieldCheckboxList.d.ts +9 -0
- package/dist/components/Form/FormFieldErrorMessages.d.ts +8 -0
- package/dist/components/Form/FormFieldLabeler.d.ts +8 -0
- package/dist/components/Form/FormImagePicker.d.ts +9 -0
- package/dist/components/Form/FormInput.d.ts +14 -0
- package/dist/components/Form/FormRadioGroup.d.ts +13 -0
- package/dist/components/Form/FormSelect.d.ts +10 -0
- package/dist/components/Form/FormTextarea.d.ts +14 -0
- package/dist/components/Form/form.transformer.d.ts +3 -0
- package/dist/components/Form/form.types.d.ts +91 -0
- package/dist/components/Icon/Icon.d.ts +17 -0
- package/dist/components/Icon/index.d.ts +1 -0
- package/dist/components/Icons/AddIcon.d.ts +4 -0
- package/dist/components/Icons/AlertsIcon.d.ts +4 -0
- package/dist/components/Icons/BellIcon.d.ts +4 -0
- package/dist/components/Icons/BluetoothIcon.d.ts +4 -0
- package/dist/components/Icons/ChartIcon.d.ts +4 -0
- package/dist/components/Icons/ChartLineColoredIcon.d.ts +4 -0
- package/dist/components/Icons/ChatBoxIcon.d.ts +4 -0
- package/dist/components/Icons/CheckIcon.d.ts +4 -0
- package/dist/components/Icons/ChevronDoubleIcon.d.ts +4 -0
- package/dist/components/Icons/ChevronDownIcon.d.ts +4 -0
- package/dist/components/Icons/ChevronRightIcon.d.ts +4 -0
- package/dist/components/Icons/CrossIcon.d.ts +4 -0
- package/dist/components/Icons/DeleteIcon.d.ts +4 -0
- package/dist/components/Icons/DownArrowIcon.d.ts +4 -0
- package/dist/components/Icons/DragIcon.d.ts +4 -0
- package/dist/components/Icons/EditIcon.d.ts +4 -0
- package/dist/components/Icons/EmptyIcon.d.ts +4 -0
- package/dist/components/Icons/EmptyStateDashboardIcon.d.ts +4 -0
- package/dist/components/Icons/ExclamationMarkIcon.d.ts +4 -0
- package/dist/components/Icons/EyeIcon.d.ts +4 -0
- package/dist/components/Icons/GearColoredIcon.d.ts +4 -0
- package/dist/components/Icons/GearIcon.d.ts +4 -0
- package/dist/components/Icons/GroupColoredIcon.d.ts +4 -0
- package/dist/components/Icons/GroupIcon.d.ts +4 -0
- package/dist/components/Icons/HamburgerIcon.d.ts +4 -0
- package/dist/components/Icons/HeartIcon.d.ts +4 -0
- package/dist/components/Icons/ImageIcon.d.ts +4 -0
- package/dist/components/Icons/InfoIcon.d.ts +4 -0
- package/dist/components/Icons/LeftArrowIcon.d.ts +4 -0
- package/dist/components/Icons/LightBulbIcon.d.ts +4 -0
- package/dist/components/Icons/LinkIcon.d.ts +4 -0
- package/dist/components/Icons/LockIcon.d.ts +4 -0
- package/dist/components/Icons/MessagesIcon.d.ts +4 -0
- package/dist/components/Icons/MouseIcon.d.ts +4 -0
- package/dist/components/Icons/NotesIcon.d.ts +4 -0
- package/dist/components/Icons/PageViewIcon.d.ts +4 -0
- package/dist/components/Icons/PinIcon.d.ts +4 -0
- package/dist/components/Icons/PrintIcon.d.ts +4 -0
- package/dist/components/Icons/RightArrowIcon.d.ts +4 -0
- package/dist/components/Icons/SearchCancelIcon.d.ts +4 -0
- package/dist/components/Icons/SearchIcon.d.ts +4 -0
- package/dist/components/Icons/SmallCircleIcon.d.ts +4 -0
- package/dist/components/Icons/SmallDiamondIcon.d.ts +4 -0
- package/dist/components/Icons/SmallSquareIcon.d.ts +4 -0
- package/dist/components/Icons/SpaceRocketIcon.d.ts +4 -0
- package/dist/components/Icons/StarIcon.d.ts +4 -0
- package/dist/components/Icons/StatusColoredIcon.d.ts +4 -0
- package/dist/components/Icons/WarningIcon.d.ts +4 -0
- package/dist/components/Icons/iconWrapper/iconWrapper.d.ts +4 -0
- package/dist/components/Icons/iconWrapper/index.d.ts +1 -0
- package/dist/components/Icons/index.d.ts +48 -0
- package/dist/components/Icons/templates/component.d.ts +3 -0
- package/dist/components/Icons/templates/index.d.ts +2 -0
- package/dist/components/Icons/types/IconProps.type.d.ts +8 -0
- package/dist/components/Image/Image.d.ts +10 -0
- package/dist/components/ImagePicker/ImageCategory.d.ts +14 -0
- package/dist/components/ImagePicker/ImagePicker.d.ts +29 -0
- package/dist/components/InfoField/InfoField.d.ts +18 -0
- package/dist/components/Input/Input.d.ts +57 -0
- package/dist/components/Input/SearchInput.d.ts +4 -0
- package/dist/components/List/List.d.ts +6 -0
- package/dist/components/List/List.types.d.ts +19 -0
- package/dist/components/List/ListItem.d.ts +4 -0
- package/dist/components/List/index.d.ts +5 -0
- package/dist/components/LoadingIndicator/LoadingIndicator.d.ts +12 -0
- package/dist/components/Modal/FullPageModal.d.ts +11 -0
- package/dist/components/Modal/FullPageModalHeader.d.ts +7 -0
- package/dist/components/Modal/Modal.d.ts +6 -0
- package/dist/components/Modal/ModalBase.d.ts +16 -0
- package/dist/components/Modal/ModalFooter.d.ts +12 -0
- package/dist/components/Modal/ModalHeader.d.ts +6 -0
- package/dist/components/NavMenu/NavLayout.d.ts +20 -0
- package/dist/components/NavMenu/NavMenu.d.ts +16 -0
- package/dist/components/NavMenu/NavMenuContent.d.ts +3 -0
- package/dist/components/NavMenu/NavMenuFooter.d.ts +3 -0
- package/dist/components/NavMenu/NavMenuHeader.d.ts +3 -0
- package/dist/components/NavMenu/NavMenuItem.d.ts +3 -0
- package/dist/components/NavMenu/types/NavMenuFooterProps.type.d.ts +5 -0
- package/dist/components/NavMenu/types/NavMenuHeaderProps.type.d.ts +5 -0
- package/dist/components/NavMenu/types/NavMenuItemProps.type.d.ts +11 -0
- package/dist/components/NotificationBanner/NotificationBanner.d.ts +41 -0
- package/dist/components/Page/CRUDPage.d.ts +4 -0
- package/dist/components/Page/CRUDPage.types.d.ts +32 -0
- package/dist/components/Page/index.d.ts +3 -0
- package/dist/components/PageHeader/PageHeader.d.ts +4 -0
- package/dist/components/PageHeader/PageHeader.types.d.ts +28 -0
- package/dist/components/PageHeader/index.d.ts +2 -0
- package/dist/components/PaginationMenu/PaginationMenu.d.ts +3 -0
- package/dist/components/PaginationMenu/PaginationMenu.types.d.ts +37 -0
- package/dist/components/PaginationMenu/PaginationMenu.utils.d.ts +15 -0
- package/dist/components/PaginationMenu/PaginationMenuLarge.d.ts +3 -0
- package/dist/components/PaginationMenu/PaginationMenuSmall.d.ts +3 -0
- package/dist/components/PreviewPhone/PreviewPhone.d.ts +7 -0
- package/dist/components/Radio/RadioV2.d.ts +17 -0
- package/dist/components/RadioGroup/RadioGroupV2.d.ts +10 -0
- package/dist/components/Section/Section.d.ts +25 -0
- package/dist/components/Section/SectionItem.d.ts +9 -0
- package/dist/components/Section/SectionItemWithContent.d.ts +9 -0
- package/dist/components/Section/subcomponents/SectionActions.d.ts +21 -0
- package/dist/components/Select/Select.d.ts +40 -0
- package/dist/components/Select/SelectDropdownIndicator.d.ts +3 -0
- package/dist/components/Select/SelectLoadingIndicator.d.ts +3 -0
- package/dist/components/SettingsMenuButton/SettingsMenuButton.d.ts +19 -0
- package/dist/components/Spinner/Spinner.d.ts +6 -0
- package/dist/components/Steps/Step.d.ts +10 -0
- package/dist/components/Steps/Steps.d.ts +10 -0
- package/dist/components/TabLinks/TabLinks.d.ts +14 -0
- package/dist/components/Tabbar/Tabbar.d.ts +18 -0
- package/dist/components/Tabbar/TabbarItem.d.ts +16 -0
- package/dist/components/Table/Table.d.ts +16 -0
- package/dist/components/Table/Table.types.d.ts +43 -0
- package/dist/components/Table/Table.utils.d.ts +3 -0
- package/dist/components/Table/TableBody.d.ts +13 -0
- package/dist/components/Table/TableBodyRow.d.ts +10 -0
- package/dist/components/Table/TableBodyRowDataCell.d.ts +8 -0
- package/dist/components/Table/TableFooter.d.ts +8 -0
- package/dist/components/Table/TableHeader.d.ts +7 -0
- package/dist/components/Tag/Tag.d.ts +17 -0
- package/dist/components/Tag/Tag.utils.d.ts +4 -0
- package/dist/components/Tag/TagGroup.d.ts +10 -0
- package/dist/components/Text/Text.d.ts +66 -0
- package/dist/components/TextEditor/TextEditor.d.ts +17 -0
- package/dist/components/TextLink/TextLink.d.ts +11 -0
- package/dist/components/Textarea/Textarea.d.ts +29 -0
- package/dist/components/Timeline/Timeline.d.ts +14 -0
- package/dist/components/Timeline/TimelineHeader.d.ts +10 -0
- package/dist/components/Timeline/TimelineStep.d.ts +10 -0
- package/dist/components/Title/Title.d.ts +17 -0
- package/dist/components/Toaster/Toaster.d.ts +17 -0
- package/dist/components/Toaster/toast-elements-getter.d.ts +22 -0
- package/dist/components/Toaster/toast-progress-animator.d.ts +12 -0
- package/dist/components/Toaster/toast.d.ts +12 -0
- package/dist/components/ViewItem/ViewItem.d.ts +16 -0
- package/dist/index.d.ts +81 -0
- package/dist/index.development.js +5531 -0
- package/dist/index.development.js.map +1 -0
- package/dist/index.js +2 -0
- package/dist/index.js.map +1 -0
- package/dist/types/general.types.d.ts +8 -0
- package/dist/utils/string.utils.d.ts +7 -0
- package/dist/web-ui.esm.js +2 -0
- package/dist/web-ui.esm.js.map +1 -0
- package/package.json +153 -0
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
export declare enum CheckboxState {
|
|
2
|
+
CHECKED = "checked",
|
|
3
|
+
INDETERMINATE = "indeterminate",
|
|
4
|
+
UNCHECKED = "unchecked"
|
|
5
|
+
}
|
|
6
|
+
export interface CheckboxListProps {
|
|
7
|
+
groups: CheckboxGroup[];
|
|
8
|
+
onChange: (event: CheckboxChangeEvent) => void;
|
|
9
|
+
hasDividers?: boolean;
|
|
10
|
+
className?: string;
|
|
11
|
+
}
|
|
12
|
+
type WithCollapsible = {
|
|
13
|
+
/**
|
|
14
|
+
* When `false`, will prevent the checkbox list from being collapsed (also disabling clicking to expand/collapse)
|
|
15
|
+
* in the component and it will be displayed expanded by default.
|
|
16
|
+
* @default true
|
|
17
|
+
*/
|
|
18
|
+
collapsible?: boolean;
|
|
19
|
+
};
|
|
20
|
+
export type CheckboxGroupProps = {
|
|
21
|
+
title?: string;
|
|
22
|
+
items: CheckboxListItem[];
|
|
23
|
+
onChange: (event: CheckboxChangeEvent) => void;
|
|
24
|
+
hasDividers?: boolean;
|
|
25
|
+
className?: string;
|
|
26
|
+
isCollapsed?: boolean;
|
|
27
|
+
} & WithCollapsible;
|
|
28
|
+
export interface CheckboxGroupItemProps {
|
|
29
|
+
id: string;
|
|
30
|
+
label: string;
|
|
31
|
+
isChecked?: boolean;
|
|
32
|
+
isDisabled?: boolean;
|
|
33
|
+
onChange: (event: CheckboxChangeEvent) => void;
|
|
34
|
+
className?: string;
|
|
35
|
+
}
|
|
36
|
+
export interface CheckboxListItem {
|
|
37
|
+
id: string;
|
|
38
|
+
label: string;
|
|
39
|
+
isChecked?: boolean;
|
|
40
|
+
isDisabled?: boolean;
|
|
41
|
+
className?: string;
|
|
42
|
+
}
|
|
43
|
+
export type CheckboxGroup = {
|
|
44
|
+
title?: string;
|
|
45
|
+
items: CheckboxListItem[];
|
|
46
|
+
isCollapsed?: boolean;
|
|
47
|
+
} & WithCollapsible;
|
|
48
|
+
export interface CheckboxChangeEvent {
|
|
49
|
+
id: string;
|
|
50
|
+
newCheckedValue: boolean;
|
|
51
|
+
}
|
|
52
|
+
export {};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { ConfirmationDialogChoice, ConfirmationDialogProps } from "./types/ConfirmationDialog.types";
|
|
3
|
+
export declare const ConfirmationDialogChoices: React.FC<{
|
|
4
|
+
choices: ConfirmationDialogProps["choices"];
|
|
5
|
+
onChoiceChangeCallback?: (choice: ConfirmationDialogChoice) => void;
|
|
6
|
+
selectedChoice?: ConfirmationDialogChoice;
|
|
7
|
+
}>;
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import type { IconKey, IconProps } from "../../Icons/types/IconProps.type";
|
|
3
|
+
import type { NotificationBannerColor } from "../../NotificationBanner/NotificationBanner";
|
|
4
|
+
interface ConfirmationDialogTexts {
|
|
5
|
+
message: string | string[];
|
|
6
|
+
confirmLabel: string;
|
|
7
|
+
cancelLabel: string;
|
|
8
|
+
}
|
|
9
|
+
export interface ConfirmationDialogChoice<T extends string = string> {
|
|
10
|
+
text: string;
|
|
11
|
+
value: T;
|
|
12
|
+
description?: string;
|
|
13
|
+
displaysInfo?: {
|
|
14
|
+
level: NotificationBannerColor;
|
|
15
|
+
text: string;
|
|
16
|
+
};
|
|
17
|
+
}
|
|
18
|
+
export interface ConfirmationDialogProps {
|
|
19
|
+
texts: ConfirmationDialogTexts;
|
|
20
|
+
isOpen: boolean;
|
|
21
|
+
onCancel: () => void;
|
|
22
|
+
onConfirm: (choice?: ConfirmationDialogChoice) => void;
|
|
23
|
+
isProcessing?: boolean;
|
|
24
|
+
withTitle?: {
|
|
25
|
+
title: string;
|
|
26
|
+
icon?: React.FC<IconProps> | IconKey;
|
|
27
|
+
};
|
|
28
|
+
choices?: {
|
|
29
|
+
defaultChoice?: ConfirmationDialogChoice["value"];
|
|
30
|
+
onChoiceChange: (choice: ConfirmationDialogChoice) => void;
|
|
31
|
+
options: {
|
|
32
|
+
0: ConfirmationDialogChoice;
|
|
33
|
+
1: ConfirmationDialogChoice;
|
|
34
|
+
} & ConfirmationDialogChoice[];
|
|
35
|
+
};
|
|
36
|
+
dataTestId?: string;
|
|
37
|
+
}
|
|
38
|
+
export interface ConfirmationDialogTitleProps {
|
|
39
|
+
title: ConfirmationDialogProps["withTitle"];
|
|
40
|
+
}
|
|
41
|
+
export {};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { FlexContainerProps } from "./types/FlexContainerProps.type";
|
|
3
|
+
/**
|
|
4
|
+
* Container to be used for layouting instead of divs around the project.
|
|
5
|
+
* The spacing here has been coded according to our guidelines.
|
|
6
|
+
*/
|
|
7
|
+
export declare const FlexColumn: React.FC<FlexContainerProps>;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { FlexContainerBaseProps } from "./types/FlexContainerProps.type";
|
|
3
|
+
/**
|
|
4
|
+
* Container to be used for layouting instead of divs around the project.
|
|
5
|
+
* The spacing here has been coded according to our guidelines.
|
|
6
|
+
*/
|
|
7
|
+
export declare const FlexContainer: React.FC<FlexContainerBaseProps & {
|
|
8
|
+
type: "column" | "row";
|
|
9
|
+
}>;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { FlexContainerProps } from "./types/FlexContainerProps.type";
|
|
3
|
+
/**
|
|
4
|
+
* Container to be used for layouting instead of divs around the project.
|
|
5
|
+
* The spacing here has been coded according to our guidelines.
|
|
6
|
+
*/
|
|
7
|
+
export declare const FlexRow: React.FC<FlexContainerProps>;
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
type Spacing = "tiny" | "none" | "small" | "medium" | "large";
|
|
3
|
+
type FlexContainerBase = {
|
|
4
|
+
alignItems?: "center" | "start" | "end";
|
|
5
|
+
justifyContent?: "center" | "start" | "end" | "between";
|
|
6
|
+
position?: "static" | "fixed" | "absolute" | "relative" | "sticky";
|
|
7
|
+
verticalSpacing?: Spacing;
|
|
8
|
+
horizontalSpacing?: Spacing;
|
|
9
|
+
/**
|
|
10
|
+
* Applies the default padding (`"ui-p-4"`) inside the container.
|
|
11
|
+
*/
|
|
12
|
+
hasPadding?: boolean;
|
|
13
|
+
backgroundColor?: string;
|
|
14
|
+
/**
|
|
15
|
+
* If `true`, will make the flexbox full width and not size itui-relative to its content.
|
|
16
|
+
* @default true
|
|
17
|
+
*/
|
|
18
|
+
stretch?: boolean;
|
|
19
|
+
};
|
|
20
|
+
export type FlexContainerBaseProps = FlexContainerBase & {
|
|
21
|
+
children: React.ReactNode;
|
|
22
|
+
};
|
|
23
|
+
export type FlexContainerProps = Omit<FlexContainerBaseProps, "verticalSpacing" | "horizontalSpacing"> & {
|
|
24
|
+
spacing?: Spacing;
|
|
25
|
+
};
|
|
26
|
+
export {};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
declare const DragHandle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLButtonElement> & {
|
|
3
|
+
grabbing: boolean;
|
|
4
|
+
disabled?: boolean | undefined;
|
|
5
|
+
dataTestId?: string | undefined;
|
|
6
|
+
} & React.RefAttributes<HTMLButtonElement>>;
|
|
7
|
+
export default DragHandle;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import "./Dropzone.scss";
|
|
3
|
+
import type { DropzoneProps, DropzonePresentationProps } from "./Dropzone.types";
|
|
4
|
+
export declare const DropzonePresentation: React.FC<DropzonePresentationProps>;
|
|
5
|
+
export declare const Dropzone: React.FC<DropzoneProps>;
|
|
6
|
+
export default Dropzone;
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { ReactNode, Ref } from "react";
|
|
2
|
+
import type { IconKey } from "../Icons/types/IconProps.type";
|
|
3
|
+
export type DropzonePresentationProps = {
|
|
4
|
+
/**
|
|
5
|
+
* Message shown to the user hinting how to use the component
|
|
6
|
+
* Usually something like "Click or Drag"
|
|
7
|
+
*/
|
|
8
|
+
message?: string;
|
|
9
|
+
/**
|
|
10
|
+
* @deprecated
|
|
11
|
+
* Dropzones no longer support icons
|
|
12
|
+
*/
|
|
13
|
+
icon?: IconKey;
|
|
14
|
+
isHighlighted?: boolean;
|
|
15
|
+
isClickable?: boolean;
|
|
16
|
+
ref?: Ref<HTMLDivElement>;
|
|
17
|
+
children?: ReactNode;
|
|
18
|
+
className?: string;
|
|
19
|
+
dataTestId?: string;
|
|
20
|
+
/**
|
|
21
|
+
* @deprecated
|
|
22
|
+
* use alignMessage instead
|
|
23
|
+
*/
|
|
24
|
+
horizontal?: boolean;
|
|
25
|
+
alignMessage?: "left" | "center";
|
|
26
|
+
};
|
|
27
|
+
export type DropzoneProps = Omit<DropzonePresentationProps, "isHighlighted" | "isClickable"> & {
|
|
28
|
+
draggableIdentifier: string | number;
|
|
29
|
+
disabled?: boolean;
|
|
30
|
+
data?: Record<string, unknown>;
|
|
31
|
+
dataTestId?: string;
|
|
32
|
+
onClick?: React.HTMLAttributes<HTMLButtonElement>["onClick"];
|
|
33
|
+
};
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
declare const imageSrc: {
|
|
3
|
+
"no-open-alerts": string;
|
|
4
|
+
"search-not-found": string;
|
|
5
|
+
"no-notes-found": string;
|
|
6
|
+
};
|
|
7
|
+
interface EmptyListMessageProps {
|
|
8
|
+
text: string;
|
|
9
|
+
imageName?: keyof typeof imageSrc;
|
|
10
|
+
dataTestId?: string;
|
|
11
|
+
className?: string;
|
|
12
|
+
}
|
|
13
|
+
export declare const EmptyListMessage: ({ text, imageName, dataTestId, className, }: EmptyListMessageProps) => JSX.Element;
|
|
14
|
+
export {};
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { type FieldValues, type UseFormMethods as UseFormReturn, DeepPartial, SubmitErrorHandler, SubmitHandler, UnpackNestedValue } from "react-hook-form/dist/index.ie11";
|
|
3
|
+
import { FormFieldConfiguration } from "./form.types";
|
|
4
|
+
export interface GenericFormProps<TFieldValues extends FieldValues> {
|
|
5
|
+
fields: FormFieldConfiguration<TFieldValues>[];
|
|
6
|
+
onValid: SubmitHandler<TFieldValues>;
|
|
7
|
+
onError?: SubmitErrorHandler<TFieldValues>;
|
|
8
|
+
defaultValues?: UnpackNestedValue<DeepPartial<TFieldValues>>;
|
|
9
|
+
}
|
|
10
|
+
/**
|
|
11
|
+
* Create a straight forward Form, which takes away the 'overhead' of react-hook-form.
|
|
12
|
+
*
|
|
13
|
+
* You will probably don't want to use this component for now, given that the button is hardcoded.
|
|
14
|
+
* This is an example for the Form for now, though it could be improved to enforce further unification.
|
|
15
|
+
*
|
|
16
|
+
* TODO: make the buttons configurable.
|
|
17
|
+
*/
|
|
18
|
+
export declare function GenericForm<TFieldValues extends FieldValues>({ fields, onValid, onError, defaultValues, }: GenericFormProps<TFieldValues>): JSX.Element;
|
|
19
|
+
export interface FormProps<TFieldValues extends FieldValues> {
|
|
20
|
+
fields: FormFieldConfiguration<TFieldValues>[];
|
|
21
|
+
useFormReturn: UseFormReturn<TFieldValues>;
|
|
22
|
+
}
|
|
23
|
+
/**
|
|
24
|
+
* Creates a Form based on the fields input.
|
|
25
|
+
*
|
|
26
|
+
* Expects the results of the useForm hook to be injected into the useFormReturn parameter.
|
|
27
|
+
*
|
|
28
|
+
* This allows you to use and modify the useFormReturn before injecting it here.
|
|
29
|
+
*/
|
|
30
|
+
export declare function Form<TFieldValues extends FieldValues>({ fields, useFormReturn, }: FormProps<TFieldValues>): JSX.Element;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { Control, RegisterOptions } from "react-hook-form/dist/index.ie11";
|
|
3
|
+
import { FieldCheckboxConfiguration, FormFieldLabelerWithFormProps } from "./form.types";
|
|
4
|
+
interface FormCheckboxProps extends FieldCheckboxConfiguration, FormFieldLabelerWithFormProps {
|
|
5
|
+
control: Control;
|
|
6
|
+
rules?: Exclude<RegisterOptions, "valueAsNumber" | "valueAsDate" | "setValueAs">;
|
|
7
|
+
}
|
|
8
|
+
export declare const FormFieldCheckbox: React.ForwardRefExoticComponent<FormCheckboxProps & React.RefAttributes<HTMLInputElement>>;
|
|
9
|
+
export {};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { Control, RegisterOptions } from "react-hook-form/dist/index.ie11";
|
|
3
|
+
import { FieldCheckboxListConfiguration, FormFieldLabelerWithFormProps } from "./form.types";
|
|
4
|
+
interface FormCheckboxListProps extends FieldCheckboxListConfiguration, FormFieldLabelerWithFormProps {
|
|
5
|
+
control: Control;
|
|
6
|
+
rules?: Exclude<RegisterOptions, "valueAsNumber" | "valueAsDate" | "setValueAs">;
|
|
7
|
+
}
|
|
8
|
+
export declare const FormFieldCheckboxList: React.FC<FormCheckboxListProps>;
|
|
9
|
+
export {};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { FormFieldLabelerWithFormProps } from "./form.types";
|
|
3
|
+
/**
|
|
4
|
+
* Decorator for any input component. Adds a label and additional information to be shown.
|
|
5
|
+
*
|
|
6
|
+
* Includes the default error handling from react-hook-form.
|
|
7
|
+
*/
|
|
8
|
+
export declare function FormFieldLabeler({ name, children, label, fieldRequired, info, fieldErrors, decoratorClassname, }: FormFieldLabelerWithFormProps): JSX.Element;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { Control, RegisterOptions } from "react-hook-form/dist/index.ie11";
|
|
3
|
+
import { ImagePickerFieldConfiguration, FormFieldLabelerWithFormProps } from "./form.types";
|
|
4
|
+
interface FormImagePickerProps extends ImagePickerFieldConfiguration, FormFieldLabelerWithFormProps {
|
|
5
|
+
control: Control;
|
|
6
|
+
rules?: Exclude<RegisterOptions, "valueAsNumber" | "valueAsDate" | "setValueAs">;
|
|
7
|
+
}
|
|
8
|
+
export declare const FormImagePicker: React.ForwardRefExoticComponent<FormImagePickerProps & React.RefAttributes<any>>;
|
|
9
|
+
export {};
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import React, { HTMLInputTypeAttribute } from "react";
|
|
2
|
+
import { Control, RegisterOptions } from "react-hook-form/dist/index.ie11";
|
|
3
|
+
import { InputProps } from "../Input/Input";
|
|
4
|
+
import { FormFieldLabelerWithFormProps } from "./form.types";
|
|
5
|
+
interface FormInputProps extends Omit<InputProps, "name">, FormFieldLabelerWithFormProps {
|
|
6
|
+
control: Control;
|
|
7
|
+
rules?: Exclude<RegisterOptions, "valueAsNumber" | "valueAsDate" | "setValueAs">;
|
|
8
|
+
type: Extract<HTMLInputTypeAttribute, "email" | "number" | "password" | "text">;
|
|
9
|
+
}
|
|
10
|
+
/**
|
|
11
|
+
* Input field that can be used in any react-hook-form context.
|
|
12
|
+
*/
|
|
13
|
+
export declare const FormInput: React.ForwardRefExoticComponent<FormInputProps & React.RefAttributes<HTMLInputElement>>;
|
|
14
|
+
export {};
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { Control, RegisterOptions } from "react-hook-form/dist/index.ie11";
|
|
3
|
+
import { RadioGroupProps } from "../RadioGroup/RadioGroupV2";
|
|
4
|
+
import { FormFieldLabelerWithFormProps } from "./form.types";
|
|
5
|
+
interface FormRadioGroupProps extends Omit<RadioGroupProps, "isError">, FormFieldLabelerWithFormProps {
|
|
6
|
+
control: Control;
|
|
7
|
+
rules?: Exclude<RegisterOptions, "valueAsNumber" | "valueAsDate" | "setValueAs">;
|
|
8
|
+
}
|
|
9
|
+
/**
|
|
10
|
+
* Radio Group that can be used in any react-hook-form context.
|
|
11
|
+
*/
|
|
12
|
+
export declare const FormRadioGroup: React.ForwardRefExoticComponent<FormRadioGroupProps & React.RefAttributes<HTMLInputElement>>;
|
|
13
|
+
export {};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { Control, RegisterOptions } from "react-hook-form/dist/index.ie11";
|
|
3
|
+
import { SelectProps } from "../Select/Select";
|
|
4
|
+
import { FormFieldLabelerWithFormProps } from "./form.types";
|
|
5
|
+
interface FormSelectProps extends Omit<SelectProps, "name">, FormFieldLabelerWithFormProps {
|
|
6
|
+
control: Control;
|
|
7
|
+
rules?: Exclude<RegisterOptions, "valueAsNumber" | "valueAsDate" | "setValueAs">;
|
|
8
|
+
}
|
|
9
|
+
export declare const FormSelect: React.ForwardRefExoticComponent<FormSelectProps & React.RefAttributes<any>>;
|
|
10
|
+
export {};
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { Control, RegisterOptions } from "react-hook-form/dist/index.ie11";
|
|
3
|
+
import { TextareaProps } from "../Textarea/Textarea";
|
|
4
|
+
import { FieldTextareaConfiguration, FormFieldLabelerWithFormProps } from "./form.types";
|
|
5
|
+
interface FormTextareaProps extends FieldTextareaConfiguration, Omit<TextareaProps, "name">, FormFieldLabelerWithFormProps {
|
|
6
|
+
control: Control;
|
|
7
|
+
rules?: Exclude<RegisterOptions, "valueAsNumber" | "valueAsDate" | "setValueAs">;
|
|
8
|
+
type: "textarea";
|
|
9
|
+
}
|
|
10
|
+
/**
|
|
11
|
+
* Input field that can be used in any react-hook-form context.
|
|
12
|
+
*/
|
|
13
|
+
export declare const FormTextarea: React.ForwardRefExoticComponent<FormTextareaProps & React.RefAttributes<HTMLTextAreaElement>>;
|
|
14
|
+
export {};
|
|
@@ -0,0 +1,91 @@
|
|
|
1
|
+
import { FieldErrors, FieldName, FieldValues, RegisterOptions } from "react-hook-form/dist/index.ie11";
|
|
2
|
+
import React, { HTMLInputTypeAttribute } from "react";
|
|
3
|
+
import { InputProps } from "../Input/Input";
|
|
4
|
+
import { RadioGroupProps } from "../RadioGroup/RadioGroupV2";
|
|
5
|
+
import { SelectProps } from "../Select/Select";
|
|
6
|
+
import { ImagePickerProps } from "../ImagePicker/ImagePicker";
|
|
7
|
+
import { PartialProperties } from "../../types/general.types";
|
|
8
|
+
import { CheckboxProps } from "../Checkbox/Checkbox";
|
|
9
|
+
import { CheckboxListProps } from "../CheckboxList/CheckboxList.types";
|
|
10
|
+
import { TextareaProps } from "../Textarea/Textarea";
|
|
11
|
+
import { TitleProps } from "../Title/Title";
|
|
12
|
+
export type AllowedTextInputTypes = Extract<HTMLInputTypeAttribute, "email" | "number" | "password" | "text">;
|
|
13
|
+
export type FormFieldWidth = "sm" | "md" | "lg" | "xl" | "full";
|
|
14
|
+
interface FormFieldBaseConfiguration<TFieldType> extends FormFieldLabelerProps {
|
|
15
|
+
name: FieldName<FieldValues>;
|
|
16
|
+
options?: RegisterOptions;
|
|
17
|
+
fieldProps?: TFieldType;
|
|
18
|
+
}
|
|
19
|
+
export interface FormFieldLabelerProps {
|
|
20
|
+
label?: string;
|
|
21
|
+
info?: string;
|
|
22
|
+
/**
|
|
23
|
+
* allow for custom styling of the labeler component
|
|
24
|
+
*/
|
|
25
|
+
decoratorClassname?: string;
|
|
26
|
+
}
|
|
27
|
+
/**
|
|
28
|
+
* This is an empty entry in the field form. To be used
|
|
29
|
+
* when there's logic to add/remove fields from the array.
|
|
30
|
+
*
|
|
31
|
+
* Using this makes life easier and avoids having to splice/push/concat fields.
|
|
32
|
+
*/
|
|
33
|
+
interface FieldVoidConfiguration extends Partial<FormFieldBaseConfiguration<never>> {
|
|
34
|
+
type: "void";
|
|
35
|
+
}
|
|
36
|
+
export type FormFieldConfiguration<TFieldValues> = FieldInputConfiguration | FieldSelectConfiguration | FieldImagePickerConfiguration | FieldRadioGroupConfiguration | FieldRowConfiguration<TFieldValues> | FieldCheckboxConfiguration | FieldCheckboxListConfiguration | FieldTextareaConfiguration | FieldTitleConfiguration | FieldVoidConfiguration;
|
|
37
|
+
/**
|
|
38
|
+
* @backwardscompatibility
|
|
39
|
+
* @deprecated - this is an alias for `FormFieldConfiguration`, for backwards compatibility the name can remain for now, but
|
|
40
|
+
* import `FormFieldConfiguration` whenever you need this type in the future.
|
|
41
|
+
*/
|
|
42
|
+
export type FormFieldProps<TFieldValues> = FormFieldConfiguration<TFieldValues>;
|
|
43
|
+
export interface FieldRowConfiguration<TFieldValues> extends Record<keyof FormFieldBaseConfiguration<never>, never> {
|
|
44
|
+
type: "row";
|
|
45
|
+
key: string;
|
|
46
|
+
fields: FormFieldConfiguration<TFieldValues>[];
|
|
47
|
+
}
|
|
48
|
+
export interface FieldTitleConfiguration extends FormFieldBaseConfiguration<TitleProps> {
|
|
49
|
+
type: "title";
|
|
50
|
+
}
|
|
51
|
+
export interface FieldInputConfiguration extends FormFieldBaseConfiguration<Omit<InputProps, "name">> {
|
|
52
|
+
type: AllowedTextInputTypes;
|
|
53
|
+
}
|
|
54
|
+
export interface FieldTextareaConfiguration extends FormFieldBaseConfiguration<Omit<TextareaProps, "name">> {
|
|
55
|
+
type: "textarea";
|
|
56
|
+
}
|
|
57
|
+
export interface FieldRadioGroupConfiguration extends FormFieldBaseConfiguration<Omit<RadioGroupProps, "name">> {
|
|
58
|
+
type: "radioGroup";
|
|
59
|
+
}
|
|
60
|
+
export interface FieldSelectConfiguration extends FormFieldBaseConfiguration<SelectProps> {
|
|
61
|
+
type: "select";
|
|
62
|
+
fieldProps: SelectProps;
|
|
63
|
+
}
|
|
64
|
+
export type ImagePickerFieldConfiguration = PartialProperties<Omit<ImagePickerProps, "name">, "handleChange">;
|
|
65
|
+
export interface FieldImagePickerConfiguration extends FormFieldBaseConfiguration<ImagePickerFieldConfiguration> {
|
|
66
|
+
type: "imagePicker";
|
|
67
|
+
fieldProps: ImagePickerFieldConfiguration;
|
|
68
|
+
}
|
|
69
|
+
export interface FieldCheckboxConfiguration extends FormFieldBaseConfiguration<Omit<CheckboxProps, "name" | "type">> {
|
|
70
|
+
type: "checkbox";
|
|
71
|
+
variant?: CheckboxProps["type"];
|
|
72
|
+
}
|
|
73
|
+
/**
|
|
74
|
+
* Omiting `groups` and `onChange` here because these will be handled by
|
|
75
|
+
* the `Control` component from react-hook-form.
|
|
76
|
+
*/
|
|
77
|
+
export interface FieldCheckboxListConfiguration extends FormFieldBaseConfiguration<Pick<CheckboxListProps, "hasDividers" | "className">> {
|
|
78
|
+
type: "checkboxlist";
|
|
79
|
+
}
|
|
80
|
+
/**
|
|
81
|
+
* This type is the base for every form field component wrapped in the `FormFieldLabeler` and `Control` from `react-form-hook`.
|
|
82
|
+
* This is your baseline for creating a new form field type. For reference, look at FormInput.tsx.
|
|
83
|
+
*
|
|
84
|
+
*/
|
|
85
|
+
export interface FormFieldLabelerWithFormProps extends FormFieldLabelerProps {
|
|
86
|
+
name: string;
|
|
87
|
+
fieldErrors: FieldErrors;
|
|
88
|
+
fieldRequired: boolean;
|
|
89
|
+
children?: React.ReactNode;
|
|
90
|
+
}
|
|
91
|
+
export {};
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { IconProps, IconKey } from "../Icons/types/IconProps.type";
|
|
3
|
+
export declare const Icon: React.FC<{
|
|
4
|
+
name: IconKey;
|
|
5
|
+
} & IconProps>;
|
|
6
|
+
/**
|
|
7
|
+
* This is a temporary component toui-transition the way we pass icons to components.
|
|
8
|
+
* Once all components are passed an IconKey instead of a function component we can replace it with the Icon component.
|
|
9
|
+
*
|
|
10
|
+
* If any expansion or customization must be made for all icons, do it in the iconWrapper.tsx component.
|
|
11
|
+
*
|
|
12
|
+
* @linkcode https://github.com/Luscii/web-ui/blob/main/src/components/Icons/iconWrapper/iconWrapper.tsx
|
|
13
|
+
*/
|
|
14
|
+
export declare const IconComponentOrKey: React.FC<{
|
|
15
|
+
name: React.FunctionComponent<IconProps> | IconKey;
|
|
16
|
+
} & IconProps>;
|
|
17
|
+
export default Icon;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { Icon } from "./Icon";
|