@gustavo-valsechi/client 1.4.113 → 1.4.115

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 (7) hide show
  1. package/dist/components/types/form/types/select/index.js +3 -0
  2. package/dist/components/types/form/types/select/index.mjs +3 -0
  3. package/dist/components/types/form/types/select/options/index.js +21 -11
  4. package/dist/components/types/form/types/select/options/index.mjs +21 -11
  5. package/dist/contexts/target/index.js +6 -9
  6. package/dist/contexts/target/index.mjs +6 -9
  7. package/package.json +1 -1
package/dist/components/types/form/types/select/index.js CHANGED
@@ -81,6 +81,9 @@ function InputSelect(props) {
81
81
  event.target.value = props.mask ? props.mask(value2) : value2;
82
82
  setFilter(value2);
83
83
  if (props.onFilter) props.onFilter(value2);
84
+ const optionsElement = document.getElementById("input-options");
85
+ if (!optionsElement) return;
86
+ optionsElement.setAttribute("value", value2);
84
87
  };
85
88
  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styles.Container, { className: props.className, error: props.error, children: [
86
89
  !!props.label && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_label.InputLabel, { children: [
package/dist/components/types/form/types/select/index.mjs CHANGED
@@ -48,6 +48,9 @@ function InputSelect(props) {
48
48
  event.target.value = props.mask ? props.mask(value2) : value2;
49
49
  setFilter(value2);
50
50
  if (props.onFilter) props.onFilter(value2);
51
+ const optionsElement = document.getElementById("input-options");
52
+ if (!optionsElement) return;
53
+ optionsElement.setAttribute("value", value2);
51
54
  };
52
55
  return /* @__PURE__ */ jsxs(Container, { className: props.className, error: props.error, children: [
53
56
  !!props.label && /* @__PURE__ */ jsxs(InputLabel, { children: [
package/dist/components/types/form/types/select/options/index.js CHANGED
@@ -46,18 +46,28 @@ function InputSelectOption(props) {
46
46
  props.inputRef.current.blur();
47
47
  }, [value, props.inputRef]);
48
48
  (0, import_react.useEffect)(() => {
49
- const filter = props.value || "";
50
- console.log("filter", filter);
51
- if (!filter) return setOptions(props.options);
52
- const filtredOptions = import_lodash.default.filter(props.options, (data) => {
53
- var _a;
54
- const value2 = ((_a = Object.values(data || {})) == null ? void 0 : _a[0]) || "";
55
- if (import_lodash.default.isString(value2)) return import_lodash.default.includes(value2, filter);
56
- return import_lodash.default.includes(value2 == null ? void 0 : value2.textContent, filter);
49
+ const optionsElement = document.getElementById("input-options");
50
+ if (!optionsElement) return;
51
+ const observer = new MutationObserver((mutations) => {
52
+ for (const mutation of mutations) {
53
+ if (mutation.type === "attributes" && mutation.attributeName === "value") {
54
+ const filter = optionsElement.getAttribute("value") || "";
55
+ console.log("filter", filter);
56
+ if (!filter) return setOptions(props.options);
57
+ const filtredOptions = import_lodash.default.filter(props.options, (data) => {
58
+ var _a;
59
+ const value2 = ((_a = Object.values(data || {})) == null ? void 0 : _a[0]) || "";
60
+ if (import_lodash.default.isString(value2)) return import_lodash.default.includes(value2, filter);
61
+ return import_lodash.default.includes(value2 == null ? void 0 : value2.textContent, filter);
62
+ });
63
+ setOptions(filtredOptions);
64
+ }
65
+ }
57
66
  });
58
- setOptions(filtredOptions);
59
- }, [props.value]);
60
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.Container, { width: props.width, children: import_lodash.default.map(
67
+ observer.observe(optionsElement, { attributes: true });
68
+ return () => observer.disconnect();
69
+ }, [props.options]);
70
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.Container, { id: "input-options", width: props.width, children: import_lodash.default.map(
61
71
  options,
62
72
  (data, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
63
73
  "div",
package/dist/components/types/form/types/select/options/index.mjs CHANGED
@@ -13,18 +13,28 @@ function InputSelectOption(props) {
13
13
  props.inputRef.current.blur();
14
14
  }, [value, props.inputRef]);
15
15
  useEffect(() => {
16
- const filter = props.value || "";
17
- console.log("filter", filter);
18
- if (!filter) return setOptions(props.options);
19
- const filtredOptions = _.filter(props.options, (data) => {
20
- var _a;
21
- const value2 = ((_a = Object.values(data || {})) == null ? void 0 : _a[0]) || "";
22
- if (_.isString(value2)) return _.includes(value2, filter);
23
- return _.includes(value2 == null ? void 0 : value2.textContent, filter);
16
+ const optionsElement = document.getElementById("input-options");
17
+ if (!optionsElement) return;
18
+ const observer = new MutationObserver((mutations) => {
19
+ for (const mutation of mutations) {
20
+ if (mutation.type === "attributes" && mutation.attributeName === "value") {
21
+ const filter = optionsElement.getAttribute("value") || "";
22
+ console.log("filter", filter);
23
+ if (!filter) return setOptions(props.options);
24
+ const filtredOptions = _.filter(props.options, (data) => {
25
+ var _a;
26
+ const value2 = ((_a = Object.values(data || {})) == null ? void 0 : _a[0]) || "";
27
+ if (_.isString(value2)) return _.includes(value2, filter);
28
+ return _.includes(value2 == null ? void 0 : value2.textContent, filter);
29
+ });
30
+ setOptions(filtredOptions);
31
+ }
32
+ }
24
33
  });
25
- setOptions(filtredOptions);
26
- }, [props.value]);
27
- return /* @__PURE__ */ jsx(Container, { width: props.width, children: _.map(
34
+ observer.observe(optionsElement, { attributes: true });
35
+ return () => observer.disconnect();
36
+ }, [props.options]);
37
+ return /* @__PURE__ */ jsx(Container, { id: "input-options", width: props.width, children: _.map(
28
38
  options,
29
39
  (data, index) => /* @__PURE__ */ jsx(
30
40
  "div",
package/dist/contexts/target/index.js CHANGED
@@ -121,22 +121,16 @@ const TargetProviderContainer = ({ children }) => {
121
121
  import_lodash.default.forEach(containerRef.current, (elementRef) => close(elementRef, index));
122
122
  });
123
123
  focusable.addEventListener("blur", () => {
124
+ console.log("onBlur", insideMemory);
124
125
  if (import_lodash.default.some(insideMemory, (i) => i === index)) return;
125
126
  close(containerRef.current[index], index);
126
127
  });
127
- focusable.addEventListener("change", (e) => {
128
- var _a2;
129
- e.preventDefault();
130
- const value = ((_a2 = e.target) == null ? void 0 : _a2.value) || "";
131
- console.log("input target value", value);
132
- target.component = import_react.default.cloneElement(target.component, { value });
133
- });
134
128
  });
135
129
  }, [targets, inputRef, containerRef]);
136
130
  const getCoords = (target) => {
137
131
  const rect = target.getBoundingClientRect();
138
132
  const targetTop = rect.top + window.scrollY;
139
- const targetLeft = rect.left + window.scrollX;
133
+ const targetLeft = rect.left + window.scrollX + 1;
140
134
  const coords = {
141
135
  top: targetTop + (target.offsetHeight + 5),
142
136
  left: targetLeft
@@ -177,9 +171,12 @@ const TargetProviderContainer = ({ children }) => {
177
171
  insideMemory.push(index);
178
172
  elementFocusable(target, index).focus();
179
173
  },
174
+ onClick: () => {
175
+ insideMemory.push(index);
176
+ elementFocusable(target, index).focus();
177
+ },
180
178
  onMouseLeave: () => {
181
179
  insideMemory.splice(import_lodash.default.findIndex(insideMemory, (i) => i === index), 1);
182
- elementFocusable(target, index).focus();
183
180
  },
184
181
  children: target.component
185
182
  }
package/dist/contexts/target/index.mjs CHANGED
@@ -87,22 +87,16 @@ const TargetProviderContainer = ({ children }) => {
87
87
  _.forEach(containerRef.current, (elementRef) => close(elementRef, index));
88
88
  });
89
89
  focusable.addEventListener("blur", () => {
90
+ console.log("onBlur", insideMemory);
90
91
  if (_.some(insideMemory, (i) => i === index)) return;
91
92
  close(containerRef.current[index], index);
92
93
  });
93
- focusable.addEventListener("change", (e) => {
94
- var _a2;
95
- e.preventDefault();
96
- const value = ((_a2 = e.target) == null ? void 0 : _a2.value) || "";
97
- console.log("input target value", value);
98
- target.component = React.cloneElement(target.component, { value });
99
- });
100
94
  });
101
95
  }, [targets, inputRef, containerRef]);
102
96
  const getCoords = (target) => {
103
97
  const rect = target.getBoundingClientRect();
104
98
  const targetTop = rect.top + window.scrollY;
105
- const targetLeft = rect.left + window.scrollX;
99
+ const targetLeft = rect.left + window.scrollX + 1;
106
100
  const coords = {
107
101
  top: targetTop + (target.offsetHeight + 5),
108
102
  left: targetLeft
@@ -143,9 +137,12 @@ const TargetProviderContainer = ({ children }) => {
143
137
  insideMemory.push(index);
144
138
  elementFocusable(target, index).focus();
145
139
  },
140
+ onClick: () => {
141
+ insideMemory.push(index);
142
+ elementFocusable(target, index).focus();
143
+ },
146
144
  onMouseLeave: () => {
147
145
  insideMemory.splice(_.findIndex(insideMemory, (i) => i === index), 1);
148
- elementFocusable(target, index).focus();
149
146
  },
150
147
  children: target.component
151
148
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gustavo-valsechi/client",
3
- "version": "1.4.113",
3
+ "version": "1.4.115",
4
4
  "main": "dist/index.js",
5
5
  "module": "dist/index.js",
6
6
  "types": "dist/index.d.ts",