@0xsequence/marketplace-sdk 0.3.6 → 0.3.7

package/dist/{chunk-Z3VR2KMP.js → chunk-QGELCUYG.js}

@@ -14,6 +14,12 @@ import {
   getPresentableChainName,
   getPublicRpcClient
 } from "./chunk-OUZ42I6B.js";
+import {
+  ERC1155_ABI
+} from "./chunk-WFE6OCYF.js";
+import {
+  EIP2981_ABI
+} from "./chunk-3OHM45R3.js";
 import {
   AddressSchema,
   ChainIdSchema,
@@ -79,12 +85,6 @@ import {
   UnexpectedStepsError,
   UnknownTransactionTypeError
 } from "./chunk-T2AMWIKD.js";
-import {
-  EIP2981_ABI
-} from "./chunk-3OHM45R3.js";
-import {
-  ERC1155_ABI
-} from "./chunk-WFE6OCYF.js";
 
 // src/react/hooks/useBalanceOfCollectible.tsx
 import { queryOptions, skipToken, useQuery } from "@tanstack/react-query";
@@ -2395,4 +2395,4 @@ export {
   useCancelOrder,
   useBuyCollectable
 };
-//# sourceMappingURL=chunk-Z3VR2KMP.js.map
+//# sourceMappingURL=chunk-QGELCUYG.js.map

package/dist/index.js

@@ -1,4 +1,5 @@
 "use client"
+import "./chunk-MJ4YU7RW.js";
 import {
   calculatePriceDifferencePercentage,
   compareAddress,
@@ -7,7 +8,17 @@ import {
   truncateEnd,
   truncateMiddle
 } from "./chunk-OUZ42I6B.js";
-import "./chunk-MJ4YU7RW.js";
+import "./chunk-MCI3KOSQ.js";
+import {
+  ERC1155_ABI,
+  ERC20_ABI,
+  ERC721_ABI
+} from "./chunk-WFE6OCYF.js";
+import {
+  EIP2981_ABI,
+  SequenceMarketplaceV1_ABI,
+  SequenceMarketplaceV2_ABI
+} from "./chunk-3OHM45R3.js";
 import "./chunk-Q2BVDQ3G.js";
 import {
   CollectibleStatus,
@@ -28,17 +39,6 @@ import {
 } from "./chunk-D3HRXVYJ.js";
 import "./chunk-3CXEYH2I.js";
 import "./chunk-T2AMWIKD.js";
-import "./chunk-MCI3KOSQ.js";
-import {
-  EIP2981_ABI,
-  SequenceMarketplaceV1_ABI,
-  SequenceMarketplaceV2_ABI
-} from "./chunk-3OHM45R3.js";
-import {
-  ERC1155_ABI,
-  ERC20_ABI,
-  ERC721_ABI
-} from "./chunk-WFE6OCYF.js";
 
 // src/consts.ts
 var SEQUENCE_MARKET_V1_ADDRESS = "0xB537a160472183f2150d42EB1c3DD6684A55f74c";

package/dist/react/hooks/index.js

@@ -58,20 +58,20 @@ import {
   useMarketplaceConfig,
   useRoyaltyPercentage,
   useTransferTokens
-} from "../../chunk-Z3VR2KMP.js";
+} from "../../chunk-QGELCUYG.js";
 import "../../chunk-Y7YO5TLE.js";
 import "../../chunk-7NJETFMF.js";
 import "../../chunk-SBVLWSRZ.js";
 import "../../chunk-NJ2GXOPW.js";
-import "../../chunk-OUZ42I6B.js";
 import "../../chunk-MJ4YU7RW.js";
+import "../../chunk-OUZ42I6B.js";
+import "../../chunk-MCI3KOSQ.js";
+import "../../chunk-WFE6OCYF.js";
+import "../../chunk-3OHM45R3.js";
 import "../../chunk-Q2BVDQ3G.js";
 import "../../chunk-D3HRXVYJ.js";
 import "../../chunk-3CXEYH2I.js";
 import "../../chunk-T2AMWIKD.js";
-import "../../chunk-MCI3KOSQ.js";
-import "../../chunk-3OHM45R3.js";
-import "../../chunk-WFE6OCYF.js";
 export {
   UseGenerateBuyTransactionArgsSchema,
   balanceOfCollectibleOptions,

package/dist/react/index.js

@@ -8,10 +8,10 @@ import {
   useSellModal,
   useSuccessfulPurchaseModal,
   useTransferModal
-} from "../chunk-F42XMKDS.js";
+} from "../chunk-3LGNSRBR.js";
 import "../chunk-NMCGA2TB.js";
 import "../chunk-FFCNYF3S.js";
-import "../chunk-RZSZNVEH.js";
+import "../chunk-L6GSYPCR.js";
 import "../chunk-O642NH7U.js";
 import {
   MarketplaceProvider,
@@ -74,13 +74,16 @@ import {
   useMarketplaceConfig,
   useRoyaltyPercentage,
   useTransferTokens
-} from "../chunk-Z3VR2KMP.js";
+} from "../chunk-QGELCUYG.js";
 import "../chunk-Y7YO5TLE.js";
 import "../chunk-7NJETFMF.js";
 import "../chunk-SBVLWSRZ.js";
 import "../chunk-NJ2GXOPW.js";
-import "../chunk-OUZ42I6B.js";
 import "../chunk-MJ4YU7RW.js";
+import "../chunk-OUZ42I6B.js";
+import "../chunk-MCI3KOSQ.js";
+import "../chunk-WFE6OCYF.js";
+import "../chunk-3OHM45R3.js";
 import "../chunk-Q2BVDQ3G.js";
 import {
   getQueryClient
@@ -89,9 +92,6 @@ import {
   createWagmiConfig
 } from "../chunk-3CXEYH2I.js";
 import "../chunk-T2AMWIKD.js";
-import "../chunk-MCI3KOSQ.js";
-import "../chunk-3OHM45R3.js";
-import "../chunk-WFE6OCYF.js";
 export {
   CollectibleCard,
   MarketplaceProvider,

package/dist/react/ui/components/index.js

@@ -1,25 +1,25 @@
 "use client"
 import {
   CollectibleCard
-} from "../../../chunk-F42XMKDS.js";
+} from "../../../chunk-3LGNSRBR.js";
 import "../../../chunk-NMCGA2TB.js";
 import "../../../chunk-FFCNYF3S.js";
-import "../../../chunk-RZSZNVEH.js";
+import "../../../chunk-L6GSYPCR.js";
 import "../../../chunk-O642NH7U.js";
-import "../../../chunk-Z3VR2KMP.js";
+import "../../../chunk-QGELCUYG.js";
 import "../../../chunk-Y7YO5TLE.js";
 import "../../../chunk-7NJETFMF.js";
 import "../../../chunk-SBVLWSRZ.js";
 import "../../../chunk-NJ2GXOPW.js";
-import "../../../chunk-OUZ42I6B.js";
 import "../../../chunk-MJ4YU7RW.js";
+import "../../../chunk-OUZ42I6B.js";
+import "../../../chunk-MCI3KOSQ.js";
+import "../../../chunk-WFE6OCYF.js";
+import "../../../chunk-3OHM45R3.js";
 import "../../../chunk-Q2BVDQ3G.js";
 import "../../../chunk-D3HRXVYJ.js";
 import "../../../chunk-3CXEYH2I.js";
 import "../../../chunk-T2AMWIKD.js";
-import "../../../chunk-MCI3KOSQ.js";
-import "../../../chunk-3OHM45R3.js";
-import "../../../chunk-WFE6OCYF.js";
 export {
   CollectibleCard
 };

package/dist/react/ui/index.js

@@ -8,25 +8,25 @@ import {
   useSellModal,
   useSuccessfulPurchaseModal,
   useTransferModal
-} from "../../chunk-F42XMKDS.js";
+} from "../../chunk-3LGNSRBR.js";
 import "../../chunk-NMCGA2TB.js";
 import "../../chunk-FFCNYF3S.js";
-import "../../chunk-RZSZNVEH.js";
+import "../../chunk-L6GSYPCR.js";
 import "../../chunk-O642NH7U.js";
-import "../../chunk-Z3VR2KMP.js";
+import "../../chunk-QGELCUYG.js";
 import "../../chunk-Y7YO5TLE.js";
 import "../../chunk-7NJETFMF.js";
 import "../../chunk-SBVLWSRZ.js";
 import "../../chunk-NJ2GXOPW.js";
-import "../../chunk-OUZ42I6B.js";
 import "../../chunk-MJ4YU7RW.js";
+import "../../chunk-OUZ42I6B.js";
+import "../../chunk-MCI3KOSQ.js";
+import "../../chunk-WFE6OCYF.js";
+import "../../chunk-3OHM45R3.js";
 import "../../chunk-Q2BVDQ3G.js";
 import "../../chunk-D3HRXVYJ.js";
 import "../../chunk-3CXEYH2I.js";
 import "../../chunk-T2AMWIKD.js";
-import "../../chunk-MCI3KOSQ.js";
-import "../../chunk-3OHM45R3.js";
-import "../../chunk-WFE6OCYF.js";
 export {
   CollectibleCard,
   ModalProvider,

package/dist/react/ui/styles/index.d.ts

@@ -1,5 +1,5 @@
 declare const dialogOverlay: string;
-declare const dialogContent: Record<"narrow" | "wide", string>;
+declare const dialogContent: Record<"wide" | "narrow", string>;
 declare const closeButton: string;
 
 export { closeButton, dialogContent, dialogOverlay };

package/dist/styles/index.d.ts

@@ -43,7 +43,7 @@ declare const alertMessageBox: string;
 declare const alertMessageBoxVariants: Record<"info" | "warning", string>;
 
 declare const switchChainModalContent: string;
-declare const switchChainCta: Record<"default" | "pending", string>;
+declare const switchChainCta: Record<"pending" | "default", string>;
 
 declare const collectiblesGrid: string;
 declare const collectiblesGridItem: string;

package/dist/styles/index.js

@@ -18,7 +18,7 @@ import {
   quantityInputWrapper,
   tokenPreview,
   transferModalContent
-} from "../chunk-RZSZNVEH.js";
+} from "../chunk-L6GSYPCR.js";
 import {
   cta
 } from "../chunk-O642NH7U.js";

package/dist/utils/abi/index.js

@@ -1,15 +1,15 @@
 "use client"
 import "../../chunk-MCI3KOSQ.js";
-import {
-  EIP2981_ABI,
-  SequenceMarketplaceV1_ABI,
-  SequenceMarketplaceV2_ABI
-} from "../../chunk-3OHM45R3.js";
 import {
   ERC1155_ABI,
   ERC20_ABI,
   ERC721_ABI
 } from "../../chunk-WFE6OCYF.js";
+import {
+  EIP2981_ABI,
+  SequenceMarketplaceV1_ABI,
+  SequenceMarketplaceV2_ABI
+} from "../../chunk-3OHM45R3.js";
 export {
   EIP2981_ABI,
   ERC1155_ABI,

package/dist/utils/index.js

@@ -7,18 +7,18 @@ import {
   truncateEnd,
   truncateMiddle
 } from "../chunk-OUZ42I6B.js";
-import "../chunk-T2AMWIKD.js";
 import "../chunk-MCI3KOSQ.js";
-import {
-  EIP2981_ABI,
-  SequenceMarketplaceV1_ABI,
-  SequenceMarketplaceV2_ABI
-} from "../chunk-3OHM45R3.js";
 import {
   ERC1155_ABI,
   ERC20_ABI,
   ERC721_ABI
 } from "../chunk-WFE6OCYF.js";
+import {
+  EIP2981_ABI,
+  SequenceMarketplaceV1_ABI,
+  SequenceMarketplaceV2_ABI
+} from "../chunk-3OHM45R3.js";
+import "../chunk-T2AMWIKD.js";
 export {
   EIP2981_ABI,
   ERC1155_ABI,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@0xsequence/marketplace-sdk",
   "private": false,
-  "version": "0.3.6",
+  "version": "0.3.7",
   "type": "module",
   "exports": {
     ".": {

package/src/react/ui/components/_internals/custom-select/CustomSelect.tsx

@@ -9,7 +9,7 @@ interface CustomSelectProps {
 		label: string;
 		disabled?: boolean;
 	}>;
-	placeholder?: string;
+	value: string;
 	onValueChange?: (value: string) => void;
 	defaultValue?: string;
 }
@@ -30,14 +30,14 @@ const CustomSelectItem = React.forwardRef<
 
 export const CustomSelect: React.FC<CustomSelectProps> = ({
 	items,
-	placeholder = 'Select an item...',
+	value,
 	onValueChange,
 	defaultValue,
 }) => {
 	return (
 		<Select.Root onValueChange={onValueChange} defaultValue={defaultValue}>
-			<Select.Trigger className={trigger}>
-				<Select.Value placeholder={placeholder} />
+			<Select.Trigger className={trigger} value={value}>
+				<Select.Value />
 				<Select.Icon>
 					<ChevronDownIcon size="xs" />
 				</Select.Icon>

package/src/react/ui/modals/BuyModal/index.tsx

@@ -172,13 +172,13 @@ const ERC1155QuantityModal = observer(
 						decimals={order.quantityDecimals}
 						maxQuantity={order.quantityRemaining}
 					/>
-					<Box display="flex" flexDirection="column" gap="2">
+					<Box display="flex" justifyContent="space-between">
 						<Text color="text50" fontSize="small">
 							Total Price
 						</Text>
 						<Box display="flex" alignItems="center" gap="2">
 							<TokenImage src={currency?.imageUrl} size="xs" />
-							<Text color="text" fontSize="large" fontWeight="bold">
+							<Text color="text100" fontSize="small" fontWeight="bold">
 								{formatUnits(BigInt(totalPrice), currency?.decimals || 0)}
 							</Text>
 						</Box>

package/src/react/ui/modals/_internal/components/currencyOptionsSelect/index.tsx

@@ -16,30 +16,32 @@ type SelectOption = {
 type CurrencyOptionsSelectProps = {
 	collectionAddress: Hex;
 	chainId: ChainId;
-	$selectedCurrency: Observable<Currency | null | undefined>;
+	selectedCurrency$: Observable<Currency | null | undefined>;
 };
 
 const CurrencyOptionsSelect = observer(function CurrencyOptionsSelect({
 	chainId,
 	collectionAddress,
-	$selectedCurrency,
+	selectedCurrency$,
 }: CurrencyOptionsSelectProps) {
+	const currency = selectedCurrency$.get() as Currency;
 	const { data: currencies, isLoading: currenciesLoading } = useCurrencies({
 		collectionAddress,
 		chainId,
 	});
 
+	// set default currency
 	useEffect(() => {
 		if (
 			currencies &&
 			currencies.length > 0 &&
-			!$selectedCurrency.contractAddress.get()
+			!selectedCurrency$.contractAddress.get()
 		) {
-			$selectedCurrency.set(currencies[0]);
+			selectedCurrency$.set(currencies[0]);
 		}
 	}, [currencies]);
 
-	if (!currencies || currenciesLoading) {
+	if (!currencies || currenciesLoading || !currency.symbol) {
 		return <Skeleton borderRadius="lg" width="20" height="7" marginRight="3" />;
 	}
 
@@ -57,11 +59,17 @@ const CurrencyOptionsSelect = observer(function CurrencyOptionsSelect({
 			(currency) => currency.contractAddress === value,
 		)!;
 
-		$selectedCurrency.set(c);
+		selectedCurrency$.set(c);
 	};
 
+	console.log('currency', currency);
+
 	return (
-		<CustomSelect items={options} onValueChange={onChange} placeholder="" />
+		<CustomSelect
+			items={options}
+			value={currency.symbol}
+			onValueChange={onChange}
+		/>
 	);
 });
 

package/src/react/ui/modals/_internal/components/expirationDateSelect/index.tsx

@@ -1,6 +1,6 @@
 import { useState } from 'react';
 
-import { Box, Text } from '@0xsequence/design-system';
+import { Box, Skeleton, Text } from '@0xsequence/design-system';
 import type { Observable } from '@legendapp/state';
 import { observer } from '@legendapp/state/react';
 import { addDays, isSameDay } from 'date-fns';
@@ -47,7 +47,8 @@ const ExpirationDateSelect = observer(function ExpirationDateSelect({
 	className,
 	$date,
 }: ExpirationDateSelectProps) {
-	const [_, setRange] = useState<rangeType>('1_week');
+	const defaultRange = '1_week';
+	const [range, setRange] = useState<rangeType>(defaultRange);
 	function handleSelectPresetRange(range: rangeType) {
 		setRange(range);
 
@@ -76,6 +77,10 @@ const ExpirationDateSelect = observer(function ExpirationDateSelect({
 		$date.set(date);
 	}
 
+	if (!$date.get()) {
+		return <Skeleton borderRadius="lg" width="20" height="7" marginRight="3" />;
+	}
+
 	return (
 		<Box width="full" position="relative">
 			<Text
@@ -108,25 +113,11 @@ const ExpirationDateSelect = observer(function ExpirationDateSelect({
 							label: preset.label,
 							value: preset.value,
 						}))}
-						placeholder={
-							Object.values(PRESET_RANGES).find((preset) =>
-								isSameDay(
-									new Date($date.get()),
-									addDays(new Date(), preset.offset),
-								),
-							)?.label
-						}
+						value={range}
+						defaultValue={defaultRange}
 						onValueChange={(value) =>
 							handleSelectPresetRange(value as rangeType)
 						}
-						defaultValue={
-							Object.values(PRESET_RANGES).find((preset) =>
-								isSameDay(
-									new Date($date.get()),
-									addDays(new Date(), preset.offset),
-								),
-							)?.value
-						}
 					/>
 				</Box>
 

package/src/react/ui/modals/_internal/components/priceInput/index.tsx

@@ -83,7 +83,7 @@ const PriceInput = observer(function PriceInput({
 				labelLocation="top"
 				controls={
 					<CurrencyOptionsSelect
-						$selectedCurrency={$listingPrice?.currency}
+						selectedCurrency$={$listingPrice?.currency}
 						collectionAddress={collectionAddress}
 						chainId={chainId}
 					/>