@phillips/seldon 1.133.4 → 1.134.0

package/dist/components/FavoritingTileButton/FavoritingTileButton.d.ts

@@ -0,0 +1,34 @@
+import { ComponentProps } from 'react';
+export interface FavoritingTileButtonProps extends ComponentProps<'button'> {
+    /**
+     * Text for when the object is not in the list and the user wants to add it
+     */
+    actionAddText?: string;
+    /**
+     * Text for when the object is in the list and the user wants to remove it
+     */
+    actionRemoveText?: string;
+    /**
+     *  If the selected lot is in the list of listTitle, controls border style and action text displayed on tile
+     */
+    isLotInList: boolean;
+    /**
+     *  List title shown on tile
+     */
+    listTitle: React.ReactNode;
+    /**
+     *  Number of objects in list to display on tile
+     */
+    numberOfObjects: string;
+}
+/**
+ * ## Overview
+ *
+ * Overview of this widget
+ *
+ * [Figma Link](https://www.figma.com/design/hMu9IWH5N3KamJy8tLFdyV/EASEL-Compendium%3A-Tokens%2C-Components-%26-Patterns?node-id=11973-9023&m=dev)
+ *
+ * [Storybook Link](https://phillips-seldon.netlify.app/?path=/docs/components-favoritingtilebutton--overview)
+ */
+declare const FavoritingTileButton: import('react').ForwardRefExoticComponent<Omit<FavoritingTileButtonProps, "ref"> & import('react').RefAttributes<HTMLButtonElement>>;
+export default FavoritingTileButton;

package/dist/components/FavoritingTileButton/FavoritingTileButton.js

@@ -0,0 +1,46 @@
+import { jsxs as l, jsx as o } from "react/jsx-runtime";
+import { forwardRef as v } from "react";
+import { getCommonProps as h } from "../../utils/index.js";
+import b from "../../node_modules/classnames/index.js";
+import { TextVariants as t } from "../Text/types.js";
+import e from "../Text/Text.js";
+const g = v(
+  ({
+    className: d,
+    actionAddText: i = "Add to",
+    actionRemoveText: m = "Remove from",
+    isLotInList: r,
+    listTitle: n,
+    numberOfObjects: c,
+    onClick: f,
+    ...s
+  }, p) => {
+    const { className: a, ...u } = h(s, "FavoritingTileButton");
+    return /* @__PURE__ */ l(
+      "button",
+      {
+        ...u,
+        className: b(a, d, {
+          [`${a}--lot-in-list`]: r
+        }),
+        onClick: f,
+        ref: p,
+        id: s?.id,
+        "aria-label": `${r ? m : i} ${n}`,
+        "aria-pressed": r,
+        role: "switch",
+        children: [
+          /* @__PURE__ */ l("div", { className: `${a}__text`, children: [
+            /* @__PURE__ */ o(e, { variant: t.button, children: r ? m : i }),
+            /* @__PURE__ */ o(e, { variant: t.string2, children: n })
+          ] }),
+          /* @__PURE__ */ o(e, { variant: t.button, children: c })
+        ]
+      }
+    );
+  }
+);
+g.displayName = "FavoritingTileButton";
+export {
+  g as default
+};

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

@@ -0,0 +1,16 @@
+import { FavoritingTileButtonProps } from './FavoritingTileButton';
+declare const meta: {
+    title: string;
+    component: import('react').ForwardRefExoticComponent<Omit<FavoritingTileButtonProps, "ref"> & import('react').RefAttributes<HTMLButtonElement>>;
+};
+export default meta;
+export declare const Playground: {
+    (props: FavoritingTileButtonProps): import("react/jsx-runtime").JSX.Element;
+    args: {
+        listTitle: string;
+        numberOfObjects: string;
+        isLotInList: boolean;
+    };
+    argTypes: {};
+};
+export declare const BothStates: () => import("react/jsx-runtime").JSX.Element;

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

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

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

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

package/dist/index.d.ts

@@ -65,5 +65,6 @@ export * from './components/Countdown/types';
 export * from './patterns/ObjectTile';
 export * from './patterns/BidSnapshot';
 export * from './components/Article';
+export * from './components/FavoritingTileButton';
 export * from './components/Icon';
 export * from './components/TextArea';

package/dist/index.js

@@ -1,13 +1,13 @@
-import { PaddingTokens as a, SpacingTokens as f, defaultYear as s, emailValidation as l, encodeURLSearchParams as m, findChildrenExcludingTypes as d, findChildrenOfType as p, generatePaddingClassName as u, getCommonProps as n, noOp as i, px as x, useNormalizedInputProps as g } from "./utils/index.js";
+import { PaddingTokens as a, SpacingTokens as f, defaultYear as s, emailValidation as l, encodeURLSearchParams as m, findChildrenExcludingTypes as d, findChildrenOfType as p, generatePaddingClassName as u, getCommonProps as i, noOp as n, px as x, useNormalizedInputProps as g } from "./utils/index.js";
 import { default as S } from "./pages/Page.js";
 import { usePendingState as T } from "./utils/hooks.js";
-import { SSRMediaQuery as P, ssrMediaQueryStyle as A } from "./providers/SeldonProvider/utils.js";
+import { SSRMediaQuery as B, ssrMediaQueryStyle as P } from "./providers/SeldonProvider/utils.js";
 import { AuctionStatus as I, LotStatus as V, SupportedLanguages as b } from "./types/commonTypes.js";
 import { default as k } from "./components/Button/Button.js";
 import { ButtonVariants as y } from "./components/Button/types.js";
 import { default as M } from "./components/IconButton/IconButton.js";
-import { default as N } from "./components/ErrorBoundary/ErrorBoundary.js";
-import { default as F } from "./site-furniture/Footer/Footer.js";
+import { default as D } from "./components/ErrorBoundary/ErrorBoundary.js";
+import { default as N } from "./site-furniture/Footer/Footer.js";
 import { Grid as E } from "./components/Grid/Grid.js";
 import { default as O } from "./site-furniture/Header/Header.js";
 import { default as Q } from "./components/Navigation/Navigation.js";
@@ -22,19 +22,19 @@ import { default as ae } from "./components/LinkBlock/LinkBlock.js";
 import { default as se } from "./components/LinkList/LinkList.js";
 import { default as me } from "./components/Row/Row.js";
 import { default as pe } from "./components/GridItem/GridItem.js";
-import { GridItemAlign as ne } from "./components/GridItem/types.js";
+import { GridItemAlign as ie } from "./components/GridItem/types.js";
 import { default as xe } from "./components/Search/Search.js";
 import { default as ce } from "./components/Select/Select.js";
 import { SelectVariants as Ce } from "./components/Select/types.js";
 import { default as Le } from "./components/SplitPanel/SplitPanel.js";
-import { default as Ae } from "./patterns/Subscribe/Subscribe.js";
+import { default as Pe } from "./patterns/Subscribe/Subscribe.js";
 import { SubscriptionState as Ie } from "./patterns/Subscribe/types.js";
 import { default as be } from "./patterns/Social/Social.js";
 import { default as ke } from "./patterns/ViewingsList/ViewingsList.js";
 import { default as ye } from "./components/Modal/Modal.js";
 import { default as Me } from "./components/Drawer/Drawer.js";
-import { default as Ne } from "./components/Pagination/Pagination.js";
-import { Tag as Fe, default as Ue } from "./components/Tags/Tags.js";
+import { default as De } from "./components/Pagination/Pagination.js";
+import { Tag as Ne, default as Ue } from "./components/Tags/Tags.js";
 import { default as Ge } from "./patterns/ViewingsList/StatefulViewingsList.js";
 import { TextAlignments as Re, TextVariants as Qe } from "./components/Text/types.js";
 import { default as ze } from "./components/Text/Text.js";
@@ -50,18 +50,18 @@ import "react/jsx-runtime";
 import "./node_modules/classnames/index.js";
 import { default as dt } from "./components/Icon/Icon.js";
 import { default as ut } from "./components/Dropdown/Dropdown.js";
-import { default as it } from "./components/Video/Video.js";
+import { default as nt } from "./components/Video/Video.js";
 import { default as gt } from "./patterns/LanguageSelector/LanguageSelector.js";
 import { default as St } from "./components/ContentPeek/ContentPeek.js";
 import { HeightUnits as Tt } from "./components/ContentPeek/utils.js";
-import { default as Pt } from "./components/Collapsible/Collapsible.js";
-import { default as Bt } from "./components/Collapsible/CollapsibleContent.js";
+import { default as Bt } from "./components/Collapsible/Collapsible.js";
+import { default as At } from "./components/Collapsible/CollapsibleContent.js";
 import { default as Vt } from "./components/Collapsible/CollapsibleTrigger.js";
 import { SeldonProvider as ht } from "./providers/SeldonProvider/SeldonProvider.js";
 import { default as wt } from "./components/PageContentWrapper/PageContentWrapper.js";
 import { default as Ht } from "./components/Carousel/Carousel.js";
-import { default as Dt } from "./components/Carousel/CarouselArrows.js";
-import { default as vt } from "./components/Carousel/CarouselContent.js";
+import { default as vt } from "./components/Carousel/CarouselArrows.js";
+import { default as Ft } from "./components/Carousel/CarouselContent.js";
 import { default as Ut } from "./components/Carousel/CarouselItem.js";
 import { default as Gt } from "./components/Carousel/CarouselDots.js";
 import { default as Rt } from "./components/Detail/Detail.js";
@@ -76,15 +76,16 @@ import { default as ro } from "./patterns/SaleHeaderBanner/SaleHeaderBrowseAucti
 import { default as fo } from "./patterns/FilterMenu/FilterMenu.js";
 import { default as lo } from "./components/Filter/Filter.js";
 import { default as po } from "./components/Filter/FilterInput.js";
-import { default as no } from "./components/Filter/FilterHeader.js";
+import { default as io } from "./components/Filter/FilterHeader.js";
 import { default as xo } from "./components/Countdown/Countdown.js";
 import { CountdownVariants as co } from "./components/Countdown/types.js";
 import { default as Co } from "./patterns/ObjectTile/ObjectTile.js";
 import { default as Lo } from "./patterns/BidSnapshot/BidSnapshot.js";
-import { default as Ao } from "./patterns/BidSnapshot/BidMessage.js";
+import { default as Po } from "./patterns/BidSnapshot/BidMessage.js";
 import { BidMessageVariants as Io, BidStatusEnum as Vo } from "./patterns/BidSnapshot/types.js";
 import { default as ho } from "./components/Article/Article.js";
-import { default as wo } from "./components/TextArea/TextArea.js";
+import { default as wo } from "./components/FavoritingTileButton/FavoritingTileButton.js";
+import { default as Ho } from "./components/TextArea/TextArea.js";
 export {
   Ke as Accordion,
   _e as AccordionItem,
@@ -93,7 +94,7 @@ export {
   ho as Article,
   I as AuctionStatus,
   ft as AuthState,
-  Ao as BidMessage,
+  Po as BidMessage,
   Io as BidMessageVariants,
   Lo as BidSnapshot,
   Vo as BidStatusEnum,
@@ -101,12 +102,12 @@ export {
   k as Button,
   y as ButtonVariants,
   Ht as Carousel,
-  Dt as CarouselArrows,
-  vt as CarouselContent,
+  vt as CarouselArrows,
+  Ft as CarouselContent,
   Gt as CarouselDots,
   Ut as CarouselItem,
-  Pt as Collapsible,
-  Bt as CollapsibleContent,
+  Bt as Collapsible,
+  At as CollapsibleContent,
   Vt as CollapsibleTrigger,
   St as ContentPeek,
   Tt as ContentPeekHeightUnits,
@@ -117,15 +118,16 @@ export {
   Wt as DetailListAlignment,
   Me as Drawer,
   ut as Dropdown,
-  N as ErrorBoundary,
+  D as ErrorBoundary,
+  wo as FavoritingTileButton,
   lo as Filter,
-  no as FilterHeader,
+  io as FilterHeader,
   po as FilterInput,
   fo as FilterMenu,
-  F as Footer,
+  N as Footer,
   E as Grid,
   pe as GridItem,
-  ne as GridItemAlign,
+  ie as GridItemAlign,
   O as Header,
   K as HeroBanner,
   dt as Icon,
@@ -146,10 +148,10 @@ export {
   a as PaddingTokens,
   S as Page,
   wt as PageContentWrapper,
-  Ne as Pagination,
+  De as Pagination,
   Zt as PinchZoom,
   me as Row,
-  P as SSRMediaQuery,
+  B as SSRMediaQuery,
   to as SaleHeaderBanner,
   ro as SaleHeaderBrowseAuctions,
   xe as Search,
@@ -161,21 +163,21 @@ export {
   f as SpacingTokens,
   Le as SplitPanel,
   Ge as StatefulViewingsList,
-  Ae as Subscribe,
+  Pe as Subscribe,
   Ie as SubscriptionState,
   b as SupportedLanguages,
   Jt as TabsContainer,
   Xt as TabsContent,
-  Fe as Tag,
+  Ne as Tag,
   Ue as TagsList,
   ze as Text,
   Re as TextAlignments,
-  wo as TextArea,
+  Ho as TextArea,
   Ye as TextSymbolVariants,
   qe as TextSymbols,
   Qe as TextVariants,
   rt as UserManagement,
-  it as Video,
+  nt as Video,
   ke as ViewingsList,
   s as defaultYear,
   l as emailValidation,
@@ -183,10 +185,10 @@ export {
   d as findChildrenExcludingTypes,
   p as findChildrenOfType,
   u as generatePaddingClassName,
-  n as getCommonProps,
-  i as noOp,
+  i as getCommonProps,
+  n as noOp,
   x as px,
-  A as ssrMediaQueryStyle,
+  P as ssrMediaQueryStyle,
   g as useNormalizedInputProps,
   T as usePendingState
 };

package/dist/node_modules/exenv/index.js

@@ -1,4 +1,4 @@
-import { __module as t } from "../../_virtual/index5.js";
+import { __module as t } from "../../_virtual/index6.js";
 /*!
   Copyright (c) 2015 Jed Watson.
   Based on code that is Copyright 2013-2015, Facebook, Inc.

package/dist/node_modules/prop-types/node_modules/react-is/index.js

@@ -1,4 +1,4 @@
-import { __module as e } from "../../../../_virtual/index6.js";
+import { __module as e } from "../../../../_virtual/index5.js";
 import { __require as o } from "./cjs/react-is.production.min.js";
 import { __require as t } from "./cjs/react-is.development.js";
 var r;

package/dist/patterns/ObjectTile/ObjectTile.js

@@ -3,21 +3,21 @@ import { memo as z, forwardRef as F } from "react";
 import I from "../../node_modules/classnames/index.js";
 import { getCommonProps as L } from "../../utils/index.js";
 import { TextVariants as l } from "../../components/Text/types.js";
-import i from "../../components/Text/Text.js";
+import n from "../../components/Text/Text.js";
 import R from "../DetailList/DetailList.js";
 import V from "../../components/Detail/Detail.js";
 import W from "../../components/SeldonImage/SeldonImage.js";
 const w = z(
   F(
     ({
-      badgeText: p,
+      badgeText: f,
       className: $,
       children: N,
       element: g,
-      estimate: n,
+      estimate: i,
       estimateLabelText: b = "Estimate",
-      estimateOnRequestText: r,
-      badgeElement: m,
+      estimateOnRequestText: m,
+      badgeElement: r,
       favoriteElement: o,
       imageAlt: u = "Brought to you by Phillips",
       imageUrl: v = "",
@@ -31,10 +31,10 @@ const w = z(
       referenceNumber: d,
       titleText: h,
       withdrawnText: t,
-      ...f
+      ...p
     }, x) => {
-      const { className: e, ...C } = L(f, "ObjectTile"), D = g ?? "a", E = n || r;
-      return /* @__PURE__ */ s(D, { ...C, className: I(e, $), ...f, ref: x, children: [
+      const { className: e, ...C } = L(p, "ObjectTile"), D = g ?? "a", E = i || m;
+      return /* @__PURE__ */ s(D, { ...C, className: I(e, $), ...p, ref: x, children: [
         /* @__PURE__ */ a(
           W,
           {
@@ -49,17 +49,17 @@ const w = z(
             fetchPriority: P
           }
         ),
-        t ? null : /* @__PURE__ */ a(i, { className: `${e}__badge`, variant: l.badge, children: p }),
+        t ? null : /* @__PURE__ */ a(n, { element: "span", className: `${e}__badge`, variant: l.badge, children: f }),
         /* @__PURE__ */ s("div", { className: `${e}__lot-number-like`, children: [
-          /* @__PURE__ */ a(i, { className: `${e}__lot-number`, variant: l.heading4, element: "p", children: S }),
-          m && /* @__PURE__ */ a("div", { className: `${e}__lot-badge`, children: /* @__PURE__ */ a(m, {}) }),
+          /* @__PURE__ */ a(n, { element: "span", className: `${e}__lot-number`, variant: l.heading4, children: S }),
+          r && /* @__PURE__ */ a("div", { className: `${e}__lot-badge`, children: /* @__PURE__ */ a(r, {}) }),
           o && /* @__PURE__ */ a(o, {})
         ] }),
-        t ? /* @__PURE__ */ a(i, { className: `${e}__withdrawn`, variant: l.heading4, children: t }) : /* @__PURE__ */ s(O, { children: [
+        t ? /* @__PURE__ */ a(n, { element: "span", className: `${e}__withdrawn`, variant: l.heading4, children: t }) : /* @__PURE__ */ s(O, { children: [
           /* @__PURE__ */ s("div", { className: `${e}__meta`, children: [
-            c ? /* @__PURE__ */ a(i, { className: `${e}__maker`, variant: l.heading4, children: c }) : null,
+            c ? /* @__PURE__ */ a(n, { element: "span", className: `${e}__maker`, variant: l.heading4, children: c }) : null,
             h ? /* @__PURE__ */ a(
-              i,
+              n,
               {
                 className: `${e}__title ${e}__token-fix ${e}__token-fix--no-transform`,
                 variant: l.heading4,
@@ -68,20 +68,20 @@ const w = z(
               }
             ) : null,
             d ? /* @__PURE__ */ a(
-              i,
+              n,
               {
                 className: `${e}__reference-number ${e}__token-fix`,
                 variant: l.heading4,
-                element: "p",
+                element: "span",
                 children: d
               }
             ) : null,
             _ ? /* @__PURE__ */ a(
-              i,
+              n,
               {
                 className: `${e}__model ${e}__token-fix`,
                 variant: l.heading4,
-                element: "p",
+                element: "span",
                 children: _
               }
             ) : null
@@ -91,7 +91,7 @@ const w = z(
             {
               className: `${e}__estimate__label`,
               label: b,
-              value: n || r,
+              value: i || m,
               hasWrap: !1
             }
           ) }) : null,

package/dist/scss/componentStyles.scss

@@ -46,6 +46,7 @@
 @use 'components/Tabs/tabs';
 @use 'components/SeldonImage/seldonImage';
 @use 'components/Filter/filter';
+@use 'components/FavoritingTileButton/favoritingTileButton';
 
 // Patterns
 @use 'patterns/HeroBanner/heroBanner';

package/dist/scss/components/FavoritingTileButton/_favoritingTileButton.scss

@@ -0,0 +1,39 @@
+@use '../../allPartials' as *;
+
+.#{$px}-favoriting-tile-button {
+  align-items: center;
+  background-color: $white;
+  border: 1px solid $light-gray;
+  display: flex;
+  flex-shrink: 0;
+  gap: $spacing-md;
+  justify-content: space-between;
+  padding: $padding-md $padding-sm;
+  transition: all 0.2s ease-in-out;
+  width: 100%;
+
+  &--lot-in-list {
+    border: 1px solid $pure-black;
+  }
+
+  &__text {
+    display: flex;
+    gap: $spacing-xsm;
+    overflow: hidden;
+
+    span {
+      color: inherit;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+  }
+
+  &:hover {
+    align-items: center;
+    background: $button-hover;
+    border: 1px solid $button-hover;
+    color: $white;
+    cursor: pointer;
+  }
+}

package/dist/scss/patterns/ObjectTile/_objectTile.scss

@@ -13,6 +13,7 @@
 
   &__badge {
     color: $widget-red;
+    display: block; // Ensures the badge can be sized correctly
   }
 
   &__badge:empty {
@@ -47,7 +48,7 @@
     }
 
     .#{$px}-object-tile__lot-badge {
-      display: inline-block;
+      display: block;
       padding-left: $spacing-xsm;
       position: relative;
 
@@ -63,7 +64,7 @@
   }
 
   & .#{$px}-object-tile__lot-number {
-    display: inline-block;
+    display: block;
     margin-bottom: 0;
     padding-top: 2px;
   }
@@ -71,6 +72,7 @@
   & .#{$px}-object-tile__maker,
   & .#{$px}-object-tile__model,
   & .#{$px}-object-tile__reference-number {
+    display: block;
     margin-bottom: 0;
   }
 
@@ -80,6 +82,7 @@
   }
 
   &__meta {
+    display: block;
     margin-bottom: $spacing-sm;
   }
 

package/package.json

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