@aurum-sdk/core 0.1.2 → 0.1.3
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/README.md +1 -1
- package/dist/{chunk-EQEZQPHH.mjs → chunk-3TZNNET3.mjs} +31 -15
- package/dist/chunk-3TZNNET3.mjs.map +1 -0
- package/dist/{chunk-LTGSWCPM.js → chunk-F4RYBD6L.js} +31 -15
- package/dist/chunk-F4RYBD6L.js.map +1 -0
- package/dist/index.css +11 -2
- package/dist/index.css.map +1 -1
- package/dist/index.d.mts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +60 -60
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +3 -3
- package/dist/index.mjs.map +1 -1
- package/dist/widgets.css +11 -2
- package/dist/widgets.css.map +1 -1
- package/dist/widgets.js +13 -13
- package/dist/widgets.mjs +1 -1
- package/package.json +3 -3
- package/dist/chunk-EQEZQPHH.mjs.map +0 -1
- package/dist/chunk-LTGSWCPM.js.map +0 -1
|
@@ -756,20 +756,26 @@ function initSentry(enabled = true) {
|
|
|
756
756
|
Sentry.init({
|
|
757
757
|
dsn: "https://0bb16fd7057ac7b45ae0ab416cdbea8b@o4505953815494656.ingest.us.sentry.io/4509747448184832",
|
|
758
758
|
environment: getEnvironment(),
|
|
759
|
-
release: `@aurum-sdk/core@${"0.1.
|
|
759
|
+
release: `@aurum-sdk/core@${"0.1.3"}`,
|
|
760
760
|
sendDefaultPii: false,
|
|
761
761
|
enableLogs: true
|
|
762
762
|
});
|
|
763
763
|
}
|
|
764
|
+
function getUrl() {
|
|
765
|
+
if (typeof window !== "undefined") {
|
|
766
|
+
return window.location.href;
|
|
767
|
+
}
|
|
768
|
+
return void 0;
|
|
769
|
+
}
|
|
764
770
|
var sentryLogger = {
|
|
765
771
|
info: (message, attributes) => {
|
|
766
|
-
if (telemetryEnabled) Sentry.logger.info(message, attributes);
|
|
772
|
+
if (telemetryEnabled) Sentry.logger.info(message, { url: getUrl(), ...attributes });
|
|
767
773
|
},
|
|
768
774
|
warn: (message, attributes) => {
|
|
769
|
-
if (telemetryEnabled) Sentry.logger.warn(message, attributes);
|
|
775
|
+
if (telemetryEnabled) Sentry.logger.warn(message, { url: getUrl(), ...attributes });
|
|
770
776
|
},
|
|
771
777
|
error: (message, attributes) => {
|
|
772
|
-
if (telemetryEnabled) Sentry.logger.error(message, attributes);
|
|
778
|
+
if (telemetryEnabled) Sentry.logger.error(message, { url: getUrl(), ...attributes });
|
|
773
779
|
}
|
|
774
780
|
};
|
|
775
781
|
|
|
@@ -1008,6 +1014,8 @@ var GridWalletButton = ({
|
|
|
1008
1014
|
onClick: () => connectWallet(wallet),
|
|
1009
1015
|
"aria-label": `Connect with ${wallet.name}`,
|
|
1010
1016
|
title: wallet.name,
|
|
1017
|
+
size: "xs",
|
|
1018
|
+
style: { borderRadius: "var(--aurum-border-radius-md)" },
|
|
1011
1019
|
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, WalletLogoWrapper, { id: wallet.id, size: 44, variant: "icon" })
|
|
1012
1020
|
}
|
|
1013
1021
|
);
|
|
@@ -1015,17 +1023,25 @@ var GridWalletButton = ({
|
|
|
1015
1023
|
|
|
1016
1024
|
// src/components/ConnectModal/WalletListGrid.tsx
|
|
1017
1025
|
|
|
1018
|
-
var
|
|
1019
|
-
|
|
1020
|
-
if (
|
|
1021
|
-
|
|
1022
|
-
|
|
1023
|
-
|
|
1024
|
-
|
|
1026
|
+
var MAX_PER_ROW = 4;
|
|
1027
|
+
function splitIntoRows(items) {
|
|
1028
|
+
if (items.length === 0) return [];
|
|
1029
|
+
const numRows = Math.ceil(items.length / MAX_PER_ROW);
|
|
1030
|
+
const basePerRow = Math.floor(items.length / numRows);
|
|
1031
|
+
const remainder = items.length % numRows;
|
|
1032
|
+
const rows = [];
|
|
1033
|
+
let index = 0;
|
|
1034
|
+
for (let i = 0; i < numRows; i++) {
|
|
1035
|
+
const rowSize = basePerRow + (i < remainder ? 1 : 0);
|
|
1036
|
+
rows.push(items.slice(index, index + rowSize));
|
|
1037
|
+
index += rowSize;
|
|
1038
|
+
}
|
|
1039
|
+
return rows;
|
|
1040
|
+
}
|
|
1025
1041
|
var WalletListGrid = ({ wallets }) => {
|
|
1026
1042
|
const { connectWallet } = useConnectModal();
|
|
1027
|
-
const
|
|
1028
|
-
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "aurum-wallet-grid",
|
|
1043
|
+
const rows = splitIntoRows(wallets);
|
|
1044
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "aurum-wallet-grid", children: rows.map((row, rowIndex) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "aurum-wallet-grid-row", children: row.map((wallet) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, GridWalletButton, { wallet, connectWallet }, wallet.id)) }, rowIndex)) });
|
|
1029
1045
|
};
|
|
1030
1046
|
|
|
1031
1047
|
// src/components/ConnectModal/WalletListStacked.tsx
|
|
@@ -2381,7 +2397,7 @@ var ConnectPages = () => {
|
|
|
2381
2397
|
};
|
|
2382
2398
|
|
|
2383
2399
|
// src/styles/bundledStyles.ts
|
|
2384
|
-
var bundledStyles = "/* ui/globals.css */\n/* ============================================\n AURUM SDK - DESIGN TOKEN SYSTEM\n ============================================\n\n Google Fonts:\n - Noto Sans: 400, 500, 600, 700\n ============================================ */\n\n@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');\n\n/* ============================================\n External variables (injected by createShadowRoot.ts):\n - --aurum-primary-color: Brand color from dapp\n - --aurum-border-radius-*: Radius scale tokens\n - --aurum-modal-z-index: Modal z-index\n - --aurum-font-family: Font family from dapp\n ============================================ */\n\n/* Base reset styles for Shadow DOM */\n:host {\n all: initial;\n}\n\n*,\n*::before,\n*::after {\n box-sizing: border-box;\n}\n\n/* Ensure form elements inherit font from parent */\ninput,\nbutton,\ntextarea,\nselect {\n font-family: inherit;\n}\n\n.aurum-sdk {\n /* ==========================================\n TYPOGRAPHY\n ========================================== */\n font-family: var(--aurum-font-family);\n font-size: 1rem;\n line-height: 1.5;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n\n /* Font weights */\n --font-normal: 400;\n --font-medium: 500;\n --font-semibold: 600;\n --font-bold: 700;\n\n /* ==========================================\n TRANSITIONS\n ========================================== */\n --duration-fast: 100ms;\n --duration-normal: 200ms;\n --duration-slow: 300ms;\n --ease-default: cubic-bezier(0.4, 0, 0.2, 1);\n --ease-in: cubic-bezier(0.4, 0, 1, 1);\n --ease-out: cubic-bezier(0, 0, 0.2, 1);\n\n /* ==========================================\n LIGHT THEME COLORS (Default)\n ========================================== */\n\n /* Foreground / Text */\n --color-foreground: #0c0c0c;\n --color-foreground-muted: #787878;\n --color-foreground-subtle: #979797;\n\n /* Card surfaces */\n --color-card: #ffffff;\n\n /* Borders */\n --color-border: #d9d9d9;\n --color-border-muted: #c0c0c0;\n --color-border-focus: var(--aurum-primary-color);\n\n /* Brand / Primary (from integrator) */\n --color-primary: var(--aurum-primary-color);\n --color-primary-foreground: #ffffff;\n --color-primary-hover: color-mix(in srgb, var(--aurum-primary-color) 85%, #000);\n --color-primary-muted: color-mix(in srgb, var(--aurum-primary-color) 15%, transparent);\n\n /* Interactive elements */\n --color-accent: #f1f1f1;\n --color-accent-foreground: #0d0d0d;\n --color-accent-hover: #e6e6e6;\n\n /* Semantic colors */\n --color-success: #22c55e;\n --color-error: #ef4444;\n\n /* Overlay / Modal */\n --color-overlay: rgb(0 0 0 / 0.5);\n\n /* Ring (focus indicator) */\n --color-ring: var(--aurum-primary-color);\n --ring-offset: 0.125rem;\n\n /* Shadows */\n --shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);\n}\n\n/* ==========================================\n DARK THEME COLORS\n ========================================== */\n\n.aurum-sdk[data-theme='dark'] {\n /* Foreground / Text */\n --color-foreground: #fafafa;\n --color-foreground-muted: #a9a9a9;\n --color-foreground-subtle: #777777;\n\n /* Card surfaces */\n --color-card: #151515;\n\n /* Borders */\n --color-border: #282828;\n --color-border-muted: #424242;\n --color-border-focus: var(--aurum-primary-color);\n\n /* Brand / Primary (from integrator) */\n --color-primary: var(--aurum-primary-color);\n --color-primary-foreground: #0a0a0a;\n --color-primary-hover: color-mix(in srgb, var(--aurum-primary-color) 85%, #fff);\n --color-primary-muted: color-mix(in srgb, var(--aurum-primary-color) 20%, transparent);\n\n /* Interactive elements */\n --color-accent: #272727;\n --color-accent-foreground: #fafafa;\n --color-accent-hover: #404040;\n\n /* Semantic colors */\n --color-success: #22c55e;\n --color-error: #ef4444;\n\n /* Overlay / Modal */\n --color-overlay: rgb(0 0 0 / 0.7);\n\n /* Ring (focus indicator) */\n --color-ring: var(--aurum-primary-color);\n --ring-offset: 0.125rem;\n\n /* Shadows */\n --shadow: 0 20px 25px -5px rgb(0 0 0 / 0.5), 0 8px 10px -6px rgb(0 0 0 / 0.5);\n}\n\n\n/* components/ConnectModal/AdditionalWalletsIcon.css */\n.additional-wallets-container {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.additional-wallets-grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n grid-template-rows: 1fr 1fr;\n gap: 0.125rem;\n align-items: center;\n justify-items: center;\n}\n\n.additional-wallets-grid-item {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.additional-wallets-placeholder {\n background-color: var(--aurum-color-bg-tertiary);\n border-radius: var(--aurum-border-radius-xs);\n opacity: 0.4;\n}\n\n.circular-icon-wrapper {\n border-radius: 50%;\n overflow: hidden;\n border: 2px solid var(--aurum-color-bg-secondary);\n}\n\n.circular-icon-wrapper--front {\n z-index: 2;\n}\n\n.circular-icon-wrapper--back {\n margin-left: -0.5rem;\n z-index: 1;\n}\n\n\n/* components/ConnectModal/ConnectionStatus/ConnectionStatus.css */\n@keyframes shake {\n 0%,\n 100% {\n transform: translateX(0);\n }\n 20%,\n 60% {\n transform: translateX(-0.125rem);\n }\n 40%,\n 80% {\n transform: translateX(0.125rem);\n }\n}\n\n@keyframes opacity-pulse {\n 0%,\n 100% {\n opacity: 0.4;\n }\n 50% {\n opacity: 1;\n }\n}\n\n@keyframes scale-in {\n from {\n transform: scale(0.75);\n }\n to {\n transform: scale(1);\n }\n}\n\n.wallet-icon-shake {\n /* Duration synced with ANIMATION_DURATION.SHAKE in constants/theme.ts */\n animation: shake var(--duration-slow) var(--ease-default);\n}\n\n.ellipses-loading,\n.ellipses-success,\n.status-icon-with-dots {\n display: flex;\n gap: 0.25rem;\n align-items: center;\n justify-content: center;\n width: 100%;\n}\n\n.ellipses-loading span,\n.ellipses-success span,\n.status-icon-with-dots .dot,\n.status-icon-with-dots .icon-center {\n font-size: 3rem;\n line-height: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 0.9375rem;\n height: 3rem;\n margin: 0;\n padding: 0;\n flex-shrink: 0;\n}\n\n.ellipses-loading span,\n.ellipses-success span,\n.status-icon-with-dots .dot {\n transform: translateY(-0.28125rem);\n}\n\n.status-icon-with-dots .icon-center {\n transform: translateY(-0.2rem);\n}\n\n.ellipses-loading span {\n color: var(--color-foreground-subtle);\n opacity: 0.4;\n animation: opacity-pulse 1.5s var(--ease-default) infinite;\n will-change: opacity;\n}\n\n.ellipses-loading span:nth-child(2) {\n animation-delay: 0.2s;\n}\n.ellipses-loading span:nth-child(3) {\n animation-delay: 0.4s;\n}\n.ellipses-loading span:nth-child(4) {\n animation-delay: 0.6s;\n}\n.ellipses-loading span:nth-child(5) {\n animation-delay: 0.8s;\n}\n\n.ellipses-success span,\n.status-icon-with-dots.success .dot {\n color: var(--aurum-primary-color);\n}\n\n.status-icon-with-dots.error .dot {\n color: var(--color-error);\n}\n\n.status-button {\n display: flex;\n align-items: flex-start;\n justify-content: center;\n width: 100%;\n}\n\n.success-icon-large {\n animation: scale-in var(--duration-fast) var(--ease-out);\n}\n\n/* Logo containers for visual balance */\n.brand-logo-container,\n.wallet-logo-with-retry {\n position: relative;\n display: inline-block;\n}\n\n/* Always reserve space on both sides to prevent layout shift when retry button appears/disappears */\n.brand-logo-container {\n margin-left: 0.375rem; /* Matches retry button's right: -0.375rem */\n}\n\n.wallet-logo-with-retry {\n margin-right: 0.375rem; /* Reserve space for retry button */\n}\n\n.retry-icon-overlay.retry-icon-overlay {\n position: absolute;\n bottom: -0.125rem;\n right: -0.375rem;\n width: 1.625rem;\n height: 1.625rem;\n min-width: 1.625rem;\n min-height: 1.625rem;\n border-radius: 50%;\n padding: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n\n/* components/ConnectModal/EmailAuth.css */\n.email-auth-input {\n width: 100%;\n outline: none;\n font-family: inherit;\n font-size: 1rem;\n line-height: 1.75rem;\n box-sizing: border-box;\n padding: 0.75rem 3rem 0.75rem 3rem;\n color: var(--color-foreground);\n transition:\n outline 0.2s ease,\n border-color 0.2s ease;\n background-color: var(--color-card);\n border-width: 1px;\n border-style: solid;\n border-color: var(--color-border);\n border-radius: var(--aurum-border-radius-md);\n}\n\n.email-auth-input:hover:not(:focus):not(.email-auth-input--error) {\n border-color: var(--color-border-muted);\n}\n\n.email-auth-input:focus {\n outline: 2px solid var(--color-ring);\n outline-offset: var(--ring-offset);\n}\n\n.email-auth-input--error {\n outline: 2px solid var(--color-error);\n outline-offset: var(--ring-offset);\n}\n\n.email-auth-submit-button.aurum-button {\n top: 50%;\n right: 0.75rem;\n height: auto;\n padding: 0.5rem;\n min-width: auto;\n position: absolute;\n transform: translateY(-50%);\n border-radius: var(--aurum-border-radius-sm);\n}\n\n.email-auth-icon {\n top: 50%;\n left: 1rem;\n position: absolute;\n transform: translateY(-50%);\n display: flex;\n align-items: center;\n pointer-events: none;\n}\n\n\n/* components/ConnectModal/WalletGrid.css */\n.aurum-wallet-grid {\n display: grid;\n grid-template-columns: repeat(var(--grid-columns, 3), 1fr);\n gap: 10px;\n width: 100%;\n}\n\n\n/* components/ModalHeader/ModalHeader.css */\n.modal-header {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n padding: 1rem;\n background-color: var(--color-card);\n border-radius: var(--aurum-border-radius-lg) var(--aurum-border-radius-lg) 0 0;\n z-index: 1;\n display: grid;\n grid-template-columns: 1fr auto 1fr;\n align-items: center;\n}\n\n.modal-header > div {\n display: flex;\n align-items: center;\n width: 100%;\n}\n\n.modal-header-left {\n justify-content: flex-start;\n min-width: 2.25rem;\n height: 2.25rem;\n}\n\n.modal-header-center {\n justify-content: center;\n max-width: 12.5rem;\n text-align: center;\n line-height: 1.2;\n overflow-wrap: break-word;\n}\n\n.modal-header-right {\n justify-content: flex-end;\n min-width: 2.25rem;\n height: 2.25rem;\n}\n\n\n/* components/PoweredBy/PoweredBy.css */\n.powered-by-container {\n position: absolute;\n bottom: 1rem;\n left: 0;\n right: 0;\n width: 100%;\n}\n\n\n/* components/QRCodeDisplay/QRCodeDisplay.css */\n@keyframes qr-shimmer {\n 0% {\n transform: translateX(-100%);\n }\n 100% {\n transform: translateX(100%);\n }\n}\n\n.qr-container-shimmer {\n position: relative;\n overflow: hidden; /* Keep for shimmer animation */\n}\n\n.qr-container-shimmer::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: linear-gradient(\n 90deg,\n transparent 0%,\n color-mix(in srgb, var(--color-foreground) 10%, transparent) 50%,\n transparent 100%\n );\n animation: qr-shimmer 2s infinite;\n pointer-events: none;\n z-index: 1;\n}\n\n.qr-container {\n border-radius: var(--aurum-border-radius-md);\n border: 1px solid var(--color-border);\n padding: 0.5rem;\n box-sizing: content-box;\n transition: border-color var(--duration-slow) var(--ease-default);\n}\n\n.qr-subtitle {\n max-width: 15rem;\n}\n\n\n/* components/QRCodeDisplay/QRCodeSkeleton.css */\n.qr-skeleton-container {\n width: 100%;\n position: relative;\n}\n\n.qr-skeleton-svg {\n display: block;\n position: relative;\n z-index: 2;\n border-radius: var(--aurum-border-radius-sm);\n}\n\n.qr-skeleton-dot {\n opacity: 0.7;\n}\n\n.qr-skeleton-eye {\n opacity: 0.7;\n}\n\n\n/* components/SpinnerWithIcon/SpinnerWithIcon.css */\n.spinner-with-icon {\n transition: all var(--duration-normal) var(--ease-default);\n}\n\n.spinner-with-icon svg {\n transition: color var(--duration-normal) var(--ease-default);\n}\n\n\n/* components/widgets/widgets.css */\n/* Widget-specific styles that match modal-content */\n\n.widget-provider {\n position: relative;\n width: 23.75rem;\n min-width: 17rem;\n margin: 0 auto;\n padding: 1.25rem 1.5rem;\n background-color: var(--color-card);\n border-radius: var(--aurum-border-radius-lg);\n border: 1px solid var(--color-border-muted);\n box-sizing: border-box;\n color: var(--color-card-foreground);\n box-shadow: var(--shadow);\n outline: none;\n overflow-x: auto;\n}\n\n.widget-provider .modal-header {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n}\n\n@media (max-width: 30.25rem) {\n .widget-provider {\n width: 100%;\n max-width: 100%;\n border-radius: var(--aurum-border-radius-md);\n display: flex;\n flex-direction: column;\n }\n\n /* Ensure page wrapper fills width in flex container on mobile */\n /* .widget-pages {\n width: 100%;\n } */\n}\n\n\n/* ui/Badge/Badge.css */\n.aurum-badge-recent {\n padding: 0.25rem 0.5rem;\n border-radius: var(--aurum-border-radius-xs);\n\n font-size: 0.65rem;\n line-height: 1;\n letter-spacing: 0.07em;\n text-transform: uppercase;\n\n color: var(--color-foreground-muted);\n}\n\n\n/* ui/Button/Button.css */\n.aurum-button {\n display: flex;\n align-items: center;\n justify-content: center;\n border: none;\n font-weight: var(--font-semibold);\n cursor: pointer;\n transition:\n background-color var(--duration-normal) var(--ease-default),\n color var(--duration-normal) var(--ease-default),\n transform var(--duration-fast) var(--ease-default),\n box-shadow var(--duration-normal) var(--ease-default);\n text-decoration: none;\n box-sizing: border-box;\n position: relative;\n outline: none;\n font-family: inherit;\n}\n\n.aurum-button:focus-visible {\n outline: 2px solid var(--color-ring);\n outline-offset: var(--ring-offset);\n}\n\n.aurum-button--xs {\n padding: 0.25rem 0.5rem;\n font-size: 0.75rem;\n gap: 0.25rem;\n border-radius: var(--aurum-border-radius-xs);\n}\n\n.aurum-button--sm {\n padding: 0.5rem 0.75rem;\n font-size: 0.875rem;\n gap: 0.25rem;\n border-radius: calc(var(--aurum-border-radius-sm) - 2px);\n}\n\n.aurum-button--md {\n padding: 0.75rem 1rem;\n font-size: 0.9rem;\n gap: 0.5rem;\n border-radius: calc(var(--aurum-border-radius-md) - 2px);\n}\n\n.aurum-button--lg {\n padding: 1rem 1.5rem;\n font-size: 1rem;\n gap: 0.75rem;\n border-radius: var(--aurum-border-radius-md);\n}\n\n.aurum-button--full-width {\n width: 100%;\n}\n\n.aurum-button--primary {\n background-color: var(--color-primary);\n color: var(--color-primary-foreground);\n}\n\n.aurum-button--primary:active:not(:disabled) {\n transform: scale(0.98);\n}\n\n.aurum-button--secondary {\n background-color: var(--color-accent);\n color: var(--color-accent-foreground);\n}\n\n.aurum-button--secondary:active:not(:disabled) {\n transform: scale(0.98);\n}\n\n.aurum-button--tertiary {\n background: transparent;\n color: var(--color-foreground);\n border: 1px solid var(--color-border);\n}\n\n.aurum-button--tertiary:active:not(:disabled) {\n transform: scale(0.98);\n}\n\n.aurum-button--text {\n background: transparent;\n color: var(--color-primary);\n padding: 0.25rem;\n}\n\n.aurum-button--text:not(.aurum-button--full-width) {\n width: fit-content;\n}\n\n.aurum-button--text:active:not(:disabled) {\n transform: scale(0.98);\n}\n\n.aurum-button--close {\n background: transparent;\n color: var(--color-foreground-muted);\n border: none;\n padding: 0.5rem;\n border-radius: var(--aurum-border-radius-md);\n font-size: 1.25rem;\n line-height: 1;\n}\n\n.aurum-button--close:active:not(:disabled) {\n transform: scale(0.95);\n}\n\n/* Hover styles only for devices with hover capability (not touch) */\n@media (hover: hover) {\n .aurum-button--primary:hover:not(:disabled) {\n background-color: var(--color-primary-hover);\n }\n\n .aurum-button--secondary:hover:not(:disabled) {\n background-color: var(--color-accent-hover);\n }\n\n .aurum-button--tertiary:hover:not(:disabled) {\n background-color: var(--color-accent);\n border-color: var(--color-border-muted);\n }\n\n .aurum-button--text:hover:not(:disabled) {\n opacity: 0.7;\n }\n\n .aurum-button--close:hover:not(:disabled) {\n background-color: var(--color-accent);\n color: var(--color-foreground);\n }\n}\n\n.aurum-button--disabled,\n.aurum-button:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n pointer-events: none;\n}\n\n.aurum-button--loading {\n pointer-events: none;\n}\n\n\n/* ui/Divider/Divider.css */\n.divider {\n display: flex;\n align-items: center;\n width: 100%;\n}\n\n.divider-line {\n flex: 1;\n height: 1px;\n background-color: var(--color-border);\n}\n\n.divider-text {\n padding: 0 1rem;\n color: var(--color-foreground-subtle);\n font-size: 0.875rem;\n font-weight: var(--font-medium);\n}\n\n\n/* ui/Modal/Modal.css */\n.modal-overlay {\n position: fixed;\n inset: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n z-index: var(--aurum-modal-z-index);\n background-color: var(--color-overlay);\n opacity: 0;\n}\n\n.modal-overlay.modal-open {\n opacity: 1;\n transition: opacity 150ms ease-out;\n}\n\n.modal-overlay.modal-exiting {\n opacity: 0;\n transition: opacity 150ms ease-in;\n}\n\n.modal-content {\n position: relative;\n width: 23.75rem;\n min-width: 17rem;\n padding: 1.25rem 1.5rem;\n color: var(--color-card-foreground);\n background-color: var(--color-card);\n border-radius: var(--aurum-border-radius-lg);\n box-shadow: var(--shadow);\n border: 1px solid var(--color-border-muted);\n outline: none;\n opacity: 0;\n transform: scale(0.95);\n}\n\n.modal-overlay.modal-open .modal-content {\n opacity: 1;\n transform: scale(1);\n transition:\n opacity 150ms ease-out,\n transform 150ms ease-out;\n}\n\n.modal-overlay.modal-exiting .modal-content {\n opacity: 0;\n transform: scale(0.95);\n transition:\n opacity 150ms ease-in,\n transform 150ms ease-in;\n}\n\n.modal-page-container {\n position: relative;\n width: 100%;\n overflow-x: visible;\n overflow-y: auto;\n scrollbar-width: none;\n -ms-overflow-style: none;\n}\n\n.modal-page-container::-webkit-scrollbar {\n display: none;\n}\n\n.modal-page {\n position: relative;\n width: 100%;\n box-sizing: border-box;\n opacity: 0;\n transition: opacity 0s;\n}\n\n.modal-page.active {\n opacity: 1;\n transition: opacity var(--duration-slow) var(--ease-out);\n}\n\n/* Mobile drawer layout */\n@media (max-width: 30.25rem) {\n .modal-overlay {\n align-items: flex-end;\n justify-content: center;\n opacity: 1;\n transition: none;\n }\n\n .modal-overlay.modal-open {\n transition: none;\n }\n\n .modal-overlay.modal-exiting {\n opacity: 1;\n background-color: transparent;\n transition: none;\n }\n\n .modal-content {\n width: 100%;\n max-height: 82vh;\n max-height: 82dvh;\n min-height: 35vh;\n min-height: 35dvh;\n padding: 1rem;\n border-radius: var(--aurum-border-radius-lg) var(--aurum-border-radius-lg) 0 0;\n border-bottom: none;\n display: flex;\n flex-direction: column;\n height: auto;\n opacity: 1;\n transform: translateY(100%);\n }\n\n .modal-overlay.modal-open .modal-content {\n opacity: 1;\n transform: translateY(0);\n transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1);\n }\n\n .modal-overlay.modal-exiting .modal-content {\n opacity: 1;\n transform: translateY(100%);\n transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1);\n }\n\n .modal-page-container {\n flex: 0 1 auto;\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n }\n\n .modal-page {\n flex: 0 1 auto;\n display: flex;\n flex-direction: column;\n }\n}\n\n\n/* ui/Spinner/Spinner.css */\n.spinner {\n flex-shrink: 0;\n animation: spinner-rotate 1s linear infinite;\n}\n\n@keyframes spinner-rotate {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}\n\n\n/* ui/Text/Text.css */\n.aurum-text {\n margin: 0;\n padding: 0;\n font-family: inherit;\n line-height: 1.5;\n}\n\n.aurum-text--primary {\n color: var(--color-foreground);\n}\n\n.aurum-text--secondary {\n color: var(--color-foreground-muted);\n}\n\n.aurum-text--tertiary {\n color: var(--color-foreground-subtle);\n}\n\n.aurum-text--error {\n color: var(--color-error);\n}\n\n.aurum-text--brand {\n color: var(--color-primary);\n}\n\n.aurum-text--success {\n color: var(--color-success);\n}\n\n.aurum-text--xs {\n font-size: 0.75rem;\n line-height: 1.4;\n}\n\n.aurum-text--sm {\n font-size: 0.875rem;\n line-height: 1.45;\n}\n\n.aurum-text--md {\n font-size: 1rem;\n line-height: 1.5;\n}\n\n.aurum-text--lg {\n font-size: 1.125rem;\n line-height: 1.5;\n}\n\n.aurum-text--normal {\n font-weight: var(--font-normal);\n}\n\n.aurum-text--semibold {\n font-weight: var(--font-semibold);\n}\n\n.aurum-text--bold {\n font-weight: var(--font-bold);\n}\n\n.aurum-text--align-left {\n text-align: left;\n}\n\n.aurum-text--align-center {\n text-align: center;\n}\n\n.aurum-text--align-right {\n text-align: right;\n}\n\n\n";
|
|
2400
|
+
var bundledStyles = "/* ui/globals.css */\n/* ============================================\n AURUM SDK - DESIGN TOKEN SYSTEM\n ============================================\n\n Google Fonts:\n - Noto Sans: 400, 500, 600, 700\n ============================================ */\n\n@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');\n\n/* ============================================\n External variables (injected by createShadowRoot.ts):\n - --aurum-primary-color: Brand color from dapp\n - --aurum-border-radius-*: Radius scale tokens\n - --aurum-modal-z-index: Modal z-index\n - --aurum-font-family: Font family from dapp\n ============================================ */\n\n/* Base reset styles for Shadow DOM */\n:host {\n all: initial;\n}\n\n*,\n*::before,\n*::after {\n box-sizing: border-box;\n}\n\n/* Ensure form elements inherit font from parent */\ninput,\nbutton,\ntextarea,\nselect {\n font-family: inherit;\n}\n\n.aurum-sdk {\n /* ==========================================\n TYPOGRAPHY\n ========================================== */\n font-family: var(--aurum-font-family);\n font-size: 1rem;\n line-height: 1.5;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n\n /* Font weights */\n --font-normal: 400;\n --font-medium: 500;\n --font-semibold: 600;\n --font-bold: 700;\n\n /* ==========================================\n TRANSITIONS\n ========================================== */\n --duration-fast: 100ms;\n --duration-normal: 200ms;\n --duration-slow: 300ms;\n --ease-default: cubic-bezier(0.4, 0, 0.2, 1);\n --ease-in: cubic-bezier(0.4, 0, 1, 1);\n --ease-out: cubic-bezier(0, 0, 0.2, 1);\n\n /* ==========================================\n LIGHT THEME COLORS (Default)\n ========================================== */\n\n /* Foreground / Text */\n --color-foreground: #0c0c0c;\n --color-foreground-muted: #787878;\n --color-foreground-subtle: #979797;\n\n /* Card surfaces */\n --color-card: #ffffff;\n\n /* Borders */\n --color-border: #d9d9d9;\n --color-border-muted: #c0c0c0;\n --color-border-focus: var(--aurum-primary-color);\n\n /* Brand / Primary (from integrator) */\n --color-primary: var(--aurum-primary-color);\n --color-primary-foreground: #ffffff;\n --color-primary-hover: color-mix(in srgb, var(--aurum-primary-color) 85%, #000);\n --color-primary-muted: color-mix(in srgb, var(--aurum-primary-color) 15%, transparent);\n\n /* Interactive elements */\n --color-accent: #f1f1f1;\n --color-accent-foreground: #0d0d0d;\n --color-accent-hover: #e6e6e6;\n\n /* Semantic colors */\n --color-success: #22c55e;\n --color-error: #ef4444;\n\n /* Overlay / Modal */\n --color-overlay: rgb(0 0 0 / 0.5);\n\n /* Ring (focus indicator) */\n --color-ring: var(--aurum-primary-color);\n --ring-offset: 0.125rem;\n\n /* Shadows */\n --shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);\n}\n\n/* ==========================================\n DARK THEME COLORS\n ========================================== */\n\n.aurum-sdk[data-theme='dark'] {\n /* Foreground / Text */\n --color-foreground: #fafafa;\n --color-foreground-muted: #a9a9a9;\n --color-foreground-subtle: #777777;\n\n /* Card surfaces */\n --color-card: #151515;\n\n /* Borders */\n --color-border: #282828;\n --color-border-muted: #424242;\n --color-border-focus: var(--aurum-primary-color);\n\n /* Brand / Primary (from integrator) */\n --color-primary: var(--aurum-primary-color);\n --color-primary-foreground: #0a0a0a;\n --color-primary-hover: color-mix(in srgb, var(--aurum-primary-color) 85%, #fff);\n --color-primary-muted: color-mix(in srgb, var(--aurum-primary-color) 20%, transparent);\n\n /* Interactive elements */\n --color-accent: #272727;\n --color-accent-foreground: #fafafa;\n --color-accent-hover: #404040;\n\n /* Semantic colors */\n --color-success: #22c55e;\n --color-error: #ef4444;\n\n /* Overlay / Modal */\n --color-overlay: rgb(0 0 0 / 0.7);\n\n /* Ring (focus indicator) */\n --color-ring: var(--aurum-primary-color);\n --ring-offset: 0.125rem;\n\n /* Shadows */\n --shadow: 0 20px 25px -5px rgb(0 0 0 / 0.5), 0 8px 10px -6px rgb(0 0 0 / 0.5);\n}\n\n\n/* components/ConnectModal/AdditionalWalletsIcon.css */\n.additional-wallets-container {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.additional-wallets-grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n grid-template-rows: 1fr 1fr;\n gap: 0.125rem;\n align-items: center;\n justify-items: center;\n}\n\n.additional-wallets-grid-item {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.additional-wallets-placeholder {\n background-color: var(--aurum-color-bg-tertiary);\n border-radius: var(--aurum-border-radius-xs);\n opacity: 0.4;\n}\n\n.circular-icon-wrapper {\n border-radius: 50%;\n overflow: hidden;\n border: 2px solid var(--aurum-color-bg-secondary);\n}\n\n.circular-icon-wrapper--front {\n z-index: 2;\n}\n\n.circular-icon-wrapper--back {\n margin-left: -0.5rem;\n z-index: 1;\n}\n\n\n/* components/ConnectModal/ConnectionStatus/ConnectionStatus.css */\n@keyframes shake {\n 0%,\n 100% {\n transform: translateX(0);\n }\n 20%,\n 60% {\n transform: translateX(-0.125rem);\n }\n 40%,\n 80% {\n transform: translateX(0.125rem);\n }\n}\n\n@keyframes opacity-pulse {\n 0%,\n 100% {\n opacity: 0.4;\n }\n 50% {\n opacity: 1;\n }\n}\n\n@keyframes scale-in {\n from {\n transform: scale(0.75);\n }\n to {\n transform: scale(1);\n }\n}\n\n.wallet-icon-shake {\n /* Duration synced with ANIMATION_DURATION.SHAKE in constants/theme.ts */\n animation: shake var(--duration-slow) var(--ease-default);\n}\n\n.ellipses-loading,\n.ellipses-success,\n.status-icon-with-dots {\n display: flex;\n gap: 0.25rem;\n align-items: center;\n justify-content: center;\n width: 100%;\n}\n\n.ellipses-loading span,\n.ellipses-success span,\n.status-icon-with-dots .dot,\n.status-icon-with-dots .icon-center {\n font-size: 3rem;\n line-height: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 0.9375rem;\n height: 3rem;\n margin: 0;\n padding: 0;\n flex-shrink: 0;\n}\n\n.ellipses-loading span,\n.ellipses-success span,\n.status-icon-with-dots .dot {\n transform: translateY(-0.28125rem);\n}\n\n.status-icon-with-dots .icon-center {\n transform: translateY(-0.2rem);\n}\n\n.ellipses-loading span {\n color: var(--color-foreground-subtle);\n opacity: 0.4;\n animation: opacity-pulse 1.5s var(--ease-default) infinite;\n will-change: opacity;\n}\n\n.ellipses-loading span:nth-child(2) {\n animation-delay: 0.2s;\n}\n.ellipses-loading span:nth-child(3) {\n animation-delay: 0.4s;\n}\n.ellipses-loading span:nth-child(4) {\n animation-delay: 0.6s;\n}\n.ellipses-loading span:nth-child(5) {\n animation-delay: 0.8s;\n}\n\n.ellipses-success span,\n.status-icon-with-dots.success .dot {\n color: var(--aurum-primary-color);\n}\n\n.status-icon-with-dots.error .dot {\n color: var(--color-error);\n}\n\n.status-button {\n display: flex;\n align-items: flex-start;\n justify-content: center;\n width: 100%;\n}\n\n.success-icon-large {\n animation: scale-in var(--duration-fast) var(--ease-out);\n}\n\n/* Logo containers for visual balance */\n.brand-logo-container,\n.wallet-logo-with-retry {\n position: relative;\n display: inline-block;\n}\n\n/* Always reserve space on both sides to prevent layout shift when retry button appears/disappears */\n.brand-logo-container {\n margin-left: 0.375rem; /* Matches retry button's right: -0.375rem */\n}\n\n.wallet-logo-with-retry {\n margin-right: 0.375rem; /* Reserve space for retry button */\n}\n\n.retry-icon-overlay.retry-icon-overlay {\n position: absolute;\n bottom: -0.125rem;\n right: -0.375rem;\n width: 1.625rem;\n height: 1.625rem;\n min-width: 1.625rem;\n min-height: 1.625rem;\n border-radius: 50%;\n padding: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n\n/* components/ConnectModal/EmailAuth.css */\n.email-auth-input {\n width: 100%;\n outline: none;\n font-family: inherit;\n font-size: 1rem;\n line-height: 1.75rem;\n box-sizing: border-box;\n padding: 0.75rem 3rem 0.75rem 3rem;\n color: var(--color-foreground);\n transition:\n outline 0.2s ease,\n border-color 0.2s ease;\n background-color: var(--color-card);\n border-width: 1px;\n border-style: solid;\n border-color: var(--color-border);\n border-radius: var(--aurum-border-radius-md);\n}\n\n.email-auth-input:hover:not(:focus):not(.email-auth-input--error) {\n border-color: var(--color-border-muted);\n}\n\n.email-auth-input:focus {\n outline: 2px solid var(--color-ring);\n outline-offset: var(--ring-offset);\n}\n\n.email-auth-input--error {\n outline: 2px solid var(--color-error);\n outline-offset: var(--ring-offset);\n}\n\n.email-auth-submit-button.aurum-button {\n top: 50%;\n right: 0.75rem;\n height: auto;\n padding: 0.5rem;\n min-width: auto;\n position: absolute;\n transform: translateY(-50%);\n border-radius: var(--aurum-border-radius-sm);\n}\n\n.email-auth-icon {\n top: 50%;\n left: 1rem;\n position: absolute;\n transform: translateY(-50%);\n display: flex;\n align-items: center;\n pointer-events: none;\n}\n\n\n/* components/ConnectModal/WalletGrid.css */\n.aurum-wallet-grid {\n display: flex;\n flex-direction: column;\n gap: 10px;\n width: 100%;\n}\n\n.aurum-wallet-grid-row {\n display: flex;\n gap: 10px;\n width: 100%;\n}\n\n.aurum-wallet-grid-row > * {\n flex: 1;\n min-width: 0;\n}\n\n\n/* components/ModalHeader/ModalHeader.css */\n.modal-header {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n padding: 1rem;\n background-color: var(--color-card);\n border-radius: var(--aurum-border-radius-lg) var(--aurum-border-radius-lg) 0 0;\n z-index: 1;\n display: grid;\n grid-template-columns: 1fr auto 1fr;\n align-items: center;\n}\n\n.modal-header > div {\n display: flex;\n align-items: center;\n width: 100%;\n}\n\n.modal-header-left {\n justify-content: flex-start;\n min-width: 2.25rem;\n height: 2.25rem;\n}\n\n.modal-header-center {\n justify-content: center;\n max-width: 12.5rem;\n text-align: center;\n line-height: 1.2;\n overflow-wrap: break-word;\n}\n\n.modal-header-right {\n justify-content: flex-end;\n min-width: 2.25rem;\n height: 2.25rem;\n}\n\n\n/* components/PoweredBy/PoweredBy.css */\n.powered-by-container {\n position: absolute;\n bottom: 1rem;\n left: 0;\n right: 0;\n width: 100%;\n}\n\n\n/* components/QRCodeDisplay/QRCodeDisplay.css */\n@keyframes qr-shimmer {\n 0% {\n transform: translateX(-100%);\n }\n 100% {\n transform: translateX(100%);\n }\n}\n\n.qr-container-shimmer {\n position: relative;\n overflow: hidden; /* Keep for shimmer animation */\n}\n\n.qr-container-shimmer::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: linear-gradient(\n 90deg,\n transparent 0%,\n color-mix(in srgb, var(--color-foreground) 10%, transparent) 50%,\n transparent 100%\n );\n animation: qr-shimmer 2s infinite;\n pointer-events: none;\n z-index: 1;\n}\n\n.qr-container {\n border-radius: var(--aurum-border-radius-md);\n border: 1px solid var(--color-border);\n padding: 0.5rem;\n box-sizing: content-box;\n transition: border-color var(--duration-slow) var(--ease-default);\n}\n\n.qr-subtitle {\n max-width: 15rem;\n}\n\n\n/* components/QRCodeDisplay/QRCodeSkeleton.css */\n.qr-skeleton-container {\n width: 100%;\n position: relative;\n}\n\n.qr-skeleton-svg {\n display: block;\n position: relative;\n z-index: 2;\n border-radius: var(--aurum-border-radius-sm);\n}\n\n.qr-skeleton-dot {\n opacity: 0.7;\n}\n\n.qr-skeleton-eye {\n opacity: 0.7;\n}\n\n\n/* components/SpinnerWithIcon/SpinnerWithIcon.css */\n.spinner-with-icon {\n transition: all var(--duration-normal) var(--ease-default);\n}\n\n.spinner-with-icon svg {\n transition: color var(--duration-normal) var(--ease-default);\n}\n\n\n/* components/widgets/widgets.css */\n/* Widget-specific styles that match modal-content */\n\n.widget-provider {\n position: relative;\n width: 23.75rem;\n min-width: 17rem;\n margin: 0 auto;\n padding: 1.25rem 1.5rem;\n background-color: var(--color-card);\n border-radius: var(--aurum-border-radius-lg);\n border: 1px solid var(--color-border-muted);\n box-sizing: border-box;\n color: var(--color-card-foreground);\n box-shadow: var(--shadow);\n outline: none;\n overflow-x: auto;\n}\n\n.widget-provider .modal-header {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n}\n\n@media (max-width: 30.25rem) {\n .widget-provider {\n width: 100%;\n max-width: 100%;\n border-radius: var(--aurum-border-radius-md);\n display: flex;\n flex-direction: column;\n }\n\n /* Ensure page wrapper fills width in flex container on mobile */\n /* .widget-pages {\n width: 100%;\n } */\n}\n\n\n/* ui/Badge/Badge.css */\n.aurum-badge-recent {\n padding: 0.25rem 0.5rem;\n border-radius: var(--aurum-border-radius-xs);\n\n font-size: 0.65rem;\n line-height: 1;\n letter-spacing: 0.07em;\n text-transform: uppercase;\n\n color: var(--color-foreground-muted);\n}\n\n\n/* ui/Button/Button.css */\n.aurum-button {\n display: flex;\n align-items: center;\n justify-content: center;\n border: none;\n font-weight: var(--font-semibold);\n cursor: pointer;\n transition:\n background-color var(--duration-normal) var(--ease-default),\n color var(--duration-normal) var(--ease-default),\n transform var(--duration-fast) var(--ease-default),\n box-shadow var(--duration-normal) var(--ease-default);\n text-decoration: none;\n box-sizing: border-box;\n position: relative;\n outline: none;\n font-family: inherit;\n}\n\n.aurum-button:focus-visible {\n outline: 2px solid var(--color-ring);\n outline-offset: var(--ring-offset);\n}\n\n.aurum-button--xs {\n padding: 0.25rem 0.5rem;\n font-size: 0.75rem;\n gap: 0.25rem;\n border-radius: var(--aurum-border-radius-xs);\n}\n\n.aurum-button--sm {\n padding: 0.5rem 0.75rem;\n font-size: 0.875rem;\n gap: 0.25rem;\n border-radius: calc(var(--aurum-border-radius-sm) - 2px);\n}\n\n.aurum-button--md {\n padding: 0.75rem 1rem;\n font-size: 0.9rem;\n gap: 0.5rem;\n border-radius: calc(var(--aurum-border-radius-md) - 2px);\n}\n\n.aurum-button--lg {\n padding: 1rem 1.5rem;\n font-size: 1rem;\n gap: 0.75rem;\n border-radius: var(--aurum-border-radius-md);\n}\n\n.aurum-button--full-width {\n width: 100%;\n}\n\n.aurum-button--primary {\n background-color: var(--color-primary);\n color: var(--color-primary-foreground);\n}\n\n.aurum-button--primary:active:not(:disabled) {\n transform: scale(0.98);\n}\n\n.aurum-button--secondary {\n background-color: var(--color-accent);\n color: var(--color-accent-foreground);\n}\n\n.aurum-button--secondary:active:not(:disabled) {\n transform: scale(0.98);\n}\n\n.aurum-button--tertiary {\n background: transparent;\n color: var(--color-foreground);\n border: 1px solid var(--color-border);\n}\n\n.aurum-button--tertiary:active:not(:disabled) {\n transform: scale(0.98);\n}\n\n.aurum-button--text {\n background: transparent;\n color: var(--color-primary);\n padding: 0.25rem;\n}\n\n.aurum-button--text:not(.aurum-button--full-width) {\n width: fit-content;\n}\n\n.aurum-button--text:active:not(:disabled) {\n transform: scale(0.98);\n}\n\n.aurum-button--close {\n background: transparent;\n color: var(--color-foreground-muted);\n border: none;\n padding: 0.5rem;\n border-radius: var(--aurum-border-radius-md);\n font-size: 1.25rem;\n line-height: 1;\n}\n\n.aurum-button--close:active:not(:disabled) {\n transform: scale(0.95);\n}\n\n/* Hover styles only for devices with hover capability (not touch) */\n@media (hover: hover) {\n .aurum-button--primary:hover:not(:disabled) {\n background-color: var(--color-primary-hover);\n }\n\n .aurum-button--secondary:hover:not(:disabled) {\n background-color: var(--color-accent-hover);\n }\n\n .aurum-button--tertiary:hover:not(:disabled) {\n background-color: var(--color-accent);\n border-color: var(--color-border-muted);\n }\n\n .aurum-button--text:hover:not(:disabled) {\n opacity: 0.7;\n }\n\n .aurum-button--close:hover:not(:disabled) {\n background-color: var(--color-accent);\n color: var(--color-foreground);\n }\n}\n\n.aurum-button--disabled,\n.aurum-button:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n pointer-events: none;\n}\n\n.aurum-button--loading {\n pointer-events: none;\n}\n\n\n/* ui/Divider/Divider.css */\n.divider {\n display: flex;\n align-items: center;\n width: 100%;\n}\n\n.divider-line {\n flex: 1;\n height: 1px;\n background-color: var(--color-border);\n}\n\n.divider-text {\n padding: 0 1rem;\n color: var(--color-foreground-subtle);\n font-size: 0.875rem;\n font-weight: var(--font-medium);\n}\n\n\n/* ui/Modal/Modal.css */\n.modal-overlay {\n position: fixed;\n inset: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n z-index: var(--aurum-modal-z-index);\n background-color: var(--color-overlay);\n opacity: 0;\n}\n\n.modal-overlay.modal-open {\n opacity: 1;\n transition: opacity 150ms ease-out;\n}\n\n.modal-overlay.modal-exiting {\n opacity: 0;\n transition: opacity 150ms ease-in;\n}\n\n.modal-content {\n position: relative;\n width: 23.75rem;\n min-width: 17rem;\n padding: 1.25rem 1.5rem;\n color: var(--color-card-foreground);\n background-color: var(--color-card);\n border-radius: var(--aurum-border-radius-lg);\n box-shadow: var(--shadow);\n border: 1px solid var(--color-border-muted);\n outline: none;\n opacity: 0;\n transform: scale(0.95);\n}\n\n.modal-overlay.modal-open .modal-content {\n opacity: 1;\n transform: scale(1);\n transition:\n opacity 150ms ease-out,\n transform 150ms ease-out;\n}\n\n.modal-overlay.modal-exiting .modal-content {\n opacity: 0;\n transform: scale(0.95);\n transition:\n opacity 150ms ease-in,\n transform 150ms ease-in;\n}\n\n.modal-page-container {\n position: relative;\n width: 100%;\n overflow-x: visible;\n overflow-y: auto;\n scrollbar-width: none;\n -ms-overflow-style: none;\n}\n\n.modal-page-container::-webkit-scrollbar {\n display: none;\n}\n\n.modal-page {\n position: relative;\n width: 100%;\n box-sizing: border-box;\n opacity: 0;\n transition: opacity 0s;\n}\n\n.modal-page.active {\n opacity: 1;\n transition: opacity var(--duration-slow) var(--ease-out);\n}\n\n/* Mobile drawer layout */\n@media (max-width: 30.25rem) {\n .modal-overlay {\n align-items: flex-end;\n justify-content: center;\n opacity: 1;\n transition: none;\n }\n\n .modal-overlay.modal-open {\n transition: none;\n }\n\n .modal-overlay.modal-exiting {\n opacity: 1;\n background-color: transparent;\n transition: none;\n }\n\n .modal-content {\n width: 100%;\n max-height: 82vh;\n max-height: 82dvh;\n min-height: 35vh;\n min-height: 35dvh;\n padding: 1rem;\n border-radius: var(--aurum-border-radius-lg) var(--aurum-border-radius-lg) 0 0;\n border-bottom: none;\n display: flex;\n flex-direction: column;\n height: auto;\n opacity: 1;\n transform: translateY(100%);\n }\n\n .modal-overlay.modal-open .modal-content {\n opacity: 1;\n transform: translateY(0);\n transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1);\n }\n\n .modal-overlay.modal-exiting .modal-content {\n opacity: 1;\n transform: translateY(100%);\n transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1);\n }\n\n .modal-page-container {\n flex: 0 1 auto;\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n }\n\n .modal-page {\n flex: 0 1 auto;\n display: flex;\n flex-direction: column;\n }\n}\n\n\n/* ui/Spinner/Spinner.css */\n.spinner {\n flex-shrink: 0;\n animation: spinner-rotate 1s linear infinite;\n}\n\n@keyframes spinner-rotate {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}\n\n\n/* ui/Text/Text.css */\n.aurum-text {\n margin: 0;\n padding: 0;\n font-family: inherit;\n line-height: 1.5;\n}\n\n.aurum-text--primary {\n color: var(--color-foreground);\n}\n\n.aurum-text--secondary {\n color: var(--color-foreground-muted);\n}\n\n.aurum-text--tertiary {\n color: var(--color-foreground-subtle);\n}\n\n.aurum-text--error {\n color: var(--color-error);\n}\n\n.aurum-text--brand {\n color: var(--color-primary);\n}\n\n.aurum-text--success {\n color: var(--color-success);\n}\n\n.aurum-text--xs {\n font-size: 0.75rem;\n line-height: 1.4;\n}\n\n.aurum-text--sm {\n font-size: 0.875rem;\n line-height: 1.45;\n}\n\n.aurum-text--md {\n font-size: 1rem;\n line-height: 1.5;\n}\n\n.aurum-text--lg {\n font-size: 1.125rem;\n line-height: 1.5;\n}\n\n.aurum-text--normal {\n font-weight: var(--font-normal);\n}\n\n.aurum-text--semibold {\n font-weight: var(--font-semibold);\n}\n\n.aurum-text--bold {\n font-weight: var(--font-bold);\n}\n\n.aurum-text--align-left {\n text-align: left;\n}\n\n.aurum-text--align-center {\n text-align: center;\n}\n\n.aurum-text--align-right {\n text-align: right;\n}\n\n\n";
|
|
2385
2401
|
|
|
2386
2402
|
// src/utils/generateBrandStyles.ts
|
|
2387
2403
|
function generateBrandCssVariables(brandConfig) {
|
|
@@ -2429,4 +2445,4 @@ ${generateBrandCssVariables(brandConfig)}`;
|
|
|
2429
2445
|
|
|
2430
2446
|
|
|
2431
2447
|
exports.useAurumStore = useAurumStore; exports.waitForStoreHydration = waitForStoreHydration; exports.useWidgetContext = useWidgetContext; exports.WidgetProvider = WidgetProvider; exports.DEFAULT_THEME = DEFAULT_THEME; exports.getDefaultThemeConfig = getDefaultThemeConfig; exports.POWERED_BY_SPACER_REM = POWERED_BY_SPACER_REM; exports.PageTransitionContainer = PageTransitionContainer; exports.PoweredBy = PoweredBy; exports.Modal = Modal; exports.Spacer = Spacer; exports.ThemeContainer = ThemeContainer; exports.useNavigation = useNavigation; exports.sortWallets = sortWallets; exports.initSentry = initSentry; exports.sentryLogger = sentryLogger; exports.createConfigError = createConfigError; exports.isMobile = isMobile; exports.ConnectUIProviders = ConnectUIProviders; exports.ConnectPages = ConnectPages; exports.generateCompleteStyles = generateCompleteStyles;
|
|
2432
|
-
//# sourceMappingURL=chunk-
|
|
2448
|
+
//# sourceMappingURL=chunk-F4RYBD6L.js.map
|