@lumiapassport/ui-kit 1.4.15 → 1.4.16
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/iframe/index.html +1 -1
- package/dist/iframe/main.js +1 -1
- package/dist/index.cjs +34 -7
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +10 -0
- package/dist/index.d.ts +10 -0
- package/dist/index.js +34 -7
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.d.cts
CHANGED
|
@@ -80,6 +80,11 @@ interface LumiaPassportConfig {
|
|
|
80
80
|
textSecondary?: string;
|
|
81
81
|
textMuted?: string;
|
|
82
82
|
border?: string;
|
|
83
|
+
buttonBackground?: string;
|
|
84
|
+
buttonBackgroundEnd?: string;
|
|
85
|
+
buttonText?: string;
|
|
86
|
+
buttonBackgroundHover?: string;
|
|
87
|
+
buttonBackgroundHoverEnd?: string;
|
|
83
88
|
};
|
|
84
89
|
dark?: {
|
|
85
90
|
background?: string;
|
|
@@ -87,6 +92,11 @@ interface LumiaPassportConfig {
|
|
|
87
92
|
textSecondary?: string;
|
|
88
93
|
textMuted?: string;
|
|
89
94
|
border?: string;
|
|
95
|
+
buttonBackground?: string;
|
|
96
|
+
buttonBackgroundEnd?: string;
|
|
97
|
+
buttonText?: string;
|
|
98
|
+
buttonBackgroundHover?: string;
|
|
99
|
+
buttonBackgroundHoverEnd?: string;
|
|
90
100
|
};
|
|
91
101
|
};
|
|
92
102
|
branding: {
|
package/dist/index.d.ts
CHANGED
|
@@ -80,6 +80,11 @@ interface LumiaPassportConfig {
|
|
|
80
80
|
textSecondary?: string;
|
|
81
81
|
textMuted?: string;
|
|
82
82
|
border?: string;
|
|
83
|
+
buttonBackground?: string;
|
|
84
|
+
buttonBackgroundEnd?: string;
|
|
85
|
+
buttonText?: string;
|
|
86
|
+
buttonBackgroundHover?: string;
|
|
87
|
+
buttonBackgroundHoverEnd?: string;
|
|
83
88
|
};
|
|
84
89
|
dark?: {
|
|
85
90
|
background?: string;
|
|
@@ -87,6 +92,11 @@ interface LumiaPassportConfig {
|
|
|
87
92
|
textSecondary?: string;
|
|
88
93
|
textMuted?: string;
|
|
89
94
|
border?: string;
|
|
95
|
+
buttonBackground?: string;
|
|
96
|
+
buttonBackgroundEnd?: string;
|
|
97
|
+
buttonText?: string;
|
|
98
|
+
buttonBackgroundHover?: string;
|
|
99
|
+
buttonBackgroundHoverEnd?: string;
|
|
90
100
|
};
|
|
91
101
|
};
|
|
92
102
|
branding: {
|
package/dist/index.js
CHANGED
|
@@ -3095,6 +3095,31 @@ function useTheme(configTheme, customColors) {
|
|
|
3095
3095
|
} else {
|
|
3096
3096
|
root.style.removeProperty("--lumia-border");
|
|
3097
3097
|
}
|
|
3098
|
+
if (currentCustomColors?.buttonBackground) {
|
|
3099
|
+
root.style.setProperty("--lumia-button-bg", currentCustomColors.buttonBackground);
|
|
3100
|
+
} else {
|
|
3101
|
+
root.style.removeProperty("--lumia-button-bg");
|
|
3102
|
+
}
|
|
3103
|
+
if (currentCustomColors?.buttonBackgroundEnd) {
|
|
3104
|
+
root.style.setProperty("--lumia-button-bg-end", currentCustomColors.buttonBackgroundEnd);
|
|
3105
|
+
} else {
|
|
3106
|
+
root.style.removeProperty("--lumia-button-bg-end");
|
|
3107
|
+
}
|
|
3108
|
+
if (currentCustomColors?.buttonText) {
|
|
3109
|
+
root.style.setProperty("--lumia-button-text", currentCustomColors.buttonText);
|
|
3110
|
+
} else {
|
|
3111
|
+
root.style.removeProperty("--lumia-button-text");
|
|
3112
|
+
}
|
|
3113
|
+
if (currentCustomColors?.buttonBackgroundHover) {
|
|
3114
|
+
root.style.setProperty("--lumia-button-bg-hover", currentCustomColors.buttonBackgroundHover);
|
|
3115
|
+
} else {
|
|
3116
|
+
root.style.removeProperty("--lumia-button-bg-hover");
|
|
3117
|
+
}
|
|
3118
|
+
if (currentCustomColors?.buttonBackgroundHoverEnd) {
|
|
3119
|
+
root.style.setProperty("--lumia-button-bg-hover-end", currentCustomColors.buttonBackgroundHoverEnd);
|
|
3120
|
+
} else {
|
|
3121
|
+
root.style.removeProperty("--lumia-button-bg-hover-end");
|
|
3122
|
+
}
|
|
3098
3123
|
}, [currentCustomColors]);
|
|
3099
3124
|
const themeClasses = useMemo(
|
|
3100
3125
|
() => {
|
|
@@ -5786,7 +5811,7 @@ var LumiaRainbowKitProvider = ({ children }) => {
|
|
|
5786
5811
|
const rainbowConfig2 = React3.useMemo(() => {
|
|
5787
5812
|
return createRainbowConfig(config.wallet?.walletConnectProjectId);
|
|
5788
5813
|
}, [config.wallet?.walletConnectProjectId]);
|
|
5789
|
-
const customTheme = isDark ? {
|
|
5814
|
+
const customTheme = React3.useMemo(() => isDark ? {
|
|
5790
5815
|
...darkTheme(),
|
|
5791
5816
|
colors: {
|
|
5792
5817
|
...darkTheme().colors,
|
|
@@ -5802,7 +5827,7 @@ var LumiaRainbowKitProvider = ({ children }) => {
|
|
|
5802
5827
|
},
|
|
5803
5828
|
shadows: rainbowTheme.lightMode.shadows,
|
|
5804
5829
|
radii: rainbowTheme.lightMode.radii
|
|
5805
|
-
};
|
|
5830
|
+
}, [isDark]);
|
|
5806
5831
|
const isWalletEnabled = config.wallet?.enabled ?? false;
|
|
5807
5832
|
if (!isWalletEnabled) {
|
|
5808
5833
|
return /* @__PURE__ */ jsx5(Fragment, { children });
|
|
@@ -8464,7 +8489,7 @@ function useLumiaPassportLinkedProfiles() {
|
|
|
8464
8489
|
// package.json
|
|
8465
8490
|
var package_default = {
|
|
8466
8491
|
name: "@lumiapassport/ui-kit",
|
|
8467
|
-
version: "1.4.
|
|
8492
|
+
version: "1.4.16",
|
|
8468
8493
|
description: "React UI components and hooks for Lumia Passport authentication and Account Abstraction",
|
|
8469
8494
|
type: "module",
|
|
8470
8495
|
main: "./dist/index.cjs",
|
|
@@ -8905,21 +8930,23 @@ var ConnectWalletButton = ({
|
|
|
8905
8930
|
paddingRight: "3rem",
|
|
8906
8931
|
fontSize: "1.25rem",
|
|
8907
8932
|
fontWeight: "600",
|
|
8908
|
-
color: "white",
|
|
8933
|
+
color: config.ui.colors?.[isDark ? "dark" : "light"]?.buttonText || "white",
|
|
8909
8934
|
borderRadius: "1rem",
|
|
8910
|
-
background: "linear-gradient(to right, #9333ea, #2563eb)",
|
|
8935
|
+
background: config.ui.colors?.[isDark ? "dark" : "light"]?.buttonBackground && config.ui.colors?.[isDark ? "dark" : "light"]?.buttonBackgroundEnd ? `linear-gradient(to right, ${config.ui.colors[isDark ? "dark" : "light"]?.buttonBackground}, ${config.ui.colors[isDark ? "dark" : "light"]?.buttonBackgroundEnd})` : "linear-gradient(to right, #9333ea, #2563eb)",
|
|
8911
8936
|
boxShadow: "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1)",
|
|
8912
8937
|
transition: "all 0.2s",
|
|
8913
8938
|
border: "none",
|
|
8914
8939
|
cursor: "pointer"
|
|
8915
8940
|
},
|
|
8916
8941
|
onMouseEnter: (e) => {
|
|
8917
|
-
|
|
8942
|
+
const hoverBg = config.ui.colors?.[isDark ? "dark" : "light"]?.buttonBackgroundHover && config.ui.colors?.[isDark ? "dark" : "light"]?.buttonBackgroundHoverEnd ? `linear-gradient(to right, ${config.ui.colors[isDark ? "dark" : "light"]?.buttonBackgroundHover}, ${config.ui.colors[isDark ? "dark" : "light"]?.buttonBackgroundHoverEnd})` : "linear-gradient(to right, #7e22ce, #1d4ed8)";
|
|
8943
|
+
e.currentTarget.style.background = hoverBg;
|
|
8918
8944
|
e.currentTarget.style.transform = "scale(1.05)";
|
|
8919
8945
|
e.currentTarget.style.boxShadow = "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1)";
|
|
8920
8946
|
},
|
|
8921
8947
|
onMouseLeave: (e) => {
|
|
8922
|
-
|
|
8948
|
+
const normalBg = config.ui.colors?.[isDark ? "dark" : "light"]?.buttonBackground && config.ui.colors?.[isDark ? "dark" : "light"]?.buttonBackgroundEnd ? `linear-gradient(to right, ${config.ui.colors[isDark ? "dark" : "light"]?.buttonBackground}, ${config.ui.colors[isDark ? "dark" : "light"]?.buttonBackgroundEnd})` : "linear-gradient(to right, #9333ea, #2563eb)";
|
|
8949
|
+
e.currentTarget.style.background = normalBg;
|
|
8923
8950
|
e.currentTarget.style.transform = "scale(1)";
|
|
8924
8951
|
e.currentTarget.style.boxShadow = "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1)";
|
|
8925
8952
|
},
|