@phillips/seldon 1.142.1 → 1.143.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.
- package/dist/components/Countdown/Countdown.d.ts +4 -0
- package/dist/components/Countdown/Countdown.js +51 -50
- package/dist/patterns/BidSnapshot/BidSnapshot.d.ts +4 -0
- package/dist/patterns/BidSnapshot/BidSnapshot.js +46 -44
- package/dist/patterns/SaleHeaderBanner/SaleHeaderBanner.d.ts +4 -0
- package/dist/patterns/SaleHeaderBanner/SaleHeaderBanner.js +19 -17
- package/dist/scss/components/Countdown/_countdown.scss +2 -2
- package/package.json +1 -1
|
@@ -1,68 +1,69 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import { forwardRef as
|
|
3
|
-
import { getCommonProps as
|
|
4
|
-
import
|
|
5
|
-
import { SupportedLanguages as
|
|
6
|
-
import { CountdownVariants as
|
|
1
|
+
import { jsxs as d, jsx as e } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef as j, useState as z, useEffect as E, useMemo as F } from "react";
|
|
3
|
+
import { getCommonProps as H } from "../../utils/index.js";
|
|
4
|
+
import R from "../../node_modules/classnames/index.js";
|
|
5
|
+
import { SupportedLanguages as S } from "../../types/commonTypes.js";
|
|
6
|
+
import { CountdownVariants as i } from "./types.js";
|
|
7
7
|
import { Duration as a } from "./Duration.js";
|
|
8
|
-
import { zhCN as
|
|
9
|
-
import { enUS as
|
|
10
|
-
import { differenceInDays as
|
|
11
|
-
import { differenceInHours as
|
|
12
|
-
import { differenceInMinutes as
|
|
13
|
-
import { differenceInSeconds as
|
|
14
|
-
import { differenceInMilliseconds as
|
|
15
|
-
const
|
|
8
|
+
import { zhCN as U } from "../../node_modules/date-fns/locale/zh-CN.js";
|
|
9
|
+
import { enUS as V } from "../../node_modules/date-fns/locale/en-US.js";
|
|
10
|
+
import { differenceInDays as p } from "../../node_modules/date-fns/differenceInDays.js";
|
|
11
|
+
import { differenceInHours as h } from "../../node_modules/date-fns/differenceInHours.js";
|
|
12
|
+
import { differenceInMinutes as w } from "../../node_modules/date-fns/differenceInMinutes.js";
|
|
13
|
+
import { differenceInSeconds as C } from "../../node_modules/date-fns/differenceInSeconds.js";
|
|
14
|
+
import { differenceInMilliseconds as k } from "../../node_modules/date-fns/differenceInMilliseconds.js";
|
|
15
|
+
const q = j(
|
|
16
16
|
({
|
|
17
17
|
endDateTime: o,
|
|
18
18
|
formatDurationStr: t,
|
|
19
|
-
label:
|
|
20
|
-
intervalDescription:
|
|
21
|
-
className:
|
|
22
|
-
locale:
|
|
23
|
-
showBottomBorder:
|
|
24
|
-
variant:
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
19
|
+
label: m = "Lots Close in",
|
|
20
|
+
intervalDescription: g,
|
|
21
|
+
className: y,
|
|
22
|
+
locale: I = "en",
|
|
23
|
+
showBottomBorder: N = !0,
|
|
24
|
+
variant: u = i.default,
|
|
25
|
+
currentDateTime: l = /* @__PURE__ */ new Date(),
|
|
26
|
+
...f
|
|
27
|
+
}, $) => {
|
|
28
|
+
const { className: r, ...b } = H(f, "Countdown"), [n, L] = z(l), c = I === S.zh ? U : V, s = {
|
|
29
|
+
days: p(o, n) > 0 ? p(o, n) : 0,
|
|
30
|
+
hours: h(o, n) > 0 ? h(o, n) % 24 : 0,
|
|
31
|
+
minutes: w(o, n) > 0 ? w(o, n) % 60 : 0,
|
|
32
|
+
seconds: (C(o, n) > 0 ? C(o, n) % 60 : 0) % 60
|
|
32
33
|
};
|
|
33
|
-
|
|
34
|
-
const
|
|
35
|
-
|
|
34
|
+
E(() => {
|
|
35
|
+
const x = setInterval(() => {
|
|
36
|
+
L((M) => new Date(M.getTime() + 1e3));
|
|
36
37
|
}, 1e3);
|
|
37
|
-
return () => clearInterval(
|
|
38
|
-
}, [o]);
|
|
39
|
-
const
|
|
40
|
-
return
|
|
38
|
+
return () => clearInterval(x);
|
|
39
|
+
}, [o, l]);
|
|
40
|
+
const _ = F(() => new Date(o).getTime() > l.getTime(), [o, l]), v = k(o, n) <= 3 * 60 * 1e3;
|
|
41
|
+
return _ ? /* @__PURE__ */ d(
|
|
41
42
|
"div",
|
|
42
43
|
{
|
|
43
|
-
|
|
44
|
-
className:
|
|
45
|
-
[`${r}--compact`]:
|
|
46
|
-
[`${r}--show-bottom-border`]:
|
|
47
|
-
[`${r}--closing-lot`]:
|
|
44
|
+
...b,
|
|
45
|
+
className: R(r, y, {
|
|
46
|
+
[`${r}--compact`]: u === i.compact,
|
|
47
|
+
[`${r}--show-bottom-border`]: N,
|
|
48
|
+
[`${r}--closing-lot`]: v
|
|
48
49
|
}),
|
|
49
|
-
...
|
|
50
|
-
ref:
|
|
50
|
+
...f,
|
|
51
|
+
ref: $,
|
|
51
52
|
children: [
|
|
52
|
-
/* @__PURE__ */
|
|
53
|
-
/* @__PURE__ */ e("span", { className: `${r}__label`, children:
|
|
54
|
-
s.days > 0 ? /* @__PURE__ */ e(a, { duration: s, unit: "days", locale:
|
|
55
|
-
s.days > 0 || s.hours > 0 ? /* @__PURE__ */ e(a, { duration: s, unit: "hours", locale:
|
|
56
|
-
s.days === 0 ? /* @__PURE__ */ e(a, { duration: s, unit: "minutes", locale:
|
|
57
|
-
s.days === 0 && s.hours === 0 ? /* @__PURE__ */ e(a, { duration: s, unit: "seconds", locale:
|
|
53
|
+
/* @__PURE__ */ d("div", { className: `${r}__countdown-container`, role: "timer", "aria-label": m, children: [
|
|
54
|
+
/* @__PURE__ */ e("span", { className: `${r}__label`, children: m }),
|
|
55
|
+
s.days > 0 ? /* @__PURE__ */ e(a, { duration: s, unit: "days", locale: c, formatDurationStr: t }) : null,
|
|
56
|
+
s.days > 0 || s.hours > 0 ? /* @__PURE__ */ e(a, { duration: s, unit: "hours", locale: c, formatDurationStr: t }) : null,
|
|
57
|
+
s.days === 0 ? /* @__PURE__ */ e(a, { duration: s, unit: "minutes", locale: c, formatDurationStr: t }) : null,
|
|
58
|
+
s.days === 0 && s.hours === 0 ? /* @__PURE__ */ e(a, { duration: s, unit: "seconds", locale: c, formatDurationStr: t }) : null
|
|
58
59
|
] }),
|
|
59
|
-
|
|
60
|
+
u === i.default ? /* @__PURE__ */ e("span", { children: g }) : null
|
|
60
61
|
]
|
|
61
62
|
}
|
|
62
63
|
) : null;
|
|
63
64
|
}
|
|
64
65
|
);
|
|
65
|
-
|
|
66
|
+
q.displayName = "Countdown";
|
|
66
67
|
export {
|
|
67
|
-
|
|
68
|
+
q as default
|
|
68
69
|
};
|
|
@@ -1,81 +1,83 @@
|
|
|
1
|
-
import { jsxs as S, jsx as
|
|
1
|
+
import { jsxs as S, jsx as t } from "react/jsx-runtime";
|
|
2
2
|
import { forwardRef as V } from "react";
|
|
3
3
|
import k from "../../node_modules/classnames/index.js";
|
|
4
|
-
import { getCommonProps as q, findChildrenOfType as z, findChildrenExcludingTypes as
|
|
5
|
-
import
|
|
4
|
+
import { getCommonProps as q, findChildrenOfType as z, findChildrenExcludingTypes as F } from "../../utils/index.js";
|
|
5
|
+
import G from "../DetailList/DetailList.js";
|
|
6
6
|
import d from "../../components/Detail/Detail.js";
|
|
7
|
-
import { LotStatus as n, SupportedLanguages as
|
|
8
|
-
import
|
|
9
|
-
import { CountdownVariants as
|
|
10
|
-
import { BidStatusEnum as
|
|
7
|
+
import { LotStatus as n, SupportedLanguages as H } from "../../types/commonTypes.js";
|
|
8
|
+
import J from "../../components/Countdown/Countdown.js";
|
|
9
|
+
import { CountdownVariants as K } from "../../components/Countdown/types.js";
|
|
10
|
+
import { BidStatusEnum as Q } from "./types.js";
|
|
11
11
|
import v from "./BidMessage.js";
|
|
12
12
|
import { isAfter as L } from "../../node_modules/date-fns/isAfter.js";
|
|
13
|
-
import { differenceInMinutes as
|
|
14
|
-
const
|
|
13
|
+
import { differenceInMinutes as U } from "../../node_modules/date-fns/differenceInMinutes.js";
|
|
14
|
+
const X = (o) => o === 1 ? `${o} bid` : `${o} bids`, Y = V(
|
|
15
15
|
({
|
|
16
16
|
lotStatus: o = n.ready,
|
|
17
17
|
bidStatus: p,
|
|
18
|
-
bidsLabelText: w =
|
|
18
|
+
bidsLabelText: w = X,
|
|
19
19
|
children: c,
|
|
20
20
|
className: C,
|
|
21
|
-
closingText:
|
|
22
|
-
currency:
|
|
21
|
+
closingText: T = "Closes in",
|
|
22
|
+
currency: r = "$",
|
|
23
23
|
currentBid: f,
|
|
24
|
-
currentBidText:
|
|
25
|
-
formatDurationStr:
|
|
24
|
+
currentBidText: x = "Current bid",
|
|
25
|
+
formatDurationStr: N = (a) => a.replace(/seconds?/, "sec").replace(/minutes?/, "min"),
|
|
26
26
|
lang: W = "en",
|
|
27
|
-
saleCloseDate:
|
|
28
|
-
lotCloseDate:
|
|
29
|
-
numberOfBids:
|
|
27
|
+
saleCloseDate: i,
|
|
28
|
+
lotCloseDate: l,
|
|
29
|
+
numberOfBids: u = 0,
|
|
30
30
|
startingBid: y,
|
|
31
31
|
startingBidText: B = "Starting bid",
|
|
32
|
-
soldPrice:
|
|
32
|
+
soldPrice: h,
|
|
33
33
|
soldForText: M = "Sold for",
|
|
34
34
|
wonForText: j = "Won for",
|
|
35
|
+
currentDateTime: E = /* @__PURE__ */ new Date(),
|
|
35
36
|
...$
|
|
36
|
-
},
|
|
37
|
-
const { className:
|
|
38
|
-
[`${
|
|
39
|
-
[`${
|
|
37
|
+
}, P) => {
|
|
38
|
+
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, {
|
|
39
|
+
[`${a}--live`]: s,
|
|
40
|
+
[`${a}--has-bids`]: m || g
|
|
40
41
|
});
|
|
41
|
-
return /* @__PURE__ */ S("div", { ...
|
|
42
|
-
/* @__PURE__ */ S(
|
|
43
|
-
g ? /* @__PURE__ */
|
|
42
|
+
return /* @__PURE__ */ S("div", { ...R, ...$, ref: P, className: I, children: [
|
|
43
|
+
/* @__PURE__ */ S(G, { hasSeparators: !0, className: `${a}__text`, children: [
|
|
44
|
+
g ? /* @__PURE__ */ t(
|
|
44
45
|
d,
|
|
45
46
|
{
|
|
46
|
-
label: p ===
|
|
47
|
-
value:
|
|
47
|
+
label: p === Q.Won ? j : M,
|
|
48
|
+
value: h ? `${r}${h?.toLocaleString()}` : "",
|
|
48
49
|
hasWrap: !1
|
|
49
50
|
}
|
|
50
51
|
) : null,
|
|
51
|
-
|
|
52
|
+
s && m ? /* @__PURE__ */ t(
|
|
52
53
|
d,
|
|
53
54
|
{
|
|
54
|
-
label:
|
|
55
|
-
subLabel: `(${w(
|
|
56
|
-
value: `${
|
|
55
|
+
label: x,
|
|
56
|
+
subLabel: `(${w(u)})`,
|
|
57
|
+
value: `${r}${f?.toLocaleString()}`,
|
|
57
58
|
hasWrap: !1
|
|
58
59
|
}
|
|
59
60
|
) : null,
|
|
60
|
-
b ||
|
|
61
|
+
b || s && !m ? /* @__PURE__ */ t(d, { label: B, value: `${r}${y?.toLocaleString()}`, hasWrap: !1 }) : null
|
|
61
62
|
] }),
|
|
62
|
-
p && !b ?
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
63
|
+
p && !b ? A : null,
|
|
64
|
+
D,
|
|
65
|
+
_ ? /* @__PURE__ */ t(
|
|
66
|
+
J,
|
|
66
67
|
{
|
|
67
|
-
endDateTime:
|
|
68
|
-
label:
|
|
69
|
-
variant:
|
|
70
|
-
locale:
|
|
71
|
-
formatDurationStr:
|
|
72
|
-
showBottomBorder: !1
|
|
68
|
+
endDateTime: l,
|
|
69
|
+
label: T,
|
|
70
|
+
variant: K.compact,
|
|
71
|
+
locale: H[W],
|
|
72
|
+
formatDurationStr: N,
|
|
73
|
+
showBottomBorder: !1,
|
|
74
|
+
currentDateTime: e
|
|
73
75
|
}
|
|
74
76
|
) : null
|
|
75
77
|
] });
|
|
76
78
|
}
|
|
77
79
|
);
|
|
78
|
-
|
|
80
|
+
Y.displayName = "BidSnapshot";
|
|
79
81
|
export {
|
|
80
|
-
|
|
82
|
+
Y as default
|
|
81
83
|
};
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
import { jsxs as n, jsx as a } from "react/jsx-runtime";
|
|
2
|
-
import { forwardRef as
|
|
3
|
-
import { getCommonProps as
|
|
4
|
-
import
|
|
2
|
+
import { forwardRef as M } from "react";
|
|
3
|
+
import { getCommonProps as R } from "../../utils/index.js";
|
|
4
|
+
import D from "../../node_modules/classnames/index.js";
|
|
5
5
|
import h from "../../components/Countdown/Countdown.js";
|
|
6
|
-
import
|
|
7
|
-
import { AuctionStatus as
|
|
6
|
+
import F from "../../components/SeldonImage/SeldonImage.js";
|
|
7
|
+
import { AuctionStatus as O } from "../../types/commonTypes.js";
|
|
8
8
|
import { TextVariants as r } from "../../components/Text/types.js";
|
|
9
9
|
import t from "../../components/Text/Text.js";
|
|
10
|
-
import
|
|
10
|
+
import q from "../../components/PageContentWrapper/PageContentWrapper.js";
|
|
11
11
|
import { SSRMediaQuery as f } from "../../providers/SeldonProvider/utils.js";
|
|
12
|
-
const
|
|
12
|
+
const z = M(
|
|
13
13
|
({
|
|
14
14
|
auctionEndTime: i,
|
|
15
15
|
auctionTitle: o,
|
|
@@ -23,23 +23,25 @@ const q = H(
|
|
|
23
23
|
countdownFormatDuration: x,
|
|
24
24
|
auctionState: B,
|
|
25
25
|
occurrenceInformation: k,
|
|
26
|
-
onClick:
|
|
26
|
+
onClick: A,
|
|
27
27
|
children: C,
|
|
28
28
|
className: P,
|
|
29
29
|
footerElement: b,
|
|
30
30
|
headerLabel: j,
|
|
31
31
|
showTimer: c,
|
|
32
|
+
currentDateTime: y,
|
|
32
33
|
...s
|
|
33
34
|
}, l) => {
|
|
34
|
-
const { className: e, ...m } =
|
|
35
|
+
const { className: e, ...m } = R(s, "SaleHeaderBanner"), d = B === O.live, _ = {
|
|
35
36
|
endDateTime: i,
|
|
36
37
|
label: w,
|
|
37
|
-
formatDurationStr: x
|
|
38
|
+
formatDurationStr: x,
|
|
39
|
+
currentDateTime: y
|
|
38
40
|
};
|
|
39
|
-
return /* @__PURE__ */ n("div", { ...m, className:
|
|
41
|
+
return /* @__PURE__ */ n("div", { ...m, className: D(e, P), ...s, ref: l, children: [
|
|
40
42
|
d && i && c ? /* @__PURE__ */ a(f.Media, { lessThan: "md", children: /* @__PURE__ */ a("div", { className: `${e}__stack__countdown`, children: /* @__PURE__ */ a(h, { ..._, showBottomBorder: !1 }) }) }) : null,
|
|
41
43
|
/* @__PURE__ */ a(
|
|
42
|
-
|
|
44
|
+
F,
|
|
43
45
|
{
|
|
44
46
|
aspectRatio: "16/9",
|
|
45
47
|
src: g,
|
|
@@ -52,14 +54,14 @@ const q = H(
|
|
|
52
54
|
fetchPriority: S
|
|
53
55
|
}
|
|
54
56
|
),
|
|
55
|
-
/* @__PURE__ */ a(
|
|
57
|
+
/* @__PURE__ */ a(q, { className: `${e}__stack-wrapper`, ...m, ...s, ref: l, children: /* @__PURE__ */ n("div", { className: `${e}__stack`, children: [
|
|
56
58
|
d && i && c ? /* @__PURE__ */ a(f.Media, { greaterThanOrEqual: "md", children: /* @__PURE__ */ a("div", { className: `${e}__stack__countdown`, children: /* @__PURE__ */ a(h, { ..._ }) }) }) : null,
|
|
57
59
|
/* @__PURE__ */ a(t, { variant: r.badge, children: j }),
|
|
58
60
|
/* @__PURE__ */ a(t, { variant: r.title1, children: o }),
|
|
59
61
|
/* @__PURE__ */ a(t, { variant: r.string2, className: `${e}__location`, children: $ }),
|
|
60
62
|
/* @__PURE__ */ n("div", { className: `${e}__occurrence-details`, children: [
|
|
61
|
-
k.map(({ date: p, occurrenceLabel:
|
|
62
|
-
/* @__PURE__ */ a(t, { variant: r.string2, children:
|
|
63
|
+
k.map(({ date: p, occurrenceLabel: H }) => /* @__PURE__ */ n("div", { className: `${e}__occurrence-details-text`, children: [
|
|
64
|
+
/* @__PURE__ */ a(t, { variant: r.string2, children: H }),
|
|
63
65
|
/* @__PURE__ */ a(t, { variant: r.string2, className: `${e}__date`, children: p })
|
|
64
66
|
] }, String(p))),
|
|
65
67
|
C
|
|
@@ -69,7 +71,7 @@ const q = H(
|
|
|
69
71
|
] });
|
|
70
72
|
}
|
|
71
73
|
);
|
|
72
|
-
|
|
74
|
+
z.displayName = "SaleHeaderBanner";
|
|
73
75
|
export {
|
|
74
|
-
|
|
76
|
+
z as default
|
|
75
77
|
};
|