@granto-umbrella/umbrella-components 2.3.18 → 2.3.19

package/dist/umbrella-components.es.js

@@ -3961,8 +3961,8 @@ const Ge = {
     color: ${F.branding.text.accent.enabled};
   `,
   danger: k0`
-    background: ${F.danger.surface.enabled};
-    color: ${F.danger.text.onSurface};
+    background: ${F.global.surface.danger.disabled};
+    color: ${F.global.text.feedback.strong.error};
   `,
   success: k0`
     background: ${F.success.surface.feedback};
@@ -83013,6 +83013,7 @@ const M8 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
       $width: u,
       $height: h,
       "data-testid": b,
+      id: b,
       ...v,
       children: c ? /* @__PURE__ */ L.jsx(
         kt,
@@ -83211,6 +83212,7 @@ const gCt = n(
             wHt,
             {
               "data-testid": A,
+              id: A,
               ...f || {},
               ref: PHt(H, f ? f.ref : null),
               style: v,

package/dist/umbrella-components.umd.js

@@ -136,8 +136,8 @@ See https://s-c.sh/2BAXzed for more info.`),window[$e]+=1);const W8={width:{none
     border: 1px solid ${C.branding.border.enabled};
     color: ${C.branding.text.accent.enabled};
   `,danger:R0`
-    background: ${C.danger.surface.enabled};
-    color: ${C.danger.text.onSurface};
+    background: ${C.global.surface.danger.disabled};
+    color: ${C.global.text.feedback.strong.error};
   `,success:R0`
     background: ${C.success.surface.feedback};
     color: ${C.success.text.feedback};
@@ -346,7 +346,7 @@ See https://s-c.sh/2BAXzed for more info.`),window[$e]+=1);const W8={width:{none
     cursor: not-allowed;
     opacity: 0.6;
   }
-`,t6=({children:t,size:e="md",variant:r="primary",radius:l="md",isLoading:n=!1,iconSize:c="lg",leftIcon:i,rightIcon:p,width:s,height:f,testId:h,...b})=>{const v=i&&Z8[i],d=p&&Z8[p];return L.jsx(syr,{$size:e,$variant:r,$radius:l,$width:s,$height:f,"data-testid":h,...b,children:n?L.jsx(Dt,{size:W.global.padding[c]}):L.jsxs(L.Fragment,{children:[v&&L.jsx("span",{className:"icon-left",children:L.jsx(v,{size:W.global.padding[c]})}),t,d&&L.jsx("span",{className:"icon-right",children:L.jsx(d,{size:W.global.padding[c]})})]})})},fyr=U.label`
+`,t6=({children:t,size:e="md",variant:r="primary",radius:l="md",isLoading:n=!1,iconSize:c="lg",leftIcon:i,rightIcon:p,width:s,height:f,testId:h,...b})=>{const v=i&&Z8[i],d=p&&Z8[p];return L.jsx(syr,{$size:e,$variant:r,$radius:l,$width:s,$height:f,"data-testid":h,id:h,...b,children:n?L.jsx(Dt,{size:W.global.padding[c]}):L.jsxs(L.Fragment,{children:[v&&L.jsx("span",{className:"icon-left",children:L.jsx(v,{size:W.global.padding[c]})}),t,d&&L.jsx("span",{className:"icon-right",children:L.jsx(d,{size:W.global.padding[c]})})]})})},fyr=U.label`
   display: flex;
   align-items: center;
   gap: ${W.global.gap.sm};
@@ -444,7 +444,7 @@ See https://s-c.sh/2BAXzed for more info.`),window[$e]+=1);const W8={width:{none
   align-items: center;
   justify-content: center;
   color: ${C.neutral[400]};
-`;function wyr(...t){return e=>{t.forEach(r=>{typeof r=="function"?r(e):r!=null&&(r.current=e)})}}const jyr=a.forwardRef(({type:t="text",placeholder:e="",value:r,onChange:l,error:n=!1,disabled:c=!1,icon:i,label:p,supportText:s,radius:f="md",shadow:h="default",style:b,register:v,testId:d,className:Z,onBlur:A},H)=>L.jsxs(yyr,{children:[p&&L.jsx(gyr,{children:p}),L.jsxs(Eyr,{$error:n,$disabled:c,$radius:f,$shadow:h,children:[i&&L.jsx(Myr,{children:i}),L.jsx(Vyr,{"data-testid":d,...v||{},ref:wyr(H,v?v.ref:null),style:b,type:t,placeholder:e,value:r,onChange:l,onBlur:A,className:Z,disabled:c})]}),s&&L.jsx(Oyr,{$error:n,children:s})]}));var Pyr="Label",x72=g.forwardRef((t,e)=>L.jsx(B1.label,{...t,ref:e,onMouseDown:r=>{var n;r.target.closest("button, input, select, textarea")||((n=t.onMouseDown)==null||n.call(t,r),!r.defaultPrevented&&r.detail>1&&r.preventDefault())}}));x72.displayName=Pyr;var uyr=x72;const Lyr=U(uyr)`
+`;function wyr(...t){return e=>{t.forEach(r=>{typeof r=="function"?r(e):r!=null&&(r.current=e)})}}const jyr=a.forwardRef(({type:t="text",placeholder:e="",value:r,onChange:l,error:n=!1,disabled:c=!1,icon:i,label:p,supportText:s,radius:f="md",shadow:h="default",style:b,register:v,testId:d,className:Z,onBlur:A},H)=>L.jsxs(yyr,{children:[p&&L.jsx(gyr,{children:p}),L.jsxs(Eyr,{$error:n,$disabled:c,$radius:f,$shadow:h,children:[i&&L.jsx(Myr,{children:i}),L.jsx(Vyr,{"data-testid":d,id:d,...v||{},ref:wyr(H,v?v.ref:null),style:b,type:t,placeholder:e,value:r,onChange:l,onBlur:A,className:Z,disabled:c})]}),s&&L.jsx(Oyr,{$error:n,children:s})]}));var Pyr="Label",x72=g.forwardRef((t,e)=>L.jsx(B1.label,{...t,ref:e,onMouseDown:r=>{var n;r.target.closest("button, input, select, textarea")||((n=t.onMouseDown)==null||n.call(t,r),!r.defaultPrevented&&r.detail>1&&r.preventDefault())}}));x72.displayName=Pyr;var uyr=x72;const Lyr=U(uyr)`
   font-size: 0.875rem; /* Equivalente a text-sm */
   font-weight: 500; /* Equivalente a font-medium */
   line-height: 1; /* Equivalente a leading-none */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@granto-umbrella/umbrella-components",
-  "version": "2.3.18",
+  "version": "2.3.19",
   "description": "Umbrella Components for React",
   "type": "module",
   "main": "src/index.js",

package/src/components/atoms/Badge/Badge.styles.ts

@@ -17,8 +17,8 @@ const badgeVariants = {
     color: ${semanticColors.branding.text.accent.enabled};
   `,
   danger: css`
-    background: ${semanticColors.danger.surface.enabled};
-    color: ${semanticColors.danger.text.onSurface};
+    background: ${semanticColors.global.surface.danger.disabled};
+    color: ${semanticColors.global.text.feedback.strong.error};
   `,
   success: css`
     background: ${semanticColors.success.surface.feedback};

package/src/components/atoms/Button/Button.tsx

@@ -31,6 +31,7 @@ const Button: React.FC<ButtonProps> = ({
       $width={width}
       $height={height}
       data-testid={testId}
+      id={testId}
       {...props}
     >
       {isLoading ? (

package/src/components/atoms/Input/Input.tsx

@@ -57,6 +57,7 @@ const Input = forwardRef<HTMLInputElement, InputProps>(
           {icon && <Icon>{icon}</Icon>}
           <StyledInput
             data-testid={testId}
+            id={testId}
             {...(register || {})}
             ref={mergeRefs(ref, register ? register.ref : null)}
             style={style}