@metropolle/design-system 1.2026.0-1.4.1905 → 1.2026.0-1.7.1843
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 +626 -0
- package/dist/react/components/react/Button/Button.d.ts +1 -1
- package/dist/react/components/react/Button/Button.d.ts.map +1 -1
- package/dist/react/components/react/ProfileCard/ProfileCard.d.ts +55 -0
- package/dist/react/components/react/ProfileCard/ProfileCard.d.ts.map +1 -0
- package/dist/react/components/react/ProfileCard/index.d.ts +3 -0
- package/dist/react/components/react/ProfileCard/index.d.ts.map +1 -0
- package/dist/react/components/react/index.d.ts +2 -0
- package/dist/react/components/react/index.d.ts.map +1 -1
- package/dist/react/index.d.ts +2 -0
- package/dist/react/index.esm.js +120 -1
- package/dist/react/index.esm.js.map +1 -1
- package/dist/react/index.js +120 -0
- package/dist/react/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/react/ProfileCard/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,KAAK,eAAe,EAAE,MAAM,eAAe,CAAC;AACzF,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
export { GlassCard, type GlassCardProps } from './GlassCard';
|
|
2
|
+
export { ProfileCard, type ProfileCardProps, type ProfileCardUser } from './ProfileCard';
|
|
2
3
|
export { Typography, BrandLogo, type TypographyProps, type BrandLogoProps } from './Typography';
|
|
3
4
|
export { Button, type ButtonProps } from './Button';
|
|
4
5
|
export { Select, type SelectProps, type SelectOption } from './Select';
|
|
@@ -28,4 +29,5 @@ export * from './FormSection';
|
|
|
28
29
|
export * from './InfoBox';
|
|
29
30
|
export * from './FormModal';
|
|
30
31
|
export * from './DetailModal';
|
|
32
|
+
export * from './ProfileCard';
|
|
31
33
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/react/index.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7D,OAAO,EACL,UAAU,EACV,SAAS,EACT,KAAK,eAAe,EACpB,KAAK,cAAc,EACpB,MAAM,cAAc,CAAC;AACtB,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AACpD,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,KAAK,YAAY,EAAE,MAAM,UAAU,CAAC;AACvE,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACnE,OAAO,EACL,SAAS,EACT,aAAa,EACb,WAAW,EACX,cAAc,EACd,KAAK,cAAc,EACnB,KAAK,WAAW,EAChB,KAAK,WAAW,EACjB,MAAM,aAAa,CAAC;AAGrB,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7D,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,YAAY,CAAC;AAC1D,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACnE,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,YAAY,EAAE,KAAK,YAAY,EAAE,MAAM,WAAW,CAAC;AACnF,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7D,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAGnE,OAAO,EAAE,EAAE,EAAE,MAAM,gBAAgB,CAAC;AAGpC,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/react/index.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7D,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,KAAK,eAAe,EAAE,MAAM,eAAe,CAAC;AACzF,OAAO,EACL,UAAU,EACV,SAAS,EACT,KAAK,eAAe,EACpB,KAAK,cAAc,EACpB,MAAM,cAAc,CAAC;AACtB,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AACpD,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,KAAK,YAAY,EAAE,MAAM,UAAU,CAAC;AACvE,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACnE,OAAO,EACL,SAAS,EACT,aAAa,EACb,WAAW,EACX,cAAc,EACd,KAAK,cAAc,EACnB,KAAK,WAAW,EAChB,KAAK,WAAW,EACjB,MAAM,aAAa,CAAC;AAGrB,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7D,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,YAAY,CAAC;AAC1D,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACnE,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,YAAY,EAAE,KAAK,YAAY,EAAE,MAAM,WAAW,CAAC;AACnF,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7D,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAGnE,OAAO,EAAE,EAAE,EAAE,MAAM,gBAAgB,CAAC;AAGpC,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC"}
|
package/dist/react/index.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
export { GlassCard, type GlassCardProps } from './components/react/GlassCard';
|
|
2
|
+
export { ProfileCard, type ProfileCardProps, type ProfileCardUser } from './components/react/ProfileCard';
|
|
2
3
|
export { Typography, BrandLogo, type TypographyProps, type BrandLogoProps } from './components/react/Typography';
|
|
3
4
|
export { Button, type ButtonProps } from './components/react/Button';
|
|
4
5
|
export { Select, type SelectProps, type SelectOption } from './components/react/Select';
|
|
@@ -28,4 +29,5 @@ export * from './components/react/FormSection';
|
|
|
28
29
|
export * from './components/react/InfoBox';
|
|
29
30
|
export * from './components/react/FormModal';
|
|
30
31
|
export * from './components/react/DetailModal';
|
|
32
|
+
export * from './components/react/ProfileCard';
|
|
31
33
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/react/index.esm.js
CHANGED
|
@@ -1468,6 +1468,125 @@ const GlassCard = forwardRef(({ glassStyle = 'liquid', intensity = 'md', theme,
|
|
|
1468
1468
|
});
|
|
1469
1469
|
GlassCard.displayName = 'GlassCard';
|
|
1470
1470
|
|
|
1471
|
+
// Default placeholder avatar - adapts to theme with high transparency
|
|
1472
|
+
const getPlaceholderAvatar = (isDark) => {
|
|
1473
|
+
const bgColor = isDark ? 'rgba(26, 26, 46, 0.15)' : 'rgba(255, 255, 255, 0.1)';
|
|
1474
|
+
const fgColor = isDark ? 'rgba(255, 255, 255, 0.08)' : 'rgba(0, 0, 0, 0.06)';
|
|
1475
|
+
return 'data:image/svg+xml,' + encodeURIComponent(`
|
|
1476
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" fill="none">
|
|
1477
|
+
<rect width="200" height="200" fill="${bgColor}"/>
|
|
1478
|
+
<circle cx="100" cy="80" r="40" fill="${fgColor}"/>
|
|
1479
|
+
<ellipse cx="100" cy="180" rx="60" ry="50" fill="${fgColor}"/>
|
|
1480
|
+
</svg>
|
|
1481
|
+
`);
|
|
1482
|
+
};
|
|
1483
|
+
// =============================================================================
|
|
1484
|
+
// Icons
|
|
1485
|
+
// =============================================================================
|
|
1486
|
+
const Icons = {
|
|
1487
|
+
shield: (jsxRuntimeExports.jsx("svg", { viewBox: "0 0 24 24", children: jsxRuntimeExports.jsx("path", { d: "M12 1L3 5v6c0 5.55 3.84 10.74 9 12 5.16-1.26 9-6.45 9-12V5l-9-4zm-2 16l-4-4 1.41-1.41L10 14.17l6.59-6.59L18 9l-8 8z", fill: "currentColor" }) })),
|
|
1488
|
+
plus: (jsxRuntimeExports.jsx("svg", { viewBox: "0 0 24 24", children: jsxRuntimeExports.jsx("path", { d: "M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z", fill: "currentColor" }) })),
|
|
1489
|
+
instagram: jsxRuntimeExports.jsx("path", { d: "M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zM12 0C8.741 0 8.333.014 7.053.072 2.695.272.273 2.69.073 7.052.014 8.333 0 8.741 0 12c0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98C8.333 23.986 8.741 24 12 24c3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98C15.668.014 15.259 0 12 0zm0 5.838a6.162 6.162 0 100 12.324 6.162 6.162 0 000-12.324zM12 16a4 4 0 110-8 4 4 0 010 8zm6.406-11.845a1.44 1.44 0 100 2.881 1.44 1.44 0 000-2.881z" }),
|
|
1490
|
+
x: jsxRuntimeExports.jsx("path", { d: "M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" }),
|
|
1491
|
+
linkedin: jsxRuntimeExports.jsx("path", { d: "M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.062 2.062 0 01-2.063-2.065 2.064 2.064 0 112.063 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z" }),
|
|
1492
|
+
website: jsxRuntimeExports.jsx("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-1 17.93c-3.95-.49-7-3.85-7-7.93 0-.62.08-1.21.21-1.79L9 15v1c0 1.1.9 2 2 2v1.93zm6.9-2.54c-.26-.81-1-1.39-1.9-1.39h-1v-3c0-.55-.45-1-1-1H8v-2h2c.55 0 1-.45 1-1V7h2c1.1 0 2-.9 2-2v-.41c2.93 1.19 5 4.06 5 7.41 0 2.08-.8 3.97-2.1 5.39z" }),
|
|
1493
|
+
};
|
|
1494
|
+
function SocialLink({ href, title, icon }) {
|
|
1495
|
+
const iconPath = Icons[icon];
|
|
1496
|
+
if (!iconPath || typeof iconPath === 'object')
|
|
1497
|
+
return null;
|
|
1498
|
+
return (jsxRuntimeExports.jsx("a", { href: href, className: "mds-profile-card__social-link", title: title, target: "_blank", rel: "noopener noreferrer", children: jsxRuntimeExports.jsx("svg", { viewBox: "0 0 24 24", children: iconPath }) }));
|
|
1499
|
+
}
|
|
1500
|
+
function StatItem({ label, verified }) {
|
|
1501
|
+
return (jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__stat-item", children: [jsxRuntimeExports.jsx("span", { className: "mds-profile-card__stat-label", children: label }), jsxRuntimeExports.jsx("span", { className: `mds-profile-card__stat-value ${verified ? 'mds-profile-card__stat-value--verified' : ''}`, children: verified ? 'Verified' : 'Not Verified' })] }));
|
|
1502
|
+
}
|
|
1503
|
+
// =============================================================================
|
|
1504
|
+
// Main Component
|
|
1505
|
+
// =============================================================================
|
|
1506
|
+
function ProfileCard({ user, variant = 'full', photoWidth, showSocial = false, socialLinks, showRotatingInfo = false, photoSlot, className = '', onSocialClick, }) {
|
|
1507
|
+
const [showVerifiedPopup, setShowVerifiedPopup] = useState(false);
|
|
1508
|
+
const [showSocialPopup, setShowSocialPopup] = useState(false);
|
|
1509
|
+
const [currentInfoIndex, setCurrentInfoIndex] = useState(0);
|
|
1510
|
+
const [isDarkTheme, setIsDarkTheme] = useState(true);
|
|
1511
|
+
const verifiedRef = useRef(null);
|
|
1512
|
+
const socialRef = useRef(null);
|
|
1513
|
+
// Calculate photo width based on variant
|
|
1514
|
+
const computedPhotoWidth = photoWidth ?? (variant === 'full' ? 280 : 200);
|
|
1515
|
+
// Detect theme
|
|
1516
|
+
useEffect(() => {
|
|
1517
|
+
const checkTheme = () => {
|
|
1518
|
+
const theme = document.documentElement.getAttribute('data-theme');
|
|
1519
|
+
setIsDarkTheme(theme !== 'light');
|
|
1520
|
+
};
|
|
1521
|
+
checkTheme();
|
|
1522
|
+
const observer = new MutationObserver((mutations) => {
|
|
1523
|
+
mutations.forEach((mutation) => {
|
|
1524
|
+
if (mutation.attributeName === 'data-theme') {
|
|
1525
|
+
checkTheme();
|
|
1526
|
+
}
|
|
1527
|
+
});
|
|
1528
|
+
});
|
|
1529
|
+
observer.observe(document.documentElement, { attributes: true, attributeFilter: ['data-theme'] });
|
|
1530
|
+
return () => observer.disconnect();
|
|
1531
|
+
}, []);
|
|
1532
|
+
// Dynamic info texts for rotating display
|
|
1533
|
+
const infoTexts = [
|
|
1534
|
+
`Member since ${new Date(user.created_at).getFullYear()}`,
|
|
1535
|
+
...(user.verified >= 1 ? ['Email Verified'] : []),
|
|
1536
|
+
...(user.verified >= 2 ? ['Identity Verified'] : []),
|
|
1537
|
+
...(user.verified >= 3 ? ['Professional Verified'] : []),
|
|
1538
|
+
];
|
|
1539
|
+
// Rotate info text
|
|
1540
|
+
useEffect(() => {
|
|
1541
|
+
if (!showRotatingInfo)
|
|
1542
|
+
return;
|
|
1543
|
+
const interval = setInterval(() => {
|
|
1544
|
+
setCurrentInfoIndex((prev) => (prev + 1) % infoTexts.length);
|
|
1545
|
+
}, 10000);
|
|
1546
|
+
return () => clearInterval(interval);
|
|
1547
|
+
}, [infoTexts.length, showRotatingInfo]);
|
|
1548
|
+
// Close popups on click outside
|
|
1549
|
+
useEffect(() => {
|
|
1550
|
+
const handleClickOutside = (e) => {
|
|
1551
|
+
if (verifiedRef.current && !verifiedRef.current.contains(e.target)) {
|
|
1552
|
+
setShowVerifiedPopup(false);
|
|
1553
|
+
}
|
|
1554
|
+
if (socialRef.current && !socialRef.current.contains(e.target)) {
|
|
1555
|
+
setShowSocialPopup(false);
|
|
1556
|
+
}
|
|
1557
|
+
};
|
|
1558
|
+
document.addEventListener('click', handleClickOutside);
|
|
1559
|
+
return () => document.removeEventListener('click', handleClickOutside);
|
|
1560
|
+
}, []);
|
|
1561
|
+
// Get display values
|
|
1562
|
+
const displayName = user.full_name || user.username || 'User';
|
|
1563
|
+
const profession = user.profession_name || user.profession_code || '';
|
|
1564
|
+
const getLocation = () => {
|
|
1565
|
+
if (!user.city_code && !user.state_code && !user.country_code)
|
|
1566
|
+
return null;
|
|
1567
|
+
const city = user.city_name || user.city_code?.toUpperCase() || '';
|
|
1568
|
+
const state = user.state_code?.toUpperCase() || '';
|
|
1569
|
+
const country = user.country_name || user.country_code?.toUpperCase() || '';
|
|
1570
|
+
const parts = [city, state, country].filter(Boolean);
|
|
1571
|
+
return parts.join(', ');
|
|
1572
|
+
};
|
|
1573
|
+
const memberSince = new Date(user.created_at).getFullYear().toString();
|
|
1574
|
+
const photoUrl = user.photo_url_medium || user.photo_url_full || getPlaceholderAvatar(isDarkTheme);
|
|
1575
|
+
return (jsxRuntimeExports.jsxs("article", { className: `mds-profile-card ${className}`, style: { '--mds-profile-card-photo-width': `${computedPhotoWidth}px` }, children: [jsxRuntimeExports.jsx("div", { className: "mds-profile-card__grain" }), jsxRuntimeExports.jsx("div", { className: "mds-profile-card__photo", children: photoSlot ? (jsxRuntimeExports.jsx("div", { className: "mds-profile-card__photo-slot", children: photoSlot })) : (jsxRuntimeExports.jsx("img", { src: photoUrl, alt: displayName, className: "mds-profile-card__avatar" })) }), jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__content", children: [jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__identity", children: [jsxRuntimeExports.jsx("h1", { className: "mds-profile-card__name", children: displayName.toUpperCase() }), variant === 'full' && profession && (jsxRuntimeExports.jsx("p", { className: "mds-profile-card__profession", children: profession.toUpperCase() })), variant === 'compact' && (jsxRuntimeExports.jsx("p", { className: "mds-profile-card__username", children: user.username }))] }), jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__details", children: [variant === 'full' && getLocation() && (jsxRuntimeExports.jsx("p", { className: "mds-profile-card__location", children: getLocation() })), variant === 'full' && (jsxRuntimeExports.jsx("span", { className: "mds-profile-card__username-detail", children: user.username })), variant === 'compact' && user.email && (jsxRuntimeExports.jsx("p", { className: "mds-profile-card__email", children: user.email })), variant === 'compact' && (jsxRuntimeExports.jsxs("span", { className: "mds-profile-card__member", children: ["Member since ", memberSince] }))] }), variant === 'compact' && (jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__verification", children: [jsxRuntimeExports.jsxs("button", { className: "mds-profile-card__verified-badge", title: `Verification Level ${user.verified}`, onClick: (e) => {
|
|
1576
|
+
e.stopPropagation();
|
|
1577
|
+
setShowVerifiedPopup(!showVerifiedPopup);
|
|
1578
|
+
}, children: [Icons.shield, jsxRuntimeExports.jsxs("span", { children: ["Level ", user.verified] })] }), jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__dots", children: [jsxRuntimeExports.jsx("span", { className: `mds-profile-card__dot ${user.verified >= 1 ? 'active' : ''}`, title: "Email Verified" }), jsxRuntimeExports.jsx("span", { className: `mds-profile-card__dot ${user.verified >= 2 ? 'active' : ''}`, title: "Identity Verified" }), jsxRuntimeExports.jsx("span", { className: `mds-profile-card__dot ${user.verified >= 3 ? 'active' : ''}`, title: "Professional Verified" })] })] })), showSocial && (jsxRuntimeExports.jsxs("div", { ref: socialRef, className: "mds-profile-card__social", children: [jsxRuntimeExports.jsx("button", { className: "mds-profile-card__social-trigger", onClick: (e) => {
|
|
1579
|
+
e.stopPropagation();
|
|
1580
|
+
setShowSocialPopup(!showSocialPopup);
|
|
1581
|
+
setShowVerifiedPopup(false);
|
|
1582
|
+
onSocialClick?.();
|
|
1583
|
+
}, "aria-label": "Show social links", children: Icons.plus }), showSocialPopup && socialLinks && (jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__social-popup", children: [socialLinks.instagram && jsxRuntimeExports.jsx(SocialLink, { href: socialLinks.instagram, title: "Instagram", icon: "instagram" }), socialLinks.x && jsxRuntimeExports.jsx(SocialLink, { href: socialLinks.x, title: "X", icon: "x" }), socialLinks.linkedin && jsxRuntimeExports.jsx(SocialLink, { href: socialLinks.linkedin, title: "LinkedIn", icon: "linkedin" }), socialLinks.website && jsxRuntimeExports.jsx(SocialLink, { href: socialLinks.website, title: "Website", icon: "website" })] }))] })), variant === 'full' && (jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__dynamic-group", children: [showRotatingInfo && (jsxRuntimeExports.jsx("span", { className: "mds-profile-card__dynamic-info", children: infoTexts[currentInfoIndex] })), jsxRuntimeExports.jsxs("div", { ref: verifiedRef, className: "mds-profile-card__verified-section", children: [jsxRuntimeExports.jsx("button", { className: "mds-profile-card__verified-trigger", onClick: (e) => {
|
|
1584
|
+
e.stopPropagation();
|
|
1585
|
+
setShowVerifiedPopup(!showVerifiedPopup);
|
|
1586
|
+
setShowSocialPopup(false);
|
|
1587
|
+
}, title: "Verification Status", children: Icons.shield }), showVerifiedPopup && (jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__verified-popup", children: [jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__verified-header", children: ["Verification Level ", user.verified] }), jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__verified-stats", children: [jsxRuntimeExports.jsx(StatItem, { label: "Email", verified: user.verified >= 1 }), jsxRuntimeExports.jsx(StatItem, { label: "Identity", verified: user.verified >= 2 }), jsxRuntimeExports.jsx(StatItem, { label: "Professional", verified: user.verified >= 3 })] }), jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__verified-date", children: ["Since ", memberSince] })] }))] }), showRotatingInfo && (jsxRuntimeExports.jsx("div", { className: "mds-profile-card__info-dots", children: infoTexts.map((_, index) => (jsxRuntimeExports.jsx("span", { className: `mds-profile-card__info-dot ${index === currentInfoIndex ? 'active' : ''}` }, index))) }))] }))] })] }));
|
|
1588
|
+
}
|
|
1589
|
+
|
|
1471
1590
|
const variantElementMap = {
|
|
1472
1591
|
h1: 'h1',
|
|
1473
1592
|
h2: 'h2',
|
|
@@ -2941,5 +3060,5 @@ function ConfirmDialog({ open, onClose, title, description, confirmText = 'Confi
|
|
|
2941
3060
|
return (jsxRuntimeExports.jsx(Modal, { open: open, onClose: onClose, closeOnOverlay: !disableOverlayClose, children: jsxRuntimeExports.jsxs("div", { className: "mds-modal-card", style: { maxWidth: 480, width: '100%' }, children: [jsxRuntimeExports.jsx(ModalHeader, { title: title, icon: icon ?? toneIcon[tone], onClose: onClose, align: "center" }), description && (jsxRuntimeExports.jsx("div", { style: { padding: '0 24px 16px 24px' }, children: description })), jsxRuntimeExports.jsxs("div", { style: { display: 'flex', gap: 12, justifyContent: 'flex-end', borderTop: '1px solid var(--border-color)', padding: '16px 24px', marginTop: 8 }, children: [jsxRuntimeExports.jsx("button", { type: "button", onClick: onClose, className: "mds-button mds-button--secondary", children: cancelText }), jsxRuntimeExports.jsx("button", { type: "button", onClick: onConfirm, disabled: loading, className: "mds-button mds-button--primary", children: loading ? 'Processando...' : confirmText })] })] }) }));
|
|
2942
3061
|
}
|
|
2943
3062
|
|
|
2944
|
-
export { ActionIcons, BrandLogo, Button, CellRenderers, ConfirmDialog, DataTable, DetailModal, FormField, FormGrid, FormModal, FormSection, GlassCard, InfoBox, InfoRow, Modal, ModalBody, ModalFooter, ModalHeader, Select, TableHeader, TableRow, ThemeToggle, Typography, auditLogTableConfig, citiesTableConfig, cn, countriesTableConfig, getTableConfig, parametersTableConfig, regionsTableConfig, statesTableConfig };
|
|
3063
|
+
export { ActionIcons, BrandLogo, Button, CellRenderers, ConfirmDialog, DataTable, DetailModal, FormField, FormGrid, FormModal, FormSection, GlassCard, InfoBox, InfoRow, Modal, ModalBody, ModalFooter, ModalHeader, ProfileCard, Select, TableHeader, TableRow, ThemeToggle, Typography, auditLogTableConfig, citiesTableConfig, cn, countriesTableConfig, getTableConfig, parametersTableConfig, regionsTableConfig, statesTableConfig };
|
|
2945
3064
|
//# sourceMappingURL=index.esm.js.map
|