@canton-network/core-wallet-ui-components 0.3.3 → 0.5.0

package/README.md

@@ -1,6 +1,6 @@
 # Wallet UI Components
 
-This workspace contains UI components for the Wallet Kernel, implemented with [Web Components](https://www.webcomponents.org/introduction).
+This workspace contains UI components for the Wallet Gateway, implemented with [Web Components](https://www.webcomponents.org/introduction).
 
 ## Overview
 

package/dist/components/AppLayout.js

@@ -12,7 +12,7 @@ var __metadata = (this && this.__metadata) || function (k, v) {
 import { LitElement, html, css, unsafeCSS } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
 import bootstrapCss from 'bootstrap/dist/css/bootstrap.min.css?inline';
-import defaultTheme from '../../themes/default.css?inline';
+import defaultTheme from '../themes/default.css?inline';
 let AppLayout = class AppLayout extends LitElement {
     constructor() {
         super(...arguments);

package/dist/components/Configuration.js

@@ -13,7 +13,7 @@ let Configuration = class Configuration extends LitElement {
         return html `
             <div>
                 <h1>Configuration</h1>
-                <p>Wallet Kernel configuration page.</p>
+                <p>Wallet Gateway configuration page.</p>
             </div>
         `;
     }

package/dist/components/Discovery.d.ts

@@ -1,6 +1,6 @@
 import { DiscoverResult } from '@canton-network/core-types';
 /**
- * Discovery implements the view of the Wallet Kernel selection window.
+ * Discovery implements the view of the Wallet Gateway selection window.
  * It is implemented directly as a Web Component without using LitElement, so to avoid having external dependencies.
  */
 export declare class Discovery extends HTMLElement {

package/dist/components/Discovery.js

@@ -1,7 +1,7 @@
 // Copyright (c) 2025 Digital Asset (Switzerland) GmbH and/or its affiliates. All rights reserved.
 // SPDX-License-Identifier: Apache-2.0
 /**
- * Discovery implements the view of the Wallet Kernel selection window.
+ * Discovery implements the view of the Wallet Gateway selection window.
  * It is implemented directly as a Web Component without using LitElement, so to avoid having external dependencies.
  */
 export class Discovery extends HTMLElement {
@@ -101,7 +101,7 @@ export class Discovery extends HTMLElement {
     render() {
         const root = document.createElement('div');
         const header = document.createElement('h1');
-        header.innerText = 'Add Remote Wallet Kernel';
+        header.innerText = 'Add Remote Wallet Gateway';
         const input = document.createElement('input');
         input.setAttribute('autofocus', '');
         input.setAttribute('id', 'wkurl');
@@ -112,7 +112,7 @@ export class Discovery extends HTMLElement {
         button.innerText = 'Connect';
         button.addEventListener('click', () => {
             const url = input.value;
-            console.log('Connecting to Wallet Kernel...' + url);
+            console.log('Connecting to Wallet Gateway...' + url);
             this.selectKernel({ url, walletType: 'remote' });
         });
         root.appendChild(header);

package/dist/scripts/copy-css.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=copy-css.d.ts.map

package/dist/scripts/copy-css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"copy-css.d.ts","sourceRoot":"","sources":["../../src/scripts/copy-css.ts"],"names":[],"mappings":""}

package/dist/scripts/copy-css.js

@@ -0,0 +1,4 @@
+// Copyright (c) 2025 Digital Asset (Switzerland) GmbH and/or its affiliates. All rights reserved.
+// SPDX-License-Identifier: Apache-2.0
+import fs from 'fs-extra';
+fs.copySync('./themes/default.css', './dist/themes/default.css');

package/dist/themes/default.css

@@ -0,0 +1,46 @@
+:root,
+:host {
+    --splice-wk-background-color: snow;
+    --splice-wk-text-color: rgba(0, 0, 0, 0.65);
+    --splice-wk-font-family: sans-serif;
+}
+
+.hidden {
+    display: none;
+}
+.header {
+    background-color: #f8f9fa;
+    padding: 10px;
+    border-bottom: 1px solid #dee2e6;
+}
+.header h2 {
+    margin: 0;
+    font-size: 1.25rem;
+    display: flex;
+    align-items: center;
+}
+.header img {
+    margin-right: 10px;
+}
+
+.header .logo-box {
+    display: inline-block;
+    cursor: pointer;
+}
+
+.container {
+    padding: 20px;
+}
+.btn-primary,
+.btn-success {
+    background-color: #007bff;
+    border-color: #007bff;
+}
+.btn-outline-secondary {
+    border-color: #6c757d;
+    color: #6c757d;
+}
+.btn-outline-secondary:hover {
+    background-color: #6c757d;
+    color: #fff;
+}

package/dist/windows/popup.js

@@ -1,6 +1,6 @@
 // Copyright (c) 2025 Digital Asset (Switzerland) GmbH and/or its affiliates. All rights reserved.
 // SPDX-License-Identifier: Apache-2.0
-import styles from '../../themes/default.css?inline';
+import styles from '../themes/default.css?inline';
 export function popup(component, options) {
     const { title = 'Custom Popup', target = 'wallet-popup', width = 400, height = 500, screenX = 200, screenY = 200, } = options || {};
     const html = `<!DOCTYPE html>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@canton-network/core-wallet-ui-components",
-  "version": "0.3.3",
+  "version": "0.5.0",
   "type": "module",
   "description": "Reusable UI components for the Splice wallet",
   "repository": "github:hyperledger-labs/splice-wallet-kernel",
@@ -13,20 +13,24 @@
     "./themes": "./themes"
   },
   "scripts": {
-    "build": "tsc -b",
+    "copy-css": "tsx src/scripts/copy-css.ts",
+    "build": "tsc -b && yarn copy-css",
     "build:watch": "tsc -b --watch",
     "clean": "tsc -b --clean; tsc -b tsconfig.dev.json --clean; rm -rf dist; [ -d public/js ] && rm -rf public/js/* || true",
     "dev": "vite --port 8000"
   },
   "devDependencies": {
     "@types/bootstrap": "^5",
+    "@types/fs-extra": "^11",
+    "fs-extra": "^11.3.2",
+    "tsx": "^4.20.4",
     "typescript": "^5.8.3",
     "vite": "^6.3.5"
   },
   "packageManager": "yarn@4.9.4",
   "dependencies": {
-    "@canton-network/core-types": "^0.3.3",
-    "@canton-network/core-wallet-store": "^0.3.2",
+    "@canton-network/core-types": "^0.5.0",
+    "@canton-network/core-wallet-store": "^0.5.0",
     "@popperjs/core": "^2.11.8",
     "bootstrap": "^5.3.7",
     "lit": "^3.3.0"