pge-front-common 14.2.25 → 14.2.26

package/lib/index.js

@@ -763,8 +763,8 @@ var PgeButton = React.forwardRef(function (_a, ref) {
 });
 PgeButton.displayName = "PgeButton";
 
-var css_248z$E = ".styles-module__container___9pLua {\r\n  width: 100%;\r\n  height: fit-content;\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 4px;\r\n}\r\n\r\n.styles-module__label___AWyTG {\r\n  font-size: var(--font-size-16);\r\n  font-weight: 600;\r\n  line-height: 24px;\r\n  text-align: left;\r\n  color: var(--color-label);\r\n}\r\n\r\n.styles-module__labelUpload___LOAO- {\r\n  font-size: var(--font-size-16);\r\n  font-weight: 400;\r\n  line-height: 24px;\r\n  text-align: left;\r\n  color: var(--color-label);\r\n}\r\n\r\n@media (max-width: 480px) {\r\n  .styles-module__label___AWyTG {\r\n    font-size: var(--font-size-12);\r\n    font-weight: 600;\r\n    line-height: 24px;\r\n    text-align: left;\r\n    color: var(--color-label);\r\n  }\r\n\r\n  .styles-module__labelUpload___LOAO- {\r\n    font-size: var(--font-size-12);\r\n    font-weight: 400;\r\n    line-height: 24px;\r\n    text-align: left;\r\n    color: var(--color-label);\r\n  }\r\n}\r\n\r\n.styles-module__inputContainer___tsCfV {\r\n  width: 100%;\r\n  height: 58px;\r\n  display: flex;\r\n  flex-direction: row;\r\n  align-items: center;\r\n  gap: 10px;\r\n  border: 2px dotted var(--upload-border-color, #005a9280);\r\n  border-radius: 16px;\r\n  padding: 10px;\r\n  margin-top: 5px;\r\n}\r\n\r\n@media (max-width: 480px) {\r\n  .styles-module__inputContainer___tsCfV {\r\n    height: 52px;\r\n  }\r\n}\r\n\r\n.styles-module__button___1GicM {\r\n  width: fit-content;\r\n  height: 38px;\r\n  display: flex;\r\n  align-items: center;\r\n  padding: 7px 13px;\r\n  gap: 8px;\r\n  border-radius: 10px;\r\n  cursor: pointer;\r\n  white-space: nowrap;\r\n}\r\n\r\n@media (max-width: 480px) {\r\n  .styles-module__button___1GicM {\r\n    min-width: 91px;\r\n    height: 32px;\r\n  }\r\n}\r\n\r\n.styles-module__hiddenInput___lDoAG {\r\n  display: none;\r\n}\r\n\r\n.styles-module__description___S1vZj {\r\n  font-size: var(--font-size-16);\r\n  font-weight: 400;\r\n  line-height: 24px;\r\n  text-align: left;\r\n  color: var(--input-placeholder-focus);\r\n}\r\n\r\n@media (max-width: 480px) {\r\n  .styles-module__description___S1vZj {\r\n    font-size: var(--font-size-12);\r\n    font-weight: 400;\r\n    line-height: 24px;\r\n    text-align: left;\r\n    color: var(--input-placeholder-focus);\r\n  }\r\n}\r\n\r\n.styles-module__instructionText___fa9r4 {\r\n  font-size: var(--font-size-16);\r\n  font-weight: 500;\r\n  line-height: 24px;\r\n  text-align: left;\r\n  color: var(--foreground);\r\n}\r\n\r\n.styles-module__primary___AtNI- {\r\n  background-color: var(--btn-bg-primary-color);\r\n  color: var(--btn-text-primary-color);\r\n  border: none;\r\n}\r\n\r\n.styles-module__primary___AtNI-:hover {\r\n  background-color: var(--btn-bg-primary-color);\r\n  color: var(--btn-text-hover-primary-color);\r\n  outline: 3px solid var(--btn-bg-focus-primary-color);\r\n}\r\n\r\n.styles-module__primary___AtNI-:active {\r\n  border: 1.8px solid var(--Pressed-button, #3ab0f3);\r\n}\r\n\r\n.styles-module__primary___AtNI-:focus {\r\n  box-shadow: 0px 4px 4px 0px #00000040;\r\n  background: var(--btn-bg-focus-primary-color, #00436d);\r\n  color: var(--btn-text-focus-primary-color);\r\n  outline: 2px solid var(--btn-text-focus-primary-color);\r\n}\r\n\r\n.styles-module__primary___AtNI-:disabled {\r\n  background: var(--light-grey-color, #c3c3c3);\r\n  cursor: not-allowed;\r\n}\r\n\r\n.styles-module__secondary___-anJq {\r\n  border: 1px solid var(--btn-up-border-secondary-color);\r\n  background: var(--btn-up-bg-secondary-color);\r\n  color: var(--btn-up-text-secondary-color);\r\n}\r\n\r\n.styles-module__secondary___-anJq:hover {\r\n  background: var(--btn-up-bg-hover-secondary-color);\r\n  border: 1px solid var(--btn-up-border-secondary-color);\r\n  color: var(--btn-up-text-hover-secondary-color);\r\n}\r\n\r\n.styles-module__secondary___-anJq:active {\r\n  background: #00436d1a;\r\n  border: 2px solid #3ab0f3cc;\r\n}\r\n\r\n.styles-module__secondary___-anJq:focus {\r\n  background: var(--btn-up-bg-focus-secondary-color);\r\n  color: var(--btn-up-text-focus-secondary-color);\r\n  outline: 2.5px solid var(--btn-up-border-secondary-color);\r\n}\r\n\r\n.styles-module__secondary___-anJq:disabled {\r\n  border: 1px solid var(--light-grey-color, #c3c3c3);\r\n  color: var(--light-grey-color, #c3c3c3);\r\n  cursor: not-allowed;\r\n}\r\n\r\n.styles-module__secondary___-anJq.styles-module__danger___RwQhk {\r\n  border: 1px solid var(--btn-up-border-danger-secondary-color, #cb0a0a);\r\n  color: var(--btn-up-text-danger-secondary-color, #cb0a0a);\r\n}\r\n\r\n.styles-module__errorText___1LAhk {\r\n  font-size: var(--font-size-14);\r\n  font-weight: 400;\r\n  line-height: 21px;\r\n  text-align: left;\r\n  color: var(--alert-color);\r\n}\r\n\r\n.styles-module__successText___s1G4K {\r\n  font-size: var(--font-size-14);\r\n  font-weight: 400;\r\n  line-height: 21px;\r\n  text-align: left;\r\n  color: var(--success-color);\r\n}\r\n\r\n@media (max-width: 480px) {\r\n  .styles-module__errorText___1LAhk {\r\n    font-size: var(--font-size-10);\r\n  }\r\n\r\n  .styles-module__successText___s1G4K {\r\n    font-size: var(--font-size-10);\r\n  }\r\n}\r\n";
-var styles$A = {"container":"styles-module__container___9pLua","label":"styles-module__label___AWyTG","labelUpload":"styles-module__labelUpload___LOAO-","inputContainer":"styles-module__inputContainer___tsCfV","button":"styles-module__button___1GicM","hiddenInput":"styles-module__hiddenInput___lDoAG","description":"styles-module__description___S1vZj","instructionText":"styles-module__instructionText___fa9r4","primary":"styles-module__primary___AtNI-","secondary":"styles-module__secondary___-anJq","danger":"styles-module__danger___RwQhk","errorText":"styles-module__errorText___1LAhk","successText":"styles-module__successText___s1G4K"};
+var css_248z$E = ".styles-module__container___9pLua {\r\n  width: 100%;\r\n  height: fit-content;\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 4px;\r\n}\r\n\r\n.styles-module__label___AWyTG {\r\n  font-size: var(--font-size-16);\r\n  font-weight: 600;\r\n  line-height: 24px;\r\n  text-align: left;\r\n  color: var(--color-label);\r\n}\r\n\r\n.styles-module__labelUpload___LOAO- {\r\n  font-size: var(--font-size-16);\r\n  font-weight: 400;\r\n  line-height: 24px;\r\n  text-align: left;\r\n  color: var(--color-label);\r\n}\r\n\r\n@media (max-width: 480px) {\r\n  .styles-module__label___AWyTG {\r\n    font-size: var(--font-size-12);\r\n    font-weight: 600;\r\n    line-height: 24px;\r\n    text-align: left;\r\n    color: var(--color-label);\r\n  }\r\n\r\n  .styles-module__labelUpload___LOAO- {\r\n    font-size: var(--font-size-12);\r\n    font-weight: 400;\r\n    line-height: 24px;\r\n    text-align: left;\r\n    color: var(--color-label);\r\n  }\r\n}\r\n\r\n.styles-module__inputContainer___tsCfV {\r\n  width: 100%;\r\n  height: 58px;\r\n  display: flex;\r\n  flex-direction: row;\r\n  align-items: center;\r\n  gap: 10px;\r\n  border: 2px dotted var(--upload-border-color, #005a9280);\r\n  border-radius: 16px;\r\n  padding: 10px;\r\n  margin-top: 5px;\r\n}\r\n\r\n\r\n\r\n.styles-module__rightIcon___UN4xe {\r\n  margin-left: auto;\r\n}\r\n\r\n@media (max-width: 480px) {\r\n  .styles-module__inputContainer___tsCfV {\r\n    height: 52px;\r\n  }\r\n}\r\n\r\n.styles-module__button___1GicM {\r\n  width: fit-content;\r\n  height: 38px;\r\n  display: flex;\r\n  align-items: center;\r\n  padding: 7px 13px;\r\n  gap: 8px;\r\n  border-radius: 10px;\r\n  cursor: pointer;\r\n  white-space: nowrap;\r\n}\r\n\r\n@media (max-width: 480px) {\r\n  .styles-module__button___1GicM {\r\n    min-width: 91px;\r\n    height: 32px;\r\n  }\r\n}\r\n\r\n.styles-module__hiddenInput___lDoAG {\r\n  display: none;\r\n}\r\n\r\n.styles-module__description___S1vZj {\r\n  font-size: var(--font-size-16);\r\n  font-weight: 400;\r\n  line-height: 24px;\r\n  text-align: left;\r\n  color: var(--input-placeholder-focus);\r\n}\r\n\r\n.styles-module__linkDescription___T2DrY {\r\n  font-size: var(--font-size-16);\r\n  font-weight: 400;\r\n  line-height: 24px;\r\n  text-align: left;\r\n  text-decoration: underline;\r\n  color: var(--color-primary);\r\n  cursor: pointer;\r\n}\r\n\r\n.styles-module__linkDescription___T2DrY:hover {\r\n  opacity: 0.75;\r\n}\r\n\r\n@media (max-width: 480px) {\r\n  .styles-module__description___S1vZj {\r\n    font-size: var(--font-size-12);\r\n    font-weight: 400;\r\n    line-height: 24px;\r\n    text-align: left;\r\n    color: var(--input-placeholder-focus);\r\n  }\r\n}\r\n\r\n.styles-module__instructionText___fa9r4 {\r\n  font-size: var(--font-size-16);\r\n  font-weight: 500;\r\n  line-height: 24px;\r\n  text-align: left;\r\n  color: var(--foreground);\r\n}\r\n\r\n.styles-module__primary___AtNI- {\r\n  background-color: var(--btn-bg-primary-color);\r\n  color: var(--btn-text-primary-color);\r\n  border: none;\r\n}\r\n\r\n.styles-module__primary___AtNI-:hover {\r\n  background-color: var(--btn-bg-primary-color);\r\n  color: var(--btn-text-hover-primary-color);\r\n  outline: 3px solid var(--btn-bg-focus-primary-color);\r\n}\r\n\r\n.styles-module__primary___AtNI-:active {\r\n  border: 1.8px solid var(--Pressed-button, #3ab0f3);\r\n}\r\n\r\n.styles-module__primary___AtNI-:focus {\r\n  box-shadow: 0px 4px 4px 0px #00000040;\r\n  background: var(--btn-bg-focus-primary-color, #00436d);\r\n  color: var(--btn-text-focus-primary-color);\r\n  outline: 2px solid var(--btn-text-focus-primary-color);\r\n}\r\n\r\n.styles-module__primary___AtNI-:disabled {\r\n  background: var(--light-grey-color, #c3c3c3);\r\n  cursor: not-allowed;\r\n}\r\n\r\n.styles-module__secondary___-anJq {\r\n  border: 1px solid var(--btn-up-border-secondary-color);\r\n  background: var(--btn-up-bg-secondary-color);\r\n  color: var(--btn-up-text-secondary-color);\r\n}\r\n\r\n.styles-module__secondary___-anJq:hover {\r\n  background: var(--btn-up-bg-hover-secondary-color);\r\n  border: 1px solid var(--btn-up-border-secondary-color);\r\n  color: var(--btn-up-text-hover-secondary-color);\r\n}\r\n\r\n.styles-module__secondary___-anJq:active {\r\n  background: #00436d1a;\r\n  border: 2px solid #3ab0f3cc;\r\n}\r\n\r\n.styles-module__secondary___-anJq:focus {\r\n  background: var(--btn-up-bg-focus-secondary-color);\r\n  color: var(--btn-up-text-focus-secondary-color);\r\n  outline: 2.5px solid var(--btn-up-border-secondary-color);\r\n}\r\n\r\n.styles-module__secondary___-anJq:disabled {\r\n  border: 1px solid var(--light-grey-color, #c3c3c3);\r\n  color: var(--light-grey-color, #c3c3c3);\r\n  cursor: not-allowed;\r\n}\r\n\r\n.styles-module__secondary___-anJq.styles-module__danger___RwQhk {\r\n  border: 1px solid var(--btn-up-border-danger-secondary-color, #cb0a0a);\r\n  color: var(--btn-up-text-danger-secondary-color, #cb0a0a);\r\n}\r\n\r\n.styles-module__errorText___1LAhk {\r\n  font-size: var(--font-size-14);\r\n  font-weight: 400;\r\n  line-height: 21px;\r\n  text-align: left;\r\n  color: var(--alert-color);\r\n}\r\n\r\n.styles-module__successText___s1G4K {\r\n  font-size: var(--font-size-14);\r\n  font-weight: 400;\r\n  line-height: 21px;\r\n  text-align: left;\r\n  color: var(--success-color);\r\n}\r\n\r\n@media (max-width: 480px) {\r\n  .styles-module__errorText___1LAhk {\r\n    font-size: var(--font-size-10);\r\n  }\r\n\r\n  .styles-module__successText___s1G4K {\r\n    font-size: var(--font-size-10);\r\n  }\r\n}\r\n";
+var styles$A = {"container":"styles-module__container___9pLua","label":"styles-module__label___AWyTG","labelUpload":"styles-module__labelUpload___LOAO-","inputContainer":"styles-module__inputContainer___tsCfV","rightIcon":"styles-module__rightIcon___UN4xe","button":"styles-module__button___1GicM","hiddenInput":"styles-module__hiddenInput___lDoAG","description":"styles-module__description___S1vZj","linkDescription":"styles-module__linkDescription___T2DrY","instructionText":"styles-module__instructionText___fa9r4","primary":"styles-module__primary___AtNI-","secondary":"styles-module__secondary___-anJq","danger":"styles-module__danger___RwQhk","errorText":"styles-module__errorText___1LAhk","successText":"styles-module__successText___s1G4K"};
 styleInject(css_248z$E);
 
 var parseSizeToBytes = function (size) {
@@ -788,14 +788,14 @@ var parseSizeToBytes = function (size) {
 };
 var FileUpload = React.forwardRef(function (_a, ref) {
     var _b;
-    var _c = _a.variant, variant = _c === void 0 ? "primary" : _c, _d = _a.danger, danger = _d === void 0 ? false : _d, fileTypes = _a.fileTypes, onFileSelect = _a.onFileSelect, _e = _a.title, title = _e === void 0 ? React.createElement(React.Fragment, null, "Upload de Arquivos:") : _e, _f = _a.descricaoLabel, descricaoLabel = _f === void 0 ? "Escolher arquivo" : _f, className = _a.className, _g = _a.errorText, errorText = _g === void 0 ? "" : _g, _h = _a.noSelectedFileText, noSelectedFileText = _h === void 0 ? "Nenhum arquivo selecionado" : _h, _j = _a.helperText, helperText = _j === void 0 ? "" : _j, _k = _a.maxFileSize, maxFileSize = _k === void 0 ? "" : _k; __rest(_a, ["variant", "danger", "fileTypes", "onFileSelect", "title", "descricaoLabel", "className", "errorText", "noSelectedFileText", "helperText", "maxFileSize"]);
+    var _c = _a.variant, variant = _c === void 0 ? "primary" : _c, _d = _a.danger, danger = _d === void 0 ? false : _d, fileTypes = _a.fileTypes, onFileSelect = _a.onFileSelect, _e = _a.title, title = _e === void 0 ? React.createElement(React.Fragment, null, "Upload de Arquivos:") : _e, _f = _a.descricaoLabel, descricaoLabel = _f === void 0 ? "Escolher arquivo" : _f, className = _a.className, _g = _a.errorText, errorText = _g === void 0 ? "" : _g, _h = _a.noSelectedFileText, noSelectedFileText = _h === void 0 ? "Nenhum arquivo selecionado" : _h, _j = _a.helperText, helperText = _j === void 0 ? "" : _j, _k = _a.maxFileSize, maxFileSize = _k === void 0 ? "" : _k, _l = _a.rightIcon, rightIcon = _l === void 0 ? null : _l, _m = _a.isDownloadable, isDownloadable = _m === void 0 ? false : _m, onDownload = _a.onDownload; __rest(_a, ["variant", "danger", "fileTypes", "onFileSelect", "title", "descricaoLabel", "className", "errorText", "noSelectedFileText", "helperText", "maxFileSize", "rightIcon", "isDownloadable", "onDownload"]);
     var buttonClass = clsx(styles$A.labelUpload, styles$A.button, styles$A[variant], (_b = {},
         _b[styles$A.danger] = danger && variant !== "primary",
         _b), className);
     var inputId = React.useId();
     var helperId = React.useId();
     var errorId = React.useId();
-    var _l = React.useState(""), fileName = _l[0], setFileName = _l[1];
+    var _o = React.useState(""), fileName = _o[0], setFileName = _o[1];
     var fileInputRef = React.useRef(null);
     var handleFileChange = function (event) {
         var _a, _b;
@@ -848,7 +848,9 @@ var FileUpload = React.forwardRef(function (_a, ref) {
                 React.createElement(IconUploadFile, { "aria-hidden": "true" }),
                 descricaoLabel),
             React.createElement("input", { id: inputId, type: "file", ref: fileInputRef, className: styles$A.hiddenInput, onChange: handleFileChange, accept: fileTypes.join(","), "aria-describedby": "".concat(helperId, " ").concat(errorText ? errorId : ""), "aria-label": "Campo de input para selecionar arquivo", "aria-invalid": !!errorText }),
-            React.createElement("span", { className: styles$A.description }, fileName || noSelectedFileText)),
+            React.createElement("span", { className: isDownloadable ? styles$A.linkDescription : styles$A.description, onClick: isDownloadable && onDownload ? onDownload : undefined, role: isDownloadable && onDownload ? "button" : undefined, tabIndex: isDownloadable && onDownload ? 0 : undefined, onKeyDown: isDownloadable && onDownload ? function (e) { if (e.key === "Enter" || e.key === " ")
+                    onDownload(); } : undefined }, fileName || noSelectedFileText),
+            rightIcon && (React.createElement("div", { className: styles$A.rightIcon }, rightIcon))),
         React.createElement("span", { id: errorText ? errorId : helperId, role: "alert", "aria-live": "polite", className: errorText
                 ? styles$A.errorText
                 : fileName