@phillips/seldon 1.147.0 → 1.148.0
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.
- package/dist/components/AuctionTile/AuctionTile.d.ts +20 -0
- package/dist/components/AuctionTile/AuctionTile.js +27 -0
- package/dist/components/AuctionTile/AuctionTile.stories.d.ts +18 -0
- package/dist/components/AuctionTile/AuctionTile.test.d.ts +1 -0
- package/dist/components/AuctionTile/index.d.ts +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +15 -13
- package/dist/scss/componentStyles.scss +1 -0
- package/dist/scss/components/AuctionTile/_auctionTile.scss +38 -0
- package/package.json +1 -1
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { ComponentProps } from 'react';
|
|
2
|
+
export type AuctionTileProps = ComponentProps<'div'> & {
|
|
3
|
+
imageSrc: string;
|
|
4
|
+
imageAlt?: string;
|
|
5
|
+
type: string;
|
|
6
|
+
title: string;
|
|
7
|
+
date: string;
|
|
8
|
+
location: string;
|
|
9
|
+
};
|
|
10
|
+
/**
|
|
11
|
+
* ## Overview
|
|
12
|
+
*
|
|
13
|
+
* Overview of this widget
|
|
14
|
+
*
|
|
15
|
+
* [Figma Link](https://www.figma.com/design/hMu9IWH5N3KamJy8tLFdyV/RW-Design-System?node-id=22259-4172&m=dev)
|
|
16
|
+
*
|
|
17
|
+
* [Storybook Link](https://phillips-seldon.netlify.app/?path=/docs/components-auctiontile--overview)
|
|
18
|
+
*/
|
|
19
|
+
declare const AuctionTile: import('react').ForwardRefExoticComponent<Omit<AuctionTileProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
20
|
+
export default AuctionTile;
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { jsxs as s, jsx as a } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef as v } from "react";
|
|
3
|
+
import { getCommonProps as N } from "../../utils/index.js";
|
|
4
|
+
import g from "../../node_modules/classnames/index.js";
|
|
5
|
+
import { TextVariants as r } from "../Text/types.js";
|
|
6
|
+
import e from "../Text/Text.js";
|
|
7
|
+
const u = v(
|
|
8
|
+
({ className: o, imageSrc: n, imageAlt: m = "Auction Image", type: c, title: l, date: d, location: p, ...t }, f) => {
|
|
9
|
+
const { className: i, ...h } = N(t, "AuctionTile"), _ = { ...h, ...t };
|
|
10
|
+
return /* @__PURE__ */ s("div", { ..._, className: g(i, o), ref: f, children: [
|
|
11
|
+
/* @__PURE__ */ a("div", { className: `${i}__image`, children: /* @__PURE__ */ a("img", { src: n, alt: m }) }),
|
|
12
|
+
/* @__PURE__ */ s("div", { className: `${i}__details`, children: [
|
|
13
|
+
/* @__PURE__ */ a(e, { variant: r.badge, children: c }),
|
|
14
|
+
/* @__PURE__ */ a(e, { variant: r.title4, children: l }),
|
|
15
|
+
/* @__PURE__ */ s("div", { className: `${i}__date_location`, children: [
|
|
16
|
+
/* @__PURE__ */ a(e, { variant: r.string2, children: d }),
|
|
17
|
+
/* @__PURE__ */ a("span", { className: `${i}__separator`, children: "•" }),
|
|
18
|
+
/* @__PURE__ */ a(e, { variant: r.string2, children: p })
|
|
19
|
+
] })
|
|
20
|
+
] })
|
|
21
|
+
] });
|
|
22
|
+
}
|
|
23
|
+
);
|
|
24
|
+
u.displayName = "AuctionTile";
|
|
25
|
+
export {
|
|
26
|
+
u as default
|
|
27
|
+
};
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { AuctionTileProps } from './AuctionTile';
|
|
2
|
+
declare const meta: {
|
|
3
|
+
title: string;
|
|
4
|
+
component: import('react').ForwardRefExoticComponent<Omit<AuctionTileProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
|
|
5
|
+
};
|
|
6
|
+
export default meta;
|
|
7
|
+
export declare const Playground: {
|
|
8
|
+
(props: AuctionTileProps): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
args: {
|
|
10
|
+
imageSrc: string;
|
|
11
|
+
type: string;
|
|
12
|
+
title: string;
|
|
13
|
+
date: string;
|
|
14
|
+
location: string;
|
|
15
|
+
};
|
|
16
|
+
argTypes: {};
|
|
17
|
+
};
|
|
18
|
+
export declare const MultipleAuctions: () => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default as AuctionTile, type AuctionTileProps } from './AuctionTile';
|
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
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";
|
|
2
2
|
import { default as C } from "./pages/Page.js";
|
|
3
|
-
import { SSRMediaQuery as
|
|
3
|
+
import { SSRMediaQuery as A, ssrMediaQueryStyle as B } from "./providers/SeldonProvider/utils.js";
|
|
4
4
|
import { usePendingState as L } from "./utils/hooks.js";
|
|
5
5
|
import { AuctionStatus as b, LotStatus as V, SupportedLanguages as h } from "./types/commonTypes.js";
|
|
6
6
|
import { default as v } from "./components/Button/Button.js";
|
|
@@ -27,8 +27,8 @@ import { default as ie } from "./components/Detail/Detail.js";
|
|
|
27
27
|
import { default as ne } from "./components/Drawer/Drawer.js";
|
|
28
28
|
import { default as ce } from "./components/Dropdown/Dropdown.js";
|
|
29
29
|
import { default as Ce } from "./components/ErrorBoundary/ErrorBoundary.js";
|
|
30
|
-
import { Grid as
|
|
31
|
-
import { default as
|
|
30
|
+
import { Grid as Ae } from "./components/Grid/Grid.js";
|
|
31
|
+
import { default as Pe } from "./components/GridItem/GridItem.js";
|
|
32
32
|
import { GridItemAlign as Ie } from "./components/GridItem/types.js";
|
|
33
33
|
import { default as Ve } from "./components/Input/Input.js";
|
|
34
34
|
import { default as ke } from "./components/Link/Link.js";
|
|
@@ -53,8 +53,8 @@ import { default as pt } from "./components/Tabs/TabsContent.js";
|
|
|
53
53
|
import { Tag as it, default as xt } from "./components/Tags/Tags.js";
|
|
54
54
|
import { TextAlignments as gt, TextVariants as ct } from "./components/Text/types.js";
|
|
55
55
|
import { default as Ct } from "./components/Text/Text.js";
|
|
56
|
-
import { TextSymbolVariants as
|
|
57
|
-
import { default as
|
|
56
|
+
import { TextSymbolVariants as At } from "./components/TextSymbol/types.js";
|
|
57
|
+
import { default as Pt } from "./components/TextSymbol/TextSymbol.js";
|
|
58
58
|
import { default as It } from "./components/Video/Video.js";
|
|
59
59
|
import { default as Vt } from "./patterns/DetailList/DetailList.js";
|
|
60
60
|
import { DetailListAlignment as kt } from "./patterns/DetailList/types.js";
|
|
@@ -80,7 +80,7 @@ import { default as xo } from "./components/Countdown/Countdown.js";
|
|
|
80
80
|
import { CountdownVariants as go } from "./components/Countdown/types.js";
|
|
81
81
|
import { default as So } from "./components/Divider/Divider.js";
|
|
82
82
|
import { default as To } from "./components/FavoritingTileButton/FavoritingTileButton.js";
|
|
83
|
-
import { default as
|
|
83
|
+
import { default as Bo } from "./components/Filter/Filter.js";
|
|
84
84
|
import { default as Lo } from "./components/Filter/FilterInput.js";
|
|
85
85
|
import { default as bo } from "./components/Filter/FilterHeader.js";
|
|
86
86
|
import { default as ho } from "./components/TextArea/TextArea.js";
|
|
@@ -94,6 +94,7 @@ import { default as Ro } from "./patterns/BidSnapshot/BidMessage.js";
|
|
|
94
94
|
import { BidMessageVariants as jo, BidStatusEnum as zo } from "./patterns/BidSnapshot/types.js";
|
|
95
95
|
import { default as Yo } from "./patterns/FilterMenu/FilterMenu.js";
|
|
96
96
|
import { default as qo } from "./patterns/ObjectTile/ObjectTile.js";
|
|
97
|
+
import { default as Ko } from "./components/AuctionTile/AuctionTile.js";
|
|
97
98
|
export {
|
|
98
99
|
M as Accordion,
|
|
99
100
|
E as AccordionItem,
|
|
@@ -103,6 +104,7 @@ export {
|
|
|
103
104
|
Mo as AddToCalendar,
|
|
104
105
|
uo as Article,
|
|
105
106
|
b as AuctionStatus,
|
|
107
|
+
Ko as AuctionTile,
|
|
106
108
|
Yt as AuthState,
|
|
107
109
|
Ro as BidMessage,
|
|
108
110
|
jo as BidMessageVariants,
|
|
@@ -133,13 +135,13 @@ export {
|
|
|
133
135
|
Ce as ErrorBoundary,
|
|
134
136
|
wt as FavoritesCollectionTile,
|
|
135
137
|
To as FavoritingTileButton,
|
|
136
|
-
|
|
138
|
+
Bo as Filter,
|
|
137
139
|
bo as FilterHeader,
|
|
138
140
|
Lo as FilterInput,
|
|
139
141
|
Yo as FilterMenu,
|
|
140
142
|
so as Footer,
|
|
141
|
-
|
|
142
|
-
|
|
143
|
+
Ae as Grid,
|
|
144
|
+
Pe as GridItem,
|
|
143
145
|
Ie as GridItemAlign,
|
|
144
146
|
mo as Header,
|
|
145
147
|
Ht as HeroBanner,
|
|
@@ -164,7 +166,7 @@ export {
|
|
|
164
166
|
Ye as Pagination,
|
|
165
167
|
qe as PinchZoom,
|
|
166
168
|
Ke as Row,
|
|
167
|
-
|
|
169
|
+
A as SSRMediaQuery,
|
|
168
170
|
Nt as SaleHeaderBanner,
|
|
169
171
|
Ut as SaleHeaderBrowseAuctions,
|
|
170
172
|
_e as Search,
|
|
@@ -186,8 +188,8 @@ export {
|
|
|
186
188
|
Ct as Text,
|
|
187
189
|
gt as TextAlignments,
|
|
188
190
|
ho as TextArea,
|
|
189
|
-
|
|
190
|
-
|
|
191
|
+
At as TextSymbolVariants,
|
|
192
|
+
Pt as TextSymbols,
|
|
191
193
|
ct as TextVariants,
|
|
192
194
|
vo as Toast,
|
|
193
195
|
yo as ToastProvider,
|
|
@@ -204,7 +206,7 @@ export {
|
|
|
204
206
|
x as getCommonProps,
|
|
205
207
|
n as noOp,
|
|
206
208
|
g as px,
|
|
207
|
-
|
|
209
|
+
B as ssrMediaQueryStyle,
|
|
208
210
|
c as useNormalizedInputProps,
|
|
209
211
|
L as usePendingState,
|
|
210
212
|
Do as useToast
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
@use '../../allPartials' as *;
|
|
2
|
+
|
|
3
|
+
.#{$px}-auction-tile {
|
|
4
|
+
display: flex;
|
|
5
|
+
flex-direction: row;
|
|
6
|
+
gap: $spacing-sm;
|
|
7
|
+
|
|
8
|
+
&__image {
|
|
9
|
+
aspect-ratio: 16/9;
|
|
10
|
+
max-width: $spacing-xxxl;
|
|
11
|
+
min-width: 90px;
|
|
12
|
+
|
|
13
|
+
@include media($size-xl) {
|
|
14
|
+
max-width: calc($spacing-xxxl * 1.25);
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
img {
|
|
18
|
+
object-fit: cover;
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
&__details {
|
|
23
|
+
align-items: flex-start;
|
|
24
|
+
display: flex;
|
|
25
|
+
flex-direction: column;
|
|
26
|
+
flex-grow: 1;
|
|
27
|
+
gap: $spacing-micro;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
&__date_info {
|
|
31
|
+
display: flex;
|
|
32
|
+
flex-direction: row;
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
&__separator {
|
|
36
|
+
margin: 0 8px;
|
|
37
|
+
}
|
|
38
|
+
}
|