@0xsquid/ui 2.3.2-beta.1 → 2.3.2-beta.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/dist/cjs/index.js
CHANGED
|
@@ -3543,8 +3543,8 @@ const borderClassMap = {
|
|
|
3543
3543
|
inset: "tw-outline tw-outline-1 -tw-outline-offset-1 tw-outline-material-light-thin",
|
|
3544
3544
|
};
|
|
3545
3545
|
function Image$1(_a) {
|
|
3546
|
-
var { src, size = "medium", className: propsClassName, placeholderImageUrl, border = "none", rounded = "xxs", shadow = false, children, containerProps } = _a, props = __rest$1(_a, ["src", "size", "className", "placeholderImageUrl", "border", "rounded", "shadow", "children", "containerProps"]);
|
|
3547
|
-
const className = cn("tw-object-cover tw-aspect-square tw-relative tw-duration-300 tw-transition-[width,height] tw-max-w-full
|
|
3546
|
+
var { src, size = "medium", className: propsClassName, placeholderImageUrl, border = "none", rounded = "xxs", shadow = false, solidBg = false, children, containerProps } = _a, props = __rest$1(_a, ["src", "size", "className", "placeholderImageUrl", "border", "rounded", "shadow", "solidBg", "children", "containerProps"]);
|
|
3547
|
+
const className = cn("tw-object-cover tw-aspect-square tw-relative tw-duration-300 tw-transition-[width,height] tw-max-w-full", sizeClassMap[size], propsClassName, roundedClassMap$1[rounded], shadow && boxShadowClassMap[size], solidBg && "tw-bg-grey-100", borderClassMap[border]);
|
|
3548
3548
|
const [imageState, setImageState] = React$1.useState(exports.ImageState.LOADING);
|
|
3549
3549
|
return (jsxRuntime.jsxs("div", Object.assign({}, containerProps, { className: cn("tw-relative", containerProps === null || containerProps === void 0 ? void 0 : containerProps.className), children: [border === "gradient" && (jsxRuntime.jsx("span", { style: {
|
|
3550
3550
|
borderRadius: gradientRoundedClassMap[rounded],
|
|
@@ -18973,6 +18973,7 @@ function AccountListItem({ isConnected, imageUrls = [], imageUrl, badgeUrl, acti
|
|
|
18973
18973
|
className: isConnected ? undefined : "!tw-bg-royal-500",
|
|
18974
18974
|
border: "outline-lg",
|
|
18975
18975
|
size: "medium",
|
|
18976
|
+
solidBg: true,
|
|
18976
18977
|
};
|
|
18977
18978
|
return (jsxRuntime.jsxs("li", { className: "tw-flex tw-h-[80px] tw-w-full tw-items-center tw-gap-squid-s tw-px-squid-m tw-py-squid-xs tw-text-grey-300", children: [imageUrl != null ? (jsxRuntime.jsx(BadgeImage, { className: "tw-min-w-fit", image: {
|
|
18978
18979
|
src: imageUrl,
|
|
@@ -14,6 +14,7 @@ export interface ImageProps extends React.ComponentProps<"img"> {
|
|
|
14
14
|
border?: ImageBorder;
|
|
15
15
|
rounded?: ImageRoundedSize;
|
|
16
16
|
shadow?: boolean;
|
|
17
|
+
solidBg?: boolean;
|
|
17
18
|
containerProps?: React.ComponentProps<"div">;
|
|
18
19
|
}
|
|
19
|
-
export declare function Image({ src, size, className: propsClassName, placeholderImageUrl, border, rounded, shadow, children, containerProps, ...props }: ImageProps): import("react/jsx-runtime").JSX.Element;
|
|
20
|
+
export declare function Image({ src, size, className: propsClassName, placeholderImageUrl, border, rounded, shadow, solidBg, children, containerProps, ...props }: ImageProps): import("react/jsx-runtime").JSX.Element;
|
package/dist/esm/index.js
CHANGED
|
@@ -3523,8 +3523,8 @@ const borderClassMap = {
|
|
|
3523
3523
|
inset: "tw-outline tw-outline-1 -tw-outline-offset-1 tw-outline-material-light-thin",
|
|
3524
3524
|
};
|
|
3525
3525
|
function Image$1(_a) {
|
|
3526
|
-
var { src, size = "medium", className: propsClassName, placeholderImageUrl, border = "none", rounded = "xxs", shadow = false, children, containerProps } = _a, props = __rest$1(_a, ["src", "size", "className", "placeholderImageUrl", "border", "rounded", "shadow", "children", "containerProps"]);
|
|
3527
|
-
const className = cn("tw-object-cover tw-aspect-square tw-relative tw-duration-300 tw-transition-[width,height] tw-max-w-full
|
|
3526
|
+
var { src, size = "medium", className: propsClassName, placeholderImageUrl, border = "none", rounded = "xxs", shadow = false, solidBg = false, children, containerProps } = _a, props = __rest$1(_a, ["src", "size", "className", "placeholderImageUrl", "border", "rounded", "shadow", "solidBg", "children", "containerProps"]);
|
|
3527
|
+
const className = cn("tw-object-cover tw-aspect-square tw-relative tw-duration-300 tw-transition-[width,height] tw-max-w-full", sizeClassMap[size], propsClassName, roundedClassMap$1[rounded], shadow && boxShadowClassMap[size], solidBg && "tw-bg-grey-100", borderClassMap[border]);
|
|
3528
3528
|
const [imageState, setImageState] = useState(ImageState.LOADING);
|
|
3529
3529
|
return (jsxs("div", Object.assign({}, containerProps, { className: cn("tw-relative", containerProps === null || containerProps === void 0 ? void 0 : containerProps.className), children: [border === "gradient" && (jsx("span", { style: {
|
|
3530
3530
|
borderRadius: gradientRoundedClassMap[rounded],
|
|
@@ -18953,6 +18953,7 @@ function AccountListItem({ isConnected, imageUrls = [], imageUrl, badgeUrl, acti
|
|
|
18953
18953
|
className: isConnected ? undefined : "!tw-bg-royal-500",
|
|
18954
18954
|
border: "outline-lg",
|
|
18955
18955
|
size: "medium",
|
|
18956
|
+
solidBg: true,
|
|
18956
18957
|
};
|
|
18957
18958
|
return (jsxs("li", { className: "tw-flex tw-h-[80px] tw-w-full tw-items-center tw-gap-squid-s tw-px-squid-m tw-py-squid-xs tw-text-grey-300", children: [imageUrl != null ? (jsx(BadgeImage, { className: "tw-min-w-fit", image: {
|
|
18958
18959
|
src: imageUrl,
|
|
@@ -14,6 +14,7 @@ export interface ImageProps extends React.ComponentProps<"img"> {
|
|
|
14
14
|
border?: ImageBorder;
|
|
15
15
|
rounded?: ImageRoundedSize;
|
|
16
16
|
shadow?: boolean;
|
|
17
|
+
solidBg?: boolean;
|
|
17
18
|
containerProps?: React.ComponentProps<"div">;
|
|
18
19
|
}
|
|
19
|
-
export declare function Image({ src, size, className: propsClassName, placeholderImageUrl, border, rounded, shadow, children, containerProps, ...props }: ImageProps): import("react/jsx-runtime").JSX.Element;
|
|
20
|
+
export declare function Image({ src, size, className: propsClassName, placeholderImageUrl, border, rounded, shadow, solidBg, children, containerProps, ...props }: ImageProps): import("react/jsx-runtime").JSX.Element;
|
package/dist/index.d.ts
CHANGED
|
@@ -65,9 +65,10 @@ interface ImageProps extends React.ComponentProps<"img"> {
|
|
|
65
65
|
border?: ImageBorder;
|
|
66
66
|
rounded?: ImageRoundedSize;
|
|
67
67
|
shadow?: boolean;
|
|
68
|
+
solidBg?: boolean;
|
|
68
69
|
containerProps?: React.ComponentProps<"div">;
|
|
69
70
|
}
|
|
70
|
-
declare function Image({ src, size, className: propsClassName, placeholderImageUrl, border, rounded, shadow, children, containerProps, ...props }: ImageProps): react_jsx_runtime.JSX.Element;
|
|
71
|
+
declare function Image({ src, size, className: propsClassName, placeholderImageUrl, border, rounded, shadow, solidBg, children, containerProps, ...props }: ImageProps): react_jsx_runtime.JSX.Element;
|
|
71
72
|
|
|
72
73
|
interface BadgeImageProps {
|
|
73
74
|
badge?: ImageProps;
|