@phillips/seldon 1.146.2 → 1.148.0

package/dist/components/AuctionTile/AuctionTile.d.ts

@@ -0,0 +1,20 @@
+import { ComponentProps } from 'react';
+export type AuctionTileProps = ComponentProps<'div'> & {
+    imageSrc: string;
+    imageAlt?: string;
+    type: string;
+    title: string;
+    date: string;
+    location: string;
+};
+/**
+ * ## Overview
+ *
+ * Overview of this widget
+ *
+ * [Figma Link](https://www.figma.com/design/hMu9IWH5N3KamJy8tLFdyV/RW-Design-System?node-id=22259-4172&m=dev)
+ *
+ * [Storybook Link](https://phillips-seldon.netlify.app/?path=/docs/components-auctiontile--overview)
+ */
+declare const AuctionTile: import('react').ForwardRefExoticComponent<Omit<AuctionTileProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+export default AuctionTile;

package/dist/components/AuctionTile/AuctionTile.js

@@ -0,0 +1,27 @@
+import { jsxs as s, jsx as a } from "react/jsx-runtime";
+import { forwardRef as v } from "react";
+import { getCommonProps as N } from "../../utils/index.js";
+import g from "../../node_modules/classnames/index.js";
+import { TextVariants as r } from "../Text/types.js";
+import e from "../Text/Text.js";
+const u = v(
+  ({ className: o, imageSrc: n, imageAlt: m = "Auction Image", type: c, title: l, date: d, location: p, ...t }, f) => {
+    const { className: i, ...h } = N(t, "AuctionTile"), _ = { ...h, ...t };
+    return /* @__PURE__ */ s("div", { ..._, className: g(i, o), ref: f, children: [
+      /* @__PURE__ */ a("div", { className: `${i}__image`, children: /* @__PURE__ */ a("img", { src: n, alt: m }) }),
+      /* @__PURE__ */ s("div", { className: `${i}__details`, children: [
+        /* @__PURE__ */ a(e, { variant: r.badge, children: c }),
+        /* @__PURE__ */ a(e, { variant: r.title4, children: l }),
+        /* @__PURE__ */ s("div", { className: `${i}__date_location`, children: [
+          /* @__PURE__ */ a(e, { variant: r.string2, children: d }),
+          /* @__PURE__ */ a("span", { className: `${i}__separator`, children: "•" }),
+          /* @__PURE__ */ a(e, { variant: r.string2, children: p })
+        ] })
+      ] })
+    ] });
+  }
+);
+u.displayName = "AuctionTile";
+export {
+  u as default
+};

package/dist/components/AuctionTile/AuctionTile.stories.d.ts

@@ -0,0 +1,18 @@
+import { AuctionTileProps } from './AuctionTile';
+declare const meta: {
+    title: string;
+    component: import('react').ForwardRefExoticComponent<Omit<AuctionTileProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+};
+export default meta;
+export declare const Playground: {
+    (props: AuctionTileProps): import("react/jsx-runtime").JSX.Element;
+    args: {
+        imageSrc: string;
+        type: string;
+        title: string;
+        date: string;
+        location: string;
+    };
+    argTypes: {};
+};
+export declare const MultipleAuctions: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/AuctionTile/AuctionTile.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/AuctionTile/index.d.ts

@@ -0,0 +1 @@
+export { default as AuctionTile, type AuctionTileProps } from './AuctionTile';

package/dist/index.d.ts

@@ -81,3 +81,4 @@ export * from './patterns/BidSnapshot';
 export * from './patterns/FilterMenu';
 export * from './patterns/ObjectTile';
 export * from './utils/hooks';
+export * from './components/AuctionTile';

package/dist/index.js

@@ -1,6 +1,6 @@
 import { PaddingTokens as a, SpacingTokens as f, defaultYear as s, emailValidation as l, encodeURLSearchParams as d, findChildrenExcludingTypes as m, findChildrenOfType as p, focusElementById as u, generatePaddingClassName as i, getCommonProps as x, noOp as n, px as g, useNormalizedInputProps as c } from "./utils/index.js";
 import { default as C } from "./pages/Page.js";
-import { SSRMediaQuery as B, ssrMediaQueryStyle as P } from "./providers/SeldonProvider/utils.js";
+import { SSRMediaQuery as A, ssrMediaQueryStyle as B } from "./providers/SeldonProvider/utils.js";
 import { usePendingState as L } from "./utils/hooks.js";
 import { AuctionStatus as b, LotStatus as V, SupportedLanguages as h } from "./types/commonTypes.js";
 import { default as v } from "./components/Button/Button.js";
@@ -27,8 +27,8 @@ import { default as ie } from "./components/Detail/Detail.js";
 import { default as ne } from "./components/Drawer/Drawer.js";
 import { default as ce } from "./components/Dropdown/Dropdown.js";
 import { default as Ce } from "./components/ErrorBoundary/ErrorBoundary.js";
-import { Grid as Be } from "./components/Grid/Grid.js";
-import { default as Ae } from "./components/GridItem/GridItem.js";
+import { Grid as Ae } from "./components/Grid/Grid.js";
+import { default as Pe } from "./components/GridItem/GridItem.js";
 import { GridItemAlign as Ie } from "./components/GridItem/types.js";
 import { default as Ve } from "./components/Input/Input.js";
 import { default as ke } from "./components/Link/Link.js";
@@ -53,8 +53,8 @@ import { default as pt } from "./components/Tabs/TabsContent.js";
 import { Tag as it, default as xt } from "./components/Tags/Tags.js";
 import { TextAlignments as gt, TextVariants as ct } from "./components/Text/types.js";
 import { default as Ct } from "./components/Text/Text.js";
-import { TextSymbolVariants as Bt } from "./components/TextSymbol/types.js";
-import { default as At } from "./components/TextSymbol/TextSymbol.js";
+import { TextSymbolVariants as At } from "./components/TextSymbol/types.js";
+import { default as Pt } from "./components/TextSymbol/TextSymbol.js";
 import { default as It } from "./components/Video/Video.js";
 import { default as Vt } from "./patterns/DetailList/DetailList.js";
 import { DetailListAlignment as kt } from "./patterns/DetailList/types.js";
@@ -80,7 +80,7 @@ import { default as xo } from "./components/Countdown/Countdown.js";
 import { CountdownVariants as go } from "./components/Countdown/types.js";
 import { default as So } from "./components/Divider/Divider.js";
 import { default as To } from "./components/FavoritingTileButton/FavoritingTileButton.js";
-import { default as Po } from "./components/Filter/Filter.js";
+import { default as Bo } from "./components/Filter/Filter.js";
 import { default as Lo } from "./components/Filter/FilterInput.js";
 import { default as bo } from "./components/Filter/FilterHeader.js";
 import { default as ho } from "./components/TextArea/TextArea.js";
@@ -94,6 +94,7 @@ import { default as Ro } from "./patterns/BidSnapshot/BidMessage.js";
 import { BidMessageVariants as jo, BidStatusEnum as zo } from "./patterns/BidSnapshot/types.js";
 import { default as Yo } from "./patterns/FilterMenu/FilterMenu.js";
 import { default as qo } from "./patterns/ObjectTile/ObjectTile.js";
+import { default as Ko } from "./components/AuctionTile/AuctionTile.js";
 export {
   M as Accordion,
   E as AccordionItem,
@@ -103,6 +104,7 @@ export {
   Mo as AddToCalendar,
   uo as Article,
   b as AuctionStatus,
+  Ko as AuctionTile,
   Yt as AuthState,
   Ro as BidMessage,
   jo as BidMessageVariants,
@@ -133,13 +135,13 @@ export {
   Ce as ErrorBoundary,
   wt as FavoritesCollectionTile,
   To as FavoritingTileButton,
-  Po as Filter,
+  Bo as Filter,
   bo as FilterHeader,
   Lo as FilterInput,
   Yo as FilterMenu,
   so as Footer,
-  Be as Grid,
-  Ae as GridItem,
+  Ae as Grid,
+  Pe as GridItem,
   Ie as GridItemAlign,
   mo as Header,
   Ht as HeroBanner,
@@ -164,7 +166,7 @@ export {
   Ye as Pagination,
   qe as PinchZoom,
   Ke as Row,
-  B as SSRMediaQuery,
+  A as SSRMediaQuery,
   Nt as SaleHeaderBanner,
   Ut as SaleHeaderBrowseAuctions,
   _e as Search,
@@ -186,8 +188,8 @@ export {
   Ct as Text,
   gt as TextAlignments,
   ho as TextArea,
-  Bt as TextSymbolVariants,
-  At as TextSymbols,
+  At as TextSymbolVariants,
+  Pt as TextSymbols,
   ct as TextVariants,
   vo as Toast,
   yo as ToastProvider,
@@ -204,7 +206,7 @@ export {
   x as getCommonProps,
   n as noOp,
   g as px,
-  P as ssrMediaQueryStyle,
+  B as ssrMediaQueryStyle,
   c as useNormalizedInputProps,
   L as usePendingState,
   Do as useToast

package/dist/patterns/BidSnapshot/BidSnapshot.js

@@ -1,75 +1,75 @@
-import { jsxs as S, jsx as t } from "react/jsx-runtime";
+import { jsxs as v, jsx as n } from "react/jsx-runtime";
 import { forwardRef as V } from "react";
 import k from "../../node_modules/classnames/index.js";
 import { getCommonProps as q, findChildrenOfType as z, findChildrenExcludingTypes as F } from "../../utils/index.js";
 import G from "../DetailList/DetailList.js";
-import d from "../../components/Detail/Detail.js";
-import { LotStatus as n, SupportedLanguages as H } from "../../types/commonTypes.js";
+import p from "../../components/Detail/Detail.js";
+import { LotStatus as t, SupportedLanguages as H } from "../../types/commonTypes.js";
 import J from "../../components/Countdown/Countdown.js";
 import { CountdownVariants as K } from "../../components/Countdown/types.js";
 import { BidStatusEnum as Q } from "./types.js";
-import v from "./BidMessage.js";
-import { isAfter as L } from "../../node_modules/date-fns/isAfter.js";
+import L from "./BidMessage.js";
+import { isAfter as w } from "../../node_modules/date-fns/isAfter.js";
 import { differenceInMinutes as U } from "../../node_modules/date-fns/differenceInMinutes.js";
 const X = (o) => o === 1 ? `${o} bid` : `${o} bids`, Y = V(
   ({
-    lotStatus: o = n.ready,
-    bidStatus: p,
-    bidsLabelText: w = X,
+    lotStatus: o = t.ready,
+    bidStatus: d,
+    bidsLabelText: C = X,
     children: c,
-    className: C,
-    closingText: T = "Closes in",
+    className: T,
+    closingText: x = "Closes in",
     currency: r = "$",
     currentBid: f,
-    currentBidText: x = "Current bid",
-    formatDurationStr: N = (a) => a.replace(/seconds?/, "sec").replace(/minutes?/, "min"),
-    lang: W = "en",
+    currentBidText: N = "Current bid",
+    formatDurationStr: W = (a) => a.replace(/seconds?/, "sec").replace(/minutes?/, "min"),
+    lang: y = "en",
     saleCloseDate: i,
     lotCloseDate: l,
     numberOfBids: u = 0,
-    startingBid: y,
+    startingBid: h,
     startingBidText: B = "Starting bid",
-    soldPrice: h,
+    soldPrice: $,
     soldForText: M = "Sold for",
     wonForText: j = "Won for",
     currentDateTime: E = /* @__PURE__ */ new Date(),
-    ...$
+    ...b
   }, P) => {
-    const { className: a, ...R } = q($, "BidSnapshot"), m = f !== null && u > 0, b = o === n.ready, s = o === n.live, g = o === n.past, e = E, _ = s && l && L(l, e) && i && (U(i, e) < 60 || L(e, i)), A = z(c, v), D = F(c, [v]), I = k(a, C, {
+    const { className: a, ...R } = q(b, "BidSnapshot"), m = f !== null && u > 0, g = o === t.ready, s = o === t.live, S = o === t.past, e = E, _ = s && l && w(l, e) && i && (U(i, e) < 60 || w(e, i)), A = z(c, L), D = F(c, [L]), I = k(a, T, {
       [`${a}--live`]: s,
-      [`${a}--has-bids`]: m || g
+      [`${a}--has-bids`]: m || S
     });
-    return /* @__PURE__ */ S("div", { ...R, ...$, ref: P, className: I, children: [
-      /* @__PURE__ */ S(G, { hasSeparators: !0, className: `${a}__text`, children: [
-        g ? /* @__PURE__ */ t(
-          d,
+    return /* @__PURE__ */ v("div", { ...R, ...b, ref: P, className: I, children: [
+      /* @__PURE__ */ v(G, { hasSeparators: !0, className: `${a}__text`, children: [
+        S ? /* @__PURE__ */ n(
+          p,
           {
-            label: p === Q.Won ? j : M,
-            value: h ? `${r}${h?.toLocaleString()}` : "",
+            label: d === Q.Won ? j : M,
+            value: $ ? `${r}${$?.toLocaleString()}` : "",
             hasWrap: !1
           }
         ) : null,
-        s && m ? /* @__PURE__ */ t(
-          d,
+        s && m ? /* @__PURE__ */ n(
+          p,
           {
-            label: x,
-            subLabel: `(${w(u)})`,
+            label: N,
+            subLabel: `(${C(u)})`,
             value: `${r}${f?.toLocaleString()}`,
             hasWrap: !1
           }
         ) : null,
-        b || s && !m ? /* @__PURE__ */ t(d, { label: B, value: `${r}${y?.toLocaleString()}`, hasWrap: !1 }) : null
+        h && (g || s && !m) ? /* @__PURE__ */ n(p, { label: B, value: `${r}${h?.toLocaleString()}`, hasWrap: !1 }) : null
       ] }),
-      p && !b ? A : null,
+      d && !g ? A : null,
       D,
-      _ ? /* @__PURE__ */ t(
+      _ ? /* @__PURE__ */ n(
         J,
         {
           endDateTime: l,
-          label: T,
+          label: x,
           variant: K.compact,
-          locale: H[W],
-          formatDurationStr: N,
+          locale: H[y],
+          formatDurationStr: W,
           showBottomBorder: !1,
           currentDateTime: e
         }

package/dist/scss/componentStyles.scss

@@ -73,3 +73,4 @@
 @use 'components/Divider/divider';
 @use 'components/TextArea/textArea';
 @use 'components/AddToCalendar/addToCalendar';
+@use 'components/AuctionTile/auctionTile';

package/dist/scss/components/AuctionTile/_auctionTile.scss

@@ -0,0 +1,38 @@
+@use '../../allPartials' as *;
+
+.#{$px}-auction-tile {
+  display: flex;
+  flex-direction: row;
+  gap: $spacing-sm;
+
+  &__image {
+    aspect-ratio: 16/9;
+    max-width: $spacing-xxxl;
+    min-width: 90px;
+
+    @include media($size-xl) {
+      max-width: calc($spacing-xxxl * 1.25);
+    }
+
+    img {
+      object-fit: cover;
+    }
+  }
+
+  &__details {
+    align-items: flex-start;
+    display: flex;
+    flex-direction: column;
+    flex-grow: 1;
+    gap: $spacing-micro;
+  }
+
+  &__date_info {
+    display: flex;
+    flex-direction: row;
+  }
+
+  &__separator {
+    margin: 0 8px;
+  }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@phillips/seldon",
-  "version": "1.146.2",
+  "version": "1.148.0",
   "repository": {
     "type": "git",
     "url": "https://github.com/PhillipsAuctionHouse/seldon"