@gyramais/gyra-design 0.2.31 → 0.2.33

package/dist/emails/balance-sheet-finalized/components/Gauge/Gauge.d.ts

@@ -0,0 +1,28 @@
+import React from "react";
+import "./index.css";
+export type GaugeBandVariant = "neutral" | "success" | "warning" | "danger";
+/** Formata o valor central: inteiro sem casas, fracionado com 1 casa, ausente "—". */
+export declare const formatGaugeValue: (v?: number | null) => string;
+export type GaugeProps = {
+    id?: string;
+    className?: string;
+    /** Valor atual (0..max). null/undefined => mostra "—" e anel vazio. */
+    value?: number | null;
+    /** Máximo da escala. Default 1000 (escala dos bureaus de crédito). */
+    max?: number;
+    /** Legenda curta acima do número (ex.: "GYRA+ Score"). */
+    label: string;
+    /** Pill de classificação abaixo do número (ex.: "Risco baixo"). Opcional. */
+    band?: string;
+    /** Cor do pill de banda; o anel permanece azul. Default "neutral". */
+    bandVariant?: GaugeBandVariant;
+    /** Diâmetro em px (escala número/legenda proporcionalmente). Default 240. */
+    size?: number;
+};
+/**
+ * Gauge circular de score (anel azul). Usado para o score da política de
+ * crédito, score setorial e afins. O número e a legenda escalam com `size`.
+ */
+declare const Gauge: ({ id, className, value, max, label, band, bandVariant, size, }: GaugeProps) => React.JSX.Element;
+export { Gauge };
+export default Gauge;

package/dist/emails/balance-sheet-finalized/components/Gauge/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./Gauge";
+export { default } from "./Gauge";

package/dist/emails/balance-sheet-finalized/components/SyncChip/SyncChip.d.ts

@@ -11,7 +11,15 @@ type SyncChipProps = {
     errorTooltip?: string;
     /** Optional override for the tooltip when verified is false. */
     notVerifiedTooltip?: string;
+    /** When in error state and provided, renders a compact retry action to
+        the LEFT of the chip. Keeps the retry paired with its sync-status,
+        consistently across every usage. */
+    onRetry?: () => void;
+    /** Label for the retry action. */
+    retryLabel?: string;
+    /** Disables the retry action (e.g. while a retry is already in flight). */
+    retryDisabled?: boolean;
 };
-declare const SyncChip: ({ id, className, loading, date, error, verified, errorTooltip, notVerifiedTooltip, }: SyncChipProps) => React.JSX.Element;
+declare const SyncChip: ({ id, className, loading, date, error, verified, errorTooltip, notVerifiedTooltip, onRetry, retryLabel, retryDisabled, }: SyncChipProps) => React.JSX.Element;
 export { SyncChip };
 export type { SyncChipProps };

package/dist/emails/balance-sheet-finalized/index.d.ts

@@ -21,6 +21,7 @@ import "./components/Empty/index.css";
 import "./components/Filter/index.css";
 import "./components/FloatingCard/index.css";
 import "./components/Form/index.css";
+import "./components/Gauge/index.css";
 import "./components/HoverCard/index.css";
 import "./components/Icon/index.css";
 import "./components/IconDisplay/index.css";

package/dist/emails/email/components/Gauge/Gauge.d.ts

@@ -0,0 +1,28 @@
+import React from "react";
+import "./index.css";
+export type GaugeBandVariant = "neutral" | "success" | "warning" | "danger";
+/** Formata o valor central: inteiro sem casas, fracionado com 1 casa, ausente "—". */
+export declare const formatGaugeValue: (v?: number | null) => string;
+export type GaugeProps = {
+    id?: string;
+    className?: string;
+    /** Valor atual (0..max). null/undefined => mostra "—" e anel vazio. */
+    value?: number | null;
+    /** Máximo da escala. Default 1000 (escala dos bureaus de crédito). */
+    max?: number;
+    /** Legenda curta acima do número (ex.: "GYRA+ Score"). */
+    label: string;
+    /** Pill de classificação abaixo do número (ex.: "Risco baixo"). Opcional. */
+    band?: string;
+    /** Cor do pill de banda; o anel permanece azul. Default "neutral". */
+    bandVariant?: GaugeBandVariant;
+    /** Diâmetro em px (escala número/legenda proporcionalmente). Default 240. */
+    size?: number;
+};
+/**
+ * Gauge circular de score (anel azul). Usado para o score da política de
+ * crédito, score setorial e afins. O número e a legenda escalam com `size`.
+ */
+declare const Gauge: ({ id, className, value, max, label, band, bandVariant, size, }: GaugeProps) => React.JSX.Element;
+export { Gauge };
+export default Gauge;

package/dist/emails/email/components/Gauge/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./Gauge";
+export { default } from "./Gauge";

package/dist/emails/email/components/SyncChip/SyncChip.d.ts

@@ -11,7 +11,15 @@ type SyncChipProps = {
     errorTooltip?: string;
     /** Optional override for the tooltip when verified is false. */
     notVerifiedTooltip?: string;
+    /** When in error state and provided, renders a compact retry action to
+        the LEFT of the chip. Keeps the retry paired with its sync-status,
+        consistently across every usage. */
+    onRetry?: () => void;
+    /** Label for the retry action. */
+    retryLabel?: string;
+    /** Disables the retry action (e.g. while a retry is already in flight). */
+    retryDisabled?: boolean;
 };
-declare const SyncChip: ({ id, className, loading, date, error, verified, errorTooltip, notVerifiedTooltip, }: SyncChipProps) => React.JSX.Element;
+declare const SyncChip: ({ id, className, loading, date, error, verified, errorTooltip, notVerifiedTooltip, onRetry, retryLabel, retryDisabled, }: SyncChipProps) => React.JSX.Element;
 export { SyncChip };
 export type { SyncChipProps };

package/dist/emails/email/index.d.ts

@@ -21,6 +21,7 @@ import "./components/Empty/index.css";
 import "./components/Filter/index.css";
 import "./components/FloatingCard/index.css";
 import "./components/Form/index.css";
+import "./components/Gauge/index.css";
 import "./components/HoverCard/index.css";
 import "./components/Icon/index.css";
 import "./components/IconDisplay/index.css";

package/dist/index.css

@@ -6015,6 +6015,79 @@ h6 {
     color: var(--danger-color)
 }
 
+/* Gauge (CU-86ahzcm82) */
+/* Gauge circular de score. Diâmetro controlado por --gauge-size; número e
+   legenda escalam proporcionalmente. Cores via design tokens (dark-mode safe). */
+.gyramais-gauge {
+  position: relative;
+  width: var(--gauge-size, 240px);
+  height: var(--gauge-size, 240px);
+  margin: 0 auto;
+}
+.gyramais-gauge svg {
+  width: 100%;
+  height: 100%;
+  transform: rotate(-90deg);
+}
+.gyramais-gauge__track {
+  stroke: var(--color-border-subtle, #f0f0f2);
+}
+.gyramais-gauge__arc {
+  stroke: var(--gyra-blue, #1256ff);
+}
+.gyramais-gauge__center {
+  position: absolute;
+  inset: 0;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 2px;
+}
+.gyramais-gauge__caption {
+  font-size: calc(var(--gauge-size, 240px) * 0.0458);
+  color: var(--color-text-tertiary, #8e8e93);
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+  font-weight: 600;
+}
+.gyramais-gauge__num {
+  font-family: var(--font-display, "Lexend", "Inter", sans-serif);
+  font-size: calc(var(--gauge-size, 240px) * 0.233);
+  font-weight: 600;
+  letter-spacing: -0.02em;
+  color: var(--color-text-primary, #1d1d1f);
+  line-height: 1;
+}
+.gyramais-gauge__max {
+  font-size: calc(var(--gauge-size, 240px) * 0.05);
+  color: var(--color-text-tertiary, #8e8e93);
+  margin-top: 6px;
+}
+.gyramais-gauge__band {
+  margin-top: 8px;
+  font-size: calc(var(--gauge-size, 240px) * 0.0458);
+  font-weight: 700;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+  padding: 4px 10px;
+  border-radius: 9999px;
+  background: var(--gyra-blue-light, #eef1fb);
+  color: var(--gyra-blue, #1256ff);
+}
+.gyramais-gauge__band--success {
+  background: var(--success-light, #e8f9ed);
+  color: var(--status-success-text, #1a7d37);
+}
+.gyramais-gauge__band--warning {
+  background: var(--warning-light, #fff4e0);
+  color: var(--status-warning-text, #946200);
+}
+.gyramais-gauge__band--danger {
+  background: var(--danger-light, #ffedec);
+  color: var(--status-danger-text, #c93430);
+}
+
 .gyramais-hover-card-trigger {
 
     display: block;
@@ -9973,6 +10046,58 @@ h6 {
   }
 }
 
+/* Retry action paired with the chip — sits to the LEFT of the pill,
+   styled as a matching pill-button, so the retry stays visually tied to
+   the sync-status it refers to. */
+.gyramais-sync-chip-wrap {
+  display: inline-flex;
+  width: -moz-fit-content;
+  width: fit-content;
+  align-items: center;
+  gap: 8px;
+}
+.gyramais-sync-chip-retry {
+  display: inline-flex;
+  height: 28px;
+  width: 28px;
+  flex-shrink: 0;
+  cursor: pointer;
+  align-items: center;
+  justify-content: center;
+  border-radius: 9999px;
+  border-width: 1px;
+  border-color: var(--color-border-secondary);
+  background-color: var(--color-surface-secondary);
+  padding: 0px;
+  color: var(--color-text-secondary);
+  transition: background 150ms ease, color 150ms ease,
+    border-color 150ms ease;
+}
+.gyramais-sync-chip-retry:hover {
+  border-color: rgba(255,59,48,0.18);
+  background-color: rgba(255,59,48,0.08);
+  color: var(--status-danger-text);
+}
+.gyramais-sync-chip-retry:disabled {
+  cursor: default;
+  border-color: rgba(255,59,48,0.18);
+  color: var(--status-danger-text);
+}
+.gyramais-sync-chip-retry .gyramais-sync-chip-retry-icon {
+  height: 16px;
+  width: 16px;
+  font-size: 16px;
+}
+.gyramais-sync-chip-retry
+  .gyramais-sync-chip-retry-icon.gyramais-sync-chip-retry-icon--spinning {
+  animation: gyramais-sync-chip-spin 0.9s linear infinite;
+}
+@keyframes gyramais-sync-chip-spin {
+  to {
+    transform: rotate(360deg);
+  }
+}
+
 .gyramais-table-container {
   width: 100%;
   overflow-y: auto;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gyramais/gyra-design",
-  "version": "0.2.31",
+  "version": "0.2.33",
   "description": "Gyramais Design System",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",

package/dist/components/ListingPage/ListingPage.d.ts

@@ -1,21 +0,0 @@
-import React from "react";
-import "./index.css";
-type ListingPageProps = {
-    id?: string;
-    className?: string;
-    title: string;
-    description?: string;
-    /** Right-aligned actions in the head (e.g. "+ Novo"). */
-    actions?: React.ReactNode;
-    /** Filters / search row below the head. */
-    toolbar?: React.ReactNode;
-    /** Result count / density toggle row. */
-    meta?: React.ReactNode;
-    /** Table or cards. */
-    children?: React.ReactNode;
-    /** Pagination strip. */
-    footer?: React.ReactNode;
-};
-declare const ListingPage: ({ id, className, title, description, actions, toolbar, meta, children, footer, }: ListingPageProps) => React.JSX.Element;
-export { ListingPage };
-export type { ListingPageProps };

package/dist/components/ListingPage/index.d.ts

@@ -1 +0,0 @@
-export * from "./ListingPage";

package/dist/components/ListingPage/index.js

@@ -1,7 +0,0 @@
-"use client";import e from"react";function t(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var a,r={exports:{}};
-/*!
-	Copyright (c) 2018 Jed Watson.
-	Licensed under the MIT License (MIT), see
-	http://jedwatson.github.io/classnames
-*/a=r,function(){var e={}.hasOwnProperty;function t(){for(var e="",t=0;t<arguments.length;t++){var a=arguments[t];a&&(e=n(e,r(a)))}return e}function r(a){if("string"==typeof a||"number"==typeof a)return a;if("object"!=typeof a)return"";if(Array.isArray(a))return t.apply(null,a);if(a.toString!==Object.prototype.toString&&!a.toString.toString().includes("[native code]"))return a.toString();var r="";for(var i in a)e.call(a,i)&&a[i]&&(r=n(r,i));return r}function n(e,t){return t?e?e+" "+t:e+t:e}a.exports?(t.default=t,a.exports=t):window.classNames=t}();var n=t(r.exports);const i=({id:t,className:a,title:r,description:i,actions:l,toolbar:s,meta:o,children:c,footer:m})=>e.createElement("div",{id:t,className:n("gyramais-listing-page",a)},e.createElement("div",{className:"gyramais-listing-page-head"},e.createElement("div",null,e.createElement("h1",null,r),i&&e.createElement("p",{className:"lead"},i)),l&&e.createElement("div",{className:"actions"},l)),s&&e.createElement("div",{className:"gyramais-listing-page-toolbar"},s),o&&e.createElement("div",{className:"gyramais-listing-page-meta"},o),e.createElement("div",{className:"gyramais-listing-page-content"},c),m&&e.createElement("div",{className:"gyramais-listing-page-foot"},m));export{i as ListingPage};
-//# sourceMappingURL=index.js.map

package/dist/components/ListingPage/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":["../../../node_modules/classnames/index.js","../../../src/components/ListingPage/ListingPage.tsx"],"sourcesContent":["/*!\n\tCopyright (c) 2018 Jed Watson.\n\tLicensed under the MIT License (MIT), see\n\thttp://jedwatson.github.io/classnames\n*/\n/* global define */\n\n(function () {\n\t'use strict';\n\n\tvar hasOwn = {}.hasOwnProperty;\n\n\tfunction classNames () {\n\t\tvar classes = '';\n\n\t\tfor (var i = 0; i < arguments.length; i++) {\n\t\t\tvar arg = arguments[i];\n\t\t\tif (arg) {\n\t\t\t\tclasses = appendClass(classes, parseValue(arg));\n\t\t\t}\n\t\t}\n\n\t\treturn classes;\n\t}\n\n\tfunction parseValue (arg) {\n\t\tif (typeof arg === 'string' || typeof arg === 'number') {\n\t\t\treturn arg;\n\t\t}\n\n\t\tif (typeof arg !== 'object') {\n\t\t\treturn '';\n\t\t}\n\n\t\tif (Array.isArray(arg)) {\n\t\t\treturn classNames.apply(null, arg);\n\t\t}\n\n\t\tif (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {\n\t\t\treturn arg.toString();\n\t\t}\n\n\t\tvar classes = '';\n\n\t\tfor (var key in arg) {\n\t\t\tif (hasOwn.call(arg, key) && arg[key]) {\n\t\t\t\tclasses = appendClass(classes, key);\n\t\t\t}\n\t\t}\n\n\t\treturn classes;\n\t}\n\n\tfunction appendClass (value, newClass) {\n\t\tif (!newClass) {\n\t\t\treturn value;\n\t\t}\n\t\n\t\tif (value) {\n\t\t\treturn value + ' ' + newClass;\n\t\t}\n\t\n\t\treturn value + newClass;\n\t}\n\n\tif (typeof module !== 'undefined' && module.exports) {\n\t\tclassNames.default = classNames;\n\t\tmodule.exports = classNames;\n\t} else if (typeof define === 'function' && typeof define.amd === 'object' && define.amd) {\n\t\t// register as 'classnames', consistent with npm package name\n\t\tdefine('classnames', [], function () {\n\t\t\treturn classNames;\n\t\t});\n\t} else {\n\t\twindow.classNames = classNames;\n\t}\n}());\n","import React from \"react\";\nimport classNames from \"classnames\";\nimport \"./index.css\";\n\n/* Listing page layout — title + description, optional right-aligned\n   actions, optional toolbar (filters/search), optional meta strip\n   (counts/density), the table/cards body, and an optional pagination\n   footer. The visual rhythm matches the v2 listing pattern shared\n   across Relatórios, Lotes, Política de Crédito, etc. */\n\ntype ListingPageProps = {\n  id?: string;\n  className?: string;\n  title: string;\n  description?: string;\n  /** Right-aligned actions in the head (e.g. \"+ Novo\"). */\n  actions?: React.ReactNode;\n  /** Filters / search row below the head. */\n  toolbar?: React.ReactNode;\n  /** Result count / density toggle row. */\n  meta?: React.ReactNode;\n  /** Table or cards. */\n  children?: React.ReactNode;\n  /** Pagination strip. */\n  footer?: React.ReactNode;\n};\n\nconst ListingPage = ({\n  id,\n  className,\n  title,\n  description,\n  actions,\n  toolbar,\n  meta,\n  children,\n  footer,\n}: ListingPageProps) => {\n  return (\n    <div id={id} className={classNames(\"gyramais-listing-page\", className)}>\n      <div className=\"gyramais-listing-page-head\">\n        <div>\n          <h1>{title}</h1>\n          {description && <p className=\"lead\">{description}</p>}\n        </div>\n        {actions && <div className=\"actions\">{actions}</div>}\n      </div>\n\n      {toolbar && (\n        <div className=\"gyramais-listing-page-toolbar\">{toolbar}</div>\n      )}\n\n      {meta && <div className=\"gyramais-listing-page-meta\">{meta}</div>}\n\n      <div className=\"gyramais-listing-page-content\">{children}</div>\n\n      {footer && <div className=\"gyramais-listing-page-foot\">{footer}</div>}\n    </div>\n  );\n};\n\nexport { ListingPage };\nexport type { ListingPageProps };\n"],"names":["hasOwn","hasOwnProperty","classNames","classes","i","arguments","length","arg","appendClass","parseValue","Array","isArray","apply","toString","Object","prototype","includes","key","call","value","newClass","module","exports","default","window","ListingPage","id","className","title","description","actions","toolbar","meta","children","footer","React","createElement"],"mappings":";;;;;MAOC,WAGA,IAAIA,EAAS,CAAA,EAAGC,eAEhB,SAASC,IAGR,IAFA,IAAIC,EAAU,GAELC,EAAI,EAAGA,EAAIC,UAAUC,OAAQF,IAAK,CAC1C,IAAIG,EAAMF,UAAUD,GAChBG,IACHJ,EAAUK,EAAYL,EAASM,EAAWF,IAE9C,CAEE,OAAOJ,CACT,CAEC,SAASM,EAAYF,GACpB,GAAmB,iBAARA,GAAmC,iBAARA,EACrC,OAAOA,EAGR,GAAmB,iBAARA,EACV,MAAO,GAGR,GAAIG,MAAMC,QAAQJ,GACjB,OAAOL,EAAWU,MAAM,KAAML,GAG/B,GAAIA,EAAIM,WAAaC,OAAOC,UAAUF,WAAaN,EAAIM,SAASA,WAAWG,SAAS,iBACnF,OAAOT,EAAIM,WAGZ,IAAIV,EAAU,GAEd,IAAK,IAAIc,KAAOV,EACXP,EAAOkB,KAAKX,EAAKU,IAAQV,EAAIU,KAChCd,EAAUK,EAAYL,EAASc,IAIjC,OAAOd,CACT,CAEC,SAASK,EAAaW,EAAOC,GAC5B,OAAKA,EAIDD,EACIA,EAAQ,IAAMC,EAGfD,EAAQC,EAPPD,CAQV,CAEsCE,EAAOC,SAC3CpB,EAAWqB,QAAUrB,EACrBmB,UAAiBnB,GAOjBsB,OAAOtB,WAAaA,CAEtB,CArEA,sBCoBA,MAAMuB,EAAc,EAClBC,KACAC,YACAC,QACAC,cACAC,UACAC,UACAC,OACAC,WACAC,YAGEC,EAAAC,cAAA,MAAA,CAAKV,GAAIA,EAAIC,UAAWzB,EAAW,wBAAyByB,IAC1DQ,EAAAC,cAAA,MAAA,CAAKT,UAAU,8BACbQ,EAAAC,cAAA,MAAA,KACED,EAAAC,cAAA,KAAA,KAAKR,GACJC,GAAeM,qBAAGR,UAAU,QAAQE,IAEtCC,GAAWK,uBAAKR,UAAU,WAAWG,IAGvCC,GACCI,EAAAC,cAAA,MAAA,CAAKT,UAAU,iCAAiCI,GAGjDC,GAAQG,EAAAC,cAAA,MAAA,CAAKT,UAAU,8BAA8BK,GAEtDG,EAAAC,cAAA,MAAA,CAAKT,UAAU,iCAAiCM,GAE/CC,GAAUC,EAAAC,cAAA,MAAA,CAAKT,UAAU,8BAA8BO","x_google_ignoreList":[0]}