@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 tw-bg-grey-100", sizeClassMap[size], propsClassName, roundedClassMap$1[rounded], shadow && boxShadowClassMap[size], borderClassMap[border]);
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 tw-bg-grey-100", sizeClassMap[size], propsClassName, roundedClassMap$1[rounded], shadow && boxShadowClassMap[size], borderClassMap[border]);
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;
package/package.json CHANGED
@@ -5,7 +5,7 @@
5
5
  "url": "git+https://github.com/0xsquid/squid-ui.git"
6
6
  },
7
7
  "description": "Squid's UI components",
8
- "version": "2.3.2-beta.1",
8
+ "version": "2.3.2-beta.3",
9
9
  "author": "",
10
10
  "license": "MIT",
11
11
  "resolutions": {