pge-front-common 14.1.30 → 14.1.31

package/lib/components/ProgressCircle/index.d.ts

@@ -1,4 +1,4 @@
 import React from "react";
 import { ProgressCircleProps } from "./progressCircle.types";
-declare function ProgressCircle({ percentage, message, size, onClose, }: ProgressCircleProps): React.JSX.Element;
+declare function ProgressCircle({ percentage, message, size, infinite, isInProgress, onClose, }: ProgressCircleProps): React.JSX.Element | null;
 export default ProgressCircle;

package/lib/components/ProgressCircle/progressCircle.stories.d.ts

@@ -9,3 +9,4 @@ export declare const LowProgress: import("@storybook/core/csf").AnnotatedStoryFn
 export declare const SmallSize: import("@storybook/core/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, ProgressCircleProps>;
 export declare const MediumSize: import("@storybook/core/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, ProgressCircleProps>;
 export declare const LargeSize: import("@storybook/core/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, ProgressCircleProps>;
+export declare const Infinite: import("@storybook/core/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, ProgressCircleProps>;

package/lib/components/ProgressCircle/progressCircle.types.d.ts

@@ -3,4 +3,6 @@ export interface ProgressCircleProps {
     message?: string;
     size?: "small" | "medium" | "large";
     onClose: () => void;
+    infinite?: boolean;
+    isInProgress?: boolean;
 }

package/lib/index.d.ts

@@ -830,9 +830,11 @@ interface ProgressCircleProps {
     message?: string;
     size?: "small" | "medium" | "large";
     onClose: () => void;
+    infinite?: boolean;
+    isInProgress?: boolean;
 }
 
-declare function ProgressCircle({ percentage, message, size, onClose, }: ProgressCircleProps): React__default.JSX.Element;
+declare function ProgressCircle({ percentage, message, size, infinite, isInProgress, onClose, }: ProgressCircleProps): React__default.JSX.Element | null;
 
 type ChipVariant = "primary" | "information" | "success" | "warning" | "error" | "avatar";
 type ChipSize = "small" | "medium" | "large";

package/lib/index.esm.js

@@ -24175,21 +24175,25 @@ var Switch = function (_a) {
                 React__default.createElement("rect", { x: "16.0645", y: "15.9998", width: "16", height: "16", rx: "8", transform: "rotate(179.527 16.0645 15.9998)", fill: "#A0A0A0" })))))));
 };
 
-var css_248z$2 = ".progressCircle-module__overlay___BHoDf {\r\n  position: fixed;\r\n  top: 0;\r\n  left: 0;\r\n  width: 100%;\r\n  height: 100%;\r\n  background: rgba(0, 0, 0, 0.5);\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n.progressCircle-module__modal___tI5Fh {\r\n  background: #fff;\r\n  padding: 20px;\r\n  border-radius: 10px;\r\n  text-align: center;\r\n  max-width: 220px;\r\n  width: 100%;\r\n}\r\n\r\n.progressCircle-module__progressContainer___52PeR {\r\n  position: relative;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  margin: 10px auto;\r\n}\r\n\r\n.progressCircle-module__progressRing___7xKz8 {\r\n  transform: rotate(-90deg);\r\n  width: 100%;\r\n  height: 100%;\r\n}\r\n\r\n.progressCircle-module__progressBackground___m6YDA,\r\n.progressCircle-module__progressForeground___NWZOt {\r\n  fill: none;\r\n  stroke-width: 4px;\r\n  cx: 50;\r\n  cy: 50;\r\n  r: 46;\r\n}\r\n\r\n.progressCircle-module__progressBackground___m6YDA {\r\n  stroke: rgba(0, 90, 146, 0.2);\r\n}\r\n\r\n.progressCircle-module__progressForeground___NWZOt {\r\n  stroke: #005a92;\r\n  stroke-linecap: round;\r\n  transition: stroke-dashoffset 0.5s ease;\r\n  stroke-dasharray: 289.03;\r\n  stroke-dashoffset: 0;\r\n}\r\n\r\n/* ====== TAMANHOS ====== */\r\n.progressCircle-module__progressContainer___52PeR.progressCircle-module__large___BZOsB {\r\n  width: 110px;\r\n  height: 110px;\r\n}\r\n\r\n.progressCircle-module__progressContainer___52PeR.progressCircle-module__medium___dFw6V {\r\n  width: 80px;\r\n  height: 80px;\r\n}\r\n\r\n.progressCircle-module__progressContainer___52PeR.progressCircle-module__small___Rgbob {\r\n  width: 60px;\r\n  height: 60px;\r\n}\r\n\r\n/* Oculta a porcentagem e o ícone de ampulheta para os tamanhos medium e small */\r\n.progressCircle-module__progressContainer___52PeR.progressCircle-module__medium___dFw6V .progressCircle-module__percentageContainer___jYTsq,\r\n.progressCircle-module__progressContainer___52PeR.progressCircle-module__small___Rgbob .progressCircle-module__percentageContainer___jYTsq {\r\n  display: none;\r\n}\r\n\r\n.progressCircle-module__percentageContainer___jYTsq {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  gap: 8px 3px;\r\n  position: absolute;\r\n  top: 50%;\r\n  left: 50%;\r\n  transform: translate(-50%, -50%);\r\n  white-space: nowrap;\r\n}\r\n\r\n.progressCircle-module__hourglass___zFV-l {\r\n  width: 13px;\r\n  height: 13px;\r\n  color: rgba(74, 74, 75, 0.8);\r\n}\r\n\r\n.progressCircle-module__percentage___o-Lud {\r\n  font-size: 1.85rem;\r\n  font-weight: 400;\r\n  color: #005a92;\r\n}\r\n\r\n.progressCircle-module__message___wvOdY {\r\n  font-size: 1rem;\r\n  font-weight: 400;\r\n  color: #000000;\r\n  margin-top: 10px;\r\n}\r\n";
-var styles$1 = {"overlay":"progressCircle-module__overlay___BHoDf","modal":"progressCircle-module__modal___tI5Fh","progressContainer":"progressCircle-module__progressContainer___52PeR","progressRing":"progressCircle-module__progressRing___7xKz8","progressBackground":"progressCircle-module__progressBackground___m6YDA","progressForeground":"progressCircle-module__progressForeground___NWZOt","large":"progressCircle-module__large___BZOsB","medium":"progressCircle-module__medium___dFw6V","small":"progressCircle-module__small___Rgbob","percentageContainer":"progressCircle-module__percentageContainer___jYTsq","hourglass":"progressCircle-module__hourglass___zFV-l","percentage":"progressCircle-module__percentage___o-Lud","message":"progressCircle-module__message___wvOdY"};
+var css_248z$2 = ".progressCircle-module__overlay___BHoDf {\r\n  position: fixed;\r\n  top: 0;\r\n  left: 0;\r\n  width: 100%;\r\n  height: 100%;\r\n  background: rgba(0, 0, 0, 0.5);\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n.progressCircle-module__modal___tI5Fh {\r\n  background: #fff;\r\n  padding: 20px;\r\n  border-radius: 10px;\r\n  text-align: center;\r\n  max-width: 220px;\r\n  width: 100%;\r\n}\r\n\r\n.progressCircle-module__progressContainer___52PeR {\r\n  position: relative;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  margin: 10px auto;\r\n}\r\n\r\n.progressCircle-module__progressRing___7xKz8 {\r\n  transform: rotate(-90deg);\r\n  width: 100%;\r\n  height: 100%;\r\n}\r\n\r\n.progressCircle-module__progressBackground___m6YDA,\r\n.progressCircle-module__progressForeground___NWZOt {\r\n  fill: none;\r\n  stroke-width: 4px;\r\n  cx: 50;\r\n  cy: 50;\r\n  r: 46;\r\n}\r\n\r\n.progressCircle-module__progressBackground___m6YDA {\r\n  stroke: rgba(0, 90, 146, 0.2);\r\n}\r\n\r\n.progressCircle-module__progressForeground___NWZOt {\r\n  stroke: #005a92;\r\n  stroke-linecap: round;\r\n  transition: stroke-dashoffset 0.5s ease;\r\n  stroke-dasharray: 289.03;\r\n  stroke-dashoffset: 0;\r\n}\r\n\r\n.progressCircle-module__progressForegroundInfinite___cGw1H {\r\n  stroke-dasharray: 80 289.03;\r\n  stroke-dashoffset: 0;\r\n}\r\n\r\n/* ====== TAMANHOS ====== */\r\n.progressCircle-module__progressContainer___52PeR.progressCircle-module__large___BZOsB {\r\n  width: 110px;\r\n  height: 110px;\r\n}\r\n\r\n.progressCircle-module__progressContainer___52PeR.progressCircle-module__medium___dFw6V {\r\n  width: 80px;\r\n  height: 80px;\r\n}\r\n\r\n.progressCircle-module__progressContainer___52PeR.progressCircle-module__small___Rgbob {\r\n  width: 60px;\r\n  height: 60px;\r\n}\r\n\r\n/* Oculta a porcentagem e o ícone de ampulheta para os tamanhos medium e small */\r\n.progressCircle-module__progressContainer___52PeR.progressCircle-module__medium___dFw6V .progressCircle-module__percentageContainer___jYTsq,\r\n.progressCircle-module__progressContainer___52PeR.progressCircle-module__small___Rgbob .progressCircle-module__percentageContainer___jYTsq {\r\n  display: none;\r\n}\r\n\r\n.progressCircle-module__percentageContainer___jYTsq {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  gap: 8px 3px;\r\n  position: absolute;\r\n  top: 50%;\r\n  left: 50%;\r\n  transform: translate(-50%, -50%);\r\n  white-space: nowrap;\r\n}\r\n\r\n.progressCircle-module__hourglass___zFV-l {\r\n  width: 13px;\r\n  height: 13px;\r\n  color: rgba(74, 74, 75, 0.8);\r\n}\r\n\r\n.progressCircle-module__percentage___o-Lud {\r\n  font-size: 1.85rem;\r\n  font-weight: 400;\r\n  color: #005a92;\r\n}\r\n\r\n.progressCircle-module__message___wvOdY {\r\n  font-size: 1rem;\r\n  font-weight: 400;\r\n  color: #000000;\r\n  margin-top: 10px;\r\n}\r\n\r\n.progressCircle-module__progressRingInfinite___6pmkX {\r\n  transform-origin: 50% 50%;\r\n  animation: progressCircle-module__rotateRing___IXx-n 1.2s linear infinite;\r\n}\r\n\r\n@keyframes progressCircle-module__rotateRing___IXx-n {\r\n  0% {\r\n    transform: rotate(-90deg);\r\n  }\r\n  100% {\r\n    transform: rotate(270deg);\r\n  }\r\n}\r\n";
+var styles$1 = {"overlay":"progressCircle-module__overlay___BHoDf","modal":"progressCircle-module__modal___tI5Fh","progressContainer":"progressCircle-module__progressContainer___52PeR","progressRing":"progressCircle-module__progressRing___7xKz8","progressBackground":"progressCircle-module__progressBackground___m6YDA","progressForeground":"progressCircle-module__progressForeground___NWZOt","progressForegroundInfinite":"progressCircle-module__progressForegroundInfinite___cGw1H","large":"progressCircle-module__large___BZOsB","medium":"progressCircle-module__medium___dFw6V","small":"progressCircle-module__small___Rgbob","percentageContainer":"progressCircle-module__percentageContainer___jYTsq","hourglass":"progressCircle-module__hourglass___zFV-l","percentage":"progressCircle-module__percentage___o-Lud","message":"progressCircle-module__message___wvOdY","progressRingInfinite":"progressCircle-module__progressRingInfinite___6pmkX","rotateRing":"progressCircle-module__rotateRing___IXx-n"};
 styleInject(css_248z$2);
 
 function ProgressCircle(_a) {
-    var percentage = _a.percentage, message = _a.message, _b = _a.size, size = _b === void 0 ? "large" : _b, onClose = _a.onClose;
+    var percentage = _a.percentage, message = _a.message, _b = _a.size, size = _b === void 0 ? "large" : _b, _c = _a.infinite, infinite = _c === void 0 ? false : _c, _d = _a.isInProgress, isInProgress = _d === void 0 ? true : _d, onClose = _a.onClose;
+    if (!isInProgress)
+        return null;
     return (React__default.createElement("div", { className: styles$1.overlay, onClick: onClose },
         React__default.createElement("div", { className: styles$1.modal, onClick: function (e) { return e.stopPropagation(); } },
             React__default.createElement("div", { className: "".concat(styles$1.progressContainer, " ").concat(styles$1[size]) },
                 React__default.createElement("svg", { className: styles$1.progressRing, viewBox: "0 0 100 100" },
                     React__default.createElement("circle", { className: styles$1.progressBackground, cx: "50", cy: "50", r: "46" }),
-                    React__default.createElement("circle", { className: styles$1.progressForeground, cx: "50", cy: "50", r: "46", style: {
-                            strokeDasharray: "289.03",
-                            strokeDashoffset: "".concat(289.03 - (289.03 * percentage) / 100),
-                        } })),
+                    React__default.createElement("circle", { className: "".concat(styles$1.progressForeground, " ").concat(infinite ? styles$1.progressForegroundInfinite : "", " ").concat(infinite ? styles$1.progressRingInfinite : ""), cx: "50", cy: "50", r: "46", style: infinite
+                            ? undefined
+                            : {
+                                strokeDasharray: "289.03",
+                                strokeDashoffset: "".concat(289.03 - (289.03 * percentage) / 100),
+                            } })),
                 size === "large" && (React__default.createElement("div", { className: styles$1.percentageContainer },
                     React__default.createElement(IconHourglass, { className: styles$1.hourglass }),
                     React__default.createElement("span", { className: styles$1.percentage },