@sbkbs/ui 1.0.6 → 2.0.0

package/dist/components/Input/Input.js

@@ -1,78 +1,60 @@
-import { jsxs as d, jsx as a } from "react/jsx-runtime";
-import g from "react";
-import { cn as c } from "../../utils/cn.js";
-const b = g.forwardRef(
+import { jsx as e, jsxs as x } from "react/jsx-runtime";
+import N, { useId as w } from "react";
+import { cn as i } from "../../utils/cn.js";
+import { describedBy as y, fieldSize as g, fieldControl as h } from "../../utils/styles.js";
+import { Field as z } from "../Field/Field.js";
+const m = "pointer-events-none absolute z-[1] flex items-center text-sbk-fg-muted group-focus-within:text-sbk-primary [&_svg]:size-[1.125rem]", j = N.forwardRef(
   ({
-    label: i,
-    error: e,
-    helperText: s,
+    label: n,
+    error: s,
+    helperText: l,
     leftIcon: t,
-    rightIcon: o,
-    fullWidth: l = !1,
-    size: m = "md",
-    className: v,
-    id: p,
-    ...f
-  }, u) => {
-    const r = p || `input-${Math.random().toString(36).substring(2, 9)}`, n = !!e, x = c(
-      "w-full rounded-[var(--border-radius-md)] border border-[var(--md-outline-variant)] bg-[var(--md-surface)] font-inherit text-[var(--md-on-surface)] outline-none transition-[var(--transition-all)] placeholder:text-[var(--md-on-surface-variant)] placeholder:opacity-70 hover:not-disabled:not-focus:border-[var(--border-color-hover)] focus:border-[var(--border-color-focus)] focus:[box-shadow:0_0_0_0.1875rem_rgba(47,93,140,0.15)] disabled:cursor-not-allowed disabled:bg-[var(--md-surface-container-high)] disabled:opacity-60",
-      n && "border-[var(--md-error)] focus:border-[var(--md-error)] focus:[box-shadow:0_0_0_0.1875rem_rgba(186,26,26,0.2)]",
+    rightIcon: a,
+    fullWidth: o = !1,
+    size: p = "md",
+    className: c,
+    id: f,
+    required: d,
+    ...u
+  }, b) => {
+    const v = w(), r = f ?? v;
+    return /* @__PURE__ */ e(
+      z,
       {
-        sm: "min-h-8 px-[var(--spacing-md)] py-[var(--spacing-sm)] text-[var(--font-size-sm)]",
-        md: "min-h-10 px-[var(--spacing-lg)] py-[var(--spacing-md)] text-[var(--font-size-base)]",
-        lg: "min-h-12 px-[var(--spacing-xl)] py-[var(--spacing-lg)] text-[var(--font-size-lg)]"
-      }[m],
-      // icon padding vem depois do sizeClassMap para não ser sobrescrito pelo px-* do tamanho
-      t && "pl-10",
-      o && "pr-10",
-      v
+        className: i(o && "w-full"),
+        error: s,
+        helperText: l,
+        id: r,
+        label: n,
+        required: d,
+        children: /* @__PURE__ */ x("div", { className: "group relative flex w-full items-center", children: [
+          t && /* @__PURE__ */ e("span", { className: i(m, "left-3"), children: t }),
+          /* @__PURE__ */ e(
+            "input",
+            {
+              ref: b,
+              "aria-describedby": y(r, s, l),
+              "aria-invalid": s ? !0 : void 0,
+              className: i(
+                h,
+                g[p],
+                t && "pl-10",
+                a && "pr-10",
+                c
+              ),
+              id: r,
+              required: d,
+              ...u
+            }
+          ),
+          a && /* @__PURE__ */ e("span", { className: i(m, "right-3"), children: a })
+        ] })
+      }
     );
-    return /* @__PURE__ */ d("div", { className: c("flex flex-col gap-[var(--spacing-xs)]", l && "w-full"), children: [
-      i && /* @__PURE__ */ a(
-        "label",
-        {
-          className: "text-[var(--font-size-sm)] font-[var(--font-weight-semibold)] text-[var(--md-on-surface)]",
-          htmlFor: r,
-          children: i
-        }
-      ),
-      /* @__PURE__ */ d("div", { className: "group relative flex w-full items-center", children: [
-        t && /* @__PURE__ */ a("span", { className: "pointer-events-none absolute left-[var(--spacing-md)] z-[1] flex items-center justify-center text-[var(--md-on-surface-variant)] group-focus-within:text-[var(--md-primary)] [&_svg]:h-[1.125rem] [&_svg]:w-[1.125rem]", children: t }),
-        /* @__PURE__ */ a(
-          "input",
-          {
-            ref: u,
-            "aria-describedby": e ? `${r}-error` : s ? `${r}-helper` : void 0,
-            "aria-invalid": n ? !0 : void 0,
-            className: x,
-            id: r,
-            ...f
-          }
-        ),
-        o && /* @__PURE__ */ a("span", { className: "pointer-events-none absolute right-[var(--spacing-md)] z-[1] flex items-center justify-center text-[var(--md-on-surface-variant)] group-focus-within:text-[var(--md-primary)] [&_svg]:h-[1.125rem] [&_svg]:w-[1.125rem]", children: o })
-      ] }),
-      e && /* @__PURE__ */ a(
-        "span",
-        {
-          className: "mt-[var(--spacing-xs)] block text-[var(--font-size-xs)] text-[var(--md-error)]",
-          id: `${r}-error`,
-          role: "alert",
-          children: e
-        }
-      ),
-      s && !e && /* @__PURE__ */ a(
-        "span",
-        {
-          className: "mt-[var(--spacing-xs)] block text-[var(--font-size-xs)] text-[var(--md-on-surface-variant)]",
-          id: `${r}-helper`,
-          children: s
-        }
-      )
-    ] });
   }
 );
-b.displayName = "Input";
+j.displayName = "Input";
 export {
-  b as Input
+  j as Input
 };
 //# sourceMappingURL=Input.js.map

package/dist/components/Input/Input.js.map

@@ -1 +1 @@
-{"version":3,"file":"Input.js","sources":["../../../src/components/Input/Input.tsx"],"sourcesContent":["import React from 'react';\nimport { cn } from '../../utils/cn';\n\nexport interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'> {\n  error?: string;\n  fullWidth?: boolean;\n  helperText?: string;\n  label?: string;\n  leftIcon?: React.ReactNode;\n  rightIcon?: React.ReactNode;\n  size?: 'sm' | 'md' | 'lg';\n}\n\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\n  (\n    {\n      label,\n      error,\n      helperText,\n      leftIcon,\n      rightIcon,\n      fullWidth = false,\n      size = 'md',\n      className,\n      id,\n      ...props\n    },\n    ref,\n  ) => {\n    const inputId = id || `input-${Math.random().toString(36).substring(2, 9)}`;\n    const hasError = !!error;\n\n    const sizeClassMap: Record<NonNullable<InputProps['size']>, string> = {\n      sm: 'min-h-8 px-[var(--spacing-md)] py-[var(--spacing-sm)] text-[var(--font-size-sm)]',\n      md: 'min-h-10 px-[var(--spacing-lg)] py-[var(--spacing-md)] text-[var(--font-size-base)]',\n      lg: 'min-h-12 px-[var(--spacing-xl)] py-[var(--spacing-lg)] text-[var(--font-size-lg)]',\n    };\n\n    const combinedClass = cn(\n      'w-full rounded-[var(--border-radius-md)] border border-[var(--md-outline-variant)] bg-[var(--md-surface)] font-inherit text-[var(--md-on-surface)] outline-none transition-[var(--transition-all)] placeholder:text-[var(--md-on-surface-variant)] placeholder:opacity-70 hover:not-disabled:not-focus:border-[var(--border-color-hover)] focus:border-[var(--border-color-focus)] focus:[box-shadow:0_0_0_0.1875rem_rgba(47,93,140,0.15)] disabled:cursor-not-allowed disabled:bg-[var(--md-surface-container-high)] disabled:opacity-60',\n      hasError &&\n        'border-[var(--md-error)] focus:border-[var(--md-error)] focus:[box-shadow:0_0_0_0.1875rem_rgba(186,26,26,0.2)]',\n      sizeClassMap[size],\n      // icon padding vem depois do sizeClassMap para não ser sobrescrito pelo px-* do tamanho\n      leftIcon && 'pl-10',\n      rightIcon && 'pr-10',\n      className,\n    );\n\n    return (\n      <div className={cn('flex flex-col gap-[var(--spacing-xs)]', fullWidth && 'w-full')}>\n        {label && (\n          <label\n            className=\"text-[var(--font-size-sm)] font-[var(--font-weight-semibold)] text-[var(--md-on-surface)]\"\n            htmlFor={inputId}\n          >\n            {label}\n          </label>\n        )}\n        <div className=\"group relative flex w-full items-center\">\n          {leftIcon && (\n            <span className=\"pointer-events-none absolute left-[var(--spacing-md)] z-[1] flex items-center justify-center text-[var(--md-on-surface-variant)] group-focus-within:text-[var(--md-primary)] [&_svg]:h-[1.125rem] [&_svg]:w-[1.125rem]\">\n              {leftIcon}\n            </span>\n          )}\n          <input\n            ref={ref}\n            aria-describedby={\n              error ? `${inputId}-error` : helperText ? `${inputId}-helper` : undefined\n            }\n            aria-invalid={hasError ? true : undefined}\n            className={combinedClass}\n            id={inputId}\n            {...props}\n          />\n          {rightIcon && (\n            <span className=\"pointer-events-none absolute right-[var(--spacing-md)] z-[1] flex items-center justify-center text-[var(--md-on-surface-variant)] group-focus-within:text-[var(--md-primary)] [&_svg]:h-[1.125rem] [&_svg]:w-[1.125rem]\">\n              {rightIcon}\n            </span>\n          )}\n        </div>\n        {error && (\n          <span\n            className=\"mt-[var(--spacing-xs)] block text-[var(--font-size-xs)] text-[var(--md-error)]\"\n            id={`${inputId}-error`}\n            role=\"alert\"\n          >\n            {error}\n          </span>\n        )}\n        {helperText && !error && (\n          <span\n            className=\"mt-[var(--spacing-xs)] block text-[var(--font-size-xs)] text-[var(--md-on-surface-variant)]\"\n            id={`${inputId}-helper`}\n          >\n            {helperText}\n          </span>\n        )}\n      </div>\n    );\n  },\n);\n\nInput.displayName = 'Input';\n"],"names":["Input","React","label","error","helperText","leftIcon","rightIcon","fullWidth","size","className","id","props","ref","inputId","hasError","combinedClass","cn","jsx","jsxs"],"mappings":";;;AAaO,MAAMA,IAAQC,EAAM;AAAA,EACzB,CACE;AAAA,IACE,OAAAC;AAAA,IACA,OAAAC;AAAA,IACA,YAAAC;AAAA,IACA,UAAAC;AAAA,IACA,WAAAC;AAAA,IACA,WAAAC,IAAY;AAAA,IACZ,MAAAC,IAAO;AAAA,IACP,WAAAC;AAAA,IACA,IAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,GAELC,MACG;AACH,UAAMC,IAAUH,KAAM,SAAS,KAAK,OAAA,EAAS,SAAS,EAAE,EAAE,UAAU,GAAG,CAAC,CAAC,IACnEI,IAAW,CAAC,CAACX,GAQbY,IAAgBC;AAAA,MACpB;AAAA,MACAF,KACE;AAAA,MATkE;AAAA,QACpE,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,MAAA,EAOSN,CAAI;AAAA;AAAA,MAEjBH,KAAY;AAAA,MACZC,KAAa;AAAA,MACbG;AAAA,IAAA;AAGF,6BACG,OAAA,EAAI,WAAWO,EAAG,yCAAyCT,KAAa,QAAQ,GAC9E,UAAA;AAAA,MAAAL,KACC,gBAAAe;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,SAASJ;AAAA,UAER,UAAAX;AAAA,QAAA;AAAA,MAAA;AAAA,MAGL,gBAAAgB,EAAC,OAAA,EAAI,WAAU,2CACZ,UAAA;AAAA,QAAAb,KACC,gBAAAY,EAAC,QAAA,EAAK,WAAU,0NACb,UAAAZ,GACH;AAAA,QAEF,gBAAAY;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,KAAAL;AAAA,YACA,oBACET,IAAQ,GAAGU,CAAO,WAAWT,IAAa,GAAGS,CAAO,YAAY;AAAA,YAElE,gBAAcC,IAAW,KAAO;AAAA,YAChC,WAAWC;AAAA,YACX,IAAIF;AAAA,YACH,GAAGF;AAAA,UAAA;AAAA,QAAA;AAAA,QAELL,KACC,gBAAAW,EAAC,QAAA,EAAK,WAAU,2NACb,UAAAX,EAAA,CACH;AAAA,MAAA,GAEJ;AAAA,MACCH,KACC,gBAAAc;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,IAAI,GAAGJ,CAAO;AAAA,UACd,MAAK;AAAA,UAEJ,UAAAV;AAAA,QAAA;AAAA,MAAA;AAAA,MAGJC,KAAc,CAACD,KACd,gBAAAc;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,IAAI,GAAGJ,CAAO;AAAA,UAEb,UAAAT;AAAA,QAAA;AAAA,MAAA;AAAA,IACH,GAEJ;AAAA,EAEJ;AACF;AAEAJ,EAAM,cAAc;"}
+{"version":3,"file":"Input.js","sources":["../../../src/components/Input/Input.tsx"],"sourcesContent":["import React, { useId } from 'react';\r\nimport { cn } from '../../utils/cn';\r\nimport { describedBy, fieldControl, fieldSize, type FieldSize } from '../../utils/styles';\r\nimport { Field } from '../Field/Field';\r\n\r\nexport interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'> {\r\n  error?: string;\r\n  fullWidth?: boolean;\r\n  helperText?: string;\r\n  label?: React.ReactNode;\r\n  leftIcon?: React.ReactNode;\r\n  rightIcon?: React.ReactNode;\r\n  size?: FieldSize;\r\n}\r\n\r\nconst iconSlot =\r\n  'pointer-events-none absolute z-[1] flex items-center text-sbk-fg-muted group-focus-within:text-sbk-primary [&_svg]:size-[1.125rem]';\r\n\r\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\r\n  (\r\n    {\r\n      label,\r\n      error,\r\n      helperText,\r\n      leftIcon,\r\n      rightIcon,\r\n      fullWidth = false,\r\n      size = 'md',\r\n      className,\r\n      id,\r\n      required,\r\n      ...props\r\n    },\r\n    ref,\r\n  ) => {\r\n    const autoId = useId();\r\n    const inputId = id ?? autoId;\r\n\r\n    return (\r\n      <Field\r\n        className={cn(fullWidth && 'w-full')}\r\n        error={error}\r\n        helperText={helperText}\r\n        id={inputId}\r\n        label={label}\r\n        required={required}\r\n      >\r\n        <div className=\"group relative flex w-full items-center\">\r\n          {leftIcon && <span className={cn(iconSlot, 'left-3')}>{leftIcon}</span>}\r\n          <input\r\n            ref={ref}\r\n            aria-describedby={describedBy(inputId, error, helperText)}\r\n            aria-invalid={error ? true : undefined}\r\n            className={cn(\r\n              fieldControl,\r\n              fieldSize[size],\r\n              leftIcon && 'pl-10',\r\n              rightIcon && 'pr-10',\r\n              className,\r\n            )}\r\n            id={inputId}\r\n            required={required}\r\n            {...props}\r\n          />\r\n          {rightIcon && <span className={cn(iconSlot, 'right-3')}>{rightIcon}</span>}\r\n        </div>\r\n      </Field>\r\n    );\r\n  },\r\n);\r\n\r\nInput.displayName = 'Input';\r\n"],"names":["iconSlot","Input","React","label","error","helperText","leftIcon","rightIcon","fullWidth","size","className","id","required","props","ref","autoId","useId","inputId","jsx","Field","cn","jsxs","describedBy","fieldControl","fieldSize"],"mappings":";;;;;AAeA,MAAMA,IACJ,sIAEWC,IAAQC,EAAM;AAAA,EACzB,CACE;AAAA,IACE,OAAAC;AAAA,IACA,OAAAC;AAAA,IACA,YAAAC;AAAA,IACA,UAAAC;AAAA,IACA,WAAAC;AAAA,IACA,WAAAC,IAAY;AAAA,IACZ,MAAAC,IAAO;AAAA,IACP,WAAAC;AAAA,IACA,IAAAC;AAAA,IACA,UAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,GAELC,MACG;AACH,UAAMC,IAASC,EAAA,GACTC,IAAUN,KAAMI;AAEtB,WACE,gBAAAG;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,WAAWC,EAAGZ,KAAa,QAAQ;AAAA,QACnC,OAAAJ;AAAA,QACA,YAAAC;AAAA,QACA,IAAIY;AAAA,QACJ,OAAAd;AAAA,QACA,UAAAS;AAAA,QAEA,UAAA,gBAAAS,EAAC,OAAA,EAAI,WAAU,2CACZ,UAAA;AAAA,UAAAf,uBAAa,QAAA,EAAK,WAAWc,EAAGpB,GAAU,QAAQ,GAAI,UAAAM,GAAS;AAAA,UAChE,gBAAAY;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,KAAAJ;AAAA,cACA,oBAAkBQ,EAAYL,GAASb,GAAOC,CAAU;AAAA,cACxD,gBAAcD,IAAQ,KAAO;AAAA,cAC7B,WAAWgB;AAAA,gBACTG;AAAA,gBACAC,EAAUf,CAAI;AAAA,gBACdH,KAAY;AAAA,gBACZC,KAAa;AAAA,gBACbG;AAAA,cAAA;AAAA,cAEF,IAAIO;AAAA,cACJ,UAAAL;AAAA,cACC,GAAGC;AAAA,YAAA;AAAA,UAAA;AAAA,UAELN,uBAAc,QAAA,EAAK,WAAWa,EAAGpB,GAAU,SAAS,GAAI,UAAAO,EAAA,CAAU;AAAA,QAAA,EAAA,CACrE;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;AAEAN,EAAM,cAAc;"}

package/dist/components/Layout/Layout.d.ts

@@ -10,5 +10,7 @@ export declare const Stack: React.FC<StackProps>;
 export interface GridProps extends React.HTMLAttributes<HTMLDivElement> {
     cols?: 1 | 2 | 3 | 4;
     gap?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    /** Empilha colunas em telas pequenas. Padrão: true. */
+    responsive?: boolean;
 }
 export declare const Grid: React.FC<GridProps>;

package/dist/components/Layout/Layout.js

@@ -1,41 +1,47 @@
-import { jsx as m } from "react/jsx-runtime";
-import { cn as o } from "../../utils/cn.js";
-const t = ({ size: s = "lg", className: a, ...l }) => {
-  const g = {
+import { jsx as o } from "react/jsx-runtime";
+import { cn as c } from "../../utils/cn.js";
+const t = ({ size: s = "lg", className: g, ...l }) => {
+  const a = {
     sm: "max-w-2xl",
     md: "max-w-4xl",
     lg: "max-w-6xl",
     xl: "max-w-7xl",
     full: "max-w-none"
   }[s];
-  return /* @__PURE__ */ m("div", { className: o("mx-auto w-full px-4", g, a), ...l });
-}, n = ({ gap: s = "md", className: a, ...l }) => {
-  const g = {
+  return /* @__PURE__ */ o("div", { className: c("mx-auto w-full px-4", a, g), ...l });
+}, p = ({ gap: s = "md", className: g, ...l }) => {
+  const a = {
     xs: "gap-1",
     sm: "gap-2",
     md: "gap-3",
     lg: "gap-4",
     xl: "gap-6"
   }[s];
-  return /* @__PURE__ */ m("div", { className: o("flex flex-col", g, a), ...l });
-}, d = ({ cols: s = 2, gap: a = "md", className: l, ...g }) => {
-  const x = {
+  return /* @__PURE__ */ o("div", { className: c("flex flex-col", a, g), ...l });
+}, n = ({
+  cols: s = 2,
+  gap: g = "md",
+  responsive: l = !0,
+  className: a,
+  ...r
+}) => {
+  const m = {
     1: "grid-cols-1",
-    2: "grid-cols-2",
-    3: "grid-cols-3",
-    4: "grid-cols-4"
-  }[s], c = {
+    2: l ? "grid-cols-1 sm:grid-cols-2" : "grid-cols-2",
+    3: l ? "grid-cols-1 sm:grid-cols-2 lg:grid-cols-3" : "grid-cols-3",
+    4: l ? "grid-cols-1 sm:grid-cols-2 lg:grid-cols-4" : "grid-cols-4"
+  }[s], d = {
     xs: "gap-1",
     sm: "gap-2",
     md: "gap-3",
     lg: "gap-4",
     xl: "gap-6"
-  }[a];
-  return /* @__PURE__ */ m("div", { className: o("grid", x, c, l), ...g });
+  }[g];
+  return /* @__PURE__ */ o("div", { className: c("grid", m, d, a), ...r });
 };
 export {
   t as Container,
-  d as Grid,
-  n as Stack
+  n as Grid,
+  p as Stack
 };
 //# sourceMappingURL=Layout.js.map

package/dist/components/Layout/Layout.js.map

@@ -1 +1 @@
-{"version":3,"file":"Layout.js","sources":["../../../src/components/Layout/Layout.tsx"],"sourcesContent":["import type React from 'react';\nimport { cn } from '../../utils/cn';\n\nexport interface ContainerProps extends React.HTMLAttributes<HTMLDivElement> {\n  size?: 'sm' | 'md' | 'lg' | 'xl' | 'full';\n}\n\nexport const Container: React.FC<ContainerProps> = ({ size = 'lg', className, ...props }) => {\n  const sizeClass = {\n    sm: 'max-w-2xl',\n    md: 'max-w-4xl',\n    lg: 'max-w-6xl',\n    xl: 'max-w-7xl',\n    full: 'max-w-none',\n  }[size];\n  return <div className={cn('mx-auto w-full px-4', sizeClass, className)} {...props} />;\n};\n\nexport interface StackProps extends React.HTMLAttributes<HTMLDivElement> {\n  gap?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n}\n\nexport const Stack: React.FC<StackProps> = ({ gap = 'md', className, ...props }) => {\n  const gapClass = {\n    xs: 'gap-1',\n    sm: 'gap-2',\n    md: 'gap-3',\n    lg: 'gap-4',\n    xl: 'gap-6',\n  }[gap];\n  return <div className={cn('flex flex-col', gapClass, className)} {...props} />;\n};\n\nexport interface GridProps extends React.HTMLAttributes<HTMLDivElement> {\n  cols?: 1 | 2 | 3 | 4;\n  gap?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n}\n\nexport const Grid: React.FC<GridProps> = ({ cols = 2, gap = 'md', className, ...props }) => {\n  const colsClass = {\n    1: 'grid-cols-1',\n    2: 'grid-cols-2',\n    3: 'grid-cols-3',\n    4: 'grid-cols-4',\n  }[cols];\n  const gapClass = {\n    xs: 'gap-1',\n    sm: 'gap-2',\n    md: 'gap-3',\n    lg: 'gap-4',\n    xl: 'gap-6',\n  }[gap];\n  return <div className={cn('grid', colsClass, gapClass, className)} {...props} />;\n};\n"],"names":["Container","size","className","props","sizeClass","jsx","cn","Stack","gap","gapClass","Grid","cols","colsClass"],"mappings":";;AAOO,MAAMA,IAAsC,CAAC,EAAE,MAAAC,IAAO,MAAM,WAAAC,GAAW,GAAGC,QAAY;AAC3F,QAAMC,IAAY;AAAA,IAChB,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,MAAM;AAAA,EAAA,EACNH,CAAI;AACN,SAAO,gBAAAI,EAAC,SAAI,WAAWC,EAAG,uBAAuBF,GAAWF,CAAS,GAAI,GAAGC,GAAO;AACrF,GAMaI,IAA8B,CAAC,EAAE,KAAAC,IAAM,MAAM,WAAAN,GAAW,GAAGC,QAAY;AAClF,QAAMM,IAAW;AAAA,IACf,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EAAA,EACJD,CAAG;AACL,SAAO,gBAAAH,EAAC,SAAI,WAAWC,EAAG,iBAAiBG,GAAUP,CAAS,GAAI,GAAGC,GAAO;AAC9E,GAOaO,IAA4B,CAAC,EAAE,MAAAC,IAAO,GAAG,KAAAH,IAAM,MAAM,WAAAN,GAAW,GAAGC,QAAY;AAC1F,QAAMS,IAAY;AAAA,IAChB,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,EAAA,EACHD,CAAI,GACAF,IAAW;AAAA,IACf,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EAAA,EACJD,CAAG;AACL,SAAO,gBAAAH,EAAC,OAAA,EAAI,WAAWC,EAAG,QAAQM,GAAWH,GAAUP,CAAS,GAAI,GAAGC,EAAA,CAAO;AAChF;"}
+{"version":3,"file":"Layout.js","sources":["../../../src/components/Layout/Layout.tsx"],"sourcesContent":["import type React from 'react';\r\nimport { cn } from '../../utils/cn';\r\n\r\nexport interface ContainerProps extends React.HTMLAttributes<HTMLDivElement> {\r\n  size?: 'sm' | 'md' | 'lg' | 'xl' | 'full';\r\n}\r\n\r\nexport const Container: React.FC<ContainerProps> = ({ size = 'lg', className, ...props }) => {\r\n  const sizeClass = {\r\n    sm: 'max-w-2xl',\r\n    md: 'max-w-4xl',\r\n    lg: 'max-w-6xl',\r\n    xl: 'max-w-7xl',\r\n    full: 'max-w-none',\r\n  }[size];\r\n  return <div className={cn('mx-auto w-full px-4', sizeClass, className)} {...props} />;\r\n};\r\n\r\nexport interface StackProps extends React.HTMLAttributes<HTMLDivElement> {\r\n  gap?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';\r\n}\r\n\r\nexport const Stack: React.FC<StackProps> = ({ gap = 'md', className, ...props }) => {\r\n  const gapClass = {\r\n    xs: 'gap-1',\r\n    sm: 'gap-2',\r\n    md: 'gap-3',\r\n    lg: 'gap-4',\r\n    xl: 'gap-6',\r\n  }[gap];\r\n  return <div className={cn('flex flex-col', gapClass, className)} {...props} />;\r\n};\r\n\r\nexport interface GridProps extends React.HTMLAttributes<HTMLDivElement> {\r\n  cols?: 1 | 2 | 3 | 4;\r\n  gap?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';\r\n  /** Empilha colunas em telas pequenas. Padrão: true. */\r\n  responsive?: boolean;\r\n}\r\n\r\nexport const Grid: React.FC<GridProps> = ({\r\n  cols = 2,\r\n  gap = 'md',\r\n  responsive = true,\r\n  className,\r\n  ...props\r\n}) => {\r\n  const colsClass = {\r\n    1: 'grid-cols-1',\r\n    2: responsive ? 'grid-cols-1 sm:grid-cols-2' : 'grid-cols-2',\r\n    3: responsive ? 'grid-cols-1 sm:grid-cols-2 lg:grid-cols-3' : 'grid-cols-3',\r\n    4: responsive ? 'grid-cols-1 sm:grid-cols-2 lg:grid-cols-4' : 'grid-cols-4',\r\n  }[cols];\r\n  const gapClass = {\r\n    xs: 'gap-1',\r\n    sm: 'gap-2',\r\n    md: 'gap-3',\r\n    lg: 'gap-4',\r\n    xl: 'gap-6',\r\n  }[gap];\r\n  return <div className={cn('grid', colsClass, gapClass, className)} {...props} />;\r\n};\r\n"],"names":["Container","size","className","props","sizeClass","jsx","cn","Stack","gap","gapClass","Grid","cols","responsive","colsClass"],"mappings":";;AAOO,MAAMA,IAAsC,CAAC,EAAE,MAAAC,IAAO,MAAM,WAAAC,GAAW,GAAGC,QAAY;AAC3F,QAAMC,IAAY;AAAA,IAChB,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,MAAM;AAAA,EAAA,EACNH,CAAI;AACN,SAAO,gBAAAI,EAAC,SAAI,WAAWC,EAAG,uBAAuBF,GAAWF,CAAS,GAAI,GAAGC,GAAO;AACrF,GAMaI,IAA8B,CAAC,EAAE,KAAAC,IAAM,MAAM,WAAAN,GAAW,GAAGC,QAAY;AAClF,QAAMM,IAAW;AAAA,IACf,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EAAA,EACJD,CAAG;AACL,SAAO,gBAAAH,EAAC,SAAI,WAAWC,EAAG,iBAAiBG,GAAUP,CAAS,GAAI,GAAGC,GAAO;AAC9E,GASaO,IAA4B,CAAC;AAAA,EACxC,MAAAC,IAAO;AAAA,EACP,KAAAH,IAAM;AAAA,EACN,YAAAI,IAAa;AAAA,EACb,WAAAV;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAMU,IAAY;AAAA,IAChB,GAAG;AAAA,IACH,GAAGD,IAAa,+BAA+B;AAAA,IAC/C,GAAGA,IAAa,8CAA8C;AAAA,IAC9D,GAAGA,IAAa,8CAA8C;AAAA,EAAA,EAC9DD,CAAI,GACAF,IAAW;AAAA,IACf,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EAAA,EACJD,CAAG;AACL,SAAO,gBAAAH,EAAC,OAAA,EAAI,WAAWC,EAAG,QAAQO,GAAWJ,GAAUP,CAAS,GAAI,GAAGC,EAAA,CAAO;AAChF;"}

package/dist/components/Logo/Logo.d.ts

@@ -0,0 +1,27 @@
+import type React from 'react';
+export type LogoVariant = 'sbk' | 'sbk-ia';
+/**
+ * - `auto`: cor de título do tema atual (verde escuro no claro, branco no escuro)
+ * - `dark`: Verde Escuro, para fundos claros
+ * - `white`: para fundos escuros
+ * - `black`: monocromática
+ */
+export type LogoColor = 'auto' | 'dark' | 'white' | 'black';
+export interface LogoProps extends Omit<React.SVGAttributes<SVGSVGElement>, 'color'> {
+    /** Reserva a zona de respiro do brand book (espaço livre igual à altura do símbolo). */
+    clearSpace?: boolean;
+    color?: LogoColor;
+    /** Altura em px. A largura acompanha a proporção oficial. */
+    height?: number;
+    /** Nome acessível. Padrão: "SBK" ou "SBK IA". */
+    title?: string;
+    variant?: LogoVariant;
+}
+/**
+ * Logo oficial SBK / SBK IA a partir dos SVGs do time de marca.
+ * Não aplica sombras, gradientes, distorção ou rotação (usos indevidos do brand book).
+ */
+export declare const Logo: {
+    ({ variant, color, height, clearSpace, title, className, style, ...props }: LogoProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/components/Logo/Logo.js

@@ -0,0 +1,107 @@
+import { jsxs as l, jsx as t } from "react/jsx-runtime";
+import { cn as d } from "../../utils/cn.js";
+const k = {
+  auto: "text-sbk-fg-heading",
+  dark: "text-sbk-verde-escuro",
+  white: "text-sbk-branco",
+  black: "text-sbk-preto"
+}, m = {
+  auto: "var(--sbk-color-surface)",
+  dark: "var(--sbk-branco)",
+  white: "var(--sbk-preto)",
+  black: "var(--sbk-branco)"
+}, b = { x: 39.15, y: 180.84, w: 541.7, h: 258.08 }, p = { x: 48.06, y: 293.2, w: 405.56, h: 128.33 }, x = () => /* @__PURE__ */ l("g", { fill: "currentColor", transform: "translate(-49, 122)", children: [
+  /* @__PURE__ */ l("g", { stroke: "currentColor", strokeMiterlimit: 10, strokeWidth: 2, children: [
+    /* @__PURE__ */ t("path", { d: "m225.13 266.26c-27.48 0-47.67-12.07-50.38-41.01h14.16c0.62 21.44 17.69 29.56 36.85 29.56 18.11 0 39.14-7.91 39.14-29.14 0-16.24-13.12-23.74-32.48-29.99l-11.03-3.53c-24.36-7.71-42.27-16.66-42.27-40.19 0-28.1 24.78-39.97 49.76-39.97 22.9 0 46.64 8.54 47.05 35.18h-13.95c-1.87-18.32-15.82-23.94-32.47-23.94-17.29 0-36.65 7.71-36.65 27.69 0 14.78 11.04 22.28 34.36 29.77l12.49 3.96c24.36 7.7 38.3 15.82 38.93 38.73 0 30.18-26.65 42.88-53.51 42.88z" }),
+    /* @__PURE__ */ t(
+      "path",
+      {
+        d: "m351.42 264.39h-41.43v-150.53h41.43c8.53 0 17.9-0.2 26.23 2.09 16.24 4.58 27.48 17.9 27.48 35.18 0 18.74-10.41 29.98-27.9 34.56 20.82 2.71 34.15 15.2 34.15 36.85 0 34.56-31.86 41.85-59.96 41.85zm8.12-138.45h-36.02v56.49h32.06c19.16 0 34.98-8.81 34.98-30.26 0-18.74-14.16-26.23-31.02-26.23zm-1.46 63.19h-34.56v63.18h26.65c21.86 0 46.84-1.45 46.84-29.98 0-24.77-18.11-33.2-38.93-33.2z",
+        fillRule: "evenodd"
+      }
+    ),
+    /* @__PURE__ */ t("path", { d: "m443.77 264.39v-150.53h13.53v150.53zm88.07 0l-73.7-81.61 67.03-68.92h18.12l-68.91 67.88 75.99 82.65z" })
+  ] }),
+  /* @__PURE__ */ t("path", { d: "m99.09 118.17l-0.21 57.98-9.73 0.24 0.56-62.81c0.26-29.03 26.91-53.16 56.3-53.26l151.74-0.48c0.62 3.58 0.63 6.35 0.05 9.92l-150.35 0.22c-26.28 0.04-48.26 21.9-48.36 48.19z" }),
+  /* @__PURE__ */ t("path", { d: "m419.9 315.79l0.22-9.33 149.3-0.15c25.73-0.02 48.97-20.27 49.14-45.96l0.4-60.49q4.64-0.28 9.57-0.07l0.32 52.61c0.21 33.16-23.62 63.29-57.93 63.33l-135.88 0.19z" })
+] }), M = ({ knockout: r }) => /* @__PURE__ */ l("g", { children: [
+  /* @__PURE__ */ t(
+    "path",
+    {
+      d: "M 0.00165 -0.00185625 L -341.502256 -0.00185625 C -357.81085 -0.00185625 -371.033506 13.2208 -371.033506 29.529394 L -371.033506 93.802831 C -371.033506 110.115331 -357.81085 123.334081 -341.502256 123.334081 L 0.00165 123.334081 C 16.310244 123.334081 29.5329 110.115331 29.5329 93.802831 L 29.5329 29.529394 C 29.5329 13.2208 16.310244 -0.00185625 0.00165 -0.00185625 Z",
+      fill: "none",
+      stroke: "currentColor",
+      strokeMiterlimit: 10,
+      strokeWidth: 5,
+      transform: "matrix(1, 0, 0, -1, 421.5921, 419.0333)"
+    }
+  ),
+  /* @__PURE__ */ t(
+    "path",
+    {
+      d: "M 280.578125 419.230469 L 80.089844 419.230469 C 63.78125 419.230469 50.558594 406.011719 50.558594 389.699219 L 50.558594 325.425781 C 50.558594 309.117188 63.78125 295.898438 80.089844 295.898438 L 280.578125 295.898438 C 296.886719 295.898438 310.109375 309.117188 310.109375 325.425781 L 310.109375 389.699219 C 310.109375 406.011719 296.886719 419.230469 280.578125 419.230469",
+      fill: "currentColor"
+    }
+  ),
+  /* @__PURE__ */ l("g", { fill: "currentColor", children: [
+    /* @__PURE__ */ t(
+      "path",
+      {
+        d: "M 17.8125 0 L 17.8125 -75.75 L 11 -75.75 L 11 0 Z",
+        transform: "translate(327.5737, 394.627)"
+      }
+    ),
+    /* @__PURE__ */ t(
+      "path",
+      {
+        d: "M 71.453125 0 L 39.28125 -75.75 L 32.0625 -75.75 L 1.15625 0 L 8.375 0 L 16.546875 -21.15625 L 54.890625 -21.15625 L 63.484375 0 Z M 52.484375 -26.8125 L 18.75 -26.8125 L 35.203125 -69.140625 Z",
+        transform: "translate(356.385092, 394.627)"
+      }
+    )
+  ] }),
+  /* @__PURE__ */ l("g", { fill: r, stroke: r, strokeMiterlimit: 10, children: [
+    /* @__PURE__ */ t("path", { d: "M 114.230469 396.132812 C 100.488281 396.132812 90.390625 390.09375 89.039062 375.625 L 96.117188 375.625 C 96.429688 386.347656 104.964844 390.40625 114.542969 390.40625 C 123.597656 390.40625 134.113281 386.453125 134.113281 375.832031 C 134.113281 367.714844 127.554688 363.964844 117.871094 360.84375 L 112.355469 359.074219 C 100.175781 355.222656 91.222656 350.746094 91.222656 338.980469 C 91.222656 324.929688 103.613281 318.996094 116.105469 318.996094 C 127.554688 318.996094 139.421875 323.261719 139.628906 336.589844 L 132.65625 336.589844 C 131.71875 327.429688 124.742188 324.617188 116.414062 324.617188 C 107.777344 324.617188 98.09375 328.46875 98.09375 338.460938 C 98.09375 345.851562 103.613281 349.601562 115.269531 353.347656 L 121.515625 355.328125 C 133.695312 359.175781 140.671875 363.238281 140.984375 374.6875 C 140.984375 389.78125 127.660156 396.132812 114.230469 396.132812" }),
+    /* @__PURE__ */ t("path", { d: "M 180.703125 357.5625 L 163.421875 357.5625 L 163.421875 389.15625 L 176.746094 389.15625 C 187.679688 389.15625 200.167969 388.429688 200.167969 374.167969 C 200.167969 361.78125 191.113281 357.5625 180.703125 357.5625 M 181.433594 325.96875 L 163.421875 325.96875 L 163.421875 354.214844 L 179.453125 354.214844 C 189.03125 354.214844 196.941406 349.808594 196.941406 339.085938 C 196.941406 329.71875 189.863281 325.96875 181.433594 325.96875 M 177.371094 395.195312 L 156.65625 395.195312 L 156.65625 319.933594 L 177.371094 319.933594 C 181.640625 319.933594 186.324219 319.828125 190.488281 320.972656 C 198.609375 323.265625 204.230469 329.925781 204.230469 338.566406 C 204.230469 347.933594 199.023438 353.554688 190.28125 355.847656 C 200.691406 357.199219 207.351562 363.445312 207.351562 374.273438 C 207.351562 391.550781 191.425781 395.195312 177.371094 395.195312" }),
+    /* @__PURE__ */ t(
+      "path",
+      {
+        d: "M 0.00183125 0.0001875 L -36.849731 40.804875 L -3.3302 75.261906 L 5.724488 75.261906 L -28.732544 41.328312 L 9.26355 0.0001875 Z M -44.033325 75.261906 L -37.2677 75.261906 L -37.2677 0.0001875 L -44.033325 0.0001875 Z",
+        transform: "matrix(1, 0, 0, -1, 267.5802, 395.1955)"
+      }
+    )
+  ] })
+] }), f = ({
+  variant: r = "sbk",
+  color: s = "auto",
+  height: e = 32,
+  clearSpace: c = !1,
+  title: n,
+  className: L,
+  style: i,
+  ...h
+}) => {
+  const o = r === "sbk" ? b : p, C = Math.round(e * o.w / o.h), a = n ?? (r === "sbk" ? "SBK" : "SBK IA");
+  return /* @__PURE__ */ l(
+    "svg",
+    {
+      "aria-label": a,
+      className: d("inline-block shrink-0", k[s], L),
+      height: e,
+      role: "img",
+      style: { ...c ? { padding: e, boxSizing: "content-box" } : null, ...i },
+      viewBox: `${o.x} ${o.y} ${o.w} ${o.h}`,
+      width: C,
+      xmlns: "http://www.w3.org/2000/svg",
+      ...h,
+      children: [
+        /* @__PURE__ */ t("title", { children: a }),
+        r === "sbk" ? /* @__PURE__ */ t(x, {}) : /* @__PURE__ */ t(M, { knockout: m[s] })
+      ]
+    }
+  );
+};
+f.displayName = "Logo";
+export {
+  f as Logo
+};
+//# sourceMappingURL=Logo.js.map

package/dist/components/Logo/Logo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Logo.js","sources":["../../../src/components/Logo/Logo.tsx"],"sourcesContent":["import type React from 'react';\r\nimport { cn } from '../../utils/cn';\r\n\r\nexport type LogoVariant = 'sbk' | 'sbk-ia';\r\n/**\r\n * - `auto`: cor de título do tema atual (verde escuro no claro, branco no escuro)\r\n * - `dark`: Verde Escuro, para fundos claros\r\n * - `white`: para fundos escuros\r\n * - `black`: monocromática\r\n */\r\nexport type LogoColor = 'auto' | 'dark' | 'white' | 'black';\r\n\r\nexport interface LogoProps extends Omit<React.SVGAttributes<SVGSVGElement>, 'color'> {\r\n  /** Reserva a zona de respiro do brand book (espaço livre igual à altura do símbolo). */\r\n  clearSpace?: boolean;\r\n  color?: LogoColor;\r\n  /** Altura em px. A largura acompanha a proporção oficial. */\r\n  height?: number;\r\n  /** Nome acessível. Padrão: \"SBK\" ou \"SBK IA\". */\r\n  title?: string;\r\n  variant?: LogoVariant;\r\n}\r\n\r\nconst COLOR_CLASS: Record<LogoColor, string> = {\r\n  auto: 'text-sbk-fg-heading',\r\n  dark: 'text-sbk-verde-escuro',\r\n  white: 'text-sbk-branco',\r\n  black: 'text-sbk-preto',\r\n};\r\n\r\n/** Cor do recorte do wordmark dentro do bloco da SBK IA. */\r\nconst KNOCKOUT: Record<LogoColor, string> = {\r\n  auto: 'var(--sbk-color-surface)',\r\n  dark: 'var(--sbk-branco)',\r\n  white: 'var(--sbk-preto)',\r\n  black: 'var(--sbk-branco)',\r\n};\r\n\r\nconst SBK_VIEWBOX = { x: 39.15, y: 180.84, w: 541.7, h: 258.08 };\r\nconst SBK_IA_VIEWBOX = { x: 48.06, y: 293.2, w: 405.56, h: 128.33 };\r\n\r\n/** Paths oficiais: ui/docs/SBK_logo_2026.svg */\r\nconst SbkMark = () => (\r\n  <g fill=\"currentColor\" transform=\"translate(-49, 122)\">\r\n    <g stroke=\"currentColor\" strokeMiterlimit={10} strokeWidth={2}>\r\n      <path d=\"m225.13 266.26c-27.48 0-47.67-12.07-50.38-41.01h14.16c0.62 21.44 17.69 29.56 36.85 29.56 18.11 0 39.14-7.91 39.14-29.14 0-16.24-13.12-23.74-32.48-29.99l-11.03-3.53c-24.36-7.71-42.27-16.66-42.27-40.19 0-28.1 24.78-39.97 49.76-39.97 22.9 0 46.64 8.54 47.05 35.18h-13.95c-1.87-18.32-15.82-23.94-32.47-23.94-17.29 0-36.65 7.71-36.65 27.69 0 14.78 11.04 22.28 34.36 29.77l12.49 3.96c24.36 7.7 38.3 15.82 38.93 38.73 0 30.18-26.65 42.88-53.51 42.88z\" />\r\n      <path\r\n        d=\"m351.42 264.39h-41.43v-150.53h41.43c8.53 0 17.9-0.2 26.23 2.09 16.24 4.58 27.48 17.9 27.48 35.18 0 18.74-10.41 29.98-27.9 34.56 20.82 2.71 34.15 15.2 34.15 36.85 0 34.56-31.86 41.85-59.96 41.85zm8.12-138.45h-36.02v56.49h32.06c19.16 0 34.98-8.81 34.98-30.26 0-18.74-14.16-26.23-31.02-26.23zm-1.46 63.19h-34.56v63.18h26.65c21.86 0 46.84-1.45 46.84-29.98 0-24.77-18.11-33.2-38.93-33.2z\"\r\n        fillRule=\"evenodd\"\r\n      />\r\n      <path d=\"m443.77 264.39v-150.53h13.53v150.53zm88.07 0l-73.7-81.61 67.03-68.92h18.12l-68.91 67.88 75.99 82.65z\" />\r\n    </g>\r\n    <path d=\"m99.09 118.17l-0.21 57.98-9.73 0.24 0.56-62.81c0.26-29.03 26.91-53.16 56.3-53.26l151.74-0.48c0.62 3.58 0.63 6.35 0.05 9.92l-150.35 0.22c-26.28 0.04-48.26 21.9-48.36 48.19z\" />\r\n    <path d=\"m419.9 315.79l0.22-9.33 149.3-0.15c25.73-0.02 48.97-20.27 49.14-45.96l0.4-60.49q4.64-0.28 9.57-0.07l0.32 52.61c0.21 33.16-23.62 63.29-57.93 63.33l-135.88 0.19z\" />\r\n  </g>\r\n);\r\n\r\n/** Paths oficiais: ui/docs/SBK_IA_logo_2026.svg (glyphs \"IA\" expandidos para evitar ids globais) */\r\nconst SbkIaMark = ({ knockout }: { knockout: string }) => (\r\n  <g>\r\n    <path\r\n      d=\"M 0.00165 -0.00185625 L -341.502256 -0.00185625 C -357.81085 -0.00185625 -371.033506 13.2208 -371.033506 29.529394 L -371.033506 93.802831 C -371.033506 110.115331 -357.81085 123.334081 -341.502256 123.334081 L 0.00165 123.334081 C 16.310244 123.334081 29.5329 110.115331 29.5329 93.802831 L 29.5329 29.529394 C 29.5329 13.2208 16.310244 -0.00185625 0.00165 -0.00185625 Z\"\r\n      fill=\"none\"\r\n      stroke=\"currentColor\"\r\n      strokeMiterlimit={10}\r\n      strokeWidth={5}\r\n      transform=\"matrix(1, 0, 0, -1, 421.5921, 419.0333)\"\r\n    />\r\n    <path\r\n      d=\"M 280.578125 419.230469 L 80.089844 419.230469 C 63.78125 419.230469 50.558594 406.011719 50.558594 389.699219 L 50.558594 325.425781 C 50.558594 309.117188 63.78125 295.898438 80.089844 295.898438 L 280.578125 295.898438 C 296.886719 295.898438 310.109375 309.117188 310.109375 325.425781 L 310.109375 389.699219 C 310.109375 406.011719 296.886719 419.230469 280.578125 419.230469\"\r\n      fill=\"currentColor\"\r\n    />\r\n    <g fill=\"currentColor\">\r\n      <path\r\n        d=\"M 17.8125 0 L 17.8125 -75.75 L 11 -75.75 L 11 0 Z\"\r\n        transform=\"translate(327.5737, 394.627)\"\r\n      />\r\n      <path\r\n        d=\"M 71.453125 0 L 39.28125 -75.75 L 32.0625 -75.75 L 1.15625 0 L 8.375 0 L 16.546875 -21.15625 L 54.890625 -21.15625 L 63.484375 0 Z M 52.484375 -26.8125 L 18.75 -26.8125 L 35.203125 -69.140625 Z\"\r\n        transform=\"translate(356.385092, 394.627)\"\r\n      />\r\n    </g>\r\n    <g fill={knockout} stroke={knockout} strokeMiterlimit={10}>\r\n      <path d=\"M 114.230469 396.132812 C 100.488281 396.132812 90.390625 390.09375 89.039062 375.625 L 96.117188 375.625 C 96.429688 386.347656 104.964844 390.40625 114.542969 390.40625 C 123.597656 390.40625 134.113281 386.453125 134.113281 375.832031 C 134.113281 367.714844 127.554688 363.964844 117.871094 360.84375 L 112.355469 359.074219 C 100.175781 355.222656 91.222656 350.746094 91.222656 338.980469 C 91.222656 324.929688 103.613281 318.996094 116.105469 318.996094 C 127.554688 318.996094 139.421875 323.261719 139.628906 336.589844 L 132.65625 336.589844 C 131.71875 327.429688 124.742188 324.617188 116.414062 324.617188 C 107.777344 324.617188 98.09375 328.46875 98.09375 338.460938 C 98.09375 345.851562 103.613281 349.601562 115.269531 353.347656 L 121.515625 355.328125 C 133.695312 359.175781 140.671875 363.238281 140.984375 374.6875 C 140.984375 389.78125 127.660156 396.132812 114.230469 396.132812\" />\r\n      <path d=\"M 180.703125 357.5625 L 163.421875 357.5625 L 163.421875 389.15625 L 176.746094 389.15625 C 187.679688 389.15625 200.167969 388.429688 200.167969 374.167969 C 200.167969 361.78125 191.113281 357.5625 180.703125 357.5625 M 181.433594 325.96875 L 163.421875 325.96875 L 163.421875 354.214844 L 179.453125 354.214844 C 189.03125 354.214844 196.941406 349.808594 196.941406 339.085938 C 196.941406 329.71875 189.863281 325.96875 181.433594 325.96875 M 177.371094 395.195312 L 156.65625 395.195312 L 156.65625 319.933594 L 177.371094 319.933594 C 181.640625 319.933594 186.324219 319.828125 190.488281 320.972656 C 198.609375 323.265625 204.230469 329.925781 204.230469 338.566406 C 204.230469 347.933594 199.023438 353.554688 190.28125 355.847656 C 200.691406 357.199219 207.351562 363.445312 207.351562 374.273438 C 207.351562 391.550781 191.425781 395.195312 177.371094 395.195312\" />\r\n      <path\r\n        d=\"M 0.00183125 0.0001875 L -36.849731 40.804875 L -3.3302 75.261906 L 5.724488 75.261906 L -28.732544 41.328312 L 9.26355 0.0001875 Z M -44.033325 75.261906 L -37.2677 75.261906 L -37.2677 0.0001875 L -44.033325 0.0001875 Z\"\r\n        transform=\"matrix(1, 0, 0, -1, 267.5802, 395.1955)\"\r\n      />\r\n    </g>\r\n  </g>\r\n);\r\n\r\n/**\r\n * Logo oficial SBK / SBK IA a partir dos SVGs do time de marca.\r\n * Não aplica sombras, gradientes, distorção ou rotação (usos indevidos do brand book).\r\n */\r\nexport const Logo = ({\r\n  variant = 'sbk',\r\n  color = 'auto',\r\n  height = 32,\r\n  clearSpace = false,\r\n  title,\r\n  className,\r\n  style,\r\n  ...props\r\n}: LogoProps) => {\r\n  const box = variant === 'sbk' ? SBK_VIEWBOX : SBK_IA_VIEWBOX;\r\n  const width = Math.round((height * box.w) / box.h);\r\n  const accessibleName = title ?? (variant === 'sbk' ? 'SBK' : 'SBK IA');\r\n\r\n  return (\r\n    <svg\r\n      aria-label={accessibleName}\r\n      className={cn('inline-block shrink-0', COLOR_CLASS[color], className)}\r\n      height={height}\r\n      role=\"img\"\r\n      style={{ ...(clearSpace ? { padding: height, boxSizing: 'content-box' } : null), ...style }}\r\n      viewBox={`${box.x} ${box.y} ${box.w} ${box.h}`}\r\n      width={width}\r\n      xmlns=\"http://www.w3.org/2000/svg\"\r\n      {...props}\r\n    >\r\n      <title>{accessibleName}</title>\r\n      {variant === 'sbk' ? <SbkMark /> : <SbkIaMark knockout={KNOCKOUT[color]} />}\r\n    </svg>\r\n  );\r\n};\r\n\r\nLogo.displayName = 'Logo';\r\n"],"names":["COLOR_CLASS","KNOCKOUT","SBK_VIEWBOX","SBK_IA_VIEWBOX","SbkMark","jsxs","jsx","SbkIaMark","knockout","Logo","variant","color","height","clearSpace","title","className","style","props","box","width","accessibleName","cn"],"mappings":"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"}

package/dist/components/MiniCard/MiniCard.d.ts

@@ -0,0 +1,21 @@
+import type React from 'react';
+export type MiniCardTrend = 'up' | 'down' | 'neutral';
+export interface MiniCardProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title'> {
+    /** Variação exibida ao lado do valor (ex.: "+12%"). */
+    delta?: React.ReactNode;
+    /** Texto de apoio abaixo do valor. */
+    description?: React.ReactNode;
+    icon?: React.ReactNode;
+    label: React.ReactNode;
+    /** Direção da variação. `up` não significa "bom": ajuste `trendPositive` quando cair for positivo. */
+    trend?: MiniCardTrend;
+    /** Define se a tendência informada é positiva. Padrão: `up` positivo, `down` negativo. */
+    trendPositive?: boolean;
+    value: React.ReactNode;
+    variant?: 'default' | 'inverse' | 'highlight' | 'glass';
+}
+/** Card compacto de indicador (KPI): rótulo, valor, variação e ícone. */
+export declare const MiniCard: {
+    ({ label, value, delta, trend, trendPositive, description, icon, variant, className, ...props }: MiniCardProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/components/MiniCard/MiniCard.js

@@ -0,0 +1,90 @@
+import { jsxs as r, jsx as i } from "react/jsx-runtime";
+import { ArrowRight as f, ArrowDownRight as x, ArrowUpRight as h } from "lucide-react";
+import { cn as s } from "../../utils/cn.js";
+import { inverseScope as u } from "../../utils/styles.js";
+import { Icon as k } from "../Icon/Icon.js";
+const N = {
+  default: "border border-sbk-line bg-sbk-surface text-sbk-fg",
+  inverse: s("border border-transparent", u),
+  highlight: "border border-transparent bg-sbk-highlight-bg text-sbk-highlight-fg",
+  glass: "sbk-glass text-sbk-fg"
+}, w = { up: h, down: x, neutral: f }, v = { up: "alta", down: "queda", neutral: "estável" }, y = ({
+  label: c,
+  value: d,
+  delta: a,
+  trend: e,
+  trendPositive: g,
+  description: o,
+  icon: l,
+  variant: n = "default",
+  className: m,
+  ...b
+}) => {
+  const t = n !== "default" && n !== "glass", p = t || e === "neutral" || !e ? "" : g ?? e !== "down" ? "text-sbk-success-fg" : "text-sbk-error-fg";
+  return /* @__PURE__ */ r(
+    "div",
+    {
+      className: s(
+        "flex min-w-0 items-start gap-3 rounded-sbk-sm p-4",
+        N[n],
+        m
+      ),
+      ...b,
+      children: [
+        /* @__PURE__ */ r("div", { className: "grid min-w-0 flex-1 gap-1", children: [
+          /* @__PURE__ */ i(
+            "span",
+            {
+              className: s(
+                "truncate text-xs font-semibold uppercase tracking-wide",
+                t ? "opacity-80" : "text-sbk-fg-muted"
+              ),
+              children: c
+            }
+          ),
+          /* @__PURE__ */ r("div", { className: "flex flex-wrap items-baseline gap-2", children: [
+            /* @__PURE__ */ i(
+              "span",
+              {
+                className: s("text-2xl font-semibold leading-none", !t && "text-sbk-fg-heading"),
+                children: d
+              }
+            ),
+            a && /* @__PURE__ */ r(
+              "span",
+              {
+                className: s("inline-flex items-center gap-0.5 text-xs font-semibold", p),
+                children: [
+                  e && /* @__PURE__ */ i(k, { icon: w[e], size: "xs" }),
+                  a,
+                  e && /* @__PURE__ */ r("span", { className: "sr-only", children: [
+                    "(",
+                    v[e],
+                    ")"
+                  ] })
+                ]
+              }
+            )
+          ] }),
+          o && /* @__PURE__ */ i("span", { className: s("text-xs font-light", t ? "opacity-80" : "text-sbk-fg-muted"), children: o })
+        ] }),
+        l && /* @__PURE__ */ i(
+          "span",
+          {
+            "aria-hidden": "true",
+            className: s(
+              "inline-flex size-9 shrink-0 items-center justify-center rounded-sbk-sm [&_svg]:size-5",
+              t ? "bg-sbk-branco/15" : "bg-sbk-primary-subtle text-sbk-primary"
+            ),
+            children: l
+          }
+        )
+      ]
+    }
+  );
+};
+y.displayName = "MiniCard";
+export {
+  y as MiniCard
+};
+//# sourceMappingURL=MiniCard.js.map

package/dist/components/MiniCard/MiniCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MiniCard.js","sources":["../../../src/components/MiniCard/MiniCard.tsx"],"sourcesContent":["import type React from 'react';\r\nimport { ArrowDownRight, ArrowRight, ArrowUpRight } from 'lucide-react';\r\nimport { cn } from '../../utils/cn';\r\nimport { inverseScope } from '../../utils/styles';\r\nimport { Icon } from '../Icon/Icon';\r\n\r\nexport type MiniCardTrend = 'up' | 'down' | 'neutral';\r\n\r\nexport interface MiniCardProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title'> {\r\n  /** Variação exibida ao lado do valor (ex.: \"+12%\"). */\r\n  delta?: React.ReactNode;\r\n  /** Texto de apoio abaixo do valor. */\r\n  description?: React.ReactNode;\r\n  icon?: React.ReactNode;\r\n  label: React.ReactNode;\r\n  /** Direção da variação. `up` não significa \"bom\": ajuste `trendPositive` quando cair for positivo. */\r\n  trend?: MiniCardTrend;\r\n  /** Define se a tendência informada é positiva. Padrão: `up` positivo, `down` negativo. */\r\n  trendPositive?: boolean;\r\n  value: React.ReactNode;\r\n  variant?: 'default' | 'inverse' | 'highlight' | 'glass';\r\n}\r\n\r\nconst VARIANT_CLASS: Record<NonNullable<MiniCardProps['variant']>, string> = {\r\n  default: 'border border-sbk-line bg-sbk-surface text-sbk-fg',\r\n  inverse: cn('border border-transparent', inverseScope),\r\n  highlight: 'border border-transparent bg-sbk-highlight-bg text-sbk-highlight-fg',\r\n  glass: 'sbk-glass text-sbk-fg',\r\n};\r\n\r\nconst TREND_ICON = { up: ArrowUpRight, down: ArrowDownRight, neutral: ArrowRight } as const;\r\nconst TREND_LABEL = { up: 'alta', down: 'queda', neutral: 'estável' } as const;\r\n\r\n/** Card compacto de indicador (KPI): rótulo, valor, variação e ícone. */\r\nexport const MiniCard = ({\r\n  label,\r\n  value,\r\n  delta,\r\n  trend,\r\n  trendPositive,\r\n  description,\r\n  icon,\r\n  variant = 'default',\r\n  className,\r\n  ...props\r\n}: MiniCardProps) => {\r\n  const onColor = variant !== 'default' && variant !== 'glass';\r\n  const positive = trendPositive ?? trend !== 'down';\r\n  const trendColor =\r\n    onColor || trend === 'neutral' || !trend\r\n      ? ''\r\n      : positive\r\n        ? 'text-sbk-success-fg'\r\n        : 'text-sbk-error-fg';\r\n\r\n  return (\r\n    <div\r\n      className={cn(\r\n        'flex min-w-0 items-start gap-3 rounded-sbk-sm p-4',\r\n        VARIANT_CLASS[variant],\r\n        className,\r\n      )}\r\n      {...props}\r\n    >\r\n      <div className=\"grid min-w-0 flex-1 gap-1\">\r\n        <span\r\n          className={cn(\r\n            'truncate text-xs font-semibold uppercase tracking-wide',\r\n            onColor ? 'opacity-80' : 'text-sbk-fg-muted',\r\n          )}\r\n        >\r\n          {label}\r\n        </span>\r\n        <div className=\"flex flex-wrap items-baseline gap-2\">\r\n          <span\r\n            className={cn('text-2xl font-semibold leading-none', !onColor && 'text-sbk-fg-heading')}\r\n          >\r\n            {value}\r\n          </span>\r\n          {delta && (\r\n            <span\r\n              className={cn('inline-flex items-center gap-0.5 text-xs font-semibold', trendColor)}\r\n            >\r\n              {trend && <Icon icon={TREND_ICON[trend]} size=\"xs\" />}\r\n              {delta}\r\n              {trend && <span className=\"sr-only\">({TREND_LABEL[trend]})</span>}\r\n            </span>\r\n          )}\r\n        </div>\r\n        {description && (\r\n          <span className={cn('text-xs font-light', onColor ? 'opacity-80' : 'text-sbk-fg-muted')}>\r\n            {description}\r\n          </span>\r\n        )}\r\n      </div>\r\n      {icon && (\r\n        <span\r\n          aria-hidden=\"true\"\r\n          className={cn(\r\n            'inline-flex size-9 shrink-0 items-center justify-center rounded-sbk-sm [&_svg]:size-5',\r\n            onColor ? 'bg-sbk-branco/15' : 'bg-sbk-primary-subtle text-sbk-primary',\r\n          )}\r\n        >\r\n          {icon}\r\n        </span>\r\n      )}\r\n    </div>\r\n  );\r\n};\r\n\r\nMiniCard.displayName = 'MiniCard';\r\n"],"names":["VARIANT_CLASS","cn","inverseScope","TREND_ICON","ArrowUpRight","ArrowDownRight","ArrowRight","TREND_LABEL","MiniCard","label","value","delta","trend","trendPositive","description","icon","variant","className","props","onColor","trendColor","jsxs","jsx","Icon"],"mappings":";;;;;AAuBA,MAAMA,IAAuE;AAAA,EAC3E,SAAS;AAAA,EACT,SAASC,EAAG,6BAA6BC,CAAY;AAAA,EACrD,WAAW;AAAA,EACX,OAAO;AACT,GAEMC,IAAa,EAAE,IAAIC,GAAc,MAAMC,GAAgB,SAASC,EAAA,GAChEC,IAAc,EAAE,IAAI,QAAQ,MAAM,SAAS,SAAS,UAAA,GAG7CC,IAAW,CAAC;AAAA,EACvB,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,eAAAC;AAAA,EACA,aAAAC;AAAA,EACA,MAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,WAAAC;AAAA,EACA,GAAGC;AACL,MAAqB;AACnB,QAAMC,IAAUH,MAAY,aAAaA,MAAY,SAE/CI,IACJD,KAAWP,MAAU,aAAa,CAACA,IAC/B,KAHWC,KAAiBD,MAAU,SAKpC,wBACA;AAER,SACE,gBAAAS;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWpB;AAAA,QACT;AAAA,QACAD,EAAcgB,CAAO;AAAA,QACrBC;AAAA,MAAA;AAAA,MAED,GAAGC;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAG,EAAC,OAAA,EAAI,WAAU,6BACb,UAAA;AAAA,UAAA,gBAAAC;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAWrB;AAAA,gBACT;AAAA,gBACAkB,IAAU,eAAe;AAAA,cAAA;AAAA,cAG1B,UAAAV;AAAA,YAAA;AAAA,UAAA;AAAA,UAEH,gBAAAY,EAAC,OAAA,EAAI,WAAU,uCACb,UAAA;AAAA,YAAA,gBAAAC;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,WAAWrB,EAAG,uCAAuC,CAACkB,KAAW,qBAAqB;AAAA,gBAErF,UAAAT;AAAA,cAAA;AAAA,YAAA;AAAA,YAEFC,KACC,gBAAAU;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,WAAWpB,EAAG,0DAA0DmB,CAAU;AAAA,gBAEjF,UAAA;AAAA,kBAAAR,uBAAUW,GAAA,EAAK,MAAMpB,EAAWS,CAAK,GAAG,MAAK,MAAK;AAAA,kBAClDD;AAAA,kBACAC,KAAS,gBAAAS,EAAC,QAAA,EAAK,WAAU,WAAU,UAAA;AAAA,oBAAA;AAAA,oBAAEd,EAAYK,CAAK;AAAA,oBAAE;AAAA,kBAAA,EAAA,CAAC;AAAA,gBAAA;AAAA,cAAA;AAAA,YAAA;AAAA,UAC5D,GAEJ;AAAA,UACCE,KACC,gBAAAQ,EAAC,QAAA,EAAK,WAAWrB,EAAG,sBAAsBkB,IAAU,eAAe,mBAAmB,GACnF,UAAAL,EAAA,CACH;AAAA,QAAA,GAEJ;AAAA,QACCC,KACC,gBAAAO;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,eAAY;AAAA,YACZ,WAAWrB;AAAA,cACT;AAAA,cACAkB,IAAU,qBAAqB;AAAA,YAAA;AAAA,YAGhC,UAAAJ;AAAA,UAAA;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAAA,EAAA;AAIR;AAEAP,EAAS,cAAc;"}

package/dist/components/Modal/Modal.d.ts

@@ -2,12 +2,25 @@ import type React from 'react';
 export interface ModalProps {
     children: React.ReactNode;
     className?: string;
+    closeOnEscape?: boolean;
     closeOnOverlayClick?: boolean;
+    /** Rótulo do botão de fechar. Padrão: "Fechar modal". */
+    closeLabel?: string;
+    /** Rodapé fixo (ações). */
+    footer?: React.ReactNode;
     isOpen: boolean;
     onClose: () => void;
     showCloseButton?: boolean;
     size?: 'sm' | 'md' | 'lg' | 'xl' | 'full';
-    subtitle?: string;
-    title?: string | React.ReactNode;
+    subtitle?: React.ReactNode;
+    title?: React.ReactNode;
+    variant?: 'default' | 'glass';
 }
-export declare const Modal: React.FC<ModalProps>;
+/**
+ * Diálogo modal com focus trap, restauração de foco, Esc e bloqueio de rolagem.
+ * Renderizado em portal no <body>.
+ */
+export declare const Modal: {
+    ({ isOpen, onClose, title, subtitle, children, footer, size, variant, showCloseButton, closeOnOverlayClick, closeOnEscape, closeLabel, className, }: ModalProps): React.ReactPortal | null;
+    displayName: string;
+};