jclib-ui 1.0.129 → 1.0.131

package/dist/formEdit/formEdit.d.ts

@@ -3,11 +3,12 @@ import { ReactNode } from 'react';
 type FormEditProps = {
     title?: string;
     count?: number | string;
+    codigo: number | string;
     maxWidth?: number | string | undefined;
     goBack?: boolean;
     goHome?: boolean;
     onClose?: () => void;
     children?: ReactNode;
 };
-export default function FormEdit({ title, count, maxWidth, goBack, goHome, onClose, children, }: FormEditProps): import("react/jsx-runtime").JSX.Element;
+export default function FormEdit({ title, count, codigo, maxWidth, goBack, goHome, onClose, children, }: FormEditProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/jclib-ui.es.js

@@ -4236,7 +4236,6 @@ const TableContainer = styled.table`
 
   tr {
     --table-line-height: 36px;
-    /* min-height: var(--table-line-height); */
     height: var(--table-line-height);
   }
 
@@ -4990,8 +4989,9 @@ const ButtonStyled = styled.button`
 
   width: 35px;
   height: 35px;
+  min-width: 35px;
+  min-height: 35px;
   border-radius: var(--pn-button-border);
-  margin-left: var(--margin-hor);
 
   &:hover {
     background-color: rgba(0, 0, 0, 0.1);
@@ -4999,14 +4999,13 @@ const ButtonStyled = styled.button`
 
   &.back {
     font-size: 1.2rem;
+    margin-left: var(--margin-hor);
   }
 
   &.close {
     margin-right: var(--margin-hor);
-
     &:hover {
       color: #ff4545;
-      /* transform: rotate(90deg); */
     }
   }
 `;
@@ -5261,28 +5260,21 @@ const PanelHeader = styled.div`
   display: flex;
   justify-content: space-between;
   align-items: center;
-  gap: 0 5px;
-  font-size: 1.2rem;
+  gap: 0 2px;
+
   color: var(--pn-color-font);
+  font-size: 1.2rem;
   background-color: var(--pn-color);
-  padding: var(--pn-padding);
   border-radius: var(--pn-internal-radius) var(--pn-internal-radius) 0 0;
+
+  padding: var(--pn-padding);
   min-height: 39px;
 
   .pn-title {
     display: flex;
     align-items: center;
     gap: 5px;
-
-    .pn-count {
-      background-color: var(--pn-color-font);
-      color: var(--pn-color);
-      font-size: 0.86rem;
-      font-weight: bold;
-      padding: 1px 6px;
-      /* border-radius: 5px; */
-      border-radius: calc(var(--pn-border-radius) - 1px);
-    }
+    flex: 1;
   }
 
   @media print {
@@ -5296,6 +5288,25 @@ const PanelHeader = styled.div`
     }
   }
 `;
+function PanelBadge({ value, isCount, ...rest }) {
+  let total;
+  if (typeof value == "number") {
+    total = value <= 0 ? "Inclusão" : isCount ? value : `#${value}`;
+  } else {
+    total = value;
+  }
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    "div",
+    {
+      className: "badge bg-info text-dark",
+      style: {
+        borderRadius: "var(--pn-border-radius)"
+      },
+      ...rest,
+      children: total
+    }
+  );
+}
 let routeMain = "/home";
 function setRouteMain(value) {
   routeMain = value;
@@ -5303,6 +5314,7 @@ function setRouteMain(value) {
 function Panel({
   title,
   count,
+  codigo,
   goBack,
   goHome,
   onClose,
@@ -5312,7 +5324,7 @@ function Panel({
 }) {
   const history = useHistory();
   const total = count && typeof count == "number" ? count : 0;
-  const totalVisible = total > 5e3 ? "5000+" : total;
+  const totalVisible = total > 9999 ? "9999+" : total;
   const totalTitle = Intl.NumberFormat("pt-br", {}).format(total);
   const handleClick = () => {
     if (onClose) {
@@ -5326,10 +5338,18 @@ function Panel({
   };
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "panel--container " + className, ...rest, children: [
     /* @__PURE__ */ jsxRuntimeExports.jsxs(PanelHeader, { children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "d-none d-sm-block", children: (goBack || goHome || onClose) && /* @__PURE__ */ jsxRuntimeExports.jsx(ButtonBack, { title: "Fechar", onClick: handleClick }) }),
       /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "pn-title", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "d-none d-sm-block", children: (goBack || goHome || onClose) && /* @__PURE__ */ jsxRuntimeExports.jsx(ButtonBack, { title: "Fechar", onClick: handleClick }) }),
         title,
-        total !== 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "pn-count", title: `Total de registros: ${totalTitle}`, children: totalVisible })
+        total !== 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(
+          PanelBadge,
+          {
+            title: `Total de registros: ${totalTitle}`,
+            value: totalVisible,
+            isCount: true
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(PanelBadge, { value: codigo })
       ] }),
       (goBack || goHome || onClose) && /* @__PURE__ */ jsxRuntimeExports.jsx(ButtonClose, { title: "Fechar", onClick: handleClick })
     ] }),
@@ -8253,7 +8273,7 @@ function ModalHeader({
       className: `modal--header ${className}`,
       ...rest,
       children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "pn-title", children }),
         /* @__PURE__ */ jsxRuntimeExports.jsx(ButtonClose, { type: "button", onClick: () => setVisible(false) })
       ]
     }
@@ -19214,6 +19234,7 @@ function ModalFooter({
 function ModalBox({
   visible,
   setVisible,
+  codigo,
   title,
   children,
   paddingBottom = 10,
@@ -19232,7 +19253,10 @@ function ModalBox({
     controls.start(e);
   }
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(Modal, { setVisible, visible, ...rest, children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx(ModalHeader, { onPointerDown: startDrag, setVisible, children: title }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs(ModalHeader, { onPointerDown: startDrag, setVisible, children: [
+      title,
+      /* @__PURE__ */ jsxRuntimeExports.jsx(PanelBadge, { value: codigo })
+    ] }),
     /* @__PURE__ */ jsxRuntimeExports.jsx(ModalContent, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(ModalBody, { style: { paddingBottom }, children }) })
   ] });
 }
@@ -19368,6 +19392,7 @@ function PanelDashboard({
 function FormEdit({
   title,
   count,
+  codigo,
   maxWidth = 1200,
   goBack,
   goHome,
@@ -19383,6 +19408,7 @@ function FormEdit({
     {
       title,
       count,
+      codigo,
       goBack,
       goHome,
       onClose,