treege 0.4.19 → 0.5.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/CHANGELOG.md CHANGED
@@ -1,4 +1,10 @@
1
1
  # [Versions](https://github.com/Tracktor/treege/releases)
2
2
 
3
- ## v0.4.19
4
- - Improve Treege props type
3
+ ## v0.5.0
4
+ - Add new props "initialTreeId"
5
+ - Remove helper text name to tree name text field
6
+ - Default tree name props
7
+ - Fix translation
8
+ - Improve tree select
9
+ - Disable some features when endpoint is not provided
10
+ - Documentation
package/README.md CHANGED
@@ -8,6 +8,7 @@
8
8
  - [Features](#Features)
9
9
  - [Installation](#Installation)
10
10
  - [Usage](#Usage)
11
+ - [Options](#Options)
11
12
  - [Generate form from Treege data](#Generate-form-from-Treege-data)
12
13
  - [Local installation](#local-installation)
13
14
  - [Available Scripts](#Available-Scripts)
@@ -44,6 +45,15 @@ const App = () => {
44
45
  export default App;
45
46
  ```
46
47
 
48
+ ### Options
49
+
50
+ | Props | Type | Default | Required | Detail |
51
+ |---------------|--------|-----------|----------|-----------------------------------------------------------------------------------------------|
52
+ | authToken | string | undefined | false | Authentication token |
53
+ | endPoint | string | undefined | false | Endpoint for API communication |
54
+ | initialTreeId | string | undefined | false | If provided, this will fetch initial tree id. Cannot provided with `initialTree` in same time |
55
+ | initialTree | object | undefined | false | Initial tree data. Cannot provided with `initialTreeId` in same time |
56
+
47
57
  ## Generate form from Treege data
48
58
 
49
59
  Form can be easily generated with the React library [treege-consumer](https://github.com/Tracktor/treege-consumer)
@@ -8,5 +8,5 @@ interface TreeProps {
8
8
  };
9
9
  renderCustomNodeElement?: TreeRenderCustomNodeElementFn;
10
10
  }
11
- declare const _default: import("react").MemoExoticComponent<({ data, renderCustomNodeElement, nodeSize, }: TreeProps) => JSX.Element | null>;
11
+ declare const _default: import("react").MemoExoticComponent<({ data, renderCustomNodeElement, nodeSize, }: TreeProps) => JSX.Element>;
12
12
  export default _default;
@@ -2,7 +2,6 @@
2
2
  interface ViewerJSONProps {
3
3
  value: any;
4
4
  downloadedFileName?: string;
5
- onSave?(): void;
6
5
  }
7
- declare const ViewerJSONAction: ({ downloadedFileName, onSave, value }: ViewerJSONProps) => JSX.Element;
6
+ declare const ViewerJSONAction: ({ downloadedFileName, value }: ViewerJSONProps) => JSX.Element;
8
7
  export default ViewerJSONAction;
@@ -1,5 +1,6 @@
1
1
  declare const useViewerJSONAction: () => {
2
2
  formatJSON: (value: any) => string;
3
3
  getDownloadLink: (value: any) => string;
4
+ handleSubmit: () => void;
4
5
  };
5
6
  export default useViewerJSONAction;
@@ -0,0 +1,3 @@
1
+ import { QueryClient } from "react-query";
2
+ declare const queryClient: QueryClient;
3
+ export default queryClient;
@@ -0,0 +1,12 @@
1
+ <svg width="114" height="103" viewBox="0 0 114 103" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <g clip-path="url(#clip0_2_59)">
3
+ <path d="M102.797 28.1471L87.4678 1.50761C87.2052 1.0508 86.828 0.671162 86.3738 0.406614C85.9195 0.142066 85.4041 0.00186148 84.8791 0L29.1359 0C28.6108 0.00186148 28.0954 0.142066 27.6412 0.406614C27.1869 0.671162 26.8097 1.0508 26.5472 1.50761L11.2551 28.1471C10.9922 28.6047 10.8535 29.1237 10.853 29.6521C10.8526 30.1804 10.9903 30.6997 11.2525 31.1577C11.5147 31.6158 11.8921 31.9966 12.3469 32.262C12.8017 32.5274 13.3179 32.6681 13.8438 32.6699H100.194C100.721 32.6707 101.239 32.532 101.696 32.2676C102.153 32.0033 102.532 31.6228 102.796 31.1643C103.06 30.7058 103.199 30.1855 103.199 29.6558C103.2 29.1262 103.061 28.6058 102.797 28.1471Z" fill="#11D3B4"/>
4
+ <path d="M69.3919 103H84.8641C85.3929 103.002 85.913 102.864 86.3715 102.599C86.8301 102.334 87.2108 101.953 87.4753 101.492L113.595 56.0379C113.858 55.5792 113.997 55.0589 113.997 54.5292C113.997 53.9995 113.858 53.4793 113.594 53.0208C113.33 52.5623 112.95 52.1817 112.493 51.9174C112.036 51.6531 111.518 51.5143 110.991 51.5151H69.3919C68.5959 51.5151 67.8325 51.8328 67.2696 52.3982C66.7068 52.9637 66.3906 53.7306 66.3906 54.5303V99.9848C66.3906 100.784 66.7068 101.551 67.2696 102.117C67.8325 102.682 68.5959 103 69.3919 103Z" fill="#007EF6"/>
5
+ <path d="M44.6305 51.5H3.00136C2.47477 51.5005 1.95758 51.6403 1.50174 51.9051C1.04591 52.17 0.667454 52.5507 0.404391 53.009C0.141329 53.4672 0.00291666 53.987 0.00305186 54.516C0.00318705 55.045 0.141865 55.5647 0.405162 56.0228L26.5472 101.507C26.8097 101.964 27.187 102.344 27.6412 102.608C28.0955 102.873 28.6108 103.013 29.1359 103.015H44.6305C45.4265 103.015 46.19 102.697 46.7528 102.132C47.3157 101.566 47.6319 100.8 47.6319 99.9999V54.5077C47.6299 53.7093 47.3128 52.9443 46.7502 52.3805C46.1875 51.8166 45.4252 51.5 44.6305 51.5Z" fill="#0164A8"/>
6
+ </g>
7
+ <defs>
8
+ <clipPath id="clip0_2_59">
9
+ <rect width="114" height="103" fill="white"/>
10
+ </clipPath>
11
+ </defs>
12
+ </svg>
@@ -1,13 +1,20 @@
1
1
  /// <reference types="react" />
2
2
  import type { TreeNode } from '../../features/Treege/type/TreeNode';
3
3
  declare type TreegeProps = {
4
- initialTree?: TreeNode;
5
- authToken?: never;
6
- endPoint?: never;
4
+ authToken?: string;
5
+ endPoint?: string;
6
+ initialTree?: never;
7
+ initialTreeId?: never;
7
8
  } | {
8
- initialTree?: TreeNode;
9
- authToken: string;
10
- endPoint: string;
9
+ authToken?: string;
10
+ endPoint?: string;
11
+ initialTree: TreeNode;
12
+ initialTreeId?: never;
13
+ } | {
14
+ authToken?: string;
15
+ endPoint?: string;
16
+ initialTree?: never;
17
+ initialTreeId: string;
11
18
  };
12
- declare const Treege: ({ authToken, endPoint, initialTree }: TreegeProps) => JSX.Element;
19
+ declare const Treege: ({ authToken, endPoint, initialTree, initialTreeId }: TreegeProps) => JSX.Element;
13
20
  export default Treege;
@@ -0,0 +1,9 @@
1
+ /// <reference types="react" />
2
+ import { SelectChangeEvent } from "design-system-tracktor";
3
+ import type { TreeNodeField } from '../../../../features/Treege/type/TreeNode';
4
+ interface FieldsSelectProps {
5
+ value: TreeNodeField["type"];
6
+ onChange?: (event: SelectChangeEvent<TreeNodeField["type"]>) => void;
7
+ }
8
+ declare const FieldsSelect: ({ onChange, value }: FieldsSelectProps) => JSX.Element;
9
+ export default FieldsSelect;
@@ -0,0 +1,3 @@
1
+ import FieldsSelect from "./FieldsSelect";
2
+ export default FieldsSelect;
3
+ export * from "./FieldsSelect";
@@ -0,0 +1,79 @@
1
+ declare const useFieldsSelect: () => {
2
+ fields: ({
3
+ readonly isBooleanField: false;
4
+ readonly isDecisionField: false;
5
+ readonly isRequiredDisabled: false;
6
+ readonly type: "text";
7
+ } | {
8
+ readonly isBooleanField: false;
9
+ readonly isDecisionField: false;
10
+ readonly isRequiredDisabled: false;
11
+ readonly type: "number";
12
+ } | {
13
+ readonly isBooleanField: false;
14
+ readonly isDecisionField: false;
15
+ readonly isRequiredDisabled: false;
16
+ readonly type: "email";
17
+ } | {
18
+ readonly isBooleanField: false;
19
+ readonly isDecisionField: false;
20
+ readonly isRequiredDisabled: false;
21
+ readonly type: "file";
22
+ } | {
23
+ readonly isBooleanField: false;
24
+ readonly isDecisionField: false;
25
+ readonly isRequiredDisabled: false;
26
+ readonly type: "password";
27
+ } | {
28
+ readonly isBooleanField: false;
29
+ readonly isDecisionField: false;
30
+ readonly isRequiredDisabled: false;
31
+ readonly type: "tel";
32
+ } | {
33
+ readonly isBooleanField: false;
34
+ readonly isDecisionField: false;
35
+ readonly isRequiredDisabled: false;
36
+ readonly type: "address";
37
+ } | {
38
+ readonly isBooleanField: false;
39
+ readonly isDecisionField: false;
40
+ readonly isRequiredDisabled: false;
41
+ readonly type: "url";
42
+ } | {
43
+ readonly isBooleanField: false;
44
+ readonly isDecisionField: false;
45
+ readonly isRequiredDisabled: false;
46
+ readonly type: "date";
47
+ } | {
48
+ readonly isBooleanField: false;
49
+ readonly isDecisionField: false;
50
+ readonly isRequiredDisabled: false;
51
+ readonly type: "time";
52
+ } | {
53
+ readonly isBooleanField: true;
54
+ readonly isDecisionField: false;
55
+ readonly isRequiredDisabled: true;
56
+ readonly type: "switch";
57
+ } | {
58
+ readonly isBooleanField: true;
59
+ readonly isDecisionField: false;
60
+ readonly isRequiredDisabled: true;
61
+ readonly type: "checkbox";
62
+ } | {
63
+ readonly isBooleanField: false;
64
+ readonly isDecisionField: true;
65
+ readonly isRequiredDisabled: false;
66
+ readonly type: "radio";
67
+ } | {
68
+ readonly isBooleanField: false;
69
+ readonly isDecisionField: true;
70
+ readonly isRequiredDisabled: false;
71
+ readonly type: "select";
72
+ } | {
73
+ readonly isBooleanField: false;
74
+ readonly isDecisionField: false;
75
+ readonly isRequiredDisabled: true;
76
+ readonly type: "tree";
77
+ })[];
78
+ };
79
+ export default useFieldsSelect;
@@ -6,6 +6,7 @@ declare const useFormTreeCardMutation: () => {
6
6
  handleAddValue: () => void;
7
7
  handleChangeHelperText: (event: ChangeEvent<HTMLInputElement>) => void;
8
8
  handleChangeIsDecisionField: (event: ChangeEvent<HTMLInputElement>) => void;
9
+ handleChangeIsRepeatable: (event: ChangeEvent<HTMLInputElement>) => void;
9
10
  handleChangeLabel: (event: ChangeEvent<HTMLInputElement>) => void;
10
11
  handleChangeMessage: (nameMessage: "on" | "off") => (event: ChangeEvent<HTMLInputElement>) => void;
11
12
  handleChangeName: (event: ChangeEvent<HTMLInputElement>) => void;
@@ -14,7 +15,7 @@ declare const useFormTreeCardMutation: () => {
14
15
  handleChangeOptionValue: (event: ChangeEvent<HTMLInputElement>) => void;
15
16
  handleChangeRequired: (event: ChangeEvent<HTMLInputElement>) => void;
16
17
  handleChangeStep: (event: ChangeEvent<HTMLInputElement>) => void;
17
- handleChangeTreeSelect: (event: SelectChangeEvent<string>) => void;
18
+ handleChangeTreeSelect: (event: SelectChangeEvent) => void;
18
19
  handleChangeType: (event: SelectChangeEvent<TreeNodeField["type"]>) => void;
19
20
  handleDeleteValue: (idToDelete: string) => void;
20
21
  handleSubmit: (e: FormEvent) => Promise<void>;
@@ -22,6 +23,7 @@ declare const useFormTreeCardMutation: () => {
22
23
  isBooleanField: boolean;
23
24
  isDecision: boolean;
24
25
  isDecisionField: boolean;
26
+ isRepeatable: boolean;
25
27
  isRequiredDisabled: boolean;
26
28
  isTree: boolean;
27
29
  isWorkflowLoading: boolean;
@@ -1,12 +1,8 @@
1
- import type { SelectChangeEvent } from "design-system-tracktor";
2
1
  declare const useTreeGrid: () => {
3
2
  closeModal: () => void;
4
3
  getTitleModalDelete: () => string;
5
4
  getTitleModalMutation: () => string;
6
- handleChangeTree: ({ target }: SelectChangeEvent) => void;
7
- handleSubmit: () => void;
8
5
  isDeleteModal: boolean;
9
6
  isModalMutationOpen: boolean;
10
- treeSelected: string;
11
7
  };
12
8
  export default useTreeGrid;
@@ -6,7 +6,7 @@ interface TreeSelectProps {
6
6
  required?: boolean;
7
7
  showBtnAddNewTree?: boolean;
8
8
  value?: string;
9
- onChange: (event: SelectChangeEvent) => void;
9
+ onChange?: (event: SelectChangeEvent) => void;
10
10
  }
11
11
  declare const TreeSelect: ({ arrowOnly, required, size, showBtnAddNewTree, onChange, value }: TreeSelectProps) => JSX.Element;
12
12
  export default TreeSelect;
@@ -1,5 +1,16 @@
1
- declare const useTreeSelect: () => {
1
+ /// <reference types="react" />
2
+ import type { SelectChangeEvent } from "design-system-tracktor";
3
+ declare const useTreeSelect: (isControlled: boolean) => {
4
+ currentTree: {
5
+ id?: string | undefined;
6
+ name?: string | undefined;
7
+ errorName?: string | undefined;
8
+ };
2
9
  fetchWorkflowSuggestions: () => Promise<import("react-query").QueryObserverResult<import("../../../../services/workflows/query/useWorkflowQueryFetcher").WorkflowsResponse[], any>>;
10
+ handleChangeTree: ({ target }: SelectChangeEvent) => Promise<void>;
11
+ handleOnOpen: () => Promise<import("react-query").QueryObserverResult<import("../../../../services/workflows/query/useWorkflowQueryFetcher").WorkflowsResponse[], any>>;
12
+ setTreeSelected: import("react").Dispatch<import("react").SetStateAction<string>>;
13
+ treeSelected: string;
3
14
  workflowsSuggestions: import("../../../../services/workflows/query/useWorkflowQueryFetcher").WorkflowsResponse[] | undefined;
4
15
  workflowsSuggestionsLoading: boolean;
5
16
  };
@@ -4,6 +4,7 @@ interface TreegeProviderProps {
4
4
  children: ReactNode;
5
5
  endPoint?: string;
6
6
  initialTree?: TreeNode;
7
+ initialTreeId?: string;
7
8
  }
8
- declare const TreegeProvider: ({ children, endPoint, initialTree }: TreegeProviderProps) => JSX.Element;
9
+ declare const TreegeProvider: ({ children, endPoint, initialTree, initialTreeId }: TreegeProviderProps) => JSX.Element;
9
10
  export default TreegeProvider;
@@ -27,6 +27,7 @@ export interface TreeNodeField {
27
27
  message?: never;
28
28
  tree?: TreeNode;
29
29
  treePath?: string;
30
+ isRepeatable?: boolean;
30
31
  }
31
32
  export interface TreeNodeValues {
32
33
  depth: number;
@@ -44,6 +45,7 @@ export interface TreeNodeValues {
44
45
  message?: string;
45
46
  tree?: never;
46
47
  treePath?: never;
48
+ isRepeatable?: never;
47
49
  }
48
50
  export declare type TreeNodeAttributes = TreeNodeField | TreeNodeValues;
49
51
  export interface TreeNode extends Omit<RawNodeDatum, "attributes" | "children"> {