@fixefy/fixefy-ui-components 0.3.54 → 0.3.55

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.
@@ -18,7 +18,6 @@ const _helpers = require("./helpers/helpers");
18
18
  const _client = require("@apollo/client");
19
19
  const _nookies = require("nookies");
20
20
  const _components = require("./components");
21
- const _useDropdownStore = /*#__PURE__*/ _interop_require_default(require("./useDropdownStore"));
22
21
  function _define_property(obj, key, value) {
23
22
  if (key in obj) {
24
23
  Object.defineProperty(obj, key, {
@@ -32,11 +31,6 @@ function _define_property(obj, key, value) {
32
31
  }
33
32
  return obj;
34
33
  }
35
- function _interop_require_default(obj) {
36
- return obj && obj.__esModule ? obj : {
37
- default: obj
38
- };
39
- }
40
34
  function _getRequireWildcardCache(nodeInterop) {
41
35
  if (typeof WeakMap !== "function") return null;
42
36
  var cacheBabelInterop = new WeakMap();
@@ -118,7 +112,6 @@ function _object_spread_props(target, source) {
118
112
  return target;
119
113
  }
120
114
  const FxAsyncDropdown = (props)=>{
121
- const { fetchedProps, setFetchedProps, displayed, setDisplayed, options, setOptions, reason, setReason, isLastPage, setIsLastPage, isOpen, setIsOpen, searchValue, setSearchValue, page, setPage, prevPage, setPrevPage, pageSize, loadMore } = (0, _useDropdownStore.default)();
122
115
  const { onAdd, onRemoveAll, onUnselectAll, fetcher, disabled, defaultValue, type = 'text', variables, search_path, modal_type, multiple, name, query, isInitialOpen, placeholder, title_path, rootStylesOverride, options_path, _id } = props;
123
116
  const ref = (0, _react.useRef)(null);
124
117
  const { method_name } = variables !== null && variables !== void 0 ? variables : {};
@@ -127,6 +120,15 @@ const FxAsyncDropdown = (props)=>{
127
120
  var _parseCookies;
128
121
  const { ws } = (_parseCookies = (0, _nookies.parseCookies)()) !== null && _parseCookies !== void 0 ? _parseCookies : {};
129
122
  const [defaultValueWhere, setDefaultValueWhere] = (0, _react.useState)(where);
123
+ const [displayed, setDisplayed] = (0, _react.useState)(multiple ? [] : '');
124
+ const [options, setOptions] = (0, _react.useState)([]);
125
+ const [reason, setReason] = (0, _react.useState)('init');
126
+ const [isLastPage, setIsLastPage] = (0, _react.useState)(false);
127
+ const [isOpen, setIsOpen] = (0, _react.useState)(isInitialOpen);
128
+ const [searchValue, setSearchValue] = (0, _react.useState)(null);
129
+ const [page, setPage] = (0, _react.useState)(1);
130
+ const [prevPage, setPrevPage] = (0, _react.useState)(0);
131
+ const pageSize = 20;
130
132
  const getWhere = ()=>{
131
133
  if (method_name == 'workspace') {
132
134
  return searchValue ? _object_spread_props(_object_spread({}, where), {
@@ -147,6 +149,10 @@ const FxAsyncDropdown = (props)=>{
147
149
  }) : _object_spread({}, where);
148
150
  }
149
151
  };
152
+ const loadMore = ()=>{
153
+ setPage((prevPage)=>prevPage + 1);
154
+ setPrevPage((prevPage)=>prevPage + 1);
155
+ };
150
156
  const [fetch, { data, loading }] = (0, _client.useLazyQuery)((0, _graphqltag.gql)(fetcher.query), _object_spread_props(_object_spread({}, fetcher.queryOptions), {
151
157
  variables: {
152
158
  where: getWhere(),
@@ -184,18 +190,6 @@ const FxAsyncDropdown = (props)=>{
184
190
  } else {
185
191
  setDisplayed(items[0]);
186
192
  }
187
- } else {
188
- if (multiple) {
189
- setDisplayed([]);
190
- } else {
191
- setDisplayed('');
192
- }
193
- }
194
- } else {
195
- if (multiple) {
196
- setDisplayed([]);
197
- } else {
198
- setDisplayed('');
199
193
  }
200
194
  }
201
195
  }, [
@@ -241,9 +235,6 @@ const FxAsyncDropdown = (props)=>{
241
235
  defaultValue,
242
236
  defaultValueData
243
237
  ]);
244
- (0, _react.useEffect)(()=>{
245
- setFetchedProps(props);
246
- }, []);
247
238
  const handleSearch = (e)=>{
248
239
  setSearchValue(e.target.value);
249
240
  setReason('searched');
@@ -258,7 +249,7 @@ const FxAsyncDropdown = (props)=>{
258
249
  if (displayed.map((item)=>{
259
250
  return item[title_path];
260
251
  }).includes(clicked)) {
261
- (0, _helpers.deleteOneItem)(option, fetchedProps, displayed, setDisplayed);
252
+ (0, _helpers.deleteOneItem)(option, props, displayed, setDisplayed);
262
253
  } else {
263
254
  if (onAdd) {
264
255
  onAdd(option);
@@ -271,7 +262,7 @@ const FxAsyncDropdown = (props)=>{
271
262
  option
272
263
  ];
273
264
  setDisplayed(opts);
274
- (0, _helpers.addToStoredDisplayed)(option, fetchedProps);
265
+ (0, _helpers.addToStoredDisplayed)(option, props);
275
266
  }
276
267
  break;
277
268
  default:
@@ -279,7 +270,7 @@ const FxAsyncDropdown = (props)=>{
279
270
  if (onAdd) {
280
271
  onAdd(option);
281
272
  }
282
- (0, _helpers.addToStoredDisplayed)(option, fetchedProps);
273
+ (0, _helpers.addToStoredDisplayed)(option, props);
283
274
  if (!multiple && !defaultValue) {
284
275
  setIsOpen(false);
285
276
  }
@@ -336,7 +327,7 @@ const FxAsyncDropdown = (props)=>{
336
327
  },
337
328
  children: [
338
329
  /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.CheckboxIcon, {
339
- checked: (0, _helpers.isChecked)(option, displayed, fetchedProps)
330
+ checked: (0, _helpers.isChecked)(option, displayed, props)
340
331
  }),
341
332
  getSingleOptionFromListOrDisplayed(option, 'list')
342
333
  ]
@@ -375,14 +366,20 @@ const FxAsyncDropdown = (props)=>{
375
366
  rv = /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.ChipOption, {
376
367
  option: option,
377
368
  curValue: clicked,
378
- modal: modal
369
+ modal: modal,
370
+ fetchedProps: props,
371
+ displayed: displayed,
372
+ setDisplayed: setDisplayed
379
373
  });
380
374
  break;
381
375
  case 'logo':
382
376
  rv = /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.LogoOption, {
383
377
  option: option,
384
378
  curValue: clicked,
385
- modal: modal
379
+ modal: modal,
380
+ fetchedProps: props,
381
+ displayed: displayed,
382
+ setDisplayed: setDisplayed
386
383
  });
387
384
  break;
388
385
  case 'text':
@@ -390,7 +387,10 @@ const FxAsyncDropdown = (props)=>{
390
387
  rv = /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.TextOption, {
391
388
  option: option,
392
389
  curValue: clicked,
393
- modal: modal
390
+ modal: modal,
391
+ fetchedProps: props,
392
+ displayed: displayed,
393
+ setDisplayed: setDisplayed
394
394
  });
395
395
  break;
396
396
  }
@@ -476,7 +476,7 @@ const FxAsyncDropdown = (props)=>{
476
476
  children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Button, {
477
477
  onClick: ()=>{
478
478
  setReason('loaded more');
479
- loadMore(page, prevPage);
479
+ loadMore();
480
480
  },
481
481
  children: "load more"
482
482
  })
@@ -1,6 +1,9 @@
1
1
  import React from 'react';
2
- export declare const ChipOption: ({ option, curValue, modal }: {
2
+ export declare const ChipOption: ({ option, curValue, modal, fetchedProps, displayed, setDisplayed }: {
3
3
  option: any;
4
4
  curValue: any;
5
5
  modal: 'displayed' | 'list';
6
+ fetchedProps: any;
7
+ displayed: any;
8
+ setDisplayed: any;
6
9
  }) => React.JSX.Element;
@@ -12,14 +12,12 @@ const _jsxruntime = require("react/jsx-runtime");
12
12
  const _react = /*#__PURE__*/ _interop_require_default(require("react"));
13
13
  const _FxChip = require("../../FxChip");
14
14
  const _helpers = require("../helpers/helpers");
15
- const _useDropdownStore = /*#__PURE__*/ _interop_require_default(require("./../useDropdownStore"));
16
15
  function _interop_require_default(obj) {
17
16
  return obj && obj.__esModule ? obj : {
18
17
  default: obj
19
18
  };
20
19
  }
21
- const ChipOption = ({ option, curValue, modal })=>{
22
- const { fetchedProps, displayed, setDisplayed } = (0, _useDropdownStore.default)();
20
+ const ChipOption = ({ option, curValue, modal, fetchedProps, displayed, setDisplayed })=>{
23
21
  return modal == 'displayed' ? /*#__PURE__*/ (0, _jsxruntime.jsx)(_FxChip.FxChip, {
24
22
  status: curValue,
25
23
  label: (0, _helpers.titleCase)(curValue),
@@ -1,5 +1,7 @@
1
1
  import React from 'react';
2
- export declare const ChosenIcon: ({ option, isDisplay }: {
2
+ export declare const ChosenIcon: ({ option, isDisplay, fetchedProps, displayed }: {
3
3
  option: any;
4
4
  isDisplay: boolean;
5
+ fetchedProps: any;
6
+ displayed: any;
5
7
  }) => React.JSX.Element | null;
@@ -12,14 +12,12 @@ const _jsxruntime = require("react/jsx-runtime");
12
12
  const _react = /*#__PURE__*/ _interop_require_default(require("react"));
13
13
  const _FxIcon = require("../../FxIcon");
14
14
  const _helpers = require("../helpers/helpers");
15
- const _useDropdownStore = /*#__PURE__*/ _interop_require_default(require("./../useDropdownStore"));
16
15
  function _interop_require_default(obj) {
17
16
  return obj && obj.__esModule ? obj : {
18
17
  default: obj
19
18
  };
20
19
  }
21
- const ChosenIcon = ({ option, isDisplay })=>{
22
- const { fetchedProps, displayed } = (0, _useDropdownStore.default)();
20
+ const ChosenIcon = ({ option, isDisplay, fetchedProps, displayed })=>{
23
21
  const { title_path, multiple, search_path } = fetchedProps;
24
22
  const isChecked = (option)=>{
25
23
  const clicked = (0, _helpers.getOption)(option, title_path);
@@ -1,5 +1,8 @@
1
1
  import React from 'react';
2
- export declare const DeleteButton: ({ option, isDisplay }: {
2
+ export declare const DeleteButton: ({ option, isDisplay, fetchedProps, displayed, setDisplayed }: {
3
3
  option: any;
4
4
  isDisplay: boolean;
5
+ fetchedProps: any;
6
+ displayed: any;
7
+ setDisplayed: any;
5
8
  }) => React.JSX.Element | null;
@@ -11,15 +11,13 @@ Object.defineProperty(exports, "DeleteButton", {
11
11
  const _jsxruntime = require("react/jsx-runtime");
12
12
  const _react = /*#__PURE__*/ _interop_require_default(require("react"));
13
13
  const _material = require("@mui/material");
14
- const _useDropdownStore = /*#__PURE__*/ _interop_require_default(require("./../useDropdownStore"));
15
14
  const _helpers = require("../helpers/helpers");
16
15
  function _interop_require_default(obj) {
17
16
  return obj && obj.__esModule ? obj : {
18
17
  default: obj
19
18
  };
20
19
  }
21
- const DeleteButton = ({ option, isDisplay })=>{
22
- const { fetchedProps, displayed, setDisplayed } = (0, _useDropdownStore.default)();
20
+ const DeleteButton = ({ option, isDisplay, fetchedProps, displayed, setDisplayed })=>{
23
21
  const { multiple, search_path, getOption, title_path } = fetchedProps !== null && fetchedProps !== void 0 ? fetchedProps : {};
24
22
  const isDisplayButton = isDisplay && (multiple && (displayed === null || displayed === void 0 ? void 0 : displayed.length) > 0 || !multiple && displayed[search_path] === getOption(option, title_path));
25
23
  switch(isDisplayButton){
@@ -1,6 +1,9 @@
1
1
  import React from 'react';
2
- export declare const LogoOption: ({ option, curValue, modal }: {
2
+ export declare const LogoOption: ({ option, curValue, modal, fetchedProps, displayed, setDisplayed }: {
3
3
  option: any;
4
4
  curValue: any;
5
5
  modal: 'displayed' | 'list';
6
+ fetchedProps: any;
7
+ displayed: any;
8
+ setDisplayed: any;
6
9
  }) => React.JSX.Element;
@@ -17,13 +17,12 @@ const _helpers = require("../helpers/helpers");
17
17
  const _fixefyhooks = require("@fixefy/fixefy-hooks");
18
18
  const _DeleteButton = require("./DeleteButton");
19
19
  const _ChosenIcon = require("./ChosenIcon");
20
- const _useDropdownStore = /*#__PURE__*/ _interop_require_default(require("./../useDropdownStore"));
21
20
  function _interop_require_default(obj) {
22
21
  return obj && obj.__esModule ? obj : {
23
22
  default: obj
24
23
  };
25
24
  }
26
- const LogoOption = ({ option, curValue, modal })=>{
25
+ const LogoOption = ({ option, curValue, modal, fetchedProps, displayed, setDisplayed })=>{
27
26
  const theme = (0, _styles.useTheme)();
28
27
  return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Box, {
29
28
  sx: {
@@ -45,7 +44,8 @@ const LogoOption = ({ option, curValue, modal })=>{
45
44
  },
46
45
  children: [
47
46
  /*#__PURE__*/ (0, _jsxruntime.jsx)(Logo, {
48
- option: option
47
+ option: option,
48
+ fetchedProps: fetchedProps
49
49
  }),
50
50
  /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Box, {
51
51
  sx: {
@@ -61,7 +61,10 @@ const LogoOption = ({ option, curValue, modal })=>{
61
61
  }),
62
62
  /*#__PURE__*/ (0, _jsxruntime.jsx)(_DeleteButton.DeleteButton, {
63
63
  option: option,
64
- isDisplay: modal == 'displayed'
64
+ isDisplay: modal == 'displayed',
65
+ fetchedProps: fetchedProps,
66
+ displayed: displayed,
67
+ setDisplayed: setDisplayed
65
68
  })
66
69
  ]
67
70
  })
@@ -69,14 +72,15 @@ const LogoOption = ({ option, curValue, modal })=>{
69
72
  }),
70
73
  /*#__PURE__*/ (0, _jsxruntime.jsx)(_ChosenIcon.ChosenIcon, {
71
74
  option: option,
72
- isDisplay: modal == 'list'
75
+ isDisplay: modal == 'list',
76
+ fetchedProps: fetchedProps,
77
+ displayed: displayed
73
78
  })
74
79
  ]
75
80
  }, option._id);
76
81
  };
77
- const Logo = ({ option })=>{
82
+ const Logo = ({ option, fetchedProps })=>{
78
83
  const getRandomColor = (0, _fixefyhooks.useRandomColor)();
79
- const { fetchedProps } = (0, _useDropdownStore.default)();
80
84
  const { logo_folder_name, logo_placeholder, name } = fetchedProps !== null && fetchedProps !== void 0 ? fetchedProps : {};
81
85
  var _option_name;
82
86
  return /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
@@ -1,6 +1,9 @@
1
1
  import React from 'react';
2
- export declare const TextOption: ({ option, curValue, modal }: {
2
+ export declare const TextOption: ({ option, curValue, modal, fetchedProps, displayed, setDisplayed }: {
3
3
  option: any;
4
4
  curValue: any;
5
5
  modal: 'displayed' | 'list';
6
+ fetchedProps: any;
7
+ displayed: any;
8
+ setDisplayed: any;
6
9
  }) => React.JSX.Element;
@@ -20,7 +20,7 @@ function _interop_require_default(obj) {
20
20
  default: obj
21
21
  };
22
22
  }
23
- const TextOption = ({ option, curValue, modal })=>{
23
+ const TextOption = ({ option, curValue, modal, fetchedProps, displayed, setDisplayed })=>{
24
24
  const theme = (0, _styles.useTheme)();
25
25
  return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Box, {
26
26
  sx: {
@@ -54,14 +54,19 @@ const TextOption = ({ option, curValue, modal })=>{
54
54
  }),
55
55
  /*#__PURE__*/ (0, _jsxruntime.jsx)(_DeleteButton.DeleteButton, {
56
56
  option: option,
57
- isDisplay: modal == 'displayed'
57
+ isDisplay: modal == 'displayed',
58
+ fetchedProps: fetchedProps,
59
+ displayed: displayed,
60
+ setDisplayed: setDisplayed
58
61
  })
59
62
  ]
60
63
  })
61
64
  }),
62
65
  /*#__PURE__*/ (0, _jsxruntime.jsx)(_ChosenIcon.ChosenIcon, {
63
66
  option: option,
64
- isDisplay: modal == 'list'
67
+ isDisplay: modal == 'list',
68
+ fetchedProps: fetchedProps,
69
+ displayed: displayed
65
70
  })
66
71
  ]
67
72
  }, option._id);
package/package.json CHANGED
@@ -19,8 +19,7 @@
19
19
  "react": "18.3.1",
20
20
  "react-dom": "18.3.1",
21
21
  "react-use-wizard": "2.3.0",
22
- "tss-react": "^4.9.14",
23
- "zustand": "^5.0.3"
22
+ "tss-react": "^4.9.14"
24
23
  },
25
24
  "devDependencies": {
26
25
  "@svgr/webpack": "8.1.0",
@@ -70,5 +69,5 @@
70
69
  "require": "./dist/index.js"
71
70
  }
72
71
  },
73
- "version": "0.3.54"
72
+ "version": "0.3.55"
74
73
  }