@gluwa/connect-kit 0.2.0-next.8 → 0.2.1-next.1

package/CHANGELOG.md

@@ -1,5 +1,42 @@
 # @gluwa/wallet-kit
 
+## 0.2.1-next.1
+
+### Patch Changes
+
+- 998578b: update version
+- Updated dependencies [998578b]
+  - @gluwa/credit-connect-hub-node-ws@0.1.1-next.1
+  - @gluwa/credit-connect-sdk@0.2.1-next.7
+  - @gluwa/credit-connect-e2ee-tweetnacl@0.2.1-next.7
+  - @gluwa/credit-connect-storage-local@0.2.1-next.7
+
+## 0.2.0-next.11
+
+### Patch Changes
+
+- Updated dependencies [4cba4bb]
+  - @gluwa/credit-connect-sdk@0.2.0-next.6
+  - @gluwa/credit-connect-e2ee-tweetnacl@0.2.0-next.6
+  - @gluwa/credit-connect-hub-node-ws@0.1.0-next.6
+  - @gluwa/credit-connect-storage-local@0.2.0-next.6
+
+## 0.2.0-next.10
+
+### Patch Changes
+
+- Updated dependencies [0b7cf10]
+  - @gluwa/credit-connect-sdk@0.2.0-next.5
+  - @gluwa/credit-connect-e2ee-tweetnacl@0.2.0-next.5
+  - @gluwa/credit-connect-hub-node-ws@0.1.0-next.5
+  - @gluwa/credit-connect-storage-local@0.2.0-next.5
+
+## 0.2.0-next.9
+
+### Patch Changes
+
+- 18e631a: fix bugs
+
 ## 0.2.0-next.8
 
 ### Patch Changes

package/dist/{chunk-VE5LB7BN.js → chunk-CJANPJHY.js}

@@ -53,7 +53,7 @@ var creditConnectConnector = /* @__PURE__ */ __name((options) => {
       });
       if (state.status === "CONNECTING" && state.connectingPayload) {
         console.log("[CC connector] emit display_uri", {
-          payloadPrefix: state.connectingPayload.slice(0, 80)
+          ready: true
         });
         (_a = options.onDisplayUri) == null ? void 0 : _a.call(options, state.connectingPayload);
         emitWagmiMessage == null ? void 0 : emitWagmiMessage("display_uri", state.connectingPayload);
@@ -66,7 +66,9 @@ var creditConnectConnector = /* @__PURE__ */ __name((options) => {
       }
     });
     manager.on("sessionExpired", (payload) => {
-      console.log("[CC connector] session expired \u2192 emit session_expired", payload);
+      console.log("[CC connector] session expired \u2192 emit session_expired", {
+        reason: payload.reason
+      });
       emitWagmiMessage == null ? void 0 : emitWagmiMessage("session_expired", payload);
     });
     return manager;

package/dist/credit-connect.js

@@ -1,7 +1,7 @@
 import React from "react";
 import {
   creditConnectConnector
-} from "./chunk-VE5LB7BN.js";
+} from "./chunk-CJANPJHY.js";
 export {
   creditConnectConnector
 };

package/dist/index.css

@@ -564,8 +564,9 @@
     width: 100%;
     max-width: none;
     grid-template-columns: 1fr;
+    grid-template-rows: minmax(0, 1fr);
     max-height: 82dvh;
-    height: 100%;
+    height: auto;
     border-radius: 12px 12px 0 0;
   }
   .ck-root .ck-dialog[data-step=selector] .ck-detail {
@@ -575,46 +576,6 @@
     display: none !important;
   }
 }
-.ck-root .ck-dialog-snackbar {
-  position: fixed;
-  top: clamp(20px, 9.2vh, 99px);
-  left: 50%;
-  z-index: 1001;
-  width: min(100vw - 40px, 400px);
-  transform: translateX(-50%);
-  animation: ck-dialog-snackbar-in 0.2s ease;
-}
-@media (max-width: 767px) {
-  .ck-root .ck-dialog-snackbar {
-    top: clamp(env(safe-area-inset-top, 0px) + 20px, env(safe-area-inset-top, 0px) + 20px, env(safe-area-inset-top, 0px) + 20px);
-    left: 20px;
-    right: 20px;
-    width: auto;
-    transform: none;
-  }
-}
-@keyframes ck-dialog-snackbar-in {
-  from {
-    opacity: 0;
-    transform: translateX(-50%) translateY(8px);
-  }
-  to {
-    opacity: 1;
-    transform: translateX(-50%) translateY(0);
-  }
-}
-@media (max-width: 767px) {
-  @keyframes ck-dialog-snackbar-in {
-    from {
-      opacity: 0;
-      transform: translateY(8px);
-    }
-    to {
-      opacity: 1;
-      transform: translateY(0);
-    }
-  }
-}
 
 /* src/layout/selectorPanel/style.scss */
 .ck-selector {
@@ -877,6 +838,7 @@
 .ck-detail {
   display: flex;
   flex-direction: column;
+  min-width: 0;
   background: var(--semantic-paper-dialog);
   min-height: 0;
   position: relative;
@@ -884,11 +846,12 @@
 .ck-detail-header {
   display: flex;
   align-items: center;
+  position: relative;
+  z-index: 1;
   gap: 10px;
   height: 60px;
   padding: 0 20px;
   flex-shrink: 0;
-  background: var(--semantic-paper-sheet);
 }
 .ck-btn-back {
   display: flex;
@@ -959,38 +922,31 @@
 .ck-detail-body::-webkit-scrollbar-thumb:hover {
   background-color: var(--scale-gray-400);
 }
+.ck-detail-body:has(.ck-all-wallets) {
+  padding-bottom: 0;
+}
 
 /* src/layout/connectDialog/idle/style.scss */
-.ck-idle {
+.ck-root .ck-idle {
   display: flex;
   flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  gap: 20px;
-  height: 100%;
-  padding: 0px 40px;
-  margin-top: -30px;
-}
-.ck-idle-graphic {
-  max-width: 440px;
-  height: auto;
-  max-height: 240px;
-  flex-shrink: 0;
-  margin: 0;
+  align-items: flex-start;
+  gap: 6px;
+  position: absolute;
+  inset: 0;
+  z-index: 0;
+  padding: 60px;
+  box-sizing: border-box;
 }
-.ck-idle-graphic img {
+.ck-root .ck-idle-bg {
+  position: absolute;
+  inset: 0;
   width: 100%;
   height: 100%;
-  object-fit: contain;
-}
-.ck-idle-text {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: 6px;
-  width: 100%;
+  object-fit: cover;
+  z-index: -1;
 }
-.ck-idle-title {
+.ck-root .ck-idle-title {
   --font-name: title1-bold;
   font-family: "Inter-SB";
   font-size: 32px;
@@ -998,22 +954,22 @@
   letter-spacing: -0.03em;
 }
 @media (max-width: 767px) {
-  .ck-idle-title {
+  .ck-root .ck-idle-title {
     font-size: 28px;
   }
 }
 @media (max-width: 450px) {
-  .ck-idle-title {
+  .ck-root .ck-idle-title {
     font-size: 24px;
   }
 }
-.ck-idle-title {
+.ck-root .ck-idle-title {
   color: var(--scale-gray-900);
-  text-align: center;
-  width: 100%;
-  letter-spacing: -0.96px;
 }
-.ck-idle-desc {
+.ck-root .ck-idle-desc {
+  color: var(--scale-gray-600);
+  margin-top: 6px;
+  white-space: pre-line;
   --font-name: body4-l1-regular;
   font-family: "Inter-R";
   font-size: 15px;
@@ -1021,28 +977,24 @@
   letter-spacing: -0.01em;
 }
 @media (max-width: 767px) {
-  .ck-idle-desc {
+  .ck-root .ck-idle-desc {
     font-size: 14px;
   }
 }
 @media (max-width: 450px) {
-  .ck-idle-desc {
+  .ck-root .ck-idle-desc {
     font-size: 13px;
   }
 }
-.ck-idle-desc {
-  color: var(--scale-gray-600);
-  text-align: center;
-  width: 100%;
-}
 .ck-root .ck-idle-link {
-  display: inline-flex;
+  display: flex;
   align-items: center;
-  color: var(--scale-gray-600);
+  margin: -2px -8px -8px -8px;
+  padding: 8px;
 }
 .ck-root .ck-idle-link span {
-  --font-name: body4-l1-regular;
-  font-family: "Inter-R";
+  --font-name: body4-l1-bold;
+  font-family: "Inter-SB";
   font-size: 15px;
   line-height: 1.8;
   letter-spacing: -0.01em;
@@ -1057,8 +1009,12 @@
     font-size: 13px;
   }
 }
+.ck-root .ck-idle-link span {
+  color: inherit;
+}
 .ck-root .ck-idle-link svg {
   flex-shrink: 0;
+  color: inherit;
 }
 
 /* src/layout/connectDialog/loading/style.scss */
@@ -1114,11 +1070,11 @@
 /* src/components/qrArea/style.scss */
 .ck-qr-area {
   display: flex;
+  flex-direction: column;
   align-items: center;
-  justify-content: center;
   flex: 1;
   width: 100%;
-  padding-bottom: 32px;
+  padding: 32px 0;
 }
 .ck-qr-text {
   display: flex;
@@ -1128,6 +1084,11 @@
   width: 100%;
   margin-top: 24px;
 }
+@media (max-width: 767px) {
+  .ck-qr-text {
+    gap: 12px;
+  }
+}
 .ck-qr-label {
   --font-name: subtitle2-bold;
   font-family: "Inter-SB";
@@ -1149,6 +1110,61 @@
   color: var(--scale-gray-900);
   text-align: center;
 }
+.ck-root .ck-qr-open-app {
+  display: none;
+  align-items: center;
+  justify-content: center;
+  padding: 12px 28px;
+  border: 1px solid var(--semantic-divider-divider-4);
+  border-radius: 500px;
+  --font-name: label4-bold;
+  font-family: "Inter-SB";
+  font-size: 15px;
+  line-height: 1.5;
+  letter-spacing: -0.01em;
+}
+@media (max-width: 767px) {
+  .ck-root .ck-qr-open-app {
+    font-size: 14px;
+  }
+}
+@media (max-width: 450px) {
+  .ck-root .ck-qr-open-app {
+    font-size: 13px;
+  }
+}
+.ck-root .ck-qr-open-app {
+  color: var(--scale-gray-900);
+  cursor: pointer;
+  transition: background 0.15s ease;
+}
+@media (max-width: 767px) {
+  .ck-root .ck-qr-open-app {
+    display: inline-flex;
+  }
+}
+.ck-root .ck-qr-open-app:hover {
+  background: var(--scale-gray-100);
+}
+.ck-qr-open-app-skeleton {
+  display: none;
+  width: 116px;
+  height: 44px;
+  border-radius: 500px;
+  background:
+    linear-gradient(
+      132deg,
+      var(--scale-gray-100) 36%,
+      var(--scale-gray-200) 51%,
+      var(--scale-gray-100) 66%);
+  background-size: 200% 100%;
+  animation: ck-qr-shimmer 1.5s linear infinite;
+}
+@media (max-width: 767px) {
+  .ck-qr-open-app-skeleton {
+    display: block;
+  }
+}
 .ck-qr {
   display: flex;
   flex-direction: column;
@@ -1158,15 +1174,15 @@
   overflow: hidden;
   outline: none;
 }
-.ck-qr-loading {
-  border: 1px solid var(--semantic-divider-divider-1);
-}
-.ck-qr-timeout {
+.ck-qr-skeleton {
+  padding: 20px;
   border: 1px solid var(--semantic-divider-divider-1);
+  border-radius: 20px;
 }
-.ck-qr-skeleton {
-  width: 248px;
-  height: 248px;
+.ck-qr-skeleton-inner {
+  display: block;
+  width: 246px;
+  height: 246px;
   background:
     linear-gradient(
       132deg,
@@ -1177,11 +1193,40 @@
   animation: ck-qr-shimmer 1.5s linear infinite;
 }
 @media (max-width: 767px) {
-  .ck-qr-skeleton {
-    width: 200px;
-    height: 200px;
+  .ck-qr-skeleton-inner {
+    width: 198px;
+    height: 198px;
+  }
+}
+.ck-qr-timeout {
+  width: 288px;
+  height: 288px;
+  border: 1px solid var(--semantic-divider-divider-1);
+  background: var(--scale-gray-100);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+@media (max-width: 767px) {
+  .ck-qr-timeout {
+    width: 240px;
+    height: 240px;
   }
 }
+.ck-qr-copy-skeleton {
+  display: block;
+  width: 84px;
+  height: 20px;
+  border-radius: 4px;
+  background:
+    linear-gradient(
+      132deg,
+      var(--scale-gray-100) 36%,
+      var(--scale-gray-200) 51%,
+      var(--scale-gray-100) 66%);
+  background-size: 200% 100%;
+  animation: ck-qr-shimmer 1.5s linear infinite;
+}
 @keyframes ck-qr-shimmer {
   0% {
     background-position: 200% 0;
@@ -1207,20 +1252,6 @@
     height: 198px;
   }
 }
-.ck-qr-timeout {
-  width: 248px;
-  height: 248px;
-  background: var(--scale-gray-100);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-@media (max-width: 767px) {
-  .ck-qr-timeout {
-    width: 200px;
-    height: 200px;
-  }
-}
 .ck-qr-timeout-inner {
   display: flex;
   flex-direction: column;
@@ -1382,26 +1413,6 @@
 .ck-timeout-title {
   color: var(--scale-gray-900);
 }
-.ck-timeout-desc {
-  --font-name: body4-l1-regular;
-  font-family: "Inter-R";
-  font-size: 15px;
-  line-height: 1.8;
-  letter-spacing: -0.01em;
-}
-@media (max-width: 767px) {
-  .ck-timeout-desc {
-    font-size: 14px;
-  }
-}
-@media (max-width: 450px) {
-  .ck-timeout-desc {
-    font-size: 13px;
-  }
-}
-.ck-timeout-desc {
-  color: var(--scale-gray-600);
-}
 .ck-root .ck-timeout-retry-btn {
   display: inline-flex;
   align-items: center;
@@ -1690,15 +1701,8 @@
   gap: 8px;
   flex-shrink: 0;
 }
-@media (max-width: 392px) {
-  .ck-all-wallets-controls {
-    flex-direction: column;
-    align-items: flex-end;
-    gap: 12px;
-  }
-  .ck-all-wallets-controls .ck-search {
-    width: 100%;
-  }
+.ck-all-wallets-controls .ck-search {
+  min-width: 0;
 }
 .ck-wc-filter-btn {
   display: inline-flex;
@@ -2009,40 +2013,85 @@
   }
 }
 
-/* src/components/snackbar/style.scss */
-.ck-snackbar {
+/* src/components/toast/style.scss */
+.ck-toast-stack {
+  position: fixed;
+  top: clamp(20px, 9.2vh, 99px);
+  left: 50%;
+  z-index: 1001;
   display: flex;
+  flex-direction: column;
   align-items: center;
+  gap: 8px;
+  max-width: calc(100vw - 40px);
+  transform: translateX(-50%);
+}
+@media (max-width: 767px) {
+  .ck-toast-stack {
+    top: clamp(env(safe-area-inset-top, 0px) + 20px, env(safe-area-inset-top, 0px) + 20px, env(safe-area-inset-top, 0px) + 20px);
+    left: 20px;
+    right: 20px;
+    align-items: stretch;
+    max-width: none;
+    transform: none;
+  }
+}
+.ck-toast {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
   gap: 16px;
+  width: max-content;
+  min-width: min(400px, 100vw - 40px);
+  max-width: 100%;
   padding: 12px 16px;
   border-radius: 8px;
   background: var(--semantic-paper-sheet);
   border: 1px solid var(--semantic-divider-divider-1);
-  width: 100%;
-  max-width: 400px;
+  animation: ck-toast-in 0.2s ease;
 }
 @media (max-width: 767px) {
-  .ck-snackbar {
-    max-width: none;
+  .ck-toast {
+    width: 100%;
+    min-width: 0;
+  }
+}
+@keyframes ck-toast-in {
+  from {
+    opacity: 0;
+    transform: translateY(8px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
   }
 }
-.ck-snackbar-content {
+.ck-toast-content {
   display: flex;
   align-items: center;
   gap: 8px;
-  flex: 1;
-  min-width: 0;
 }
-.ck-snackbar-check {
+@media (max-width: 767px) {
+  .ck-toast-content {
+    flex: 1;
+    min-width: 0;
+  }
+}
+.ck-toast-icon {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 24px;
   height: 24px;
   flex-shrink: 0;
+}
+.ck-toast-icon--success {
   color: var(--semantic-information-success);
 }
-.ck-snackbar-message {
+.ck-toast-icon--warning {
+  color: var(--semantic-information-caution);
+}
+.ck-toast-message {
   --font-name: body3-l1-medium;
   font-family: "Inter-M";
   font-size: 16px;
@@ -2050,21 +2099,27 @@
   letter-spacing: -0.01em;
 }
 @media (max-width: 767px) {
-  .ck-snackbar-message {
+  .ck-toast-message {
     font-size: 15px;
   }
 }
 @media (max-width: 450px) {
-  .ck-snackbar-message {
+  .ck-toast-message {
     font-size: 14px;
   }
 }
-.ck-snackbar-message {
+.ck-toast-message {
   color: var(--scale-gray-900);
-  flex: 1;
-  min-width: 0;
+  white-space: nowrap;
+}
+@media (max-width: 767px) {
+  .ck-toast-message {
+    flex: 1;
+    min-width: 0;
+    white-space: normal;
+  }
 }
-.ck-root .ck-snackbar-close {
+.ck-root .ck-toast-close {
   display: flex;
   align-items: center;
   justify-content: center;

package/dist/index.d.ts

@@ -37,6 +37,7 @@ interface WCWallet {
 }
 type WCSubView = 'qr' | 'list' | 'wallet';
 type ConnectKitTheme = 'light' | 'dark';
+type ConnectBannerSiteKey = 'penguin-swap' | 'penguin-bridge' | 'penguin-base' | 'penguin-wallet';
 interface ConnectResult {
     address: `0x${string}`;
     connectorId: ConnectorId;
@@ -63,6 +64,8 @@ interface ConnectModalProps {
 
 interface ConnectKitProviderProps {
     children: ReactNode;
+    siteKey: ConnectBannerSiteKey;
+    connectBannerUrl: string;
     kitConfig?: ConnectKitConfig;
     connectors: Connectors;
     requiredChainId?: number;
@@ -111,4 +114,4 @@ declare const connectKit: {
     };
 };
 
-export { type ConnectErrorContext, type ConnectErrorReason, type ConnectKitConfig, type ConnectKitContextValue, ConnectKitProvider, type ConnectKitProviderProps, type ConnectKitTheme, type ConnectModalProps, type ConnectResult, type ConnectorId, type ConnectorKey, type Connectors, type WCSubView, type WCWallet, connectKit, initConfig, useConnectKit };
+export { type ConnectBannerSiteKey, type ConnectErrorContext, type ConnectErrorReason, type ConnectKitConfig, type ConnectKitContextValue, ConnectKitProvider, type ConnectKitProviderProps, type ConnectKitTheme, type ConnectModalProps, type ConnectResult, type ConnectorId, type ConnectorKey, type Connectors, type WCSubView, type WCWallet, connectKit, initConfig, useConnectKit };