@metropolle/design-system 1.0.0-beta.2026.1.25.110.a191d53 → 1.0.0-beta.2026.1.25.404.088068c
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/css/components.css +2 -6
- package/dist/react/components/react/VerificationScore/VerificationScore.d.ts.map +1 -1
- package/dist/react/index.esm.js +21 -21
- package/dist/react/index.esm.js.map +1 -1
- package/dist/react/index.js +21 -21
- package/dist/react/index.js.map +1 -1
- package/package.json +1 -1
package/dist/css/components.css
CHANGED
|
@@ -4407,16 +4407,12 @@ html[data-theme="light"] .mds-verification-check-card--passed .mds-verification-
|
|
|
4407
4407
|
min-width: 0;
|
|
4408
4408
|
}
|
|
4409
4409
|
|
|
4410
|
-
|
|
4410
|
+
/* Verification action buttons - uses Button component */
|
|
4411
|
+
.mds-verification-check-item .mds-button {
|
|
4411
4412
|
flex-shrink: 0;
|
|
4412
4413
|
margin-left: auto;
|
|
4413
4414
|
}
|
|
4414
4415
|
|
|
4415
|
-
.mds-verification-check-item .mds-btn--sm {
|
|
4416
|
-
padding: 6px 12px;
|
|
4417
|
-
font-size: 0.75rem;
|
|
4418
|
-
}
|
|
4419
|
-
|
|
4420
4416
|
html[data-theme="light"] .mds-verification-score-header {
|
|
4421
4417
|
background: rgba(0, 180, 140, 0.05);
|
|
4422
4418
|
border-color: rgba(0, 180, 140, 0.15);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VerificationScore.d.ts","sourceRoot":"","sources":["../../../../../src/components/react/VerificationScore/VerificationScore.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"VerificationScore.d.ts","sourceRoot":"","sources":["../../../../../src/components/react/VerificationScore/VerificationScore.tsx"],"names":[],"mappings":"AAqBA,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,EAAE,OAAO,CAAC;CACjB;AAED,MAAM,WAAW,qBAAqB;IACpC,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACnC,MAAM,EAAE,iBAAiB,EAAE,CAAC;CAC7B;AAED,MAAM,WAAW,uBAAuB;IACtC,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,0BAA0B;IACzC,8BAA8B;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,yBAAyB;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,kCAAkC;IAClC,MAAM,EAAE,iBAAiB,EAAE,CAAC;IAC5B,oBAAoB;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,oBAAoB;IACpB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,gEAAgE;IAChE,OAAO,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC7B,kDAAkD;IAClD,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,uBAAuB,GAAG,IAAI,CAAC;IAC9E,+BAA+B;IAC/B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,2BAA2B;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sDAAsD;IACtD,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,mDAAmD;IACnD,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AA8ED,wBAAgB,qBAAqB,CAAC,EACpC,KAAK,EACL,QAAY,EACZ,MAAM,EACN,OAAe,EACf,KAAY,EACZ,OAAgB,EAChB,cAAc,EACd,YAAmB,EACnB,SAAc,EACd,oBAAoB,EACpB,WAAW,GACZ,EAAE,0BAA0B,2CAkF5B;AAED,eAAe,qBAAqB,CAAC"}
|
package/dist/react/index.esm.js
CHANGED
|
@@ -1468,6 +1468,26 @@ const GlassCard = forwardRef(({ glassStyle = 'liquid', intensity = 'md', theme,
|
|
|
1468
1468
|
});
|
|
1469
1469
|
GlassCard.displayName = 'GlassCard';
|
|
1470
1470
|
|
|
1471
|
+
/**
|
|
1472
|
+
* Button Component
|
|
1473
|
+
*
|
|
1474
|
+
* Componente de botão com variantes baseadas no design system Metropolle.
|
|
1475
|
+
* Inclui suporte a glass morphism e estados de loading.
|
|
1476
|
+
*/
|
|
1477
|
+
const Button = forwardRef(({ variant = 'primary', size = 'md', loading = false, leftIcon, rightIcon, fullWidth = false, className, children, disabled, ...props }, ref) => {
|
|
1478
|
+
const isDisabled = disabled || loading;
|
|
1479
|
+
return (jsxRuntimeExports.jsxs("button", { ref: ref, className: cn(
|
|
1480
|
+
// Base classes
|
|
1481
|
+
'mds-button', `mds-button--${variant}`, `mds-button--${size}`,
|
|
1482
|
+
// State classes
|
|
1483
|
+
fullWidth && 'mds-button--full-width', loading && 'mds-button--loading', isDisabled && 'mds-button--disabled', className), disabled: isDisabled, ...props, children: [leftIcon && !loading && (jsxRuntimeExports.jsx("span", { className: "mds-button__icon mds-button__icon--left", children: leftIcon })), loading && (jsxRuntimeExports.jsx("span", { className: "mds-button__icon mds-button__icon--left", children: jsxRuntimeExports.jsx(LoadingSpinner, {}) })), jsxRuntimeExports.jsx("span", { className: "mds-button__content", children: children }), rightIcon && !loading && (jsxRuntimeExports.jsx("span", { className: "mds-button__icon mds-button__icon--right", children: rightIcon }))] }));
|
|
1484
|
+
});
|
|
1485
|
+
Button.displayName = 'Button';
|
|
1486
|
+
/**
|
|
1487
|
+
* Loading Spinner Component
|
|
1488
|
+
*/
|
|
1489
|
+
const LoadingSpinner = () => (jsxRuntimeExports.jsxs("svg", { className: "mds-spinner", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", children: [jsxRuntimeExports.jsx("circle", { className: "mds-spinner__track", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "2", fill: "none", opacity: "0.25" }), jsxRuntimeExports.jsx("circle", { className: "mds-spinner__path", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "2", fill: "none", strokeDasharray: "40 20", strokeLinecap: "round" })] }));
|
|
1490
|
+
|
|
1471
1491
|
// =============================================================================
|
|
1472
1492
|
// Icons
|
|
1473
1493
|
// =============================================================================
|
|
@@ -1482,7 +1502,7 @@ function VerificationCheckItem({ check, action, variant }) {
|
|
|
1482
1502
|
return (jsxRuntimeExports.jsxs("div", { className: "mds-verification-check-item mds-verification-check-item--compact", children: [jsxRuntimeExports.jsx("span", { className: `mds-verification-check-icon ${check.passed ? 'mds-verification-check-icon--passed' : ''}`, children: check.passed ? '\u2713' : '\u2717' }), jsxRuntimeExports.jsx("span", { className: "mds-verification-check-label", children: check.description })] }));
|
|
1483
1503
|
}
|
|
1484
1504
|
// Card version - with points and optional action
|
|
1485
|
-
return (jsxRuntimeExports.jsxs("div", { className: `mds-verification-check-item ${check.passed ? 'mds-verification-check-item--passed' : ''}`, children: [jsxRuntimeExports.jsx("div", { className: "mds-verification-check-status", children: check.passed ? Icons$1.checkCircle : Icons$1.circle }), jsxRuntimeExports.jsxs("div", { className: "mds-verification-check-content", children: [jsxRuntimeExports.jsx("span", { className: "mds-verification-check-description", children: check.description }), jsxRuntimeExports.jsx("span", { className: "mds-verification-check-points", children: check.passed ? '1 point' : '0 points' })] }), action && !check.passed && (jsxRuntimeExports.jsx(
|
|
1505
|
+
return (jsxRuntimeExports.jsxs("div", { className: `mds-verification-check-item ${check.passed ? 'mds-verification-check-item--passed' : ''}`, children: [jsxRuntimeExports.jsx("div", { className: "mds-verification-check-status", children: check.passed ? Icons$1.checkCircle : Icons$1.circle }), jsxRuntimeExports.jsxs("div", { className: "mds-verification-check-content", children: [jsxRuntimeExports.jsx("span", { className: "mds-verification-check-description", children: check.description }), jsxRuntimeExports.jsx("span", { className: "mds-verification-check-points", children: check.passed ? '1 point' : '0 points' })] }), action && !check.passed && (jsxRuntimeExports.jsx(Button, { variant: "primary", size: "sm", onClick: action.onClick, disabled: action.disabled, children: action.label }))] }));
|
|
1486
1506
|
}
|
|
1487
1507
|
// =============================================================================
|
|
1488
1508
|
// Main Component
|
|
@@ -1693,26 +1713,6 @@ className, children = 'Metropolle', ...props }, ref) => {
|
|
|
1693
1713
|
});
|
|
1694
1714
|
BrandLogo.displayName = 'BrandLogo';
|
|
1695
1715
|
|
|
1696
|
-
/**
|
|
1697
|
-
* Button Component
|
|
1698
|
-
*
|
|
1699
|
-
* Componente de botão com variantes baseadas no design system Metropolle.
|
|
1700
|
-
* Inclui suporte a glass morphism e estados de loading.
|
|
1701
|
-
*/
|
|
1702
|
-
const Button = forwardRef(({ variant = 'primary', size = 'md', loading = false, leftIcon, rightIcon, fullWidth = false, className, children, disabled, ...props }, ref) => {
|
|
1703
|
-
const isDisabled = disabled || loading;
|
|
1704
|
-
return (jsxRuntimeExports.jsxs("button", { ref: ref, className: cn(
|
|
1705
|
-
// Base classes
|
|
1706
|
-
'mds-button', `mds-button--${variant}`, `mds-button--${size}`,
|
|
1707
|
-
// State classes
|
|
1708
|
-
fullWidth && 'mds-button--full-width', loading && 'mds-button--loading', isDisabled && 'mds-button--disabled', className), disabled: isDisabled, ...props, children: [leftIcon && !loading && (jsxRuntimeExports.jsx("span", { className: "mds-button__icon mds-button__icon--left", children: leftIcon })), loading && (jsxRuntimeExports.jsx("span", { className: "mds-button__icon mds-button__icon--left", children: jsxRuntimeExports.jsx(LoadingSpinner, {}) })), jsxRuntimeExports.jsx("span", { className: "mds-button__content", children: children }), rightIcon && !loading && (jsxRuntimeExports.jsx("span", { className: "mds-button__icon mds-button__icon--right", children: rightIcon }))] }));
|
|
1709
|
-
});
|
|
1710
|
-
Button.displayName = 'Button';
|
|
1711
|
-
/**
|
|
1712
|
-
* Loading Spinner Component
|
|
1713
|
-
*/
|
|
1714
|
-
const LoadingSpinner = () => (jsxRuntimeExports.jsxs("svg", { className: "mds-spinner", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", children: [jsxRuntimeExports.jsx("circle", { className: "mds-spinner__track", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "2", fill: "none", opacity: "0.25" }), jsxRuntimeExports.jsx("circle", { className: "mds-spinner__path", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "2", fill: "none", strokeDasharray: "40 20", strokeLinecap: "round" })] }));
|
|
1715
|
-
|
|
1716
1716
|
/**
|
|
1717
1717
|
* Select Component (Design System)
|
|
1718
1718
|
*
|