@gouvfr-lasuite/ui-kit 0.0.1 → 0.0.2

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/index.d.ts CHANGED
@@ -1,19 +1,29 @@
1
1
  import { CunninghamProvider as CunninghamProvider_2 } from '@openfun/cunningham-react';
2
2
  import { CursorProps } from 'react-arborist';
3
3
  import { Dispatch } from 'react';
4
- import { JSX as JSX_2 } from 'react/jsx-runtime';
4
+ import { JSX } from 'react/jsx-runtime';
5
+ import { Key } from 'react-stately';
5
6
  import { LabelHTMLAttributes } from 'react';
7
+ import { NodeApi } from 'react-arborist';
6
8
  import { NodeRendererProps } from 'react-arborist';
7
9
  import { PropsWithChildren } from 'react';
8
10
  import { ReactNode } from 'react';
9
11
  import { SetStateAction } from 'react';
10
12
 
11
- export declare type BaseTreeViewData<T> = T & {
13
+ export declare type BaseTreeViewData<T> = {
12
14
  id: string;
13
15
  childrenCount?: number;
14
- parentId?: string;
15
- children?: BaseTreeViewData<T>[];
16
- };
16
+ hasLoadedChildren?: boolean;
17
+ subItems?: BaseTreeViewData<T>[];
18
+ canDrop?: boolean;
19
+ } & (({
20
+ type: TreeViewNodeTypeEnum.TITLE;
21
+ title: string;
22
+ }) | ({
23
+ type: TreeViewNodeTypeEnum.SEPARATOR;
24
+ }) | ({
25
+ type?: Exclude<TreeViewNodeTypeEnum, TreeViewNodeTypeEnum.TITLE | TreeViewNodeTypeEnum.SEPARATOR>;
26
+ } & T));
17
27
 
18
28
  export declare const cunninghamConfig: {
19
29
  themes: {
@@ -312,11 +322,11 @@ export declare const cunninghamConfig: {
312
322
  };
313
323
  };
314
324
 
315
- export declare const CunninghamProvider: (props: Parameters<typeof CunninghamProvider_2>[0]) => JSX_2.Element;
325
+ export declare const CunninghamProvider: (props: Parameters<typeof CunninghamProvider_2>[0]) => JSX.Element;
316
326
 
317
- export declare const CustomTabs: ({ tabs, defaultSelectedTab, fullWidth, }: TabsProps) => JSX_2.Element | null;
327
+ export declare const CustomTabs: ({ tabs, defaultSelectedTab, fullWidth, }: TabsProps) => JSX.Element | null;
318
328
 
319
- export declare const DropdownMenu: ({ options, isOpen, onOpenChange, children, selectedValues, onSelectValue, }: PropsWithChildren<DropdownMenuProps>) => JSX_2.Element;
329
+ export declare const DropdownMenu: ({ options, isOpen, onOpenChange, children, selectedValues, onSelectValue, }: PropsWithChildren<DropdownMenuProps>) => JSX.Element;
320
330
 
321
331
  export declare type DropdownMenuOption = {
322
332
  label: string;
@@ -343,7 +353,7 @@ export declare function getLocales(): {
343
353
  frFR: any;
344
354
  };
345
355
 
346
- export declare const Header: ({ leftIcon, rightIcon, languages, onTogglePanel, isPanelOpen, }: HeaderProps) => JSX_2.Element;
356
+ export declare const Header: ({ leftIcon, rightIcon, languages, onTogglePanel, isPanelOpen, }: HeaderProps) => JSX.Element;
347
357
 
348
358
  export declare const headerHeight = 52;
349
359
 
@@ -355,25 +365,31 @@ export declare type HeaderProps = {
355
365
  isPanelOpen?: boolean;
356
366
  };
357
367
 
358
- export declare const HorizontalSeparator: ({ withPadding }: Props_3) => JSX_2.Element;
368
+ export declare const HorizontalSeparator: ({ withPadding }: Props_3) => JSX.Element;
369
+
370
+ export declare const isNode: <T>(node?: TreeViewDataType<T>) => boolean;
371
+
372
+ export declare const isSeparator: <T>(node?: TreeViewDataType<T>) => boolean;
373
+
374
+ export declare const isTitle: <T>(node?: TreeViewDataType<T>) => boolean;
359
375
 
360
376
  export declare const Label: ({ children, text, ...props }: LabelHTMLAttributes<HTMLLabelElement> & {
361
377
  text?: string;
362
- }) => JSX_2.Element;
378
+ }) => JSX.Element;
363
379
 
364
- export declare const LanguagePicker: ({ languages }: LanguagePickerProps) => JSX_2.Element;
380
+ export declare const LanguagePicker: ({ languages }: LanguagePickerProps) => JSX.Element;
365
381
 
366
382
  export declare type LanguagePickerProps = {
367
383
  languages: DropdownMenuOption[];
368
384
  };
369
385
 
370
- export declare const LeftPanel: ({ children, isOpen, }: PropsWithChildren<LeftPanelProps>) => JSX_2.Element;
386
+ export declare const LeftPanel: ({ children, isOpen, }: PropsWithChildren<LeftPanelProps>) => JSX.Element;
371
387
 
372
388
  export declare type LeftPanelProps = {
373
389
  isOpen?: boolean;
374
390
  };
375
391
 
376
- export declare const MainLayout: ({ icon, children, leftPanelContent, rightHeaderContent, languages, enableResize, }: PropsWithChildren<MainLayoutProps>) => JSX_2.Element;
392
+ export declare const MainLayout: ({ icon, children, leftPanelContent, rightHeaderContent, languages, enableResize, }: PropsWithChildren<MainLayoutProps>) => JSX.Element;
377
393
 
378
394
  export declare type MainLayoutProps = {
379
395
  icon?: React.ReactNode;
@@ -384,7 +400,7 @@ export declare type MainLayoutProps = {
384
400
  enableResize?: boolean;
385
401
  };
386
402
 
387
- export declare const ProConnectButton: ({ disabled, onClick, }: ProConnectButtonProps) => JSX_2.Element;
403
+ export declare const ProConnectButton: ({ disabled, onClick, }: ProConnectButtonProps) => JSX.Element;
388
404
 
389
405
  export declare type ProConnectButtonProps = {
390
406
  disabled?: boolean;
@@ -409,7 +425,7 @@ declare type Props_3 = {
409
425
  withPadding?: boolean;
410
426
  };
411
427
 
412
- export declare const QuickSearch: ({ onFilter, inputContent, inputValue, loading, showInput, label, placeholder, children, }: QuickSearchProps) => JSX_2.Element;
428
+ export declare const QuickSearch: ({ onFilter, inputContent, inputValue, loading, showInput, label, placeholder, children, }: QuickSearchProps) => JSX.Element;
413
429
 
414
430
  export declare type QuickSearchAction = {
415
431
  onSelect?: () => void;
@@ -425,7 +441,7 @@ export declare type QuickSearchData<T> = {
425
441
  showWhenEmpty?: boolean;
426
442
  };
427
443
 
428
- export declare const QuickSearchGroup: <T>({ group, onSelect, renderElement, }: QuickSearchGroupProps<T>) => JSX_2.Element | null;
444
+ export declare const QuickSearchGroup: <T>({ group, onSelect, renderElement, }: QuickSearchGroupProps<T>) => JSX.Element | null;
429
445
 
430
446
  export declare type QuickSearchGroupProps<T> = {
431
447
  group: QuickSearchData<T>;
@@ -433,11 +449,11 @@ export declare type QuickSearchGroupProps<T> = {
433
449
  onSelect?: (element: T) => void;
434
450
  };
435
451
 
436
- export declare const QuickSearchInput: ({ loading, inputValue, onFilter, placeholder, children, withSeparator: separator, }: Props_2) => JSX_2.Element;
452
+ export declare const QuickSearchInput: ({ loading, inputValue, onFilter, placeholder, children, withSeparator: separator, }: Props_2) => JSX.Element;
437
453
 
438
- export declare const QuickSearchItem: ({ children, onSelect, id, }: PropsWithChildren<Props>) => JSX_2.Element;
454
+ export declare const QuickSearchItem: ({ children, onSelect, id, }: PropsWithChildren<Props>) => JSX.Element;
439
455
 
440
- export declare const QuickSearchItemTemplate: ({ alwaysShowRight, left, right, }: QuickSearchItemTemplateProps) => JSX_2.Element;
456
+ export declare const QuickSearchItemTemplate: ({ alwaysShowRight, left, right, }: QuickSearchItemTemplateProps) => JSX.Element;
441
457
 
442
458
  export declare type QuickSearchItemTemplateProps = {
443
459
  alwaysShowRight?: boolean;
@@ -456,7 +472,7 @@ export declare type QuickSearchProps = {
456
472
  children?: ReactNode;
457
473
  };
458
474
 
459
- export declare const Spinner: ({ size }: SpinnerProps) => JSX_2.Element;
475
+ export declare const Spinner: ({ size }: SpinnerProps) => JSX.Element;
460
476
 
461
477
  declare interface SpinnerProps {
462
478
  size?: "sm" | "md" | "lg" | "xl";
@@ -475,31 +491,22 @@ export declare type TabsProps = {
475
491
  fullWidth?: boolean;
476
492
  };
477
493
 
478
- export declare const treeDemoData: ({
479
- id: string;
480
- name: string;
481
- childrenCount?: undefined;
482
- children?: undefined;
483
- } | {
484
- id: string;
485
- name: string;
486
- childrenCount: number;
487
- children: never[];
488
- } | {
489
- id: string;
490
- name: string;
491
- children: {
492
- id: string;
493
- name: string;
494
- }[];
495
- childrenCount?: undefined;
496
- })[];
494
+ export declare type TreeDataItem<T> = {
495
+ /** A unique key for the tree node. */
496
+ key: string;
497
+ /** The key of the parent node. */
498
+ parentKey?: string | null;
499
+ /** The value object for the tree node. */
500
+ value: TreeViewDataType<T>;
501
+ /** Children of the tree node. */
502
+ children: TreeDataItem<T>[] | null;
503
+ };
497
504
 
498
- export declare const TreeView: <T>({ treeData, selectedNodeId, rootNodeId, renderNode, afterMove, }: TreeViewProps<T>) => JSX_2.Element;
505
+ export declare const TreeView: <T>({ treeData, selectedNodeId, rootNodeId, renderNode, handleMove, canDrop, canDrag, }: TreeViewProps<T>) => JSX.Element;
499
506
 
500
507
  export declare type TreeViewDataType<T> = BaseTreeViewData<T>;
501
508
 
502
- export declare const TreeViewItem: <T>({ children, onClick, node, dragHandle, style, loadChildren, forceLoading, }: PropsWithChildren<TreeViewNodeProps<T>>) => JSX_2.Element;
509
+ export declare const TreeViewItem: <T>({ children, onClick, node, dragHandle, style, loadChildren, forceLoading, }: PropsWithChildren<TreeViewNodeProps<T>>) => JSX.Element;
503
510
 
504
511
  export declare enum TreeViewMoveModeEnum {
505
512
  FIRST_CHILD = "first-child",
@@ -509,28 +516,41 @@ export declare enum TreeViewMoveModeEnum {
509
516
  }
510
517
 
511
518
  export declare type TreeViewMoveResult = {
512
- targetNodeId: string;
519
+ targetModeId: string;
513
520
  mode: TreeViewMoveModeEnum;
514
- sourceNodeId: string;
515
521
  oldParentId?: string;
522
+ index: number;
523
+ newParentId: string | null;
524
+ sourceId: string;
516
525
  };
517
526
 
518
- export declare type TreeViewNodeProps<T> = NodeRendererProps<TreeViewDataType<T>> & {
527
+ export declare type TreeViewNodeProps<T> = NodeRendererProps<TreeDataItem<T>> & {
519
528
  onClick?: () => void;
520
529
  forceLoading?: boolean;
521
530
  loadChildren?: (node: TreeViewDataType<T>) => Promise<TreeViewDataType<T>[]>;
522
531
  };
523
532
 
533
+ export declare enum TreeViewNodeTypeEnum {
534
+ NODE = "node",
535
+ SEPARATOR = "separator",
536
+ TITLE = "title"
537
+ }
538
+
524
539
  export declare type TreeViewProps<T> = {
525
- treeData: TreeViewDataType<T>[];
526
- width?: number | string;
540
+ treeData: TreeDataItem<T>[];
527
541
  selectedNodeId?: string;
528
542
  rootNodeId: string;
529
- renderNode: (props: NodeRendererProps<TreeViewDataType<T>>) => React.ReactNode;
530
- afterMove?: (result: TreeViewMoveResult, newTreeData: TreeViewDataType<T>[]) => void;
543
+ canDrop?: (args: {
544
+ parentNode: NodeApi<TreeDataItem<T>> | null;
545
+ dragNodes: NodeApi<TreeDataItem<T>>[];
546
+ index: number;
547
+ }) => boolean;
548
+ canDrag?: (node: TreeDataItem<T>) => boolean;
549
+ handleMove?: (result: TreeViewMoveResult) => void;
550
+ renderNode: (props: NodeRendererProps<TreeDataItem<T>>) => React.ReactNode;
531
551
  };
532
552
 
533
- export declare const TreeViewSeparator: ({ top, left }: CursorProps) => JSX_2.Element;
553
+ export declare const TreeViewSeparator: ({ top, left }: CursorProps) => JSX.Element;
534
554
 
535
555
  export declare const useDropdownMenu: () => {
536
556
  isOpen: boolean;
@@ -543,20 +563,26 @@ export declare const useResponsive: () => {
543
563
  isDesktop: boolean;
544
564
  };
545
565
 
546
- export declare const useTree: <T>(tree: TreeViewDataType<T>[], refreshCallback?: (id: string) => Promise<Partial<TreeViewDataType<T>>>) => {
547
- treeData: TreeViewDataType<T>[];
548
- setTreeData: Dispatch<SetStateAction<TreeViewDataType<T>[]>>;
549
- addChild: (parentId: string, newNode: TreeViewDataType<T>) => void;
566
+ export declare const useTree: <T extends object>(initialItems: TreeViewDataType<T>[], refreshCallback?: (id: string) => Promise<Partial<TreeViewDataType<T>>>, loadChildrenCallback?: (id: string) => Promise<TreeViewDataType<T>[]>) => {
567
+ nodes: TreeDataItem<TreeViewDataType<T>>[];
568
+ addChild: (parentId: string | null, newNode: TreeViewDataType<T>) => void;
550
569
  updateNode: (nodeId: string, updatedData: Partial<TreeViewDataType<T>>) => void;
551
570
  deleteNode: (nodeId: string) => void;
552
571
  addRootNode: (newNode: TreeViewDataType<T>) => void;
553
572
  selectedNode: TreeViewDataType<T> | undefined;
554
573
  setSelectedNode: Dispatch<SetStateAction<TreeViewDataType<T> | undefined>>;
555
574
  refreshNode: (nodeId: string) => Promise<void>;
556
- setChildren: (parentId: string, newChildren: TreeViewDataType<T>[], mergeStrategy?: "replace" | "merge") => void;
575
+ setChildren: (parentId: string, newChildren: TreeViewDataType<T>[]) => void;
576
+ insertBeforeNode: (nodeId: string, newNode: TreeViewDataType<T>) => void;
577
+ insertAfterNode: (nodeId: string, newNode: TreeViewDataType<T>) => void;
578
+ handleMove: (result: TreeViewMoveResult) => void;
579
+ prependToNode: (nodeId: string, newNode: TreeViewDataType<T>) => void;
580
+ moveNode: (nodeId: string, newParentId: string | null, newIndex: number, oldParentId?: string | null) => void;
581
+ move: (key: Key, toParentKey: Key | null, index: number) => void;
582
+ handleLoadChildren: (nodeId: string) => Promise<TreeViewDataType<T>[]>;
557
583
  };
558
584
 
559
- export declare const WithLabel: ({ label, text, labelSide, children, }: PropsWithChildren<WithLabelProps>) => JSX_2.Element;
585
+ export declare const WithLabel: ({ label, text, labelSide, children, }: PropsWithChildren<WithLabelProps>) => JSX.Element;
560
586
 
561
587
  export declare type WithLabelProps = {
562
588
  label: string;