@canton-network/core-wallet-ui-components 0.29.1 → 0.31.0

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.
Files changed (74) hide show
  1. package/dist/components/app-header.d.ts +4 -2
  2. package/dist/components/app-header.d.ts.map +1 -1
  3. package/dist/components/app-header.stories.d.ts +1 -0
  4. package/dist/components/app-header.stories.d.ts.map +1 -1
  5. package/dist/components/app-layout.d.ts +3 -0
  6. package/dist/components/app-layout.d.ts.map +1 -1
  7. package/dist/components/copy-button.d.ts +15 -0
  8. package/dist/components/copy-button.d.ts.map +1 -0
  9. package/dist/components/copy-button.stories.d.ts +6 -0
  10. package/dist/components/copy-button.stories.d.ts.map +1 -0
  11. package/dist/components/custom-toast.d.ts.map +1 -1
  12. package/dist/components/custom-toast.stories.d.ts +7 -0
  13. package/dist/components/custom-toast.stories.d.ts.map +1 -0
  14. package/dist/components/error-page.d.ts +20 -0
  15. package/dist/components/error-page.d.ts.map +1 -0
  16. package/dist/components/error-page.stories.d.ts +6 -0
  17. package/dist/components/error-page.stories.d.ts.map +1 -0
  18. package/dist/components/form-input.d.ts +2 -0
  19. package/dist/components/form-input.d.ts.map +1 -1
  20. package/dist/components/idp-card.d.ts +8 -2
  21. package/dist/components/idp-card.d.ts.map +1 -1
  22. package/dist/components/idp-form.d.ts +35 -0
  23. package/dist/components/idp-form.d.ts.map +1 -0
  24. package/dist/components/loading-state.d.ts +7 -0
  25. package/dist/components/loading-state.d.ts.map +1 -0
  26. package/dist/components/loading-state.stories.d.ts +6 -0
  27. package/dist/components/loading-state.stories.d.ts.map +1 -0
  28. package/dist/components/login-form.d.ts +10 -0
  29. package/dist/components/login-form.d.ts.map +1 -1
  30. package/dist/components/network-card.d.ts +7 -1
  31. package/dist/components/network-card.d.ts.map +1 -1
  32. package/dist/components/network-form.d.ts +15 -2
  33. package/dist/components/network-form.d.ts.map +1 -1
  34. package/dist/components/network-form.stories.d.ts.map +1 -1
  35. package/dist/components/network-table.d.ts.map +1 -1
  36. package/dist/components/not-found.d.ts +1 -0
  37. package/dist/components/not-found.d.ts.map +1 -1
  38. package/dist/components/not-found.stories.d.ts +1 -0
  39. package/dist/components/not-found.stories.d.ts.map +1 -1
  40. package/dist/components/pagination.d.ts +19 -0
  41. package/dist/components/pagination.d.ts.map +1 -0
  42. package/dist/components/pagination.stories.d.ts +7 -0
  43. package/dist/components/pagination.stories.d.ts.map +1 -0
  44. package/dist/components/sessions.d.ts +0 -1
  45. package/dist/components/sessions.d.ts.map +1 -1
  46. package/dist/components/transaction-card.d.ts +5 -9
  47. package/dist/components/transaction-card.d.ts.map +1 -1
  48. package/dist/components/transaction-detail.d.ts +10 -3
  49. package/dist/components/transaction-detail.d.ts.map +1 -1
  50. package/dist/components/wallet-card.d.ts +5 -12
  51. package/dist/components/wallet-card.d.ts.map +1 -1
  52. package/dist/components/wallet-create-form.d.ts +6 -10
  53. package/dist/components/wallet-create-form.d.ts.map +1 -1
  54. package/dist/components/wallet-picker.d.ts.map +1 -1
  55. package/dist/components/wallets-sync.d.ts.map +1 -1
  56. package/dist/icons/index.d.ts +11 -0
  57. package/dist/icons/index.d.ts.map +1 -1
  58. package/dist/index.cjs +3156 -962
  59. package/dist/index.cjs.map +1 -1
  60. package/dist/index.css +1 -1
  61. package/dist/index.d.ts +6 -0
  62. package/dist/index.d.ts.map +1 -1
  63. package/dist/index.js +6433 -3679
  64. package/dist/index.js.map +1 -1
  65. package/dist/internal/activity-utils.d.ts +8 -0
  66. package/dist/internal/activity-utils.d.ts.map +1 -0
  67. package/dist/internal/base-element.d.ts.map +1 -1
  68. package/dist/routing.d.ts +1 -1
  69. package/dist/routing.d.ts.map +1 -1
  70. package/dist/styles/card.d.ts.map +1 -1
  71. package/dist/styles/modal.d.ts.map +1 -1
  72. package/dist/windows/wallet-picker.d.ts.map +1 -1
  73. package/package.json +7 -7
  74. package/themes/default.css +137 -4
@@ -0,0 +1,8 @@
1
+ import type { ParsedTransactionInfo } from '@canton-network/core-tx-visualizer';
2
+ export declare function getActivityStatusTone(status: string): 'success' | 'warning' | 'danger' | 'default';
3
+ export declare function getActivityStatusLabel(status: string): string;
4
+ export declare function getActivityStatusBadgeClass(status: string): string;
5
+ export declare function formatActivityDate(value: string | null | undefined): string;
6
+ export declare function getActivityType(parsed: ParsedTransactionInfo | null): string;
7
+ export declare function getActivityAmount(parsed: ParsedTransactionInfo | null): string;
8
+ //# sourceMappingURL=activity-utils.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"activity-utils.d.ts","sourceRoot":"","sources":["../../src/internal/activity-utils.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,oCAAoC,CAAA;AAE/E,wBAAgB,qBAAqB,CACjC,MAAM,EAAE,MAAM,GACf,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,CAc9C;AAED,wBAAgB,sBAAsB,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAE7D;AAED,wBAAgB,2BAA2B,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAWlE;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,GAAG,MAAM,CAO3E;AAED,wBAAgB,eAAe,CAAC,MAAM,EAAE,qBAAqB,GAAG,IAAI,GAAG,MAAM,CAG5E;AAED,wBAAgB,iBAAiB,CAC7B,MAAM,EAAE,qBAAqB,GAAG,IAAI,GACrC,MAAM,CAOR"}
@@ -1 +1 @@
1
- {"version":3,"file":"base-element.d.ts","sourceRoot":"","sources":["../../src/internal/base-element.ts"],"names":[],"mappings":"AAGA,OAAO,EAAO,cAAc,EAAE,UAAU,EAAa,MAAM,KAAK,CAAA;AAEhE,OAAO,sCAAsC,CAAA;AAC7C,OAAO,0BAA0B,CAAA;AAMjC;;GAEG;AACH,qBAAa,WAAY,SAAQ,UAAU;IACvC,MAAM,CAAC,MAAM,EAqBR,cAAc,CAAA;CACtB"}
1
+ {"version":3,"file":"base-element.d.ts","sourceRoot":"","sources":["../../src/internal/base-element.ts"],"names":[],"mappings":"AAGA,OAAO,EAAO,cAAc,EAAE,UAAU,EAAa,MAAM,KAAK,CAAA;AAEhE,OAAO,sCAAsC,CAAA;AAC7C,OAAO,0BAA0B,CAAA;AAMjC;;GAEG;AACH,qBAAa,WAAY,SAAQ,UAAU;IACvC,MAAM,CAAC,MAAM,EA4DR,cAAc,CAAA;CACtB"}
package/dist/routing.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- export declare const ALLOWED_ROUTES: readonly ["/login", "/wallets", "/settings", "/transactions", "/approve", "/", "/404", "/callback"];
1
+ export declare const ALLOWED_ROUTES: readonly ["/login", "/parties/add", "/parties", "/wallets", "/settings", "/networks/add", "/networks/review", "/networks", "/identity-providers/add", "/identity-providers/review", "/identity-providers", "/activities", "/approve", "/", "/404", "/callback"];
2
2
  export type AllowedRoute = (typeof ALLOWED_ROUTES)[number];
3
3
  export declare function isAllowedRoute(path: string): path is AllowedRoute;
4
4
  export declare function getCurrentRoute(pathname: string): AllowedRoute | null;
@@ -1 +1 @@
1
- {"version":3,"file":"routing.d.ts","sourceRoot":"","sources":["../src/routing.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,cAAc,qGASjB,CAAA;AAEV,MAAM,MAAM,YAAY,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAA;AAE1D,wBAAgB,cAAc,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,IAAI,YAAY,CAEjE;AA2BD,wBAAgB,eAAe,CAAC,QAAQ,EAAE,MAAM,GAAG,YAAY,GAAG,IAAI,CAcrE;AAcD,wBAAgB,SAAS,CACrB,IAAI,EAAE,MAAM,EACZ,QAAQ,SAA2B,GACpC,MAAM,CAaR;AAED,wBAAgB,SAAS,CACrB,KAAK,EAAE,YAAY,EACnB,QAAQ,SAA2B,GACpC,MAAM,CAMR"}
1
+ {"version":3,"file":"routing.d.ts","sourceRoot":"","sources":["../src/routing.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,cAAc,iQAiBjB,CAAA;AAEV,MAAM,MAAM,YAAY,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAA;AAE1D,wBAAgB,cAAc,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,IAAI,YAAY,CAEjE;AA2BD,wBAAgB,eAAe,CAAC,QAAQ,EAAE,MAAM,GAAG,YAAY,GAAG,IAAI,CAcrE;AAcD,wBAAgB,SAAS,CACrB,IAAI,EAAE,MAAM,EACZ,QAAQ,SAA2B,GACpC,MAAM,CAaR;AAED,wBAAgB,SAAS,CACrB,KAAK,EAAE,YAAY,EACnB,QAAQ,SAA2B,GACpC,MAAM,CAMR"}
@@ -1 +1 @@
1
- {"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../src/styles/card.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,UAAU,yBAqBtB,CAAA"}
1
+ {"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../src/styles/card.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,UAAU,yBA2CtB,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../src/styles/modal.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,WAAW,yBAkCvB,CAAA"}
1
+ {"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../src/styles/modal.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,WAAW,yBAoCvB,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"wallet-picker.d.ts","sourceRoot":"","sources":["../../src/windows/wallet-picker.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACR,iBAAiB,EACjB,kBAAkB,EACrB,MAAM,gCAAgC,CAAA;AAIvC;;;;;GAKG;AACH,wBAAsB,UAAU,CAC5B,OAAO,EAAE,iBAAiB,EAAE,GAC7B,OAAO,CAAC,kBAAkB,CAAC,CAqC7B"}
1
+ {"version":3,"file":"wallet-picker.d.ts","sourceRoot":"","sources":["../../src/windows/wallet-picker.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACR,iBAAiB,EACjB,kBAAkB,EACrB,MAAM,gCAAgC,CAAA;AAIvC;;;;;GAKG;AACH,wBAAsB,UAAU,CAC5B,OAAO,EAAE,iBAAiB,EAAE,GAC7B,OAAO,CAAC,kBAAkB,CAAC,CAqD7B"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@canton-network/core-wallet-ui-components",
3
- "version": "0.29.1",
3
+ "version": "0.31.0",
4
4
  "type": "module",
5
5
  "description": "Reusable UI components for the Splice wallet",
6
6
  "license": "Apache-2.0",
@@ -31,7 +31,7 @@
31
31
  "@types/bootstrap": "^5.2.10",
32
32
  "@types/fs-extra": "^11.0.4",
33
33
  "fs-extra": "^11.3.3",
34
- "storybook": "^10.2.14",
34
+ "storybook": "^10.2.16",
35
35
  "tsx": "^4.21.0",
36
36
  "typescript": "^5.9.3",
37
37
  "vite": "^7.3.1",
@@ -39,11 +39,11 @@
39
39
  },
40
40
  "packageManager": "yarn@4.9.4",
41
41
  "dependencies": {
42
- "@canton-network/core-tx-visualizer": "^0.23.2",
43
- "@canton-network/core-types": "^0.23.2",
44
- "@canton-network/core-wallet-auth": "^0.24.2",
45
- "@canton-network/core-wallet-store": "^0.28.1",
46
- "@canton-network/core-wallet-user-rpc-client": "^0.29.1",
42
+ "@canton-network/core-tx-visualizer": "^0.25.0",
43
+ "@canton-network/core-types": "^0.25.0",
44
+ "@canton-network/core-wallet-auth": "^0.26.0",
45
+ "@canton-network/core-wallet-store": "^0.30.0",
46
+ "@canton-network/core-wallet-user-rpc-client": "^0.31.0",
47
47
  "@popperjs/core": "^2.11.8",
48
48
  "bootstrap": "^5.3.8",
49
49
  "lit": "^3.3.2"
@@ -1,32 +1,165 @@
1
1
  :root,
2
2
  :host {
3
+ /* ---------------------------------------------------------------------
4
+ * Core palette (legacy + runtime wallet-picker variables)
5
+ * ------------------------------------------------------------------ */
3
6
  --wg-theme-background-color: #ffffff;
4
7
  --wg-theme-text-color: #1a1a1a;
5
- --wg-theme-font-family: sans-serif;
8
+ --wg-theme-text-secondary: #6b7280;
9
+ --wg-theme-font-family:
10
+ -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
6
11
 
7
12
  --wg-theme-border-color: #e5e7eb;
8
- --wg-theme-text-secondary: #6b7280;
9
13
  --wg-theme-surface-color: #ffffff;
10
14
  --wg-theme-surface-hover: #ede9fe;
15
+
11
16
  --wg-theme-primary-color: #000000;
12
17
  --wg-theme-primary-hover: #363636;
13
18
  --wg-theme-primary-text-color: #ffffff;
14
- --wg-theme-success-color: #22c55e;
19
+ --wg-theme-primary-rgb: 128, 222, 234;
20
+
21
+ --wg-theme-accent-color: #7c3aed;
22
+ --wg-theme-accent-rgb: 124, 58, 237;
23
+ --wg-theme-success-color: #077e3b;
24
+ --wg-theme-success-rgb: 7, 126, 59;
25
+
15
26
  --wg-theme-error-color: #ef4444;
27
+ --wg-theme-error-rgb: 239, 68, 68;
28
+
16
29
  --wg-theme-icon-bg: rgba(0, 0, 0, 0.04);
17
30
  --wg-theme-badge-bg: rgba(0, 0, 0, 0.06);
18
- --wg-theme-accent-color: #7c3aed;
19
31
 
32
+ /* ---------------------------------------------------------------------
33
+ * Typography
34
+ * ------------------------------------------------------------------ */
35
+ --wg-theme-font-size-xs: 0.75rem;
36
+ --wg-theme-font-size-sm: 0.875rem;
37
+ --wg-theme-font-size-base: 1rem;
38
+ --wg-theme-font-size-lg: 1.125rem;
39
+ --wg-theme-font-size-xl: 1.25rem;
40
+ --wg-theme-font-size-2xl: 1.5rem;
41
+
42
+ --wg-theme-font-weight-normal: 400;
43
+ --wg-theme-font-weight-medium: 500;
44
+ --wg-theme-font-weight-semibold: 600;
45
+ --wg-theme-font-weight-bold: 700;
46
+
47
+ --wg-theme-line-height-tight: 1.2;
48
+ --wg-theme-line-height-normal: 1.5;
49
+ --wg-theme-line-height-relaxed: 1.7;
50
+
51
+ /* ---------------------------------------------------------------------
52
+ * Spacing scale
53
+ * ------------------------------------------------------------------ */
54
+ --wg-theme-space-0: 0;
55
+ --wg-theme-space-1: 0.25rem;
56
+ --wg-theme-space-2: 0.5rem;
57
+ --wg-theme-space-3: 0.75rem;
58
+ --wg-theme-space-4: 1rem;
59
+ --wg-theme-space-5: 1.25rem;
60
+ --wg-theme-space-6: 1.5rem;
61
+ --wg-theme-space-8: 2rem;
62
+ --wg-theme-space-10: 2.5rem;
63
+ --wg-theme-space-12: 3rem;
64
+
65
+ /* ---------------------------------------------------------------------
66
+ * Radii
67
+ * ------------------------------------------------------------------ */
68
+ --wg-theme-radius-sm: 0.375rem;
69
+ --wg-theme-radius-md: 0.5rem;
70
+ --wg-theme-radius-lg: 0.75rem;
71
+ --wg-theme-radius-xl: 1rem;
72
+ --wg-theme-radius-full: 9999px;
73
+
74
+ /* ---------------------------------------------------------------------
75
+ * Shadows
76
+ * ------------------------------------------------------------------ */
77
+ --wg-theme-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.06);
78
+ --wg-theme-shadow-md: 0 6px 18px rgba(15, 23, 42, 0.08);
79
+ --wg-theme-shadow-lg: 0 14px 28px rgba(15, 23, 42, 0.12);
80
+ --wg-theme-shadow-inset: inset 0 1px 2px rgba(15, 23, 42, 0.08);
81
+
82
+ /* ---------------------------------------------------------------------
83
+ * Form controls
84
+ * ------------------------------------------------------------------ */
85
+ --wg-theme-label-color: var(--wg-theme-accent-color);
86
+ --wg-theme-label-required-color: #dc2626;
87
+ --wg-theme-input-bg: #f3f4f6;
88
+ --wg-theme-input-text: var(--wg-theme-text-color);
89
+ --wg-theme-input-border: #d1d5db;
90
+ --wg-theme-input-border-focus: var(--wg-theme-accent-color);
91
+ --wg-theme-input-placeholder: #9ca3af;
92
+
93
+ /* ---------------------------------------------------------------------
94
+ * Canonical --wg-* aliases (for gateway app usage)
95
+ * ------------------------------------------------------------------ */
20
96
  --wg-bg: var(--wg-theme-background-color);
21
97
  --wg-text: var(--wg-theme-text-color);
22
98
  --wg-text-secondary: var(--wg-theme-text-secondary);
23
99
  --wg-font-family: var(--wg-theme-font-family);
100
+
24
101
  --wg-border: var(--wg-theme-border-color);
25
102
  --wg-surface: var(--wg-theme-surface-color);
26
103
  --wg-surface-hover: var(--wg-theme-surface-hover);
104
+
27
105
  --wg-primary: var(--wg-theme-primary-color);
28
106
  --wg-primary-hover: var(--wg-theme-primary-hover);
107
+ --wg-primary-text: var(--wg-theme-primary-text-color);
108
+ --wg-primary-rgb: var(--wg-theme-primary-rgb);
29
109
  --wg-accent: var(--wg-theme-accent-color);
110
+ --wg-accent-rgb: var(--wg-theme-accent-rgb);
30
111
  --wg-success: var(--wg-theme-success-color);
112
+ --wg-success-rgb: var(--wg-theme-success-rgb);
113
+
31
114
  --wg-error: var(--wg-theme-error-color);
115
+ --wg-error-rgb: var(--wg-theme-error-rgb);
116
+
117
+ --wg-icon-bg: var(--wg-theme-icon-bg);
118
+ --wg-badge-bg: var(--wg-theme-badge-bg);
119
+
120
+ --wg-font-size-xs: var(--wg-theme-font-size-xs);
121
+ --wg-font-size-sm: var(--wg-theme-font-size-sm);
122
+ --wg-font-size-base: var(--wg-theme-font-size-base);
123
+ --wg-font-size-lg: var(--wg-theme-font-size-lg);
124
+ --wg-font-size-xl: var(--wg-theme-font-size-xl);
125
+ --wg-font-size-2xl: var(--wg-theme-font-size-2xl);
126
+
127
+ --wg-font-weight-normal: var(--wg-theme-font-weight-normal);
128
+ --wg-font-weight-medium: var(--wg-theme-font-weight-medium);
129
+ --wg-font-weight-semibold: var(--wg-theme-font-weight-semibold);
130
+ --wg-font-weight-bold: var(--wg-theme-font-weight-bold);
131
+
132
+ --wg-line-height-tight: var(--wg-theme-line-height-tight);
133
+ --wg-line-height-normal: var(--wg-theme-line-height-normal);
134
+ --wg-line-height-relaxed: var(--wg-theme-line-height-relaxed);
135
+
136
+ --wg-space-0: var(--wg-theme-space-0);
137
+ --wg-space-1: var(--wg-theme-space-1);
138
+ --wg-space-2: var(--wg-theme-space-2);
139
+ --wg-space-3: var(--wg-theme-space-3);
140
+ --wg-space-4: var(--wg-theme-space-4);
141
+ --wg-space-5: var(--wg-theme-space-5);
142
+ --wg-space-6: var(--wg-theme-space-6);
143
+ --wg-space-8: var(--wg-theme-space-8);
144
+ --wg-space-10: var(--wg-theme-space-10);
145
+ --wg-space-12: var(--wg-theme-space-12);
146
+
147
+ --wg-radius-sm: var(--wg-theme-radius-sm);
148
+ --wg-radius-md: var(--wg-theme-radius-md);
149
+ --wg-radius-lg: var(--wg-theme-radius-lg);
150
+ --wg-radius-xl: var(--wg-theme-radius-xl);
151
+ --wg-radius-full: var(--wg-theme-radius-full);
152
+
153
+ --wg-shadow-sm: var(--wg-theme-shadow-sm);
154
+ --wg-shadow-md: var(--wg-theme-shadow-md);
155
+ --wg-shadow-lg: var(--wg-theme-shadow-lg);
156
+ --wg-shadow-inset: var(--wg-theme-shadow-inset);
157
+
158
+ --wg-label-color: var(--wg-theme-label-color);
159
+ --wg-label-required-color: var(--wg-theme-label-required-color);
160
+ --wg-input-bg: var(--wg-theme-input-bg);
161
+ --wg-input-text: var(--wg-theme-input-text);
162
+ --wg-input-border: var(--wg-theme-input-border);
163
+ --wg-input-border-focus: var(--wg-theme-input-border-focus);
164
+ --wg-input-placeholder: var(--wg-theme-input-placeholder);
32
165
  }