@medialane/ui 0.64.0 → 0.64.1
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.
|
@@ -54,7 +54,7 @@ function ActivityPill({ listing, getHref }) {
|
|
|
54
54
|
src: image,
|
|
55
55
|
alt: "",
|
|
56
56
|
loading: "lazy",
|
|
57
|
-
className: "w-full h-full object-cover
|
|
57
|
+
className: "w-full h-full object-cover",
|
|
58
58
|
onError: () => setImgError(true)
|
|
59
59
|
}
|
|
60
60
|
) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "w-full h-full bg-gradient-to-br from-brand-purple/20 to-brand-blue/20" }) }),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/activity-ticker.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport Link from \"next/link\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport { formatDisplayPrice } from \"../utils/format.js\";\nimport { ipfsToHttp } from \"../utils/ipfs.js\";\nimport { cn } from \"../utils/cn.js\";\nimport type { ApiOrder } from \"@medialane/sdk\";\n\nexport interface ActivityTickerProps {\n orders: ApiOrder[];\n /** Hide ticker if fewer items than this threshold. Default: 3 */\n minItems?: number;\n className?: string;\n getHref?: (order: ApiOrder) => string;\n}\n\nfunction ActivityPill({ listing, getHref }: { listing: ApiOrder; getHref: (order: ApiOrder) => string }) {\n const [imgError, setImgError] = useState(false);\n const image = listing.token?.image && !imgError ? ipfsToHttp(listing.token.image) : null;\n\n return (\n <Link\n href={getHref(listing)}\n className=\"flex-shrink-0 flex items-center gap-2 rounded-xl border border-border bg-card px-3 py-2 hover:bg-muted/60 active:scale-[0.98] transition-all duration-150 group\"\n >\n <div className=\"h-8 w-8 rounded-lg overflow-hidden bg-muted shrink-0\">\n {image ? (\n <img\n src={image}\n alt=\"\"\n loading=\"lazy\"\n className=\"w-full h-full object-cover
|
|
1
|
+
{"version":3,"sources":["../../src/components/activity-ticker.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport Link from \"next/link\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport { formatDisplayPrice } from \"../utils/format.js\";\nimport { ipfsToHttp } from \"../utils/ipfs.js\";\nimport { cn } from \"../utils/cn.js\";\nimport type { ApiOrder } from \"@medialane/sdk\";\n\nexport interface ActivityTickerProps {\n orders: ApiOrder[];\n /** Hide ticker if fewer items than this threshold. Default: 3 */\n minItems?: number;\n className?: string;\n getHref?: (order: ApiOrder) => string;\n}\n\nfunction ActivityPill({ listing, getHref }: { listing: ApiOrder; getHref: (order: ApiOrder) => string }) {\n const [imgError, setImgError] = useState(false);\n const image = listing.token?.image && !imgError ? ipfsToHttp(listing.token.image) : null;\n\n return (\n <Link\n href={getHref(listing)}\n className=\"flex-shrink-0 flex items-center gap-2 rounded-xl border border-border bg-card px-3 py-2 hover:bg-muted/60 active:scale-[0.98] transition-all duration-150 group\"\n >\n <div className=\"h-8 w-8 rounded-lg overflow-hidden bg-muted shrink-0\">\n {image ? (\n <img\n src={image}\n alt=\"\"\n loading=\"lazy\"\n className=\"w-full h-full object-cover\"\n onError={() => setImgError(true)}\n />\n ) : (\n <div className=\"w-full h-full bg-gradient-to-br from-brand-purple/20 to-brand-blue/20\" />\n )}\n </div>\n <div className=\"min-w-0\">\n <p className=\"text-xs font-medium whitespace-nowrap max-w-[100px] truncate\">\n {listing.token?.name ?? `#${listing.nftTokenId}`}\n </p>\n {listing.price?.formatted && (\n <p className=\"text-[10px] font-bold text-brand-orange whitespace-nowrap flex items-center gap-0.5\">\n {listing.price.currency && <CurrencyIcon symbol={listing.price.currency} size={10} />}\n {formatDisplayPrice(listing.price.formatted)} {listing.price.currency}\n </p>\n )}\n </div>\n </Link>\n );\n}\n\nexport function ActivityTicker({ orders, minItems = 3, className, getHref = (o) => `/asset/${o.nftContract}/${o.nftTokenId}` }: ActivityTickerProps) {\n if (orders.length < minItems) return null;\n\n return (\n <div className={cn(className)}>\n <div className=\"relative overflow-hidden py-2.5\">\n <div\n className=\"flex gap-2 w-max px-2\"\n style={{ animation: \"scroll-strip 50s linear infinite\" }}\n onMouseEnter={(e) => (e.currentTarget.style.animationPlayState = \"paused\")}\n onMouseLeave={(e) => (e.currentTarget.style.animationPlayState = \"running\")}\n >\n {[...orders, ...orders].map((listing, i) => (\n <ActivityPill key={`${listing.orderHash}-${i}`} listing={listing} getHref={getHref} />\n ))}\n </div>\n </div>\n </div>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA6BU;AA3BV,mBAAyB;AACzB,kBAAiB;AACjB,2BAA6B;AAC7B,oBAAmC;AACnC,kBAA2B;AAC3B,gBAAmB;AAWnB,SAAS,aAAa,EAAE,SAAS,QAAQ,GAAgE;AACvG,QAAM,CAAC,UAAU,WAAW,QAAI,uBAAS,KAAK;AAC9C,QAAM,QAAQ,QAAQ,OAAO,SAAS,CAAC,eAAW,wBAAW,QAAQ,MAAM,KAAK,IAAI;AAEpF,SACE;AAAA,IAAC,YAAAA;AAAA,IAAA;AAAA,MACC,MAAM,QAAQ,OAAO;AAAA,MACrB,WAAU;AAAA,MAEV;AAAA,oDAAC,SAAI,WAAU,wDACZ,kBACC;AAAA,UAAC;AAAA;AAAA,YACC,KAAK;AAAA,YACL,KAAI;AAAA,YACJ,SAAQ;AAAA,YACR,WAAU;AAAA,YACV,SAAS,MAAM,YAAY,IAAI;AAAA;AAAA,QACjC,IAEA,4CAAC,SAAI,WAAU,yEAAwE,GAE3F;AAAA,QACA,6CAAC,SAAI,WAAU,WACb;AAAA,sDAAC,OAAE,WAAU,gEACV,kBAAQ,OAAO,QAAQ,IAAI,QAAQ,UAAU,IAChD;AAAA,UACC,QAAQ,OAAO,aACd,6CAAC,OAAE,WAAU,uFACV;AAAA,oBAAQ,MAAM,YAAY,4CAAC,qCAAa,QAAQ,QAAQ,MAAM,UAAU,MAAM,IAAI;AAAA,gBAClF,kCAAmB,QAAQ,MAAM,SAAS;AAAA,YAAE;AAAA,YAAE,QAAQ,MAAM;AAAA,aAC/D;AAAA,WAEJ;AAAA;AAAA;AAAA,EACF;AAEJ;AAEO,SAAS,eAAe,EAAE,QAAQ,WAAW,GAAG,WAAW,UAAU,CAAC,MAAM,UAAU,EAAE,WAAW,IAAI,EAAE,UAAU,GAAG,GAAwB;AACnJ,MAAI,OAAO,SAAS,SAAU,QAAO;AAErC,SACE,4CAAC,SAAI,eAAW,cAAG,SAAS,GAC1B,sDAAC,SAAI,WAAU,mCACb;AAAA,IAAC;AAAA;AAAA,MACC,WAAU;AAAA,MACV,OAAO,EAAE,WAAW,mCAAmC;AAAA,MACvD,cAAc,CAAC,MAAO,EAAE,cAAc,MAAM,qBAAqB;AAAA,MACjE,cAAc,CAAC,MAAO,EAAE,cAAc,MAAM,qBAAqB;AAAA,MAEhE,WAAC,GAAG,QAAQ,GAAG,MAAM,EAAE,IAAI,CAAC,SAAS,MACpC,4CAAC,gBAA+C,SAAkB,WAA/C,GAAG,QAAQ,SAAS,IAAI,CAAC,EAAwC,CACrF;AAAA;AAAA,EACH,GACF,GACF;AAEJ;","names":["Link"]}
|
|
@@ -21,7 +21,7 @@ function ActivityPill({ listing, getHref }) {
|
|
|
21
21
|
src: image,
|
|
22
22
|
alt: "",
|
|
23
23
|
loading: "lazy",
|
|
24
|
-
className: "w-full h-full object-cover
|
|
24
|
+
className: "w-full h-full object-cover",
|
|
25
25
|
onError: () => setImgError(true)
|
|
26
26
|
}
|
|
27
27
|
) : /* @__PURE__ */ jsx("div", { className: "w-full h-full bg-gradient-to-br from-brand-purple/20 to-brand-blue/20" }) }),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/activity-ticker.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport Link from \"next/link\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport { formatDisplayPrice } from \"../utils/format.js\";\nimport { ipfsToHttp } from \"../utils/ipfs.js\";\nimport { cn } from \"../utils/cn.js\";\nimport type { ApiOrder } from \"@medialane/sdk\";\n\nexport interface ActivityTickerProps {\n orders: ApiOrder[];\n /** Hide ticker if fewer items than this threshold. Default: 3 */\n minItems?: number;\n className?: string;\n getHref?: (order: ApiOrder) => string;\n}\n\nfunction ActivityPill({ listing, getHref }: { listing: ApiOrder; getHref: (order: ApiOrder) => string }) {\n const [imgError, setImgError] = useState(false);\n const image = listing.token?.image && !imgError ? ipfsToHttp(listing.token.image) : null;\n\n return (\n <Link\n href={getHref(listing)}\n className=\"flex-shrink-0 flex items-center gap-2 rounded-xl border border-border bg-card px-3 py-2 hover:bg-muted/60 active:scale-[0.98] transition-all duration-150 group\"\n >\n <div className=\"h-8 w-8 rounded-lg overflow-hidden bg-muted shrink-0\">\n {image ? (\n <img\n src={image}\n alt=\"\"\n loading=\"lazy\"\n className=\"w-full h-full object-cover
|
|
1
|
+
{"version":3,"sources":["../../src/components/activity-ticker.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport Link from \"next/link\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport { formatDisplayPrice } from \"../utils/format.js\";\nimport { ipfsToHttp } from \"../utils/ipfs.js\";\nimport { cn } from \"../utils/cn.js\";\nimport type { ApiOrder } from \"@medialane/sdk\";\n\nexport interface ActivityTickerProps {\n orders: ApiOrder[];\n /** Hide ticker if fewer items than this threshold. Default: 3 */\n minItems?: number;\n className?: string;\n getHref?: (order: ApiOrder) => string;\n}\n\nfunction ActivityPill({ listing, getHref }: { listing: ApiOrder; getHref: (order: ApiOrder) => string }) {\n const [imgError, setImgError] = useState(false);\n const image = listing.token?.image && !imgError ? ipfsToHttp(listing.token.image) : null;\n\n return (\n <Link\n href={getHref(listing)}\n className=\"flex-shrink-0 flex items-center gap-2 rounded-xl border border-border bg-card px-3 py-2 hover:bg-muted/60 active:scale-[0.98] transition-all duration-150 group\"\n >\n <div className=\"h-8 w-8 rounded-lg overflow-hidden bg-muted shrink-0\">\n {image ? (\n <img\n src={image}\n alt=\"\"\n loading=\"lazy\"\n className=\"w-full h-full object-cover\"\n onError={() => setImgError(true)}\n />\n ) : (\n <div className=\"w-full h-full bg-gradient-to-br from-brand-purple/20 to-brand-blue/20\" />\n )}\n </div>\n <div className=\"min-w-0\">\n <p className=\"text-xs font-medium whitespace-nowrap max-w-[100px] truncate\">\n {listing.token?.name ?? `#${listing.nftTokenId}`}\n </p>\n {listing.price?.formatted && (\n <p className=\"text-[10px] font-bold text-brand-orange whitespace-nowrap flex items-center gap-0.5\">\n {listing.price.currency && <CurrencyIcon symbol={listing.price.currency} size={10} />}\n {formatDisplayPrice(listing.price.formatted)} {listing.price.currency}\n </p>\n )}\n </div>\n </Link>\n );\n}\n\nexport function ActivityTicker({ orders, minItems = 3, className, getHref = (o) => `/asset/${o.nftContract}/${o.nftTokenId}` }: ActivityTickerProps) {\n if (orders.length < minItems) return null;\n\n return (\n <div className={cn(className)}>\n <div className=\"relative overflow-hidden py-2.5\">\n <div\n className=\"flex gap-2 w-max px-2\"\n style={{ animation: \"scroll-strip 50s linear infinite\" }}\n onMouseEnter={(e) => (e.currentTarget.style.animationPlayState = \"paused\")}\n onMouseLeave={(e) => (e.currentTarget.style.animationPlayState = \"running\")}\n >\n {[...orders, ...orders].map((listing, i) => (\n <ActivityPill key={`${listing.orderHash}-${i}`} listing={listing} getHref={getHref} />\n ))}\n </div>\n </div>\n </div>\n );\n}\n"],"mappings":";AA6BU,cAgBA,YAhBA;AA3BV,SAAS,gBAAgB;AACzB,OAAO,UAAU;AACjB,SAAS,oBAAoB;AAC7B,SAAS,0BAA0B;AACnC,SAAS,kBAAkB;AAC3B,SAAS,UAAU;AAWnB,SAAS,aAAa,EAAE,SAAS,QAAQ,GAAgE;AACvG,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAC9C,QAAM,QAAQ,QAAQ,OAAO,SAAS,CAAC,WAAW,WAAW,QAAQ,MAAM,KAAK,IAAI;AAEpF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM,QAAQ,OAAO;AAAA,MACrB,WAAU;AAAA,MAEV;AAAA,4BAAC,SAAI,WAAU,wDACZ,kBACC;AAAA,UAAC;AAAA;AAAA,YACC,KAAK;AAAA,YACL,KAAI;AAAA,YACJ,SAAQ;AAAA,YACR,WAAU;AAAA,YACV,SAAS,MAAM,YAAY,IAAI;AAAA;AAAA,QACjC,IAEA,oBAAC,SAAI,WAAU,yEAAwE,GAE3F;AAAA,QACA,qBAAC,SAAI,WAAU,WACb;AAAA,8BAAC,OAAE,WAAU,gEACV,kBAAQ,OAAO,QAAQ,IAAI,QAAQ,UAAU,IAChD;AAAA,UACC,QAAQ,OAAO,aACd,qBAAC,OAAE,WAAU,uFACV;AAAA,oBAAQ,MAAM,YAAY,oBAAC,gBAAa,QAAQ,QAAQ,MAAM,UAAU,MAAM,IAAI;AAAA,YAClF,mBAAmB,QAAQ,MAAM,SAAS;AAAA,YAAE;AAAA,YAAE,QAAQ,MAAM;AAAA,aAC/D;AAAA,WAEJ;AAAA;AAAA;AAAA,EACF;AAEJ;AAEO,SAAS,eAAe,EAAE,QAAQ,WAAW,GAAG,WAAW,UAAU,CAAC,MAAM,UAAU,EAAE,WAAW,IAAI,EAAE,UAAU,GAAG,GAAwB;AACnJ,MAAI,OAAO,SAAS,SAAU,QAAO;AAErC,SACE,oBAAC,SAAI,WAAW,GAAG,SAAS,GAC1B,8BAAC,SAAI,WAAU,mCACb;AAAA,IAAC;AAAA;AAAA,MACC,WAAU;AAAA,MACV,OAAO,EAAE,WAAW,mCAAmC;AAAA,MACvD,cAAc,CAAC,MAAO,EAAE,cAAc,MAAM,qBAAqB;AAAA,MACjE,cAAc,CAAC,MAAO,EAAE,cAAc,MAAM,qBAAqB;AAAA,MAEhE,WAAC,GAAG,QAAQ,GAAG,MAAM,EAAE,IAAI,CAAC,SAAS,MACpC,oBAAC,gBAA+C,SAAkB,WAA/C,GAAG,QAAQ,SAAS,IAAI,CAAC,EAAwC,CACrF;AAAA;AAAA,EACH,GACF,GACF;AAEJ;","names":[]}
|