@gustavo-valsechi/client 1.4.279 → 1.4.281

package/dist/src/components/types/form/types/select/index.js

@@ -53,7 +53,7 @@ function InputSelect(props) {
   const value = ((_b = props.options) == null ? void 0 : _b[inputValue]) || /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "input-label-value-placeholder", children: "selecione" });
   (0, import_react.useEffect)(() => {
     var _a2;
-    if (!(inputRef == null ? void 0 : inputRef.current) || !(containerRef == null ? void 0 : containerRef.current) || !Object.keys(props.options || {}).length) return;
+    if (!(inputRef == null ? void 0 : inputRef.current) || !(containerRef == null ? void 0 : containerRef.current)) return;
     target.add({
       ref: inputRef,
       component: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(

package/dist/src/components/types/form/types/select/index.mjs

@@ -20,7 +20,7 @@ function InputSelect(props) {
   const value = ((_b = props.options) == null ? void 0 : _b[inputValue]) || /* @__PURE__ */ jsx("div", { className: "input-label-value-placeholder", children: "selecione" });
   useEffect(() => {
     var _a2;
-    if (!(inputRef == null ? void 0 : inputRef.current) || !(containerRef == null ? void 0 : containerRef.current) || !Object.keys(props.options || {}).length) return;
+    if (!(inputRef == null ? void 0 : inputRef.current) || !(containerRef == null ? void 0 : containerRef.current)) return;
     target.add({
       ref: inputRef,
       component: /* @__PURE__ */ jsx(

package/dist/src/components/types/form/types/select/options/index.js

@@ -71,7 +71,10 @@ function InputSelectOption(props) {
   (0, import_react.useEffect)(() => {
     const content = document.getElementById(`input[${props.name}-options-content-mask]`);
     if (!content) return;
-    if (content.clientHeight === content.scrollHeight) return;
+    if (content.clientHeight === content.scrollHeight) {
+      content.style.maskImage = "initial";
+      return;
+    }
     const maskTop = "linear-gradient(to bottom, transparent, black 50%)";
     const maskBottom = "linear-gradient(to bottom, black calc(100% - 50%), transparent)";
     const maskTopBottom = "linear-gradient(to bottom, transparent, black 50%, black calc(100% - 50%), transparent)";
@@ -112,7 +115,7 @@ function InputSelectOption(props) {
               {
                 id: `input[${props.name}-options-content-mask]`,
                 className: "input-option-content-mask",
-                children: import_lodash.default.map(
+                children: !Object.keys(options || {}).length ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "input-option empty", children: "Nenhuma op\xE7\xE3o encontrada" }) : import_lodash.default.map(
                   options,
                   (value, key) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                     "div",

package/dist/src/components/types/form/types/select/options/index.mjs

@@ -38,7 +38,10 @@ function InputSelectOption(props) {
   useEffect(() => {
     const content = document.getElementById(`input[${props.name}-options-content-mask]`);
     if (!content) return;
-    if (content.clientHeight === content.scrollHeight) return;
+    if (content.clientHeight === content.scrollHeight) {
+      content.style.maskImage = "initial";
+      return;
+    }
     const maskTop = "linear-gradient(to bottom, transparent, black 50%)";
     const maskBottom = "linear-gradient(to bottom, black calc(100% - 50%), transparent)";
     const maskTopBottom = "linear-gradient(to bottom, transparent, black 50%, black calc(100% - 50%), transparent)";
@@ -79,7 +82,7 @@ function InputSelectOption(props) {
               {
                 id: `input[${props.name}-options-content-mask]`,
                 className: "input-option-content-mask",
-                children: _.map(
+                children: !Object.keys(options || {}).length ? /* @__PURE__ */ jsx("div", { className: "input-option empty", children: "Nenhuma op\xE7\xE3o encontrada" }) : _.map(
                   options,
                   (value, key) => /* @__PURE__ */ jsx(
                     "div",

package/dist/src/components/types/form/types/select/options/styles.js

@@ -76,9 +76,19 @@ const Container = import_styled_components.default.div`
                     font-size: .8rem;
                     color: ${({ theme }) => theme.t6};
                 }
+                
+                &.empty {
+                    font-size: .8rem;
+                    color: ${({ theme }) => theme.t4};
+                    cursor: default;
+                }
 
                 &:hover {
                     background-color: ${({ theme }) => theme.t05};
+
+                    &.empty {
+                        background-color: transparent;
+                    }
                 }
             }   
         }

package/dist/src/components/types/form/types/select/options/styles.mjs

@@ -43,9 +43,19 @@ const Container = styled.div`
                     font-size: .8rem;
                     color: ${({ theme }) => theme.t6};
                 }
+                
+                &.empty {
+                    font-size: .8rem;
+                    color: ${({ theme }) => theme.t4};
+                    cursor: default;
+                }
 
                 &:hover {
                     background-color: ${({ theme }) => theme.t05};
+
+                    &.empty {
+                        background-color: transparent;
+                    }
                 }
             }   
         }

package/dist/src/contexts/target/events/blur.d.ts

@@ -1 +1,2 @@
-export declare const onBlur: (target: any, index: any, close: any, focusable: any, insideMemory: any) => void;
+import { ITargetConfig } from "../../../interfaces";
+export declare const onBlur: (target: ITargetConfig, index: number, close: (index: number) => void, focusable: HTMLElement, insideMemory: Array<number>) => void;

package/dist/src/contexts/target/events/blur.js

@@ -35,7 +35,6 @@ module.exports = __toCommonJS(blur_exports);
 var import_lodash = __toESM(require("lodash"));
 const onBlur = (target, index, close, focusable, insideMemory) => {
   if (import_lodash.default.some(insideMemory, (i) => i === index)) {
-    console.log("BLUR", target, index);
     focusable.focus();
     return;
   }

package/dist/src/contexts/target/events/blur.mjs

@@ -2,7 +2,6 @@
 import _ from "lodash";
 const onBlur = (target, index, close, focusable, insideMemory) => {
   if (_.some(insideMemory, (i) => i === index)) {
-    console.log("BLUR", target, index);
     focusable.focus();
     return;
   }

package/dist/src/contexts/target/events/click.d.ts

@@ -1 +1,2 @@
-export declare const onClick: (target: any, index: any, close: any, focusable: any, targetElement: any, theme: any, setModal: any) => void;
+import { ITargetConfig, IThemeContext } from "../../../interfaces";
+export declare const onClick: (target: ITargetConfig, index: number, close: (index: number) => void, focusable: HTMLElement, targetElement: HTMLElement, theme: IThemeContext, setModal: (value: number) => void) => void;

package/dist/src/contexts/target/events/click.js

@@ -32,7 +32,6 @@ const onClick = (target, index, close, focusable, targetElement, theme, setModal
     close(index);
     return;
   }
-  console.log("CLICK", target, index);
   focusable.focus();
 };
 // Annotate the CommonJS export names for ESM import in node:

package/dist/src/contexts/target/events/click.mjs

@@ -9,7 +9,6 @@ const onClick = (target, index, close, focusable, targetElement, theme, setModal
     close(index);
     return;
   }
-  console.log("CLICK", target, index);
   focusable.focus();
 };
 export {

package/dist/src/contexts/target/events/focus.d.ts

@@ -1 +1,2 @@
-export declare const onFocus: (target: any, index: any, open: any) => void;
+import { ITargetConfig } from "../../../interfaces";
+export declare const onFocus: (target: ITargetConfig, index: number, open: (target: ITargetConfig, index: number) => void) => void;

package/dist/src/contexts/target/events/focus.js

@@ -23,7 +23,6 @@ __export(focus_exports, {
 });
 module.exports = __toCommonJS(focus_exports);
 const onFocus = (target, index, open) => {
-  console.log("FOCUS", target, index);
   open(target, index);
 };
 // Annotate the CommonJS export names for ESM import in node:

package/dist/src/contexts/target/events/focus.mjs

@@ -1,6 +1,5 @@
 "use client";
 const onFocus = (target, index, open) => {
-  console.log("FOCUS", target, index);
   open(target, index);
 };
 export {

package/dist/src/contexts/target/events/scroll.d.ts

@@ -1 +1,2 @@
-export declare const onScroll: (close: any, containerRef: any, insideMemory: any) => () => void;
+import { MutableRefObject } from "react";
+export declare const onScroll: (close: (index: number) => void, containerRef: MutableRefObject<HTMLElement[]>) => () => void;

package/dist/src/contexts/target/events/scroll.js

@@ -33,10 +33,10 @@ __export(scroll_exports, {
 });
 module.exports = __toCommonJS(scroll_exports);
 var import_lodash = __toESM(require("lodash"));
-const onScroll = (close, containerRef, insideMemory) => {
-  const handleScroll = () => {
+const onScroll = (close, containerRef) => {
+  const handleScroll = (event) => {
     import_lodash.default.forEach(containerRef.current, (element, index) => {
-      if (import_lodash.default.some(insideMemory, (i) => i === index)) return;
+      if (element.contains(event.target)) return;
       close(index);
     });
   };

package/dist/src/contexts/target/events/scroll.mjs

@@ -1,9 +1,9 @@
 "use client";
 import _ from "lodash";
-const onScroll = (close, containerRef, insideMemory) => {
-  const handleScroll = () => {
+const onScroll = (close, containerRef) => {
+  const handleScroll = (event) => {
     _.forEach(containerRef.current, (element, index) => {
-      if (_.some(insideMemory, (i) => i === index)) return;
+      if (element.contains(event.target)) return;
       close(index);
     });
   };

package/dist/src/contexts/target/index.js

@@ -52,7 +52,7 @@ const TargetProviderContainer = ({ children }) => {
   const [targets, setTargets] = (0, import_react.useState)([]);
   const [modal, setModal] = (0, import_react.useState)(-1);
   (0, import_react.useEffect)(() => {
-    (0, import_events.onScroll)(close, containerRef, insideMemory);
+    (0, import_events.onScroll)(close, containerRef);
   }, [containerRef]);
   (0, import_react.useEffect)(() => {
     import_lodash.default.forEach(targets, (target, index) => {
@@ -62,12 +62,8 @@ const TargetProviderContainer = ({ children }) => {
       if (!(toggleElement == null ? void 0 : toggleElement.addEventListener)) return;
       const focusable = elementFocusable(target, index);
       const targetElement = containerRef.current[index];
-      toggleElement.removeEventListener("click", () => (0, import_events.onClick)(target, index, close, focusable, targetElement, theme, setModal));
       toggleElement.addEventListener("click", () => (0, import_events.onClick)(target, index, close, focusable, targetElement, theme, setModal));
       if (theme.content.isMobile) return;
-      toggleElement.removeEventListener("mouseleave", () => removeInside(index));
-      focusable.removeEventListener("focus", () => (0, import_events.onFocus)(target, index, open));
-      focusable.removeEventListener("blur", () => (0, import_events.onBlur)(target, index, close, focusable, insideMemory));
       toggleElement.addEventListener("mouseleave", () => removeInside(index));
       focusable.addEventListener("focus", () => (0, import_events.onFocus)(target, index, open));
       focusable.addEventListener("blur", () => (0, import_events.onBlur)(target, index, close, focusable, insideMemory));
@@ -137,7 +133,6 @@ const TargetProviderContainer = ({ children }) => {
   const add = (target) => {
     const exists = import_lodash.default.find(memory, (data) => data.ref.current === target.ref.current);
     if (exists) return;
-    console.log("memory", [...memory]);
     memory.push(target);
     setTargets([...memory]);
   };

package/dist/src/contexts/target/index.mjs

@@ -18,7 +18,7 @@ const TargetProviderContainer = ({ children }) => {
   const [targets, setTargets] = useState([]);
   const [modal, setModal] = useState(-1);
   useEffect(() => {
-    onScroll(close, containerRef, insideMemory);
+    onScroll(close, containerRef);
   }, [containerRef]);
   useEffect(() => {
     _.forEach(targets, (target, index) => {
@@ -28,12 +28,8 @@ const TargetProviderContainer = ({ children }) => {
       if (!(toggleElement == null ? void 0 : toggleElement.addEventListener)) return;
       const focusable = elementFocusable(target, index);
       const targetElement = containerRef.current[index];
-      toggleElement.removeEventListener("click", () => onClick(target, index, close, focusable, targetElement, theme, setModal));
       toggleElement.addEventListener("click", () => onClick(target, index, close, focusable, targetElement, theme, setModal));
       if (theme.content.isMobile) return;
-      toggleElement.removeEventListener("mouseleave", () => removeInside(index));
-      focusable.removeEventListener("focus", () => onFocus(target, index, open));
-      focusable.removeEventListener("blur", () => onBlur(target, index, close, focusable, insideMemory));
       toggleElement.addEventListener("mouseleave", () => removeInside(index));
       focusable.addEventListener("focus", () => onFocus(target, index, open));
       focusable.addEventListener("blur", () => onBlur(target, index, close, focusable, insideMemory));
@@ -103,7 +99,6 @@ const TargetProviderContainer = ({ children }) => {
   const add = (target) => {
     const exists = _.find(memory, (data) => data.ref.current === target.ref.current);
     if (exists) return;
-    console.log("memory", [...memory]);
     memory.push(target);
     setTargets([...memory]);
   };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gustavo-valsechi/client",
-  "version": "1.4.279",
+  "version": "1.4.281",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",