pge-front-common 14.1.4 → 14.1.6

package/lib/index.esm.js

@@ -903,8 +903,8 @@ var DropDown = function (_a) {
     })));
 };
 
-var css_248z$q = ".menu-module__iconMenu___hsJkY {\r\n  width: 48px;\r\n  height: 49px;\r\n  color: var(--header-menu-icon-color);\r\n}\r\n\r\n@media (max-width: 480px) {\r\n  .menu-module__iconMenu___hsJkY {\r\n    width: 31px;\r\n    height: 49px;\r\n  }\r\n}\r\n";
-var styles$n = {"iconMenu":"menu-module__iconMenu___hsJkY"};
+var css_248z$q = ".menu-module__iconMenu___hsJkY {\r\n  width: 48px;\r\n  height: 49px;\r\n  color: var(--header-menu-icon-color);\r\n}\r\n\r\n.menu-module__menuButton___BV-Rs {\r\n  background: none;\r\n  border: none;\r\n  padding: 0;\r\n  margin: 0;\r\n  cursor: pointer;\r\n}\r\n\r\n@media (max-width: 480px) {\r\n  .menu-module__iconMenu___hsJkY {\r\n    width: 31px;\r\n    height: 49px;\r\n  }\r\n}\r\n";
+var styles$n = {"iconMenu":"menu-module__iconMenu___hsJkY","menuButton":"menu-module__menuButton___BV-Rs"};
 styleInject(css_248z$q);
 
 var Menu$2 = function (_a) {
@@ -932,7 +932,7 @@ var Menu$2 = function (_a) {
             document.removeEventListener("click", handleClickOutside);
         };
     }, [showDropDown]);
-    return (React__default.createElement("button", { ref: buttonRef, style: { all: "unset", cursor: "pointer" }, className: showDropDown ? "active" : undefined, onClick: toggleDropDown, "aria-expanded": showDropDown, "aria-label": "Abrir menu" },
+    return (React__default.createElement("button", { ref: buttonRef, className: "".concat(styles$n.menuButton, " ").concat(showDropDown ? styles$n.active : ""), onClick: toggleDropDown, "aria-expanded": showDropDown, "aria-label": "Abrir menu" },
         React__default.createElement(MenuIcon, { className: styles$n.iconMenu }),
         showDropDown && (React__default.createElement(DropDown, { options: options, showDropDown: showDropDown, toggleDropDown: toggleDropDown, optionSelection: handleSelectOption }))));
 };
@@ -8591,10 +8591,6 @@ var SelectMult = function (_a) {
         !hasError && message && React__default.createElement("p", { className: styles$g.message }, message)));
 };
 
-var css_248z$f = ".styles-module__selectContainer___uFP2d {\r\n  width: 100%;\r\n  font-size: var(--font-size-14);\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 8px;\r\n}\r\n\r\n.styles-module__selectContainer___uFP2d label {\r\n  font-size: var(--font-size-16);\r\n  font-weight: 700;\r\n  line-height: 24px;\r\n  color: var(--color-label);\r\n}\r\n\r\n@media (max-width: 480px) {\r\n  .styles-module__selectContainer___uFP2d label {\r\n    font-size: var(--font-size-12);\r\n  }\r\n\r\n  .styles-module__selectContainer___uFP2d {\r\n    font-size: var(--font-size-12);\r\n  }\r\n}\r\n\r\n.styles-module__errorText___grCcq {\r\n  font-size: var(--font-size-12);\r\n  font-weight: 700;\r\n  line-height: 15px;\r\n  text-align: left;\r\n  color: var(--color-danger);\r\n  margin-left: 8px;\r\n}\r\n\r\n.styles-module__errorRequired___PNeLN {\r\n  font-size: var(--font-size-16);\r\n  font-weight: 700;\r\n  line-height: 24px;\r\n  text-align: left;\r\n  color: var(--color-danger);\r\n}\r\n\r\n.styles-module__contentIcon___SAMFM {\r\n  display: flex;\r\n  align-items: center;\r\n  padding: 8px;\r\n}\r\n\r\n.styles-module__iconChefron___Cp81j {\r\n  color: var(--color-label);\r\n}\r\n";
-var styles$f = {"selectContainer":"styles-module__selectContainer___uFP2d","errorText":"styles-module__errorText___grCcq","errorRequired":"styles-module__errorRequired___PNeLN","contentIcon":"styles-module__contentIcon___SAMFM","iconChefron":"styles-module__iconChefron___Cp81j"};
-styleInject(css_248z$f);
-
 function useDarkMode() {
     var isClient = typeof document !== 'undefined';
     var _a = useState(function () { return isClient && document.body.classList.contains('dark-mode'); }), isDarkMode = _a[0], setIsDarkMode = _a[1];
@@ -8638,6 +8634,10 @@ function useIsMobile(breakpoint) {
     return isMobile;
 }
 
+var css_248z$f = ".styles-module__selectContainer___uFP2d {\r\n  width: 100%;\r\n  font-size: var(--font-size-14);\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 8px;\r\n}\r\n\r\n.styles-module__selectContainer___uFP2d label {\r\n  font-size: var(--font-size-16);\r\n  font-weight: 700;\r\n  line-height: 24px;\r\n  color: var(--color-label);\r\n}\r\n\r\n@media (max-width: 480px) {\r\n  .styles-module__selectContainer___uFP2d label {\r\n    font-size: var(--font-size-12);\r\n  }\r\n\r\n  .styles-module__selectContainer___uFP2d {\r\n    font-size: var(--font-size-12);\r\n  }\r\n}\r\n\r\n.styles-module__errorText___grCcq {\r\n  font-size: var(--font-size-12);\r\n  font-weight: 700;\r\n  line-height: 15px;\r\n  text-align: left;\r\n  color: var(--color-danger);\r\n  margin-left: 8px;\r\n}\r\n\r\n.styles-module__errorRequired___PNeLN {\r\n  font-size: var(--font-size-16);\r\n  font-weight: 700;\r\n  line-height: 24px;\r\n  text-align: left;\r\n  color: var(--color-danger);\r\n}\r\n\r\n.styles-module__contentIcon___SAMFM {\r\n  display: flex;\r\n  align-items: center;\r\n  padding: 8px;\r\n}\r\n\r\n.styles-module__iconChefron___Cp81j {\r\n  color: var(--color-label);\r\n}\r\n";
+var styles$f = {"selectContainer":"styles-module__selectContainer___uFP2d","errorText":"styles-module__errorText___grCcq","errorRequired":"styles-module__errorRequired___PNeLN","contentIcon":"styles-module__contentIcon___SAMFM","iconChefron":"styles-module__iconChefron___Cp81j"};
+styleInject(css_248z$f);
+
 var selectColourStyles$1 = function (isInvalid, isDarkMode, isMobile) { return ({
     control: function (styles, _a) {
         var isFocused = _a.isFocused, isDisabled = _a.isDisabled;
@@ -8650,11 +8650,19 @@ var selectColourStyles$1 = function (isInvalid, isDarkMode, isMobile) { return (
     option: function (styles, _a) {
         var isDisabled = _a.isDisabled, isFocused = _a.isFocused;
         return (__assign(__assign({}, styles), { cursor: isDisabled ? "not-allowed" : "default", color: isDisabled ? "white" : isDarkMode ? "#fff" : "#303030CC", backgroundColor: isDarkMode
-                ? isFocused ? "#303030" : "#4B4B4C"
-                : isFocused ? "#005A921A" : "#fff", fontSize: "inherit", ":hover": {
+                ? isFocused
+                    ? "#303030"
+                    : "#4B4B4C"
+                : isFocused
+                    ? "#005A921A"
+                    : "#fff", fontSize: "inherit", ":hover": {
                 backgroundColor: isDarkMode
-                    ? isFocused ? "#303030" : "#4B4B4C"
-                    : isFocused ? "#005A921A" : "#fff",
+                    ? isFocused
+                        ? "#303030"
+                        : "#4B4B4C"
+                    : isFocused
+                        ? "#005A921A"
+                        : "#fff",
             } }));
     },
     multiValue: function (styles) { return (__assign(__assign({}, styles), { backgroundColor: "#005a921a", borderRadius: "9px" })); },
@@ -8683,9 +8691,29 @@ var BasicSelect = function (_a) {
             label,
             isRequired ? React.createElement("span", { className: styles$f.errorRequired }, "*") : null)),
         React.createElement("div", { className: styles$f.selectElement },
-            React.createElement(StateManagedSelect$1, { inputId: name, isMulti: false, isDisabled: isDisabled, options: optionsSelect, value: optionsSelect.find(function (opt) { return opt.value === value; }) || value, onChange: handleChange, placeholder: placeholder, styles: selectColourStyles$1(hasError, isDarkMode), isClearable: true, isSearchable: true, noOptionsMessage: function () { return "Nenhuma opção disponível"; }, components: { DropdownIndicator: CustomDropdownIndicator }, "aria-label": typeof label === 'string' ? label : (placeholder || "Campo para seleção") })),
+            React.createElement(StateManagedSelect$1, { inputId: name, isMulti: false, isDisabled: isDisabled, options: optionsSelect, value: optionsSelect.find(function (opt) { return opt.value === value; }) || value, onChange: handleChange, placeholder: placeholder, styles: selectColourStyles$1(hasError, isDarkMode), isSearchable: true, isClearable: true, noOptionsMessage: function () { return "Nenhuma opção disponível"; }, components: {
+                    DropdownIndicator: CustomDropdownIndicator,
+                    ClearIndicator: CustomClearIndicator,
+                }, "aria-label": typeof label === "string"
+                    ? label
+                    : placeholder || "Campo para seleção" })),
         hasError && (React.createElement("span", { className: styles$f.errorText }, "Campo obrigat\u00F3rio ou inv\u00E1lido"))));
 };
+var CustomClearIndicator = function (props) {
+    var innerProps = props.innerProps, clearValue = props.clearValue, inputId = props.selectProps.inputId;
+    var handleClear = function (e) {
+        e.preventDefault();
+        e.stopPropagation();
+        clearValue();
+        var input = document.getElementById(inputId || "");
+        input === null || input === void 0 ? void 0 : input.focus();
+    };
+    return (React.createElement(components.ClearIndicator, __assign({}, props, { innerProps: __assign(__assign({}, innerProps), { tabIndex: 0, role: "button", "aria-label": "Limpar opção selecionada", onMouseDown: handleClear, onTouchEnd: handleClear, onKeyDown: function (e) {
+                if (e.key === " " || e.key === "Enter") {
+                    handleClear(e);
+                }
+            } }) })));
+};
 
 var css_248z$e = ".header-module__separator_background___Sicie {\r\n  background-color: rgb(188, 157, 50);\r\n  width: 100%;\r\n  height: 4px;\r\n  opacity: 1;\r\n}\r\n\r\n.header-module__headerContentWrapper___3CWPS {\r\n  height: 100%;\r\n  display: flex;\r\n  flex-direction: row;\r\n  align-items: center;\r\n  width: 100%;\r\n  max-width: 1440px;\r\n  padding: 0px 72px;\r\n}\r\n\r\n@media (max-width: 600px) {\r\n  .header-module__headerContentWrapper___3CWPS {\r\n    padding: 0px 4px;\r\n  }\r\n}\r\n\r\n.header-module__container___pv1f6 {\r\n  height: 100%;\r\n  width: 100%;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  padding: 28px 0px;\r\n  min-width: 1024px;\r\n\r\n  @media (max-width: 1024px) {\r\n    padding: 22px 16px;\r\n    min-width: 100%;\r\n  }\r\n}\r\n\r\n.header-module__wrapperMenu___qgf2- {\r\n  display: flex;\r\n  gap: 24px;\r\n  align-items: center;\r\n\r\n  @media (max-width: 1024px) {\r\n    gap: 8px;\r\n  }\r\n}\r\n\r\n.header-module__iconLogo___Sr8Ih {\r\n  @media (max-width: 1024px) {\r\n    width: 100px;\r\n  }\r\n}\r\n\r\n@media (max-width: 768px) {\r\n  .header-module__iconLogo___Sr8Ih {\r\n    width: 64px;\r\n    height: 25px;\r\n  }\r\n}\r\n\r\n.header-module__verticalDivider___j6I1p {\r\n  content: \"\";\r\n  display: inline-block;\r\n  height: 50px;\r\n  width: 1px;\r\n  background-color: #ccc;\r\n  margin: 0px 0px 0px 0px;\r\n}\r\n\r\n.header-module__containerHeaderIndex___6ddUY {\r\n  display: flex;\r\n  flex-direction: column;\r\n  justify-content: center;\r\n  align-items: center;\r\n  width: 100%;\r\n  max-height: 6rem;\r\n  font-size: 2rem;\r\n  box-shadow: 0px 15px 10px -15px rgba(0, 0, 0, 0.19);\r\n  background-color: var(--header-bg-main-color);\r\n}\r\n\r\n.header-module__set_shadow___Wwh0E {\r\n  border-radius: 0px 0px 16px 16px;\r\n  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.25);\r\n}\r\n\r\n.header-module__limitedWidth___PhM7B {\r\n  max-width: 1440px;\r\n  margin: 0 auto;\r\n}\r\n\r\n@media (min-width: 640px) {\r\n  .header-module__containerHeaderIndex___6ddUY {\r\n    max-height: 6rem;\r\n  }\r\n}\r\n\r\n@media (min-width: 768px) {\r\n  .header-module__containerHeaderIndex___6ddUY {\r\n    max-height: 13rem;\r\n  }\r\n}\r\n\r\n.header-module__iconLogoCASC___HX7YL {\r\n  height: 65px;\r\n  width: auto;\r\n}\r\n\r\n.header-module__iconLogoPGE___II1i2 {\r\n  margin-right: 20px;\r\n}\r\n\r\n@media (max-width: 1024px) {\r\n  .header-module__iconLogoCASC___HX7YL {\r\n    height: 45px;\r\n    width: auto;\r\n  }\r\n}\r\n\r\n.header-module__responsiveCASC___nqE60 {\r\n  @media (max-width: 1024px) {\r\n    .header-module__iconLogoCASC___HX7YL {\r\n      height: 45px;\r\n      width: auto;\r\n    }\r\n  }\r\n\r\n  @media (max-width: 600px) {\r\n    .header-module__iconLogoCASC___HX7YL {\r\n      height: 40px;\r\n      width: auto;\r\n    }\r\n  }\r\n}\r\n\r\n.header-module__dividaAtivaLogoContainer___k6PDu {\r\n  display: flex;\r\n  flex-direction: row;\r\n  justify-content: space-between;\r\n  align-items: center;\r\n  gap: 4px;\r\n}\r\n\r\n.header-module__IconMenu___guscJ {\r\n  display: flex;\r\n  max-height: 48px;\r\n}\r\n";
 var styles$e = {"separator_background":"header-module__separator_background___Sicie","headerContentWrapper":"header-module__headerContentWrapper___3CWPS","container":"header-module__container___pv1f6","wrapperMenu":"header-module__wrapperMenu___qgf2-","iconLogo":"header-module__iconLogo___Sr8Ih","verticalDivider":"header-module__verticalDivider___j6I1p","containerHeaderIndex":"header-module__containerHeaderIndex___6ddUY","set_shadow":"header-module__set_shadow___Wwh0E","limitedWidth":"header-module__limitedWidth___PhM7B","iconLogoCASC":"header-module__iconLogoCASC___HX7YL","iconLogoPGE":"header-module__iconLogoPGE___II1i2","responsiveCASC":"header-module__responsiveCASC___nqE60","dividaAtivaLogoContainer":"header-module__dividaAtivaLogoContainer___k6PDu","IconMenu":"header-module__IconMenu___guscJ"};