@0xsquid/ui 2.2.3 → 2.2.5-beta.0

package/dist/cjs/types/services/internal/colorService.d.ts

@@ -1,5 +1,11 @@
 import { type Theme } from "../../types/config";
 import { type ThemeType } from "../../types";
+interface RGB {
+    r: number;
+    g: number;
+    b: number;
+    a: number;
+}
 /**
  * Parses the user readable config to css variables
  * and adds the material-* variants
@@ -30,5 +36,9 @@ export declare function hexToRgb(hex: string): {
     a: number;
 } | null;
 export declare function rgbToHex(r: number, g: number, b: number): string;
-export declare function blendColors(foreground: string, background: string): string | null;
+export declare function blendColors(foreground: string, background: string, factor?: number): string | null;
 export declare const isValidHexColor: (hex: string) => boolean;
+export declare function parseColor(color: string): RGB | null;
+export declare const getColorBrightness: (color: string) => number;
+export declare const getWalletCardBackground: (colors: string[]) => string | undefined;
+export {};

package/dist/cjs/types/stories/badges/BadgeImage.stories.d.ts

@@ -1,15 +1,12 @@
-import { Meta, StoryObj } from "@storybook/react";
+import { type Meta, type StoryObj } from "@storybook/react";
 import { BadgeImage } from "../../components/badges/BadgeImage";
 declare const meta: Meta<typeof BadgeImage>;
 export default meta;
 type Story = StoryObj<typeof meta>;
-export declare const ImageOnly: Story;
-export declare const BadgeAndImage: Story;
+export declare const Large: Story;
+export declare const ExtraLarge: Story;
+export declare const ExtraExtraLarge: Story;
+export declare const RoundedFull: Story;
 export declare const ExtraMarginForBadge: Story;
-export declare const Rounded: Story;
-export declare const SizeMedium: Story;
-export declare const SizeSmall: Story;
-export declare const CustomPlaceholderForBrokenImage: Story;
-export declare const CustomPlaceholderForLoadingImage: Story;
-export declare const CustomPlaceholderForBrokenBadgeImage: Story;
-export declare const CustomPlaceholderForLoadingBadgeImage: Story;
+export declare const TokenBadge: Story;
+export declare const PlaceholderForBrokenImage: Story;

package/dist/cjs/types/stories/badges/IconLabel.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from "@storybook/react";
+import { type Meta, type StoryObj } from "@storybook/react";
 import { IconLabel } from "../../components/badges/IconLabel";
 declare const meta: Meta<typeof IconLabel>;
 export default meta;

package/dist/cjs/types/stories/badges/Image.stories.d.ts

@@ -0,0 +1,16 @@
+import { type Meta, type StoryObj } from "@storybook/react";
+import { Image } from "../../components/badges/Image";
+declare const meta: Meta<typeof Image>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Small: Story;
+export declare const Medium: Story;
+export declare const Large: Story;
+export declare const ExtraLarge: Story;
+export declare const ExtraLargeLoading: Story;
+export declare const ExtraExtraLarge: Story;
+export declare const GradientBorder: Story;
+export declare const InsetBorder: Story;
+export declare const OutlineBorder: Story;
+export declare const RoundedFull: Story;
+export declare const CustomContent: Story;

package/dist/cjs/types/stories/badges/PriceChange.stories.d.ts

@@ -0,0 +1,8 @@
+import { type Meta, type StoryObj } from "@storybook/react";
+import { PriceChange } from "../../components/badges/PriceChange";
+declare const meta: Meta<typeof PriceChange>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Positive: Story;
+export declare const Negative: Story;
+export declare const Neutral: Story;

package/dist/cjs/types/stories/buttons/AddressButton.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from "@storybook/react";
+import { type Meta, type StoryObj } from "@storybook/react";
 import { AddressButton } from "../../components/buttons/AddressButton";
 declare const meta: Meta<typeof AddressButton>;
 export default meta;

package/dist/cjs/types/stories/buttons/Button.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from "@storybook/react";
+import { type Meta, type StoryObj } from "@storybook/react";
 import { Button } from "../../components/buttons/Button";
 declare const meta: Meta<typeof Button>;
 export default meta;

package/dist/cjs/types/stories/buttons/FilterButton.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from "@storybook/react";
+import { type Meta, type StoryObj } from "@storybook/react";
 import { FilterButton } from "../../components/buttons/FilterButton";
 declare const meta: Meta<typeof FilterButton>;
 export default meta;

package/dist/cjs/types/stories/cards/WalletCard.stories.d.ts

@@ -0,0 +1,11 @@
+import { type Meta, type StoryObj } from "@storybook/react";
+import { WalletCard } from "../../components/cards/WalletCard";
+declare const meta: Meta<typeof WalletCard>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Disconnected: Story;
+export declare const ConnectedEVM: Story;
+export declare const ConnectedSolana: Story;
+export declare const ConnectedCosmos: Story;
+export declare const LightBackground: Story;
+export declare const ConnectedSelected: Story;

package/dist/cjs/types/stories/controls/Tooltip.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from "@storybook/react";
+import { type Meta, type StoryObj } from "@storybook/react";
 import { Tooltip } from "../../components/controls/Tooltip";
 declare const meta: Meta<typeof Tooltip>;
 export default meta;

package/dist/cjs/types/stories/layout/ImageStack.stories.d.ts

@@ -0,0 +1,8 @@
+import { type Meta, type StoryObj } from "@storybook/react";
+import { ImageStack } from "../../components/layout/ImageStack";
+declare const meta: Meta<typeof ImageStack>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const NegativeSpacing: Story;
+export declare const LargeImages: Story;

package/dist/cjs/types/stories/layout/Toast.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from "@storybook/react";
+import { type Meta, type StoryObj } from "@storybook/react";
 import { Toast } from "../../components/layout/Toast";
 declare const meta: Meta<typeof Toast>;
 export default meta;

package/dist/cjs/types/stories/layout/TokenDetailsView.stories.d.ts

@@ -0,0 +1,13 @@
+import { type Meta, type StoryObj } from "@storybook/react";
+import { TokenDetailsView } from "../../components/layout/TokenDetailsView";
+declare const meta: Meta<typeof TokenDetailsView>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const PositivePriceChange: Story;
+export declare const LowBalance: Story;
+export declare const HighBalance: Story;
+export declare const DifferentToken: Story;
+export declare const Closed: Story;
+export declare const Loading: Story;
+export declare const WithFakeChart: Story;

package/dist/cjs/types/stories/layout/TransactionProperties.stories.d.ts

@@ -1,5 +1,5 @@
-import { Meta, StoryObj } from "@storybook/react/*";
-import { TransactionProperties, TransactionPropertiesProps } from "../../components/layout/TransactionProperties";
+import { type Meta, type StoryObj } from "@storybook/react/*";
+import { TransactionProperties, type TransactionPropertiesProps } from "../../components/layout/TransactionProperties";
 declare const meta: Meta<typeof TransactionProperties>;
 export default meta;
 type Story = StoryObj<TransactionPropertiesProps>;

package/dist/cjs/types/stories/layout/TransactionSearch.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from "@storybook/react/*";
+import { type Meta, type StoryObj } from "@storybook/react/*";
 import { TransactionSearch } from "../../components/layout/TransactionSearch";
 declare const meta: Meta<typeof TransactionSearch>;
 export default meta;

package/dist/cjs/types/stories/lists/HistoryItem.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from "@storybook/react";
+import { type Meta, type StoryObj } from "@storybook/react";
 import { HistoryItem } from "../../components/lists/HistoryItem";
 declare const meta: Meta<typeof HistoryItem>;
 export default meta;
@@ -10,3 +10,4 @@ export declare const Warning: Story;
 export declare const WithActions: Story;
 export declare const WithActionsSubmenu: Story;
 export declare const IsClickable: Story;
+export declare const LargeAmount: Story;

package/dist/cjs/types/stories/lists/ListItem.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from "@storybook/react";
+import { type Meta, type StoryObj } from "@storybook/react";
 import { ListItem } from "../../components/lists/ListItem";
 declare const meta: Meta<typeof ListItem>;
 export default meta;

package/dist/cjs/types/stories/lists/PropertyListItem.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from "@storybook/react";
+import { type Meta, type StoryObj } from "@storybook/react";
 import { PropertyListItem } from "../../components/lists/PropertyListItem";
 declare const meta: Meta<typeof PropertyListItem>;
 export default meta;

package/dist/cjs/types/stories/lists/SwapStepItem.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from "@storybook/react";
+import { type Meta, type StoryObj } from "@storybook/react";
 import { SwapStepItem } from "../../components/lists/SwapStepItem";
 declare const meta: Meta<typeof SwapStepItem>;
 export default meta;

package/dist/cjs/types/stories/lists/TokenGroup.stories.d.ts

@@ -0,0 +1,15 @@
+import { type Meta, type StoryObj } from "@storybook/react";
+import { TokenGroup } from "../../components/lists/TokenGroup";
+declare const meta: Meta<typeof TokenGroup>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Balance: Story;
+export declare const BalanceUsd: Story;
+export declare const PositivePriceChange: Story;
+export declare const NegativePriceChange: Story;
+export declare const NeutralPriceChange: Story;
+export declare const LargeVariant: Story;
+export declare const SmallVariant: Story;
+export declare const CompactVariant: Story;
+export declare const LargeVariantWithItems: Story;
+export declare const CompactVariantWithItems: Story;

package/dist/cjs/types/stories/lists/TransactionItem.stories.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from "@storybook/react/*";
+import { type Meta, type StoryObj } from "@storybook/react/*";
 import { TransactionItem } from "../../components/lists/TransactionItem";
 declare const meta: Meta<typeof TransactionItem>;
 export default meta;

package/dist/cjs/types/types/components.d.ts

@@ -35,10 +35,15 @@ export type InputMode = "token" | "price";
 export type TransactionStateVariant = "full" | "compact" | "small";
 export type TokenPairVariant = "horizontal" | "vertical";
 export type TokenPairSize = "small" | "medium";
-export type ImageVariant = "square" | "round" | "proportional";
-export type ImageSize = "small" | "medium" | "large" | "xlarge";
+export type ImageSize = "small" | "medium" | "large" | "xlarge" | "xxlarge";
+export type ImageRoundedSize = "xxs" | "xs" | "s" | "m" | "l" | "xl" | "xxl" | "full" | "none";
+export type ImageBorder = "none" | "gradient" | "inset" | "outline-sm" | "outline-lg";
 export type ChainTypeFilter = "source" | "destination";
 export type StatusFilter = "success" | "ongoing" | "error";
 export type AssetsButtonVariant = "primary" | "accent";
 export type PropertyListItemSize = "small" | "large";
 export type DropdownPosition = "top" | "bottom" | "center";
+export interface PriceChange {
+    value: string;
+    sign: "positive" | "negative" | "neutral";
+}

package/dist/cjs/types/types/config.d.ts

@@ -1,5 +1,5 @@
 import { type DeepPartial } from "./utils";
-declare const THEME_COLOR_KEYS: readonly ["grey-100", "grey-200", "grey-300", "grey-400", "grey-500", "grey-600", "grey-700", "grey-800", "grey-900", "royal-300", "royal-400", "royal-500", "royal-700", "highlight-700", "status-positive", "status-negative", "status-partial", "button-lg-primary-bg", "button-lg-primary-text", "button-lg-secondary-bg", "button-lg-secondary-text", "button-lg-tertiary-bg", "button-lg-tertiary-text", "button-md-primary-bg", "button-md-primary-text", "button-md-secondary-bg", "button-md-secondary-text", "button-md-tertiary-bg", "button-md-tertiary-text", "input-placeholder", "input-text", "input-selection", "input-bg", "animation-bg", "animation-text", "modal-backdrop", "menu-bg", "menu-text", "menu-backdrop", "material-light-thin", "material-light-average", "material-light-thick", "material-dark-thin", "material-dark-average", "material-dark-thick", "grey-100-005", "material-light-blend-grey-900", "material-light-blend-grey-800"];
+declare const THEME_COLOR_KEYS: readonly ["grey-100", "grey-200", "grey-300", "grey-400", "grey-500", "grey-600", "grey-700", "grey-800", "grey-900", "royal-300", "royal-400", "royal-500", "royal-600", "royal-700", "highlight-700", "status-positive", "status-negative", "status-partial", "button-lg-primary-bg", "button-lg-primary-text", "button-lg-secondary-bg", "button-lg-secondary-text", "button-lg-tertiary-bg", "button-lg-tertiary-text", "button-md-primary-bg", "button-md-primary-text", "button-md-secondary-bg", "button-md-secondary-text", "button-md-tertiary-bg", "button-md-tertiary-text", "input-placeholder", "input-text", "input-selection", "input-bg", "animation-bg", "animation-text", "modal-backdrop", "menu-bg", "menu-text", "menu-backdrop", "material-light-thin", "material-light-average", "material-light-thick", "material-dark-thin", "material-dark-average", "material-dark-thick", "grey-100-005", "material-light-blend-grey-900", "material-light-blend-grey-800"];
 declare const THEME_BORDER_RADIUS_KEYS: readonly ["button-lg-primary", "button-lg-secondary", "button-lg-tertiary", "button-md-primary", "button-md-secondary", "button-md-tertiary", "container", "input", "menu-sm", "menu-lg", "modal"];
 declare const THEME_FONT_SIZE_KEYS: readonly ["caption", "body-large", "body-medium", "body-small", "heading-small", "heading-medium", "heading-large"];
 declare const THEME_FONT_WEIGHT_KEYS: readonly ["caption", "body-small", "body-medium", "body-large", "heading-small", "heading-medium", "heading-large"];