@gouvfr-lasuite/ui-kit 0.2.0 → 0.3.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.
- package/dist/cunningham.ts +11 -0
- package/dist/index.cjs +38 -38
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +165 -4
- package/dist/index.js +5822 -5264
- package/dist/index.js.map +1 -1
- package/dist/style.css +1 -1
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -12,6 +12,41 @@ import { ReactNode } from 'react';
|
|
|
12
12
|
import { SetStateAction } from 'react';
|
|
13
13
|
import { TreeApi } from 'react-arborist';
|
|
14
14
|
|
|
15
|
+
export declare type AccessData<UserType, T> = T & {
|
|
16
|
+
id: string;
|
|
17
|
+
role: string;
|
|
18
|
+
user: UserData<UserType>;
|
|
19
|
+
};
|
|
20
|
+
|
|
21
|
+
export declare const AccessRoleDropdown: ({ roles, onSelect, canUpdate, selectedRole, isOpen, onOpenChange, roleTopMessage, }: AccessRoleDropdownProps) => JSX.Element;
|
|
22
|
+
|
|
23
|
+
declare type AccessRoleDropdownProps = {
|
|
24
|
+
selectedRole: string;
|
|
25
|
+
roles: DropdownMenuOption[];
|
|
26
|
+
onSelect: (role: string) => void;
|
|
27
|
+
canUpdate?: boolean;
|
|
28
|
+
isOpen?: boolean;
|
|
29
|
+
onOpenChange?: (isOpen: boolean) => void;
|
|
30
|
+
roleTopMessage?: string;
|
|
31
|
+
};
|
|
32
|
+
|
|
33
|
+
export declare type AddShareUserListProps<UserType> = {
|
|
34
|
+
users: UserData<UserType>[];
|
|
35
|
+
onRemoveUser: (user: UserData<UserType>) => void;
|
|
36
|
+
rightActions?: ReactNode;
|
|
37
|
+
onShare: () => void;
|
|
38
|
+
roles: DropdownMenuOption[];
|
|
39
|
+
selectedRole: string;
|
|
40
|
+
shareButtonLabel?: string;
|
|
41
|
+
onSelectRole: (role: string) => void;
|
|
42
|
+
};
|
|
43
|
+
|
|
44
|
+
export declare type AvatarProps = {
|
|
45
|
+
fullName: string;
|
|
46
|
+
size?: "xsmall" | "small" | "medium" | "large";
|
|
47
|
+
forceColor?: string;
|
|
48
|
+
};
|
|
49
|
+
|
|
15
50
|
export declare type BaseTreeViewData<T> = {
|
|
16
51
|
id: string;
|
|
17
52
|
childrenCount?: number;
|
|
@@ -112,6 +147,17 @@ export declare const cunninghamConfig: {
|
|
|
112
147
|
"danger-700": string;
|
|
113
148
|
"danger-800": string;
|
|
114
149
|
"danger-900": string;
|
|
150
|
+
"blue-500": string;
|
|
151
|
+
"brown-500": string;
|
|
152
|
+
"cyan-500": string;
|
|
153
|
+
"gold-500": string;
|
|
154
|
+
"green-500": string;
|
|
155
|
+
"olive-500": string;
|
|
156
|
+
"orange-500": string;
|
|
157
|
+
"purple-500": string;
|
|
158
|
+
"red-500": string;
|
|
159
|
+
"yellow-500": string;
|
|
160
|
+
"rose-500": string;
|
|
115
161
|
};
|
|
116
162
|
font: {
|
|
117
163
|
sizes: {
|
|
@@ -327,7 +373,7 @@ export declare const CunninghamProvider: (props: Parameters<typeof CunninghamPro
|
|
|
327
373
|
|
|
328
374
|
export declare const CustomTabs: ({ tabs, defaultSelectedTab, fullWidth, }: TabsProps) => JSX.Element | null;
|
|
329
375
|
|
|
330
|
-
export declare const DropdownMenu: ({ options, isOpen, onOpenChange, children, selectedValues, onSelectValue, }: PropsWithChildren<DropdownMenuProps>) => JSX.Element;
|
|
376
|
+
export declare const DropdownMenu: ({ options, isOpen, onOpenChange, children, selectedValues, onSelectValue, topMessage, shouldCloseOnInteractOutside, }: PropsWithChildren<DropdownMenuProps>) => JSX.Element;
|
|
331
377
|
|
|
332
378
|
export declare type DropdownMenuOption = {
|
|
333
379
|
label: string;
|
|
@@ -347,6 +393,8 @@ export declare type DropdownMenuProps = {
|
|
|
347
393
|
selectedValues?: string[];
|
|
348
394
|
onSelectValue?: (value: string) => void;
|
|
349
395
|
isOpen?: boolean;
|
|
396
|
+
topMessage?: string;
|
|
397
|
+
shouldCloseOnInteractOutside?: (element: Element) => boolean;
|
|
350
398
|
};
|
|
351
399
|
|
|
352
400
|
export declare const Footer: () => JSX.Element;
|
|
@@ -382,6 +430,17 @@ export declare const HomeGutter: ({ children }: {
|
|
|
382
430
|
|
|
383
431
|
export declare const HorizontalSeparator: ({ withPadding }: Props_3) => JSX.Element;
|
|
384
432
|
|
|
433
|
+
export declare type InvitationData<UserType, T> = T & {
|
|
434
|
+
id: string;
|
|
435
|
+
role: string;
|
|
436
|
+
email: string;
|
|
437
|
+
user: UserData<UserType>;
|
|
438
|
+
};
|
|
439
|
+
|
|
440
|
+
export declare const InvitationUserSelectorItem: <UserType>({ user, onRemoveUser, }: ShareSelectedUserItemProps<UserType>) => JSX.Element;
|
|
441
|
+
|
|
442
|
+
export declare const InvitationUserSelectorList: <UserType>({ users, onRemoveUser, rightActions, onShare, shareButtonLabel, roles, selectedRole, onSelectRole, }: AddShareUserListProps<UserType>) => JSX.Element;
|
|
443
|
+
|
|
385
444
|
export declare const isNode: <T>(node?: TreeViewDataType<T>) => boolean;
|
|
386
445
|
|
|
387
446
|
export declare const isSeparator: <T>(node?: TreeViewDataType<T>) => boolean;
|
|
@@ -498,11 +557,94 @@ export declare type QuickSearchProps = {
|
|
|
498
557
|
children?: ReactNode;
|
|
499
558
|
};
|
|
500
559
|
|
|
560
|
+
export declare const SearchUserItem: <UserType>({ user, }: SearchUserItemProps<UserType>) => JSX.Element;
|
|
561
|
+
|
|
562
|
+
declare type SearchUserItemProps<UserType> = {
|
|
563
|
+
user: UserData<UserType>;
|
|
564
|
+
};
|
|
565
|
+
|
|
566
|
+
export declare const ShareInvitationItem: <UserType, InvitationType>({ invitation, roles, updateRole, deleteInvitation, canUpdate, roleTopMessage, }: ShareInvitationItemProps<UserType, InvitationType>) => JSX.Element;
|
|
567
|
+
|
|
568
|
+
export declare type ShareInvitationItemProps<UserType, InvitationType> = {
|
|
569
|
+
invitation: InvitationData<UserType, InvitationType>;
|
|
570
|
+
roles: DropdownMenuOption[];
|
|
571
|
+
updateRole?: (invitation: InvitationData<UserType, InvitationType>, role: string) => void;
|
|
572
|
+
deleteInvitation?: (invitation: InvitationData<UserType, InvitationType>) => void;
|
|
573
|
+
canUpdate?: boolean;
|
|
574
|
+
roleTopMessage?: string;
|
|
575
|
+
};
|
|
576
|
+
|
|
577
|
+
export declare const ShareMemberItem: <UserType, AccessType>({ accessData, roles, updateRole, deleteAccess, canUpdate, roleTopMessage, }: ShareMemberItemProps<UserType, AccessType>) => JSX.Element;
|
|
578
|
+
|
|
579
|
+
export declare type ShareMemberItemProps<UserType, AccessType> = {
|
|
580
|
+
accessData: AccessData<UserType, AccessType>;
|
|
581
|
+
roles: DropdownMenuOption[];
|
|
582
|
+
updateRole?: (access: AccessData<UserType, AccessType>, role: string) => void;
|
|
583
|
+
deleteAccess?: (access: AccessData<UserType, AccessType>) => void;
|
|
584
|
+
canUpdate?: boolean;
|
|
585
|
+
roleTopMessage?: string;
|
|
586
|
+
};
|
|
587
|
+
|
|
588
|
+
export declare const ShareModal: <UserType, InvitationType, AccessType>({ searchUsersResult, children, outsideSearchContent, accesses: members, invitations, hasNextMembers, canUpdate, hasNextInvitations, ...props }: PropsWithChildren<ShareModalProps<UserType, InvitationType, AccessType>>) => JSX.Element;
|
|
589
|
+
|
|
590
|
+
declare type ShareModalAccessProps<UserType, AccessType> = {
|
|
591
|
+
accesses?: AccessData<UserType, AccessType>[];
|
|
592
|
+
hasNextMembers?: boolean;
|
|
593
|
+
onLoadNextMembers?: () => void;
|
|
594
|
+
onDeleteAccess?: (access: AccessData<UserType, AccessType>) => void;
|
|
595
|
+
onUpdateAccess?: (access: AccessData<UserType, AccessType>, role: string) => void;
|
|
596
|
+
accessRoleTopMessage?: (access: AccessData<UserType, AccessType>) => string | undefined;
|
|
597
|
+
};
|
|
598
|
+
|
|
599
|
+
export declare const ShareModalCopyLinkFooter: ({ onCopyLink, onOk, }: ShareModalCopyLinkFooterProps) => JSX.Element;
|
|
600
|
+
|
|
601
|
+
export declare type ShareModalCopyLinkFooterProps = {
|
|
602
|
+
onCopyLink: () => void;
|
|
603
|
+
onOk: () => void;
|
|
604
|
+
};
|
|
605
|
+
|
|
606
|
+
declare type ShareModalInvitationProps<UserType, InvitationType> = {
|
|
607
|
+
invitations?: InvitationData<UserType, InvitationType>[];
|
|
608
|
+
onUpdateInvitation?: (invitation: InvitationData<UserType, InvitationType>, role: string) => void;
|
|
609
|
+
onDeleteInvitation?: (invitation: InvitationData<UserType, InvitationType>) => void;
|
|
610
|
+
hasNextInvitations?: boolean;
|
|
611
|
+
onLoadNextInvitations?: () => void;
|
|
612
|
+
invitationRoleTopMessage?: (invitation: InvitationData<UserType, InvitationType>) => string;
|
|
613
|
+
};
|
|
614
|
+
|
|
615
|
+
/**
|
|
616
|
+
* Only the props for the modal and generic props
|
|
617
|
+
* The modal is generic and can be with all types as long as the types meet the minimum requirements
|
|
618
|
+
* Like the modal, we can search users, list invitations and members and modify them, that's why we give the corresponding types
|
|
619
|
+
*/
|
|
620
|
+
export declare type ShareModalProps<UserType, InvitationType, AccessType> = {
|
|
621
|
+
modalTitle?: string;
|
|
622
|
+
isOpen: boolean;
|
|
623
|
+
canUpdate?: boolean;
|
|
624
|
+
onClose: () => void;
|
|
625
|
+
invitationRoles: DropdownMenuOption[];
|
|
626
|
+
getAccessRoles?: (access: AccessData<UserType, AccessType>) => DropdownMenuOption[];
|
|
627
|
+
outsideSearchContent?: ReactNode;
|
|
628
|
+
} & ShareModalInvitationProps<UserType, InvitationType> & ShareModalAccessProps<UserType, AccessType> & ShareModalSearchProps<UserType>;
|
|
629
|
+
|
|
630
|
+
declare type ShareModalSearchProps<UserType> = {
|
|
631
|
+
searchUsersResult?: UserData<UserType>[];
|
|
632
|
+
onSearchUsers: (search: string) => void;
|
|
633
|
+
searchPlaceholder?: string;
|
|
634
|
+
onInviteUser: (users: UserData<UserType>[], role: string) => void;
|
|
635
|
+
loading?: boolean;
|
|
636
|
+
};
|
|
637
|
+
|
|
638
|
+
export declare type ShareSelectedUserItemProps<UserType> = {
|
|
639
|
+
user: UserData<UserType>;
|
|
640
|
+
onRemoveUser: (user: UserData<UserType>) => void;
|
|
641
|
+
};
|
|
642
|
+
|
|
501
643
|
export declare const Spinner: ({ size }: SpinnerProps) => JSX.Element;
|
|
502
644
|
|
|
503
|
-
declare
|
|
645
|
+
declare type SpinnerProps = {
|
|
504
646
|
size?: "sm" | "md" | "lg" | "xl";
|
|
505
|
-
}
|
|
647
|
+
};
|
|
506
648
|
|
|
507
649
|
export declare type TabData = {
|
|
508
650
|
id: string;
|
|
@@ -551,7 +693,7 @@ export declare type TreeProviderProps<T> = {
|
|
|
551
693
|
onLoadChildren?: (id: string) => Promise<TreeViewDataType<T>[]>;
|
|
552
694
|
};
|
|
553
695
|
|
|
554
|
-
export declare const TreeView: <T>({ initialOpenState, selectedNodeId, rootNodeId, renderNode, canDrop, canDrag, afterMove, }: TreeViewProps<T>) => JSX.Element | undefined;
|
|
696
|
+
export declare const TreeView: <T>({ initialOpenState, selectedNodeId, rootNodeId, renderNode, canDrop, canDrag, afterMove, beforeMove, }: TreeViewProps<T>) => JSX.Element | undefined;
|
|
555
697
|
|
|
556
698
|
export declare type TreeViewDataType<T> = BaseTreeViewData<T>;
|
|
557
699
|
|
|
@@ -594,6 +736,7 @@ export declare type TreeViewProps<T> = {
|
|
|
594
736
|
index: number;
|
|
595
737
|
}) => boolean;
|
|
596
738
|
canDrag?: (node: TreeDataItem<T>) => boolean;
|
|
739
|
+
beforeMove?: (result: TreeViewMoveResult, moveCallback: () => void) => void;
|
|
597
740
|
afterMove?: (result: TreeViewMoveResult) => void;
|
|
598
741
|
renderNode: (props: NodeRendererProps<TreeDataItem<T>>) => React.ReactNode;
|
|
599
742
|
};
|
|
@@ -605,18 +748,36 @@ export declare const useDropdownMenu: () => {
|
|
|
605
748
|
setIsOpen: Dispatch<SetStateAction<boolean>>;
|
|
606
749
|
};
|
|
607
750
|
|
|
751
|
+
export declare const UserAvatar: ({ fullName, size, forceColor, }: AvatarProps) => JSX.Element;
|
|
752
|
+
|
|
753
|
+
export declare type UserData<T> = T & {
|
|
754
|
+
id: string;
|
|
755
|
+
full_name: string;
|
|
756
|
+
email: string;
|
|
757
|
+
};
|
|
758
|
+
|
|
608
759
|
export declare const useResponsive: () => {
|
|
609
760
|
isMobile: boolean;
|
|
610
761
|
isTablet: boolean;
|
|
611
762
|
isDesktop: boolean;
|
|
612
763
|
};
|
|
613
764
|
|
|
765
|
+
declare type UserProps = {
|
|
766
|
+
fullName?: string;
|
|
767
|
+
email?: string;
|
|
768
|
+
showEmail?: boolean;
|
|
769
|
+
};
|
|
770
|
+
|
|
771
|
+
export declare const UserRow: ({ fullName: full_name, email, showEmail, }: UserProps) => JSX.Element;
|
|
772
|
+
|
|
614
773
|
export declare const useTree: <T>(initialItems: TreeViewDataType<T>[], refreshCallback?: (id: string) => Promise<Partial<TreeViewDataType<T>>>, loadChildrenCallback?: (id: string) => Promise<TreeViewDataType<T>[]>) => {
|
|
615
774
|
nodes: TreeDataItem<TreeViewDataType<T>>[];
|
|
616
775
|
addChild: (parentId: string | null, newNode: TreeViewDataType<T>, index?: number) => void;
|
|
617
776
|
updateNode: (nodeId: string, updatedData: Partial<TreeViewDataType<T>>) => void;
|
|
618
777
|
deleteNode: (nodeId: string) => void;
|
|
778
|
+
deleteNodes: (nodeIds: string[]) => void;
|
|
619
779
|
addRootNode: (newNode: TreeViewDataType<T>, index?: number) => void;
|
|
780
|
+
addRootNodes: (newNodes: TreeViewDataType<T>[], index?: number) => void;
|
|
620
781
|
selectedNode: T | undefined;
|
|
621
782
|
setSelectedNode: Dispatch<SetStateAction<T | undefined>>;
|
|
622
783
|
refreshNode: (nodeId: string) => Promise<void>;
|