@metropolle/design-system 1.2026.0-1.24.1854 → 1.2026.0-1.24.2224

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.
@@ -4414,3 +4414,224 @@ html[data-theme="light"] .mds-verification-check-item--passed .mds-verification-
4414
4414
  background: rgba(0, 180, 140, 0.15);
4415
4415
  color: #00b48c;
4416
4416
  }
4417
+
4418
+ /* =============================================================================
4419
+ FEAT-090: VerificationScoreCard Component (Unified)
4420
+ Used by ProfileCard popup, @front settings, @back UserIdentityModal
4421
+ ============================================================================= */
4422
+
4423
+ /* Compact Popup Variant (ProfileCard) */
4424
+ .mds-verification-popup {
4425
+ min-width: 200px;
4426
+ }
4427
+
4428
+ .mds-verification-popup__header {
4429
+ font-size: 0.875rem;
4430
+ font-weight: 600;
4431
+ color: var(--mds-color-text-primary, #fff);
4432
+ padding-bottom: 12px;
4433
+ margin-bottom: 12px;
4434
+ border-bottom: 1px solid rgba(255, 255, 255, 0.1);
4435
+ }
4436
+
4437
+ html[data-theme="light"] .mds-verification-popup__header {
4438
+ color: var(--mds-color-text-primary, #1f2937);
4439
+ border-bottom-color: rgba(0, 0, 0, 0.1);
4440
+ }
4441
+
4442
+ .mds-verification-popup__checks {
4443
+ display: flex;
4444
+ flex-direction: column;
4445
+ gap: 8px;
4446
+ }
4447
+
4448
+ .mds-verification-popup__footer {
4449
+ display: flex;
4450
+ justify-content: space-between;
4451
+ align-items: center;
4452
+ padding-top: 12px;
4453
+ margin-top: 12px;
4454
+ border-top: 1px solid rgba(255, 255, 255, 0.1);
4455
+ font-size: 0.75rem;
4456
+ color: var(--mds-color-text-secondary, rgba(255, 255, 255, 0.6));
4457
+ }
4458
+
4459
+ html[data-theme="light"] .mds-verification-popup__footer {
4460
+ border-top-color: rgba(0, 0, 0, 0.1);
4461
+ color: var(--mds-color-text-secondary, rgba(0, 0, 0, 0.6));
4462
+ }
4463
+
4464
+ .mds-verification-popup__sequence,
4465
+ .mds-verification-popup__date {
4466
+ font-family: 'OCR-B', 'OCR B Std', 'Courier New', monospace;
4467
+ }
4468
+
4469
+ /* Compact Check Item (for popup) */
4470
+ .mds-verification-check-item--compact {
4471
+ display: flex;
4472
+ align-items: center;
4473
+ gap: 8px;
4474
+ padding: 4px 0;
4475
+ }
4476
+
4477
+ .mds-verification-check-icon {
4478
+ width: 18px;
4479
+ height: 18px;
4480
+ display: flex;
4481
+ align-items: center;
4482
+ justify-content: center;
4483
+ font-size: 12px;
4484
+ font-weight: bold;
4485
+ color: rgba(255, 255, 255, 0.3);
4486
+ }
4487
+
4488
+ .mds-verification-check-icon--passed {
4489
+ color: #00d4aa;
4490
+ }
4491
+
4492
+ html[data-theme="light"] .mds-verification-check-icon {
4493
+ color: rgba(0, 0, 0, 0.3);
4494
+ }
4495
+
4496
+ html[data-theme="light"] .mds-verification-check-icon--passed {
4497
+ color: #00b48c;
4498
+ }
4499
+
4500
+ .mds-verification-check-label {
4501
+ font-size: 0.8125rem;
4502
+ color: var(--mds-color-text-primary, #fff);
4503
+ }
4504
+
4505
+ html[data-theme="light"] .mds-verification-check-label {
4506
+ color: var(--mds-color-text-primary, #1f2937);
4507
+ }
4508
+
4509
+ /* Full Card Variant */
4510
+ .mds-verification-card {
4511
+ display: flex;
4512
+ flex-direction: column;
4513
+ gap: 20px;
4514
+ }
4515
+
4516
+ .mds-verification-card__header {
4517
+ display: flex;
4518
+ align-items: center;
4519
+ gap: 20px;
4520
+ padding: 20px;
4521
+ background: rgba(0, 212, 170, 0.05);
4522
+ border: 1px solid rgba(0, 212, 170, 0.15);
4523
+ border-radius: 12px;
4524
+ }
4525
+
4526
+ html[data-theme="light"] .mds-verification-card__header {
4527
+ background: rgba(0, 180, 140, 0.05);
4528
+ border-color: rgba(0, 180, 140, 0.15);
4529
+ }
4530
+
4531
+ .mds-verification-card__badge {
4532
+ display: flex;
4533
+ flex-direction: column;
4534
+ align-items: center;
4535
+ gap: 4px;
4536
+ padding: 16px 24px;
4537
+ background: rgba(0, 212, 170, 0.1);
4538
+ border-radius: 10px;
4539
+ }
4540
+
4541
+ html[data-theme="light"] .mds-verification-card__badge {
4542
+ background: rgba(0, 180, 140, 0.1);
4543
+ }
4544
+
4545
+ .mds-verification-card__badge-label {
4546
+ font-size: 0.75rem;
4547
+ text-transform: uppercase;
4548
+ letter-spacing: 0.1em;
4549
+ color: var(--mds-color-text-secondary, rgba(255, 255, 255, 0.6));
4550
+ }
4551
+
4552
+ .mds-verification-card__badge-score {
4553
+ font-family: 'OCR-B', 'OCR B Std', 'Courier New', monospace;
4554
+ font-size: 2.5rem;
4555
+ font-weight: bold;
4556
+ line-height: 1;
4557
+ color: #00d4aa;
4558
+ }
4559
+
4560
+ html[data-theme="light"] .mds-verification-card__badge-score {
4561
+ color: #00b48c;
4562
+ }
4563
+
4564
+ .mds-verification-card__title {
4565
+ flex: 1;
4566
+ }
4567
+
4568
+ .mds-verification-card__heading {
4569
+ margin: 0 0 4px 0;
4570
+ font-size: 1.125rem;
4571
+ font-weight: 600;
4572
+ color: var(--mds-color-text-primary, #fff);
4573
+ }
4574
+
4575
+ html[data-theme="light"] .mds-verification-card__heading {
4576
+ color: var(--mds-color-text-primary, #1f2937);
4577
+ }
4578
+
4579
+ .mds-verification-card__subtitle {
4580
+ margin: 0;
4581
+ font-size: 0.875rem;
4582
+ color: var(--mds-color-text-secondary, rgba(255, 255, 255, 0.6));
4583
+ }
4584
+
4585
+ html[data-theme="light"] .mds-verification-card__subtitle {
4586
+ color: var(--mds-color-text-secondary, rgba(0, 0, 0, 0.6));
4587
+ }
4588
+
4589
+ .mds-verification-card__error {
4590
+ padding: 12px 16px;
4591
+ background: rgba(220, 38, 38, 0.1);
4592
+ border: 1px solid rgba(220, 38, 38, 0.2);
4593
+ border-radius: 8px;
4594
+ color: #ef4444;
4595
+ font-size: 0.875rem;
4596
+ }
4597
+
4598
+ .mds-verification-card__checks {
4599
+ display: flex;
4600
+ flex-direction: column;
4601
+ gap: 10px;
4602
+ }
4603
+
4604
+ .mds-verification-check-description {
4605
+ display: block;
4606
+ font-size: 0.9375rem;
4607
+ color: var(--mds-color-text-primary, #fff);
4608
+ }
4609
+
4610
+ html[data-theme="light"] .mds-verification-check-description {
4611
+ color: var(--mds-color-text-primary, #1f2937);
4612
+ }
4613
+
4614
+ .mds-verification-check-points {
4615
+ display: block;
4616
+ font-size: 0.8125rem;
4617
+ color: var(--mds-color-text-secondary, rgba(255, 255, 255, 0.6));
4618
+ margin-top: 2px;
4619
+ }
4620
+
4621
+ html[data-theme="light"] .mds-verification-check-points {
4622
+ color: var(--mds-color-text-secondary, rgba(0, 0, 0, 0.6));
4623
+ }
4624
+
4625
+ .mds-verification-card__info {
4626
+ margin: 0;
4627
+ padding: 16px;
4628
+ background: rgba(255, 255, 255, 0.03);
4629
+ border-radius: 8px;
4630
+ font-size: 0.875rem;
4631
+ color: var(--mds-color-text-secondary, rgba(255, 255, 255, 0.6));
4632
+ }
4633
+
4634
+ html[data-theme="light"] .mds-verification-card__info {
4635
+ background: rgba(0, 0, 0, 0.02);
4636
+ color: var(--mds-color-text-secondary, rgba(0, 0, 0, 0.6));
4637
+ }
@@ -6,6 +6,7 @@
6
6
  * @package @metropolle/design-system
7
7
  */
8
8
  import React from 'react';
9
+ import { VerificationCheck } from '../VerificationScore';
9
10
  export interface ProfileCardUser {
10
11
  identity_id: string;
11
12
  full_name: string;
@@ -28,11 +29,7 @@ export interface ProfileCardUser {
28
29
  mfa_enabled?: boolean;
29
30
  verification_score?: VerificationScore;
30
31
  }
31
- export interface VerificationCheck {
32
- name: string;
33
- description: string;
34
- passed: boolean;
35
- }
32
+ export type { VerificationCheck } from '../VerificationScore';
36
33
  export interface VerificationScore {
37
34
  score: number;
38
35
  max_score: number;
@@ -1 +1 @@
1
- {"version":3,"file":"ProfileCard.d.ts","sourceRoot":"","sources":["../../../../../src/components/react/ProfileCard/ProfileCard.tsx"],"names":[],"mappings":"AAEA;;;;;;GAMG;AAEH,OAAO,KAAsC,MAAM,OAAO,CAAC;AAO3D,MAAM,WAAW,eAAe;IAE9B,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IAGjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;IAGtB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,cAAc,CAAC,EAAE,MAAM,CAAC;IAGxB,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAG/B,WAAW,CAAC,EAAE,OAAO,CAAC;IAGtB,kBAAkB,CAAC,EAAE,iBAAiB,CAAC;CACxC;AAGD,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,EAAE,OAAO,CAAC;CACjB;AAED,MAAM,WAAW,iBAAiB;IAChC,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,gBAAgB;IAC/B,2BAA2B;IAC3B,IAAI,EAAE,eAAe,CAAC;IAEtB,sEAAsE;IACtE,OAAO,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAE7B,6EAA6E;IAC7E,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,gCAAgC;IAChC,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,8BAA8B;IAC9B,WAAW,CAAC,EAAE;QACZ,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,CAAC,CAAC,EAAE,MAAM,CAAC;QACX,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,OAAO,CAAC,EAAE,MAAM,CAAC;KAClB,CAAC;IAEF,8BAA8B;IAC9B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE3B,8CAA8C;IAC9C,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE5B,2BAA2B;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,6CAA6C;IAC7C,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;CAC5B;AAyJD,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,OAAgB,EAChB,UAAU,EACV,UAAkB,EAClB,WAAW,EACX,gBAAwB,EACxB,SAAS,EACT,SAAc,EACd,aAAa,GACd,EAAE,gBAAgB,2CAwTlB;AAED,eAAe,WAAW,CAAC"}
1
+ {"version":3,"file":"ProfileCard.d.ts","sourceRoot":"","sources":["../../../../../src/components/react/ProfileCard/ProfileCard.tsx"],"names":[],"mappings":"AAEA;;;;;;GAMG;AAEH,OAAO,KAAsC,MAAM,OAAO,CAAC;AAC3D,OAAO,EAAyB,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAOhF,MAAM,WAAW,eAAe;IAE9B,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IAGjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;IAGtB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,cAAc,CAAC,EAAE,MAAM,CAAC;IAGxB,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAG/B,WAAW,CAAC,EAAE,OAAO,CAAC;IAGtB,kBAAkB,CAAC,EAAE,iBAAiB,CAAC;CACxC;AAGD,YAAY,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAE9D,MAAM,WAAW,iBAAiB;IAChC,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,gBAAgB;IAC/B,2BAA2B;IAC3B,IAAI,EAAE,eAAe,CAAC;IAEtB,sEAAsE;IACtE,OAAO,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAE7B,6EAA6E;IAC7E,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,gCAAgC;IAChC,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,8BAA8B;IAC9B,WAAW,CAAC,EAAE;QACZ,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,CAAC,CAAC,EAAE,MAAM,CAAC;QACX,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,OAAO,CAAC,EAAE,MAAM,CAAC;KAClB,CAAC;IAEF,8BAA8B;IAC9B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE3B,8CAA8C;IAC9C,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE5B,2BAA2B;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,6CAA6C;IAC7C,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;CAC5B;AAyID,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,OAAgB,EAChB,UAAU,EACV,UAAkB,EAClB,WAAW,EACX,gBAAwB,EACxB,SAAS,EACT,SAAc,EACd,aAAa,GACd,EAAE,gBAAgB,2CA2TlB;AAED,eAAe,WAAW,CAAC"}
@@ -0,0 +1,43 @@
1
+ export interface VerificationCheck {
2
+ name: string;
3
+ description: string;
4
+ passed: boolean;
5
+ }
6
+ export interface VerificationScoreData {
7
+ score: number;
8
+ max_score: number;
9
+ breakdown: Record<string, boolean>;
10
+ checks: VerificationCheck[];
11
+ }
12
+ export interface VerificationCheckAction {
13
+ label: string;
14
+ onClick: () => void;
15
+ disabled?: boolean;
16
+ }
17
+ export interface VerificationScoreCardProps {
18
+ /** Verification score data */
19
+ score: number;
20
+ /** Max possible score */
21
+ maxScore?: number;
22
+ /** List of verification checks */
23
+ checks: VerificationCheck[];
24
+ /** Loading state */
25
+ loading?: boolean;
26
+ /** Error message */
27
+ error?: string | null;
28
+ /** Variant - 'card' shows full card, 'compact' for popup use */
29
+ variant?: 'card' | 'compact';
30
+ /** Optional function to get action for a check */
31
+ getCheckAction?: (check: VerificationCheck) => VerificationCheckAction | null;
32
+ /** Show info text at bottom */
33
+ showInfoText?: boolean;
34
+ /** Additional CSS class */
35
+ className?: string;
36
+ /** User sequence number (for compact popup footer) */
37
+ registrationSequence?: number;
38
+ /** Member since year (for compact popup footer) */
39
+ memberSince?: string;
40
+ }
41
+ export declare function VerificationScoreCard({ score, maxScore, checks, loading, error, variant, getCheckAction, showInfoText, className, registrationSequence, memberSince, }: VerificationScoreCardProps): import("react/jsx-runtime").JSX.Element;
42
+ export default VerificationScoreCard;
43
+ //# sourceMappingURL=VerificationScore.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"VerificationScore.d.ts","sourceRoot":"","sources":["../../../../../src/components/react/VerificationScore/VerificationScore.tsx"],"names":[],"mappings":"AAoBA,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"}
@@ -0,0 +1,3 @@
1
+ export { VerificationScoreCard, type VerificationScoreCardProps, type VerificationScoreData, type VerificationCheck, type VerificationCheckAction, } from './VerificationScore';
2
+ export { default } from './VerificationScore';
3
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/react/VerificationScore/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,qBAAqB,EACrB,KAAK,0BAA0B,EAC/B,KAAK,qBAAqB,EAC1B,KAAK,iBAAiB,EACtB,KAAK,uBAAuB,GAC7B,MAAM,qBAAqB,CAAC;AAE7B,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC"}
@@ -11,6 +11,7 @@ export { FormSection, type FormSectionProps } from './FormSection';
11
11
  export { InfoBox, InfoRow, type InfoBoxProps, type InfoRowProps } from './InfoBox';
12
12
  export { FormModal, type FormModalProps } from './FormModal';
13
13
  export { DetailModal, type DetailModalProps } from './DetailModal';
14
+ export { VerificationScoreCard, type VerificationScoreCardProps, type VerificationScoreData, type VerificationCheck, type VerificationCheckAction, } from './VerificationScore';
14
15
  export { cn } from '../../utils/cn';
15
16
  export * from './GlassCard';
16
17
  export * from './Typography';
@@ -30,4 +31,5 @@ export * from './InfoBox';
30
31
  export * from './FormModal';
31
32
  export * from './DetailModal';
32
33
  export * from './ProfileCard';
34
+ export * from './VerificationScore';
33
35
  //# 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,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"}
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,EACL,qBAAqB,EACrB,KAAK,0BAA0B,EAC/B,KAAK,qBAAqB,EAC1B,KAAK,iBAAiB,EACtB,KAAK,uBAAuB,GAC7B,MAAM,qBAAqB,CAAC;AAG7B,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;AAC9B,cAAc,qBAAqB,CAAC"}
@@ -11,6 +11,7 @@ export { FormSection, type FormSectionProps } from './components/react/FormSecti
11
11
  export { InfoBox, InfoRow, type InfoBoxProps, type InfoRowProps } from './components/react/InfoBox';
12
12
  export { FormModal, type FormModalProps } from './components/react/FormModal';
13
13
  export { DetailModal, type DetailModalProps } from './components/react/DetailModal';
14
+ export { VerificationScoreCard, type VerificationScoreCardProps, type VerificationScoreData, type VerificationCheck, type VerificationCheckAction, } from './components/react/VerificationScore';
14
15
  export { cn } from './components/utils/cn';
15
16
  export * from './components/react/GlassCard';
16
17
  export * from './components/react/Typography';
@@ -30,4 +31,5 @@ export * from './components/react/InfoBox';
30
31
  export * from './components/react/FormModal';
31
32
  export * from './components/react/DetailModal';
32
33
  export * from './components/react/ProfileCard';
34
+ export * from './components/react/VerificationScore';
33
35
  //# sourceMappingURL=index.d.ts.map
@@ -1468,6 +1468,34 @@ const GlassCard = forwardRef(({ glassStyle = 'liquid', intensity = 'md', theme,
1468
1468
  });
1469
1469
  GlassCard.displayName = 'GlassCard';
1470
1470
 
1471
+ // =============================================================================
1472
+ // Icons
1473
+ // =============================================================================
1474
+ const Icons$1 = {
1475
+ shield: (jsxRuntimeExports.jsx("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: jsxRuntimeExports.jsx("path", { d: "M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z" }) })),
1476
+ checkCircle: (jsxRuntimeExports.jsxs("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [jsxRuntimeExports.jsx("path", { d: "M22 11.08V12a10 10 0 1 1-5.93-9.14" }), jsxRuntimeExports.jsx("polyline", { points: "22 4 12 14.01 9 11.01" })] })),
1477
+ circle: (jsxRuntimeExports.jsx("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: jsxRuntimeExports.jsx("circle", { cx: "12", cy: "12", r: "10" }) })),
1478
+ };
1479
+ function VerificationCheckItem({ check, action, variant }) {
1480
+ if (variant === 'compact') {
1481
+ // Compact version for popup - just icon + text
1482
+ 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
+ }
1484
+ // 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("button", { type: "button", className: "mds-btn mds-btn--secondary mds-btn--sm", onClick: action.onClick, disabled: action.disabled, children: action.label }))] }));
1486
+ }
1487
+ // =============================================================================
1488
+ // Main Component
1489
+ // =============================================================================
1490
+ function VerificationScoreCard({ score, maxScore = 5, checks, loading = false, error = null, variant = 'card', getCheckAction, showInfoText = true, className = '', registrationSequence, memberSince, }) {
1491
+ if (variant === 'compact') {
1492
+ // Compact popup version (used in ProfileCard)
1493
+ return (jsxRuntimeExports.jsxs("div", { className: `mds-verification-popup ${className}`, children: [jsxRuntimeExports.jsxs("div", { className: "mds-verification-popup__header", children: ["Verification Level ", loading ? '...' : score] }), jsxRuntimeExports.jsx("div", { className: "mds-verification-popup__checks", children: checks.map((check) => (jsxRuntimeExports.jsx(VerificationCheckItem, { check: check, variant: "compact" }, check.name))) }), (registrationSequence || memberSince) && (jsxRuntimeExports.jsxs("div", { className: "mds-verification-popup__footer", children: [registrationSequence && (jsxRuntimeExports.jsxs("span", { className: "mds-verification-popup__sequence", children: ["User #", registrationSequence.toLocaleString()] })), memberSince && (jsxRuntimeExports.jsxs("span", { className: "mds-verification-popup__date", children: ["since ", memberSince] }))] }))] }));
1494
+ }
1495
+ // Full card version (used in settings pages)
1496
+ return (jsxRuntimeExports.jsxs("div", { className: `mds-verification-card ${className}`, children: [jsxRuntimeExports.jsxs("div", { className: "mds-verification-card__header", children: [jsxRuntimeExports.jsxs("div", { className: "mds-verification-card__badge", children: [jsxRuntimeExports.jsx("span", { className: "mds-verification-card__badge-label", children: "Verification Level" }), jsxRuntimeExports.jsx("span", { className: "mds-verification-card__badge-score", children: loading ? '...' : score })] }), jsxRuntimeExports.jsxs("div", { className: "mds-verification-card__title", children: [jsxRuntimeExports.jsx("h4", { className: "mds-verification-card__heading", children: "Verification Score" }), jsxRuntimeExports.jsx("p", { className: "mds-verification-card__subtitle", children: "Each completed criterion adds 1 point to your verification score." })] })] }), error && (jsxRuntimeExports.jsx("div", { className: "mds-verification-card__error", children: error })), jsxRuntimeExports.jsx("div", { className: "mds-verification-card__checks", children: checks.map((check) => (jsxRuntimeExports.jsx(VerificationCheckItem, { check: check, action: getCheckAction?.(check), variant: "card" }, check.name))) }), showInfoText && (jsxRuntimeExports.jsx("p", { className: "mds-verification-card__info", children: "The Verification Score indicates your account's trustworthiness. Users with higher scores have more credibility on the platform." }))] }));
1497
+ }
1498
+
1471
1499
  // Default placeholder avatar - adapts to theme with high transparency
1472
1500
  const getPlaceholderAvatar = (isDark) => {
1473
1501
  const bgColor = isDark ? 'rgba(26, 26, 46, 0.15)' : 'rgba(255, 255, 255, 0.1)';
@@ -1508,9 +1536,6 @@ function UsernameLinks({ username, className }) {
1508
1536
  function StatItem({ label, verified }) {
1509
1537
  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' })] }));
1510
1538
  }
1511
- function VerificationCheckItem({ description, passed }) {
1512
- return (jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__check-item", children: [jsxRuntimeExports.jsx("span", { className: `mds-profile-card__check-icon ${passed ? 'mds-profile-card__check-icon--passed' : ''}`, children: passed ? '\u2713' : '\u2717' }), jsxRuntimeExports.jsx("span", { className: "mds-profile-card__check-label", children: description })] }));
1513
- }
1514
1539
  // =============================================================================
1515
1540
  // Main Component
1516
1541
  // =============================================================================
@@ -1542,14 +1567,23 @@ function ProfileCard({ user, variant = 'full', photoWidth, showSocial = false, s
1542
1567
  return () => observer.disconnect();
1543
1568
  }, []);
1544
1569
  // Dynamic info texts for rotating display
1545
- const infoTexts = [
1570
+ // FEAT-090: Use verification_score checks when available, fallback to legacy
1571
+ const infoTexts = user.verification_score ? [
1572
+ `Verification Level ${user.verification_score.score}`,
1573
+ `User #${user.registration_sequence?.toLocaleString() || '—'}`,
1574
+ `Member since ${new Date(user.created_at).getFullYear()}`,
1575
+ // Show passed verification checks
1576
+ ...user.verification_score.checks
1577
+ .filter(check => check.passed)
1578
+ .map(check => check.description),
1579
+ ] : [
1546
1580
  `Member since ${new Date(user.created_at).getFullYear()}`,
1547
1581
  ...(user.registration_sequence ? [`User #${user.registration_sequence.toLocaleString()}`] : []),
1548
1582
  ...(user.verified >= 1 ? ['Email Verified'] : []),
1549
1583
  ...(user.verified >= 2 ? ['Identity Verified'] : []),
1550
1584
  ...(user.verified >= 3 ? ['Area Verified'] : []),
1551
1585
  // PROC-013: Show MFA status when enabled (highlight security-conscious users)
1552
- ...(user.mfa_enabled === true ? ['2FA Ativado'] : []),
1586
+ ...(user.mfa_enabled === true ? ['2FA Enabled'] : []),
1553
1587
  ];
1554
1588
  // Rotate info text
1555
1589
  useEffect(() => {
@@ -1611,11 +1645,11 @@ function ProfileCard({ user, variant = 'full', photoWidth, showSocial = false, s
1611
1645
  e.stopPropagation();
1612
1646
  setShowVerifiedPopup(!showVerifiedPopup);
1613
1647
  setShowSocialPopup(false);
1614
- }, title: "Verification Status", children: Icons.shield }), showVerifiedPopup && (jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__verified-popup", children: [user.verification_score ? (
1615
- // FEAT-090: New 6-point verification score
1616
- jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__verified-header", children: ["Verificacao: ", user.verification_score.score] }), jsxRuntimeExports.jsx("div", { className: "mds-profile-card__verified-checks", children: user.verification_score.checks.map((check) => (jsxRuntimeExports.jsx(VerificationCheckItem, { description: check.description, passed: check.passed }, check.name))) })] })) : (
1617
- // Legacy: Old verification levels
1618
- jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { 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: "Area", verified: user.verified >= 3 })] })] })), jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__verified-footer", children: [user.registration_sequence && (jsxRuntimeExports.jsxs("span", { className: "mds-profile-card__verified-sequence", children: ["User #", user.registration_sequence.toLocaleString()] })), jsxRuntimeExports.jsxs("span", { 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))) }))] }))] })] }));
1648
+ }, title: "Verification Status", children: Icons.shield }), showVerifiedPopup && (jsxRuntimeExports.jsx("div", { className: "mds-profile-card__verified-popup", children: user.verification_score ? (
1649
+ // FEAT-090: Use VerificationScoreCard component
1650
+ jsxRuntimeExports.jsx(VerificationScoreCard, { score: user.verification_score.score, maxScore: user.verification_score.max_score, checks: user.verification_score.checks, variant: "compact", registrationSequence: user.registration_sequence, memberSince: memberSince })) : (
1651
+ // Legacy: Old verification levels
1652
+ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { 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: "Area", verified: user.verified >= 3 })] }), jsxRuntimeExports.jsxs("div", { className: "mds-profile-card__verified-footer", children: [user.registration_sequence && (jsxRuntimeExports.jsxs("span", { className: "mds-profile-card__verified-sequence", children: ["User #", user.registration_sequence.toLocaleString()] })), jsxRuntimeExports.jsxs("span", { 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))) }))] }))] })] }));
1619
1653
  }
1620
1654
 
1621
1655
  const variantElementMap = {
@@ -3091,5 +3125,5 @@ function ConfirmDialog({ open, onClose, title, description, confirmText = 'Confi
3091
3125
  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 })] })] }) }));
3092
3126
  }
3093
3127
 
3094
- 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 };
3128
+ 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, VerificationScoreCard, auditLogTableConfig, citiesTableConfig, cn, countriesTableConfig, getTableConfig, parametersTableConfig, regionsTableConfig, statesTableConfig };
3095
3129
  //# sourceMappingURL=index.esm.js.map