aio-tree 1.0.0 → 1.1.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 (4) hide show
  1. package/index.css +1 -0
  2. package/index.d.ts +23 -9
  3. package/index.js +238 -191
  4. package/package.json +21 -21
package/index.css CHANGED
@@ -25,6 +25,7 @@
25
25
  .aio-input-tree-row{
26
26
  display:flex;
27
27
  align-items: center;
28
+ padding:0 0.4em;
28
29
  }
29
30
  .aio-input-tree-text{
30
31
  flex:1;
package/index.d.ts CHANGED
@@ -1,10 +1,11 @@
1
- import { FC, ReactNode } from "react";
1
+ import { type FC, type ReactNode } from "react";
2
2
  import './index.css';
3
- export type I_treeRef = React.RefObject<ReturnType<typeof useTree>>;
3
+ export type I_useTree = ReturnType<typeof useTree>;
4
+ export type I_treeRef = React.RefObject<ReturnType<typeof useTree> | undefined>;
4
5
  export type AI_Tree = {
5
6
  value: any[];
6
7
  indent?: number;
7
- onToggle?: (openDic: {
8
+ onToggle?: (detail: I_treeOptionDetail, state: boolean, openDic: {
8
9
  [id: string]: boolean;
9
10
  }) => void;
10
11
  setChilds?: (treeOptionDetail: I_treeOptionDetail, childs: undefined | any[]) => void;
@@ -55,23 +56,36 @@ export type I_treeOptionDetail = {
55
56
  attrs: any;
56
57
  };
57
58
  export declare const AITree: FC<AI_Tree>;
58
- export declare const useTree: (hookProps: {
59
- treeOptionProp?: I_treeOptionProp;
60
- onChange?: (v: any) => void;
61
- mainValueRef: React.RefObject<any[]>;
62
- }) => {
59
+ export declare const useTree: (getProps: () => AI_Tree) => {
63
60
  toggle: (treeOptionDetail: I_treeOptionDetail, state?: boolean) => void;
64
61
  openDic: any;
65
62
  isOpen: (treeOptionDetail?: I_treeOptionDetail) => boolean;
63
+ openByValue: (value: any, reset?: boolean) => void;
64
+ closeByValue: (value: any) => void;
65
+ getBodyClassName: (level: number, directParent?: I_treeOptionDetail) => string;
66
66
  change: (row: any, newRow: any) => void;
67
67
  getChilds: (treeOptionDetail: I_treeOptionDetail) => undefined | any[];
68
- setChilds: (treeOptionDetail: I_treeOptionDetail, childs: undefined | any[], setChilds?: AI_Tree["setChilds"]) => void;
69
68
  getOptions: (p: {
70
69
  rows: any[];
71
70
  level: number;
72
71
  parentOptions: I_treeOptionDetail[];
73
72
  }) => I_treeOptionDetail[];
74
73
  getTreeOptionDetailByValues: (values: any[], rows: any[]) => I_treeOptionDetail;
74
+ getIndentProps: (detail: I_treeOptionDetail) => {
75
+ width: number;
76
+ level: number;
77
+ isLastChild: boolean;
78
+ isLeaf: boolean;
79
+ isParentLastChild: boolean;
80
+ rtl: boolean;
81
+ toggleIcon: false | {
82
+ close?: ReactNode;
83
+ open?: ReactNode;
84
+ leaf?: ReactNode;
85
+ };
86
+ open: boolean;
87
+ onToggle: () => void;
88
+ };
75
89
  };
76
90
  type AI_Indent = {
77
91
  level: number;
package/index.js CHANGED
@@ -2,17 +2,15 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
2
2
  import { createContext, useContext, useEffect, useRef, useState } from "react";
3
3
  import './index.css';
4
4
  export const AITree = (props) => {
5
- const mainValueRef = useRef(props.value);
6
- mainValueRef.current = props.value;
7
- const tree = useTree({ treeOptionProp: props.treeOption, onChange: props.onChange, mainValueRef });
5
+ const rootPropsRef = useRef(props);
6
+ rootPropsRef.current = props;
7
+ const tree = useTree(() => rootPropsRef.current);
8
8
  if (props.treeRef) {
9
9
  props.treeRef.current = tree;
10
10
  }
11
11
  let Attrs = AddToAttrs(props.attrs, { className: ['aio-input-tree', props.className, props.rtl ? 'aio-input-tree-rtl' : undefined], style: props.style });
12
12
  useEffect(() => {
13
- if (props.onToggle) {
14
- props.onToggle(tree.openDic);
15
- }
13
+ console.log(tree.openDic);
16
14
  }, [tree.openDic]);
17
15
  return (_jsx(TreeProvider, { value: { rootProps: props, tree }, children: _jsx("div", Object.assign({}, Attrs, { children: _jsx(TreeBody, { rows: props.value, level: 0, parentOptions: [] }) })) }));
18
16
  };
@@ -25,109 +23,102 @@ const TreeBody = (props) => {
25
23
  let { tree } = useTreeProvider();
26
24
  let { rows, level, parentOptions } = props;
27
25
  let list = tree.getOptions({ rows, level, parentOptions });
28
- function getClassName() {
29
- let className = 'aio-input-tree-body';
30
- if (level === 0) {
31
- className += ' aio-input-tree-root';
32
- }
33
- const directParent = parentOptions.length ? parentOptions[parentOptions.length - 1] : undefined;
34
- if (tree.isOpen(directParent)) {
35
- className += ' open';
36
- }
37
- className += ` aio-input-tree-body-level-${level}`;
38
- return className;
39
- }
40
- return (_jsx("div", { className: getClassName(), children: list.map((treeOptionDetail) => {
26
+ const directParent = parentOptions.length ? parentOptions[parentOptions.length - 1] : undefined;
27
+ return (_jsx("div", { className: tree.getBodyClassName(level, directParent), children: list.map((treeOptionDetail) => {
41
28
  return _jsx(TreeNode, { treeOptionDetail: treeOptionDetail }, treeOptionDetail.value);
42
29
  }) }));
43
30
  };
44
31
  const TreeNode = ({ treeOptionDetail }) => {
45
- let { tree } = useTreeProvider();
46
- const { level, parentOptions, open } = treeOptionDetail;
47
- const childs = tree.getChilds(treeOptionDetail);
32
+ const { level, parentOptions, open, childs } = treeOptionDetail;
48
33
  return (_jsxs(_Fragment, { children: [_jsx(TreeRow, { treeOptionDetail: treeOptionDetail }), Array.isArray(childs) && open !== false &&
49
34
  _jsx(TreeBody, { parentOptions: [...parentOptions, treeOptionDetail], rows: childs, level: level + 1 })] }));
50
35
  };
51
36
  const TreeRow = ({ treeOptionDetail }) => {
52
- let { tree, rootProps } = useTreeProvider();
53
- const { parentOptions, level, isLastChild, text, open } = treeOptionDetail;
54
- let childs = tree.getChilds(treeOptionDetail);
55
- const directParent = parentOptions.length ? parentOptions[parentOptions.length - 1] : undefined;
56
- const indent = treeOptionDetail.toggleIcon !== false && (_jsx(Indent, { width: rootProps.indent || 24, level: level, isLastChild: isLastChild, isLeaf: !childs, isParentLastChild: !!(directParent === null || directParent === void 0 ? void 0 : directParent.isLastChild), rtl: !!rootProps.rtl, toggleIcon: treeOptionDetail.toggleIcon, open: open, onToggle: () => tree.toggle(treeOptionDetail) }));
37
+ let { tree } = useTreeProvider();
38
+ const { text } = treeOptionDetail;
39
+ const indent = treeOptionDetail.toggleIcon !== false && (_jsx(Indent, Object.assign({}, tree.getIndentProps(treeOptionDetail))));
57
40
  return (_jsxs("div", Object.assign({}, treeOptionDetail.attrs, { children: [!!indent && indent, _jsx("div", { className: "aio-input-tree-text", children: text })] })));
58
41
  };
59
- export const useTree = (hookProps) => {
60
- let [openDic, setOpenDic] = useState({}), openDicRef = useRef(openDic);
42
+ export const useTree = (getProps) => {
43
+ let [openDic, _setOpenDic] = useState({}), openDicRef = useRef(openDic);
61
44
  openDicRef.current = openDic;
62
- const dicRef = useRef({});
63
- function SetOpen(id, state) {
64
- const newOpenDic = Object.assign(Object.assign({}, openDicRef.current), { [id]: state });
65
- setOpenDic(newOpenDic);
66
- }
67
- function toggle(treeOptionDetail, state) {
68
- const open = state === undefined ? treeOptionDetail.open : state;
69
- const newOpen = !open;
70
- SetOpen(treeOptionDetail.value, newOpen);
71
- }
72
- const isOpen = (treeOptionDetail) => {
73
- if (!treeOptionDetail) {
74
- return true;
75
- }
76
- const { parentOptions, value } = treeOptionDetail;
77
- for (let i = 0; i < parentOptions.length; i++) {
78
- const parentOption = parentOptions[i];
79
- if (openDicRef.current[parentOption.value] !== true) {
80
- return false;
81
- }
82
- }
83
- return openDicRef.current[value] === true;
45
+ const getOpenDic = () => openDicRef.current;
46
+ const setOpenDic = (v) => _setOpenDic(v);
47
+ const treeClassRef = useRef(new TreeClass({ getOpenDic, setOpenDic, getProps }));
48
+ const tree = treeClassRef.current;
49
+ return {
50
+ toggle: tree.toggle,
51
+ openDic,
52
+ isOpen: tree.isOpen,
53
+ openByValue: tree.openByValue,
54
+ closeByValue: tree.closeByValue,
55
+ getBodyClassName: tree.getBodyClassName,
56
+ change: tree.change,
57
+ getChilds: tree.getChilds,
58
+ getOptions: tree.getOptions,
59
+ getTreeOptionDetailByValues: tree.getTreeOptionDetailByValues,
60
+ getIndentProps: tree.getIndentProps
84
61
  };
85
- function change(row, newRow) {
86
- for (let prop in newRow) {
87
- row[prop] = newRow[prop];
88
- }
89
- if (hookProps.onChange) {
90
- hookProps.onChange(hookProps.mainValueRef.current);
91
- }
92
- }
93
- function getChilds(treeOptionDetail) {
94
- var _a;
95
- const { row } = treeOptionDetail;
96
- try {
97
- if (!!((_a = hookProps.treeOptionProp) === null || _a === void 0 ? void 0 : _a.childs)) {
98
- return hookProps.treeOptionProp.childs(treeOptionDetail);
62
+ };
63
+ class TreeClass {
64
+ constructor(p) {
65
+ this.dic = {};
66
+ this.toggle = (treeOptionDetail, state) => {
67
+ const open = state === undefined ? treeOptionDetail.open : state;
68
+ const newOpen = !open;
69
+ const newOpenDic = Object.assign(Object.assign({}, this.getOpenDic()), { [treeOptionDetail.value]: newOpen });
70
+ const { onToggle } = this.getProps();
71
+ if (onToggle) {
72
+ onToggle(treeOptionDetail, newOpen, newOpenDic);
99
73
  }
100
- else {
101
- return row.childs;
74
+ this.setOpenDic(newOpenDic);
75
+ };
76
+ this.isOpen = (treeOptionDetail) => {
77
+ if (!treeOptionDetail) {
78
+ return true;
102
79
  }
103
- }
104
- catch (_b) {
105
- return;
106
- }
107
- }
108
- function setChilds(treeOptionDetail, childs, setChilds) {
109
- try {
110
- if (setChilds) {
111
- setChilds(treeOptionDetail, childs);
80
+ const { parentOptions, value } = treeOptionDetail;
81
+ const openDic = this.getOpenDic();
82
+ for (let i = 0; i < parentOptions.length; i++) {
83
+ const parentOption = parentOptions[i];
84
+ if (openDic[parentOption.value] !== true) {
85
+ return false;
86
+ }
112
87
  }
113
- else {
114
- treeOptionDetail.row.childs = childs;
88
+ return openDic[value] === true;
89
+ };
90
+ this.change = (row, newRow) => {
91
+ for (let prop in newRow) {
92
+ row[prop] = newRow[prop];
115
93
  }
116
- }
117
- catch (_a) { }
118
- }
119
- function getOptions(p) {
120
- let { level, parentOptions, rows } = p;
121
- let list = [];
122
- for (let i = 0; i < rows.length; i++) {
123
- let row = rows[i];
94
+ const { onChange } = this.getProps();
95
+ if (onChange) {
96
+ onChange(this.getProps().value);
97
+ }
98
+ };
99
+ this.getChilds = (treeOptionDetail) => {
100
+ const { row } = treeOptionDetail;
101
+ try {
102
+ const { treeOption } = this.getProps();
103
+ if (!!(treeOption === null || treeOption === void 0 ? void 0 : treeOption.childs)) {
104
+ return treeOption.childs(treeOptionDetail);
105
+ }
106
+ else {
107
+ return row.childs;
108
+ }
109
+ }
110
+ catch (_a) {
111
+ return;
112
+ }
113
+ };
114
+ this.getOption = (row, index, level, parentOptions) => {
124
115
  const treeOptionDetail = {
125
116
  text: null,
126
117
  row,
127
118
  toggleIcon: undefined,
128
119
  childs: undefined,
129
120
  level,
130
- index: i,
121
+ index,
131
122
  parentOptions,
132
123
  open: false,
133
124
  toggle: () => { },
@@ -140,29 +131,29 @@ export const useTree = (hookProps) => {
140
131
  attrs: undefined,
141
132
  values: parentOptions.map((o) => o.value)
142
133
  };
143
- const value = getOptionValue(row, 'value', treeOptionDetail);
134
+ const value = this.getOptionValue(row, 'value', treeOptionDetail);
144
135
  treeOptionDetail.value = value;
145
136
  treeOptionDetail.values.push(value);
146
- treeOptionDetail.open = isOpen(treeOptionDetail);
147
- const childs = getOptionValue(row, 'childs', treeOptionDetail);
137
+ treeOptionDetail.open = this.isOpen(treeOptionDetail);
138
+ const childs = this.getOptionValue(row, 'childs', treeOptionDetail);
148
139
  treeOptionDetail.childs = childs;
149
140
  treeOptionDetail.isLeaf = !childs;
150
- treeOptionDetail.toggle = (state) => toggle(treeOptionDetail, state);
151
- treeOptionDetail.change = (newRow) => change(row, newRow);
152
- treeOptionDetail.toggleIcon = getOptionValue(row, 'toggleIcon', treeOptionDetail);
153
- const show = getOptionValue(row, 'show', treeOptionDetail, true);
141
+ treeOptionDetail.toggle = (state) => this.toggle(treeOptionDetail, state);
142
+ treeOptionDetail.change = (newRow) => this.change(row, newRow);
143
+ treeOptionDetail.toggleIcon = this.getOptionValue(row, 'toggleIcon', treeOptionDetail);
144
+ const show = this.getOptionValue(row, 'show', treeOptionDetail, true);
154
145
  if (show === false) {
155
- continue;
146
+ return;
156
147
  }
157
- treeOptionDetail.text = getOptionValue(row, 'text', treeOptionDetail);
158
- dicRef.current = Object.assign(Object.assign({}, dicRef.current), { [treeOptionDetail.value.toString()]: treeOptionDetail });
159
- const attrs = getOptionValue(row, 'attrs', treeOptionDetail);
160
- const className = getOptionValue(row, 'className', treeOptionDetail);
161
- const style = getOptionValue(row, 'style', treeOptionDetail);
148
+ treeOptionDetail.text = this.getOptionValue(row, 'text', treeOptionDetail);
149
+ this.dic = Object.assign(Object.assign({}, this.dic), { [treeOptionDetail.value.toString()]: treeOptionDetail });
150
+ const attrs = this.getOptionValue(row, 'attrs', treeOptionDetail);
151
+ const className = this.getOptionValue(row, 'className', treeOptionDetail);
152
+ const style = this.getOptionValue(row, 'style', treeOptionDetail);
162
153
  const onClick = () => {
163
- var _a, _b;
164
- if ((_a = hookProps.treeOptionProp) === null || _a === void 0 ? void 0 : _a.onClick) {
165
- (_b = hookProps.treeOptionProp) === null || _b === void 0 ? void 0 : _b.onClick(treeOptionDetail);
154
+ const { treeOption } = this.getProps();
155
+ if (treeOption === null || treeOption === void 0 ? void 0 : treeOption.onClick) {
156
+ treeOption === null || treeOption === void 0 ? void 0 : treeOption.onClick(treeOptionDetail);
166
157
  }
167
158
  else if (row.onClick) {
168
159
  row.onClick(treeOptionDetail);
@@ -170,52 +161,133 @@ export const useTree = (hookProps) => {
170
161
  };
171
162
  const Attrs = AddToAttrs(Object.assign(Object.assign({}, attrs), { onClick }), { className: [className, 'aio-input-tree-row'], style });
172
163
  treeOptionDetail.attrs = Attrs;
173
- list.push(treeOptionDetail);
174
- }
175
- if (list.length) {
176
- list[0].isFirstChild = true;
177
- list[list.length - 1].isLastChild = true;
178
- }
179
- return list;
180
- }
181
- const getOptionValue = (row, key, treeOptionDetail, def) => {
182
- let res;
183
- if (hookProps.treeOptionProp && hookProps.treeOptionProp[key]) {
184
- res = hookProps.treeOptionProp[key](treeOptionDetail);
185
- }
186
- if (res !== undefined && res !== null) {
187
- return res;
188
- }
189
- if (typeof row === 'object' && !Array.isArray(row)) {
190
- res = row[key];
191
- }
192
- if (res !== undefined && res !== null) {
164
+ return treeOptionDetail;
165
+ };
166
+ this.getOptions = (p) => {
167
+ let { level, parentOptions, rows } = p;
168
+ let list = [];
169
+ for (let index = 0; index < rows.length; index++) {
170
+ let row = rows[index];
171
+ const res = this.getOption(row, index, level, parentOptions);
172
+ if (res) {
173
+ list.push(res);
174
+ }
175
+ }
176
+ if (list.length) {
177
+ list[0].isFirstChild = true;
178
+ list[list.length - 1].isLastChild = true;
179
+ }
180
+ return list;
181
+ };
182
+ this.getOptionValue = (row, key, treeOptionDetail, def) => {
183
+ const { treeOption } = this.getProps();
184
+ let res;
185
+ if (treeOption && treeOption[key]) {
186
+ res = treeOption[key](treeOptionDetail);
187
+ }
188
+ if (res !== undefined && res !== null) {
189
+ return res;
190
+ }
191
+ if (typeof row === 'object' && !Array.isArray(row)) {
192
+ res = row[key];
193
+ }
194
+ if (res !== undefined && res !== null) {
195
+ return res;
196
+ }
197
+ return def;
198
+ };
199
+ this.getTreeOptionDetailByValue = (value, rows, level, parentOptions) => {
200
+ const res = this.getOptions({ rows, parentOptions, level });
201
+ return res.find((o) => o.value === value);
202
+ };
203
+ this.getTreeOptionDetailByValues = (values, rows) => {
204
+ let res = this.getTreeOptionDetailByValue(values[0], rows, 0, []);
205
+ if (!res) {
206
+ return;
207
+ }
208
+ for (let i = 1; i < values.length; i++) {
209
+ if (!res || !res.childs) {
210
+ return;
211
+ }
212
+ res = this.getTreeOptionDetailByValue(values[i], res.childs, i, [...res.parentOptions, res]);
213
+ }
193
214
  return res;
194
- }
195
- return def;
196
- };
197
- const getTreeOptionDetailByValue = (value, rows, level, parentOptions) => {
198
- const res = getOptions({ rows, parentOptions, level });
199
- return res.find((o) => o.value === value);
200
- };
201
- const getTreeOptionDetailByValues = (values, rows) => {
202
- let res = getTreeOptionDetailByValue(values[0], rows, 0, []);
203
- if (!res) {
204
- return;
205
- }
206
- for (let i = 1; i < values.length; i++) {
207
- if (!res || !res.childs) {
215
+ };
216
+ this.getRowAndParentsById_req = (rows, id, parentOptions, level, result) => {
217
+ if (result.row) {
208
218
  return;
209
219
  }
210
- res = getTreeOptionDetailByValue(values[i], res.childs, i, [...res.parentOptions, res]);
211
- }
212
- return res;
213
- };
214
- return {
215
- toggle, openDic, isOpen,
216
- change, getChilds, setChilds, getOptions, getTreeOptionDetailByValues
217
- };
218
- };
220
+ for (let i = 0; i < rows.length; i++) {
221
+ const row = rows[i];
222
+ const d = this.getOption(row, i, level, parentOptions);
223
+ if (!d) {
224
+ continue;
225
+ }
226
+ if (d.value === id) {
227
+ result.row = d;
228
+ result.parentOptions = parentOptions;
229
+ return;
230
+ }
231
+ if (d.childs && d.childs.length) {
232
+ this.getRowAndParentsById_req(d.childs, id, [...parentOptions, d], level + 1, result);
233
+ }
234
+ }
235
+ };
236
+ this.getRowAndParentsById = (rows, rowId) => {
237
+ let result = { parentOptions: [] };
238
+ this.getRowAndParentsById_req(rows, rowId, [], 0, result);
239
+ return result;
240
+ };
241
+ this.openByValue = (value, reset) => {
242
+ const { value: mainValue } = this.getProps();
243
+ const { row, parentOptions } = this.getRowAndParentsById(mainValue, value);
244
+ if (!row) {
245
+ return;
246
+ }
247
+ const newOpenDic = reset ? {} : Object.assign({}, this.getOpenDic());
248
+ for (let i = 0; i < parentOptions.length; i++) {
249
+ const po = parentOptions[i];
250
+ newOpenDic[po.value] = true;
251
+ }
252
+ newOpenDic[value] = true;
253
+ this.setOpenDic(newOpenDic);
254
+ };
255
+ this.closeByValue = (value) => {
256
+ const { value: mainValue } = this.getProps();
257
+ const { row } = this.getRowAndParentsById(mainValue, value);
258
+ if (!row) {
259
+ return;
260
+ }
261
+ const newOpenDic = Object.assign({}, this.getOpenDic());
262
+ newOpenDic[value] = false;
263
+ this.setOpenDic(newOpenDic);
264
+ };
265
+ this.getBodyClassName = (level, directParent) => {
266
+ let className = 'aio-input-tree-body';
267
+ if (!directParent) {
268
+ className += ' aio-input-tree-root';
269
+ }
270
+ if (this.isOpen(directParent)) {
271
+ className += ' open';
272
+ }
273
+ className += ` aio-input-tree-body-level-${level}`;
274
+ return className;
275
+ };
276
+ this.getIndentProps = (detail) => {
277
+ const { indent = 24, rtl } = this.getProps();
278
+ const { level, childs, isLastChild, parentOptions, toggleIcon, open } = detail;
279
+ const directParent = parentOptions.length ? parentOptions[parentOptions.length - 1] : undefined;
280
+ return {
281
+ width: indent, level, isLastChild, isLeaf: !childs,
282
+ isParentLastChild: !!(directParent === null || directParent === void 0 ? void 0 : directParent.isLastChild),
283
+ rtl: !!rtl, toggleIcon, open, onToggle: () => this.toggle(detail)
284
+ };
285
+ };
286
+ this.getOpenDic = p.getOpenDic;
287
+ this.setOpenDic = p.setOpenDic;
288
+ this.getProps = p.getProps;
289
+ }
290
+ }
219
291
  export const Indent = (props) => {
220
292
  const { width, level, open, rtl, isLastChild, isParentLastChild, isLeaf } = props;
221
293
  const [indentPathes, setIndentPathes] = useState(getIndentIcons);
@@ -246,14 +318,13 @@ export const Indent = (props) => {
246
318
  if (toggleIcon === false) {
247
319
  return false;
248
320
  }
249
- const getIcon = new GetSvg('em').getIcon;
250
321
  if (isLeaf) {
251
- return toggleIcon.leaf || getIcon('mdiCircleSmall', 1);
322
+ return toggleIcon.leaf || _jsx(CircleSmall, {});
252
323
  }
253
324
  if (open) {
254
- return toggleIcon.open || getIcon('mdiChevronDown', 1);
325
+ return toggleIcon.open || _jsx(ChevronDown, {});
255
326
  }
256
- return toggleIcon.close || getIcon(rtl ? 'mdiChevronLeft' : 'mdiChevronRight', 1);
327
+ return toggleIcon.close || (rtl ? _jsx(ChevronLeft, {}) : _jsx(ChevronRight, {}));
257
328
  };
258
329
  function getIndentIcons() {
259
330
  const list = new Array(level).fill(0);
@@ -272,7 +343,19 @@ export const Indent = (props) => {
272
343
  }
273
344
  return (_jsxs("div", { className: `ai-indents`, children: [indentPathes, toggleIcon] }));
274
345
  };
275
- function classListToString(classes) {
346
+ const ChevronLeft = () => {
347
+ return (_jsx("svg", { viewBox: "0 0 24 24", role: "presentation", style: { width: '1.5em', height: '1.5em' }, children: _jsx("path", { d: "M15.41,16.58L10.83,12L15.41,7.41L14,6L8,12L14,18L15.41,16.58Z", style: { fill: 'currentcolor' } }) }));
348
+ };
349
+ const ChevronRight = () => {
350
+ return (_jsx("svg", { viewBox: "0 0 24 24", role: "presentation", style: { width: '1.5em', height: '1.5em' }, children: _jsx("path", { d: "M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z", style: { fill: 'currentcolor' } }) }));
351
+ };
352
+ const ChevronDown = () => {
353
+ return (_jsx("svg", { viewBox: "0 0 24 24", role: "presentation", style: { width: '1.5em', height: '1.5em' }, children: _jsx("path", { d: "M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z", style: { fill: 'currentcolor' } }) }));
354
+ };
355
+ const CircleSmall = () => {
356
+ return (_jsx("svg", { viewBox: "0 0 24 24", role: "presentation", style: { width: '1.5em', height: '1.5em' }, children: _jsx("path", { d: "M12,10A2,2 0 0,0 10,12C10,13.11 10.9,14 12,14C13.11,14 14,13.11 14,12A2,2 0 0,0 12,10Z", style: { fill: 'currentcolor' } }) }));
357
+ };
358
+ const ClassListToString = (classes) => {
276
359
  let list = [];
277
360
  const getClasses = (cls) => {
278
361
  if (Array.isArray(cls)) {
@@ -288,47 +371,11 @@ function classListToString(classes) {
288
371
  list = [...list, ...getClasses(cls)];
289
372
  }
290
373
  return list.length ? list.join(' ') : '';
291
- }
292
- function AddToAttrs(attrs, p) {
374
+ };
375
+ const AddToAttrs = (attrs, p) => {
293
376
  attrs = attrs || {};
294
- const className = classListToString([attrs.className, p === null || p === void 0 ? void 0 : p.className]);
377
+ const className = ClassListToString([attrs.className, p === null || p === void 0 ? void 0 : p.className]);
295
378
  let newStyle = Object.assign(Object.assign({}, attrs.style), p === null || p === void 0 ? void 0 : p.style);
296
379
  const res = Object.assign(Object.assign(Object.assign({}, attrs), { className, style: newStyle }), p === null || p === void 0 ? void 0 : p.attrs);
297
380
  return res;
298
- }
299
- class GetSvg {
300
- constructor(unit) {
301
- this.getStyle = (color) => ({ fill: color || "currentcolor" });
302
- this.getSvgStyle = (size) => {
303
- size = size || 1;
304
- return { width: `${size * 1.5}${this.unit}`, height: `${size * 1.5}${this.unit}` };
305
- };
306
- this.fixSvgContent = (content, size, p) => {
307
- const { spin } = p || {};
308
- let res = null;
309
- if (spin) {
310
- res = (_jsxs(_Fragment, { children: [_jsx("style", { children: `@keyframes spin { from { transform: rotate(0deg) } to { transform: rotate(360deg) } }` }), _jsx("g", { style: { animation: `${spin}s linear 0s infinite normal none running spin`, transformOrigin: 'center center' }, children: content })] }));
311
- }
312
- else {
313
- res = content;
314
- }
315
- return (_jsx("svg", { viewBox: "0 0 24 24", role: "presentation", style: this.getSvgStyle(size), children: res }));
316
- };
317
- this.getIcon = (path, size, p) => {
318
- const { color } = p || {};
319
- const fn = this[path];
320
- if (!fn) {
321
- alert(`${path} is not valid`);
322
- return null;
323
- }
324
- const content = fn(color);
325
- return this.fixSvgContent(content, size, p);
326
- };
327
- this.mdiChevronDown = (color) => (_jsx(_Fragment, { children: _jsx("path", { d: "M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z", style: this.getStyle(color) }) }));
328
- this.mdiChevronUp = (color) => (_jsx(_Fragment, { children: _jsx("path", { d: "M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z", style: this.getStyle(color) }) }));
329
- this.mdiChevronLeft = (color) => (_jsx(_Fragment, { children: _jsx("path", { d: "M15.41,16.58L10.83,12L15.41,7.41L14,6L8,12L14,18L15.41,16.58Z", style: this.getStyle(color) }) }));
330
- this.mdiChevronRight = (color) => (_jsx(_Fragment, { children: _jsx("path", { d: "M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z", style: this.getStyle(color) }) }));
331
- this.mdiCircleSmall = (color) => (_jsx(_Fragment, { children: _jsx("path", { d: "M12,10A2,2 0 0,0 10,12C10,13.11 10.9,14 12,14C13.11,14 14,13.11 14,12A2,2 0 0,0 12,10Z", style: this.getStyle(color) }) }));
332
- this.unit = unit || 'rem';
333
- }
334
- }
381
+ };
package/package.json CHANGED
@@ -1,21 +1,21 @@
1
- {
2
- "name": "aio-tree",
3
- "version": "1.0.0",
4
- "description": "tree hierarchy",
5
- "homepage": "https://github.com/mohammadFeiz/aio-tree#readme",
6
- "types": "index.d.ts",
7
- "bugs": {
8
- "url": "https://github.com/mohammadFeiz/aio-tree/issues"
9
- },
10
- "repository": {
11
- "type": "git",
12
- "url": "git+https://github.com/mohammadFeiz/aio-tree.git"
13
- },
14
- "license": "ISC",
15
- "author": "mohammad sharif feiz feiz.ms@gmail.com",
16
- "type": "commonjs",
17
- "main": "index.js",
18
- "scripts": {
19
- "test": "echo \"Error: no test specified\" && exit 1"
20
- }
21
- }
1
+ {
2
+ "name": "aio-tree",
3
+ "version": "1.1.0",
4
+ "description": "tree hierarchy",
5
+ "homepage": "https://github.com/mohammadFeiz/aio-tree#readme",
6
+ "types": "index.d.ts",
7
+ "bugs": {
8
+ "url": "https://github.com/mohammadFeiz/aio-tree/issues"
9
+ },
10
+ "repository": {
11
+ "type": "git",
12
+ "url": "git+https://github.com/mohammadFeiz/aio-tree.git"
13
+ },
14
+ "license": "ISC",
15
+ "author": "mohammad sharif feiz feiz.ms@gmail.com",
16
+ "type": "commonjs",
17
+ "main": "index.js",
18
+ "scripts": {
19
+ "test": "echo \"Error: no test specified\" && exit 1"
20
+ }
21
+ }