@phillips/seldon 1.92.0 → 1.94.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/assets/PhillipsLogo.svg.js +2 -2
- package/dist/assets/calendarAlt.svg.js +5 -0
- package/dist/assets/favorite.svg.js +5 -0
- package/dist/assets/icons.d.ts +2 -0
- package/dist/components/Button/Button.js +39 -33
- package/dist/components/Countdown/Countdown.d.ts +4 -0
- package/dist/components/Countdown/Countdown.js +54 -42
- package/dist/components/Countdown/Duration.d.ts +2 -1
- package/dist/components/Countdown/Duration.js +7 -8
- package/dist/components/Detail/Detail.d.ts +2 -0
- package/dist/components/Detail/Detail.js +19 -13
- package/dist/components/Detail/Detail.stories.d.ts +1 -0
- package/dist/components/SeldonImage/SeldonImage.js +27 -26
- package/dist/index.d.ts +3 -0
- package/dist/index.js +205 -194
- package/dist/patterns/BidSnapshot/BidMessage.d.ts +27 -0
- package/dist/patterns/BidSnapshot/BidMessage.js +22 -0
- package/dist/patterns/BidSnapshot/BidMessage.test.d.ts +1 -0
- package/dist/patterns/BidSnapshot/BidSnapshot.d.ts +67 -0
- package/dist/patterns/BidSnapshot/BidSnapshot.js +61 -0
- package/dist/patterns/BidSnapshot/BidSnapshot.stories.d.ts +27 -0
- package/dist/patterns/BidSnapshot/BidSnapshot.test.d.ts +1 -0
- package/dist/patterns/BidSnapshot/index.d.ts +2 -0
- package/dist/patterns/BidSnapshot/types.d.ts +4 -0
- package/dist/patterns/BidSnapshot/types.js +4 -0
- package/dist/patterns/ObjectTile/ObjectTile.d.ts +69 -0
- package/dist/patterns/ObjectTile/ObjectTile.js +94 -0
- package/dist/patterns/ObjectTile/ObjectTile.stories.d.ts +41 -0
- package/dist/patterns/ObjectTile/ObjectTile.test.d.ts +1 -0
- package/dist/patterns/ObjectTile/index.d.ts +1 -0
- package/dist/patterns/SaleHeaderBanner/SaleHeaderBanner.d.ts +2 -2
- package/dist/patterns/SaleHeaderBanner/SaleHeaderBanner.js +17 -17
- package/dist/patterns/SaleHeaderBanner/SaleHeaderBanner.stories.d.ts +3 -3
- package/dist/scss/_vars.scss +5 -1
- package/dist/scss/componentStyles.scss +2 -0
- package/dist/scss/components/Countdown/_countdown.scss +8 -0
- package/dist/scss/components/Countdown/_duration.scss +5 -4
- package/dist/scss/components/Detail/_detail.scss +20 -0
- package/dist/scss/components/SeldonImage/_seldonImage.scss +12 -4
- package/dist/scss/patterns/BidSnapshot/_bidSnapshot.scss +48 -0
- package/dist/scss/patterns/ObjectTile/_objectTile.scss +61 -0
- package/dist/types/commonTypes.d.ts +5 -0
- package/dist/types/commonTypes.js +2 -1
- package/package.json +1 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as e from "react";
|
|
2
|
-
const
|
|
2
|
+
const t = (l) => /* @__PURE__ */ e.createElement("svg", { "data-testid": "header-logo-svg", viewBox: "0 0 131 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...l }, /* @__PURE__ */ e.createElement("g", { id: "Logo/ HP Button", clipPath: "url(#clip0_3288_4057)" }, /* @__PURE__ */ e.createElement("path", { className: "phillips-logo", id: "Phillips Logo", d: "M54.8166 0.274027H52.6224V13.726H63.7504V11.6083H54.8166V0.274027ZM41.3171 13.7273H43.5119V0.274027H41.3171V13.7273ZM21.276 0.274027H19.1214V13.726H21.2566V8.86215H30.0526V13.726H32.2079V0.274027H30.0526V6.80339H21.2566L21.276 0.274027ZM87.8477 13.7273H90.0425V0.274027H87.8477V13.7273ZM118.23 10.402L117.489 12.3843C119.214 13.3651 122.153 14 124.23 14C128.07 14 130.48 12.4912 130.48 9.84295C130.48 6.72565 127.521 6.17565 124.309 5.86211C122.252 5.66647 120.096 5.50969 120.096 4.01971C120.096 2.86206 121.135 2.11772 123.898 2.11772C125.543 2.11772 127.444 2.49021 129.031 3.15747L129.716 1.157C127.953 0.39193 125.817 0 123.936 0C120.058 0 117.863 1.52885 117.863 4.01971C117.863 7.1571 120.861 7.7058 124.034 7.99991C126.091 8.1962 128.227 8.37305 128.227 9.8436C128.227 11.0401 127.15 11.8829 124.25 11.8829C122.467 11.8823 120.004 11.3485 118.23 10.402ZM72.4298 0.274027H70.2357V13.726H81.3637V11.6083H72.4298V0.274027ZM106.676 0.274027H99.1724V13.726H101.367V9.27417H106.676C109.811 9.27417 111.614 7.39161 111.614 4.76406C111.614 2.15659 109.85 0.274027 106.676 0.274027ZM106.421 7.1571H101.367V2.39174H106.421C108.321 2.39174 109.379 3.27407 109.379 4.7647C109.38 6.25533 108.361 7.1571 106.421 7.1571ZM7.50343 0.274027H0V13.726H2.19414V9.27417H7.50343C10.638 9.27417 12.4399 7.39161 12.4399 4.76406C12.4406 2.15659 10.6775 0.274027 7.50343 0.274027ZM7.24907 7.1571H2.19414V2.39174H7.24907C9.14936 2.39174 10.2069 3.27407 10.2069 4.7647C10.2063 6.25533 9.18819 7.1571 7.24907 7.1571Z", fill: "black" })), /* @__PURE__ */ e.createElement("defs", null, /* @__PURE__ */ e.createElement("clipPath", { id: "clip0_3288_4057" }, /* @__PURE__ */ e.createElement("rect", { width: 130.667, height: 14, fill: "white" }))));
|
|
3
3
|
export {
|
|
4
|
-
|
|
4
|
+
t as default
|
|
5
5
|
};
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import * as e from "react";
|
|
2
|
+
const t = (l) => /* @__PURE__ */ e.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 28, height: 28, viewBox: "0 0 28 28", fill: "none", ...l }, /* @__PURE__ */ e.createElement("path", { d: "M7 12.2505C6.51675 12.2505 6.125 12.6422 6.125 13.1255C6.125 13.6087 6.51675 14.0005 7 14.0005H8.75C9.23325 14.0005 9.625 13.6087 9.625 13.1255C9.625 12.6422 9.23325 12.2505 8.75 12.2505H7Z", fill: "black" }), /* @__PURE__ */ e.createElement("path", { d: "M13.125 12.2505C12.6418 12.2505 12.25 12.6422 12.25 13.1255C12.25 13.6087 12.6418 14.0005 13.125 14.0005H14.875C15.3582 14.0005 15.75 13.6087 15.75 13.1255C15.75 12.6422 15.3582 12.2505 14.875 12.2505H13.125Z", fill: "black" }), /* @__PURE__ */ e.createElement("path", { d: "M19.25 12.2505C18.7668 12.2505 18.375 12.6422 18.375 13.1255C18.375 13.6087 18.7668 14.0005 19.25 14.0005H21C21.4832 14.0005 21.875 13.6087 21.875 13.1255C21.875 12.6422 21.4832 12.2505 21 12.2505H19.25Z", fill: "black" }), /* @__PURE__ */ e.createElement("path", { d: "M7 17.5005C6.51675 17.5005 6.125 17.8922 6.125 18.3755C6.125 18.8587 6.51675 19.2505 7 19.2505H8.75C9.23325 19.2505 9.625 18.8587 9.625 18.3755C9.625 17.8922 9.23325 17.5005 8.75 17.5005H7Z", fill: "black" }), /* @__PURE__ */ e.createElement("path", { d: "M13.125 17.5005C12.6418 17.5005 12.25 17.8922 12.25 18.3755C12.25 18.8587 12.6418 19.2505 13.125 19.2505H14.875C15.3582 19.2505 15.75 18.8587 15.75 18.3755C15.75 17.8922 15.3582 17.5005 14.875 17.5005H13.125Z", fill: "black" }), /* @__PURE__ */ e.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M1.75 7.00049C1.75 5.06749 3.317 3.50049 5.25 3.50049H22.75C24.683 3.50049 26.25 5.06749 26.25 7.00049V21.0005C26.25 22.9335 24.683 24.5005 22.75 24.5005H5.25C3.317 24.5005 1.75 22.9335 1.75 21.0005V7.00049ZM24.5 9.62549V21.0005C24.5 21.967 23.7165 22.7505 22.75 22.7505H5.25C4.2835 22.7505 3.5 21.967 3.5 21.0005V9.62549H24.5ZM24.5 7.87549V7.00049C24.5 6.03399 23.7165 5.25049 22.75 5.25049H5.25C4.2835 5.25049 3.5 6.03399 3.5 7.00049V7.87549H24.5Z", fill: "black" }));
|
|
3
|
+
export {
|
|
4
|
+
t as default
|
|
5
|
+
};
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import * as e from "react";
|
|
2
|
+
const l = (t) => /* @__PURE__ */ e.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 32 32", ...t }, /* @__PURE__ */ e.createElement("g", { clipPath: "url(#a)" }, /* @__PURE__ */ e.createElement("path", { fill: "#323232", stroke: "#323232", strokeWidth: 2, d: "m16.76 6.45.006-.007.037-.04a9.895 9.895 0 0 1 .784-.753c.548-.472 1.316-1.033 2.22-1.436.901-.401 1.903-.63 2.95-.49 1.032.138 2.2.647 3.429 1.876 2.459 2.46 2.55 4.748 2.116 6.41a7.466 7.466 0 0 1-1.481 2.848l-.003.003v.001h-.001L16 26.53 5.183 14.863v-.001h-.001l-.003-.004a2.984 2.984 0 0 1-.143-.173 7.466 7.466 0 0 1-1.338-2.676c-.434-1.66-.343-3.95 2.116-6.41 1.23-1.228 2.397-1.737 3.43-1.875 1.046-.14 2.048.089 2.949.49.904.403 1.672.964 2.22 1.436a9.867 9.867 0 0 1 .784.753l.037.04.006.008h.001l.759.89.759-.89Z" })), /* @__PURE__ */ e.createElement("defs", null, /* @__PURE__ */ e.createElement("clipPath", { id: "a" }, /* @__PURE__ */ e.createElement("path", { fill: "#fff", d: "M0 0h32v32H0z" }))));
|
|
3
|
+
export {
|
|
4
|
+
l as default
|
|
5
|
+
};
|
package/dist/assets/icons.d.ts
CHANGED
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
export { default as AccountCircle } from './account_circle.svg?react';
|
|
2
2
|
export { default as ArrowPrev } from './arrowPrev.svg?react';
|
|
3
3
|
export { default as Calendar } from './calendar.svg?react';
|
|
4
|
+
export { default as CalendarAlt } from './calendarAlt.svg?react';
|
|
4
5
|
export { default as ChevronDown } from './chevronDown.svg?react';
|
|
5
6
|
export { default as ChevronNext } from './chevronNext.svg?react';
|
|
6
7
|
export { default as ChevronRight } from './chevronRight.svg?react';
|
|
7
8
|
export { default as Close } from './close.svg?react';
|
|
9
|
+
export { default as Favorite } from './favorite.svg?react';
|
|
8
10
|
export { default as FavoriteOutline } from './favoriteOutline.svg?react';
|
|
9
11
|
export { default as Facebook } from './icon-footer-facebook.svg?react';
|
|
10
12
|
export { default as FooterInstagram } from './icon-footer-instagram.svg?react';
|
|
@@ -1,58 +1,64 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import
|
|
1
|
+
import { jsx as i } from "react/jsx-runtime";
|
|
2
|
+
import p from "../../node_modules/classnames/index.js";
|
|
3
3
|
import { getCommonProps as d } from "../../utils/index.js";
|
|
4
4
|
import { ButtonVariants as b } from "./types.js";
|
|
5
|
-
import { forwardRef as
|
|
6
|
-
const
|
|
5
|
+
import { forwardRef as B } from "react";
|
|
6
|
+
const N = B(
|
|
7
7
|
({
|
|
8
|
-
variant:
|
|
9
|
-
size:
|
|
10
|
-
children:
|
|
11
|
-
className:
|
|
8
|
+
variant: t = b.primary,
|
|
9
|
+
size: s = "md",
|
|
10
|
+
children: r,
|
|
11
|
+
className: a,
|
|
12
12
|
isIconLast: m = !1,
|
|
13
13
|
type: u = "button",
|
|
14
14
|
isDisabled: c = !1,
|
|
15
|
-
href:
|
|
16
|
-
target:
|
|
17
|
-
...
|
|
18
|
-
},
|
|
19
|
-
const { className: o,
|
|
20
|
-
return
|
|
15
|
+
href: e,
|
|
16
|
+
target: n,
|
|
17
|
+
...l
|
|
18
|
+
}, $) => {
|
|
19
|
+
const { className: o, ...f } = d(l, "Button");
|
|
20
|
+
return e ? /* @__PURE__ */ i(
|
|
21
21
|
"a",
|
|
22
22
|
{
|
|
23
|
-
|
|
24
|
-
ref:
|
|
25
|
-
href:
|
|
26
|
-
className:
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
23
|
+
...f,
|
|
24
|
+
ref: $,
|
|
25
|
+
href: e,
|
|
26
|
+
className: p(
|
|
27
|
+
`${o}`,
|
|
28
|
+
`${o}--${s}`,
|
|
29
|
+
`${o}--${t}`,
|
|
30
|
+
{
|
|
31
|
+
[`${o}--icon-last`]: m
|
|
32
|
+
},
|
|
33
|
+
a
|
|
34
|
+
),
|
|
35
|
+
target: n,
|
|
36
|
+
rel: n === "_blank" ? "noopener noreferrer" : void 0,
|
|
37
|
+
children: r
|
|
32
38
|
}
|
|
33
|
-
) : /* @__PURE__ */
|
|
39
|
+
) : /* @__PURE__ */ i(
|
|
34
40
|
"button",
|
|
35
41
|
{
|
|
36
|
-
|
|
37
|
-
ref:
|
|
42
|
+
...f,
|
|
43
|
+
ref: $,
|
|
38
44
|
type: u,
|
|
39
|
-
className:
|
|
45
|
+
className: p(
|
|
40
46
|
`${o}`,
|
|
41
|
-
`${o}--${t}`,
|
|
42
47
|
`${o}--${s}`,
|
|
48
|
+
`${o}--${t}`,
|
|
43
49
|
{
|
|
44
50
|
[`${o}--icon-last`]: m
|
|
45
51
|
},
|
|
46
|
-
|
|
52
|
+
a
|
|
47
53
|
),
|
|
48
54
|
disabled: c,
|
|
49
|
-
...
|
|
50
|
-
children:
|
|
55
|
+
...l,
|
|
56
|
+
children: r
|
|
51
57
|
}
|
|
52
58
|
);
|
|
53
59
|
}
|
|
54
60
|
);
|
|
55
|
-
|
|
61
|
+
N.displayName = "Button";
|
|
56
62
|
export {
|
|
57
|
-
|
|
63
|
+
N as default
|
|
58
64
|
};
|
|
@@ -6,6 +6,10 @@ export interface CountdownProps extends ComponentProps<'div'> {
|
|
|
6
6
|
* The date the countdown should end
|
|
7
7
|
*/
|
|
8
8
|
endDateTime: Date;
|
|
9
|
+
/**
|
|
10
|
+
* Function to modify strings coming from date-fns (Minutes -> Mins etc)
|
|
11
|
+
*/
|
|
12
|
+
formatDurationStr?: (duration: string) => string;
|
|
9
13
|
/**
|
|
10
14
|
* Any descriptor to appear below the coundown
|
|
11
15
|
*/
|
|
@@ -1,50 +1,62 @@
|
|
|
1
|
-
import { jsxs as d, jsx 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 N, useState as L, useEffect as v } from "react";
|
|
3
|
+
import { getCommonProps as g } from "../../utils/index.js";
|
|
4
|
+
import x from "../../node_modules/classnames/index.js";
|
|
5
|
+
import { SupportedLanguages as j } from "../../types/commonTypes.js";
|
|
6
|
+
import { CountdownVariants as m } from "./types.js";
|
|
7
7
|
import { Duration as s } 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
|
-
const
|
|
8
|
+
import { zhCN as z } from "../../node_modules/date-fns/locale/zh-CN.js";
|
|
9
|
+
import { enUS as P } from "../../node_modules/date-fns/locale/en-US.js";
|
|
10
|
+
import { differenceInDays as S } from "../../node_modules/date-fns/differenceInDays.js";
|
|
11
|
+
import { differenceInHours as _ } from "../../node_modules/date-fns/differenceInHours.js";
|
|
12
|
+
import { differenceInMinutes as $ } from "../../node_modules/date-fns/differenceInMinutes.js";
|
|
13
|
+
import { differenceInSeconds as b } from "../../node_modules/date-fns/differenceInSeconds.js";
|
|
14
|
+
const E = N(
|
|
15
15
|
({
|
|
16
|
-
endDateTime:
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
16
|
+
endDateTime: n,
|
|
17
|
+
formatDurationStr: a,
|
|
18
|
+
label: l = "Lots Close in",
|
|
19
|
+
intervalDescription: f = "Lots Close in 1-minute intervals",
|
|
20
|
+
className: p,
|
|
21
|
+
locale: h = "en",
|
|
22
|
+
variant: u = m.default,
|
|
23
|
+
...c
|
|
24
|
+
}, C) => {
|
|
25
|
+
const { className: i, ...w } = g(c, "Countdown"), [r, y] = L(/* @__PURE__ */ new Date()), t = h === j.zh ? z : P, o = {
|
|
26
|
+
days: S(n, r),
|
|
27
|
+
hours: _(n, r) % 24,
|
|
28
|
+
minutes: $(n, r) % 60,
|
|
29
|
+
seconds: b(n, r) % 60 % 60
|
|
29
30
|
};
|
|
30
|
-
return
|
|
31
|
-
const
|
|
32
|
-
|
|
31
|
+
return v(() => {
|
|
32
|
+
const I = setInterval(() => {
|
|
33
|
+
y(/* @__PURE__ */ new Date());
|
|
33
34
|
}, 1e3);
|
|
34
|
-
return () => clearInterval(
|
|
35
|
-
}, [
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
35
|
+
return () => clearInterval(I);
|
|
36
|
+
}, [n]), /* @__PURE__ */ d(
|
|
37
|
+
"div",
|
|
38
|
+
{
|
|
39
|
+
...w,
|
|
40
|
+
className: x(i, p, {
|
|
41
|
+
[`${i}--compact`]: u === m.compact
|
|
42
|
+
}),
|
|
43
|
+
...c,
|
|
44
|
+
ref: C,
|
|
45
|
+
children: [
|
|
46
|
+
/* @__PURE__ */ d("div", { className: `${i}__countdown-container`, role: "timer", "aria-label": l, children: [
|
|
47
|
+
/* @__PURE__ */ e("span", { children: l }),
|
|
48
|
+
o.days > 0 ? /* @__PURE__ */ e(s, { duration: o, unit: "days", locale: t, formatDurationStr: a }) : null,
|
|
49
|
+
o.days > 0 || o.hours > 0 ? /* @__PURE__ */ e(s, { duration: o, unit: "hours", locale: t }) : null,
|
|
50
|
+
o.days === 0 ? /* @__PURE__ */ e(s, { duration: o, unit: "minutes", locale: t, formatDurationStr: a }) : null,
|
|
51
|
+
o.days === 0 && o.hours === 0 ? /* @__PURE__ */ e(s, { duration: o, unit: "seconds", locale: t, formatDurationStr: a }) : null
|
|
52
|
+
] }),
|
|
53
|
+
u === m.default ? /* @__PURE__ */ e("span", { children: f }) : null
|
|
54
|
+
]
|
|
55
|
+
}
|
|
56
|
+
);
|
|
45
57
|
}
|
|
46
58
|
);
|
|
47
|
-
|
|
59
|
+
E.displayName = "Countdown";
|
|
48
60
|
export {
|
|
49
|
-
|
|
61
|
+
E as default
|
|
50
62
|
};
|
|
@@ -3,5 +3,6 @@ export interface DurationProps {
|
|
|
3
3
|
duration: DurationValue;
|
|
4
4
|
unit: DurationUnit;
|
|
5
5
|
locale: Locale;
|
|
6
|
+
formatDurationStr?: (duration: string) => string;
|
|
6
7
|
}
|
|
7
|
-
export declare const Duration: ({ duration, unit, locale }: DurationProps) => import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export declare const Duration: ({ duration, unit, locale, formatDurationStr }: DurationProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,12 +1,11 @@
|
|
|
1
|
-
import { jsxs as
|
|
1
|
+
import { jsxs as e, jsx as o } from "react/jsx-runtime";
|
|
2
2
|
import { px as m } from "../../utils/index.js";
|
|
3
|
-
import
|
|
4
|
-
|
|
5
|
-
const
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
/* @__PURE__ */ o("span", {
|
|
9
|
-
/* @__PURE__ */ o("span", { children: a[1] })
|
|
3
|
+
import { formatDuration as p } from "../../node_modules/date-fns/formatDuration.js";
|
|
4
|
+
const u = ({ duration: a, unit: s, locale: n, formatDurationStr: i = (r) => r }) => {
|
|
5
|
+
const r = `${m}-duration`, t = p(a, { format: [s], zero: !0, locale: n }).split(" ");
|
|
6
|
+
return /* @__PURE__ */ e("div", { className: r, children: [
|
|
7
|
+
/* @__PURE__ */ o("span", { children: t[0].padStart(2, "0") }),
|
|
8
|
+
/* @__PURE__ */ o("span", { children: i(t[1]) })
|
|
10
9
|
] });
|
|
11
10
|
};
|
|
12
11
|
export {
|
|
@@ -1,15 +1,21 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import { forwardRef as
|
|
3
|
-
import { getCommonProps as
|
|
4
|
-
import
|
|
5
|
-
const
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
/* @__PURE__ */
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
1
|
+
import { jsxs as l, jsx as r } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef as p } from "react";
|
|
3
|
+
import { getCommonProps as f } from "../../utils/index.js";
|
|
4
|
+
import m from "../../node_modules/classnames/index.js";
|
|
5
|
+
const N = p(
|
|
6
|
+
({ className: o = "", hasWrap: t = !0, label: i, subLabel: e, value: n, ...s }, c) => {
|
|
7
|
+
const { className: a, ...d } = f(s, "Detail");
|
|
8
|
+
return /* @__PURE__ */ l("div", { ...d, className: m(a, o), ...s, ref: c, children: [
|
|
9
|
+
/* @__PURE__ */ l("dt", { className: m(`${a}__label`, { [`${a}__label--no-wrap`]: !t }), children: [
|
|
10
|
+
i,
|
|
11
|
+
" ",
|
|
12
|
+
e ? /* @__PURE__ */ r("span", { children: e }) : null
|
|
13
|
+
] }),
|
|
14
|
+
/* @__PURE__ */ r("dd", { className: `${a}__value`, children: n })
|
|
15
|
+
] });
|
|
16
|
+
}
|
|
17
|
+
);
|
|
18
|
+
N.displayName = "Detail";
|
|
13
19
|
export {
|
|
14
|
-
|
|
20
|
+
N as default
|
|
15
21
|
};
|
|
@@ -1,17 +1,18 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import { forwardRef as
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
|
|
1
|
+
import { jsxs as h, jsx as l } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef as I, useRef as v, useState as y, useCallback as E, useEffect as P } from "react";
|
|
3
|
+
import d from "../../node_modules/classnames/index.js";
|
|
4
|
+
import { getCommonProps as w } from "../../utils/index.js";
|
|
5
|
+
import x from "../../assets/PhillipsLogo.svg.js";
|
|
6
|
+
function C(s) {
|
|
6
7
|
return new Promise((a) => {
|
|
7
8
|
const r = document.createElement("img");
|
|
8
|
-
r.onerror = () => a(!1), r.onload = () => a(!0), r.src =
|
|
9
|
+
r.onerror = () => a(!1), r.onload = () => a(!0), r.src = s;
|
|
9
10
|
});
|
|
10
11
|
}
|
|
11
|
-
const
|
|
12
|
+
const L = I(
|
|
12
13
|
({
|
|
13
|
-
className:
|
|
14
|
-
aspectRatio:
|
|
14
|
+
className: s,
|
|
15
|
+
aspectRatio: m = "none",
|
|
15
16
|
objectFit: a = "none",
|
|
16
17
|
hasBlurBackground: r = !1,
|
|
17
18
|
imageClassName: u,
|
|
@@ -20,20 +21,20 @@ const P = h(
|
|
|
20
21
|
alt: t,
|
|
21
22
|
errorText: p = "Error loading image",
|
|
22
23
|
...g
|
|
23
|
-
},
|
|
24
|
-
const { className: e, ...c } =
|
|
25
|
-
const
|
|
26
|
-
|
|
24
|
+
}, b) => {
|
|
25
|
+
const { className: e, ...c } = w(g, "SeldonImage"), N = v(null), [o, i] = y("loading"), f = E(async () => {
|
|
26
|
+
const S = await C(n);
|
|
27
|
+
i(S ? "loaded" : "error");
|
|
27
28
|
}, [n]);
|
|
28
|
-
return
|
|
29
|
+
return P(() => {
|
|
29
30
|
f();
|
|
30
|
-
}, [f]), /* @__PURE__ */
|
|
31
|
+
}, [f]), /* @__PURE__ */ h(
|
|
31
32
|
"div",
|
|
32
33
|
{
|
|
33
|
-
ref:
|
|
34
|
-
className:
|
|
34
|
+
ref: b,
|
|
35
|
+
className: d(e, s, {
|
|
35
36
|
[`${e}--hidden`]: o === "loading" || o === "error",
|
|
36
|
-
[`${e}--aspect-ratio-${
|
|
37
|
+
[`${e}--aspect-ratio-${m.replace("/", "-")}`]: m !== "none"
|
|
37
38
|
}),
|
|
38
39
|
role: "img",
|
|
39
40
|
"aria-label": t,
|
|
@@ -43,17 +44,17 @@ const P = h(
|
|
|
43
44
|
r && /* @__PURE__ */ l(
|
|
44
45
|
"div",
|
|
45
46
|
{
|
|
46
|
-
className:
|
|
47
|
+
className: d(`${e}-blur`, {
|
|
47
48
|
[`${e}-blur--hidden`]: o === "loading" || o === "error"
|
|
48
49
|
}),
|
|
49
50
|
style: { backgroundImage: `url(${n})` }
|
|
50
51
|
}
|
|
51
52
|
),
|
|
52
|
-
o === "error"
|
|
53
|
+
o === "error" ? /* @__PURE__ */ l("div", { className: `${e}--error`, children: /* @__PURE__ */ l(x, { "aria-label": p }) }) : null,
|
|
53
54
|
/* @__PURE__ */ l(
|
|
54
55
|
"img",
|
|
55
56
|
{
|
|
56
|
-
className:
|
|
57
|
+
className: d(`${e}-img`, u, {
|
|
57
58
|
[`${e}-img--hidden`]: o !== "loaded",
|
|
58
59
|
[`${e}-img--object-fit-${a}`]: a !== "none"
|
|
59
60
|
}),
|
|
@@ -61,12 +62,12 @@ const P = h(
|
|
|
61
62
|
src: n,
|
|
62
63
|
alt: t,
|
|
63
64
|
"data-testid": `${c["data-testid"]}-img`,
|
|
64
|
-
ref:
|
|
65
|
+
ref: N,
|
|
65
66
|
onLoad: () => {
|
|
66
|
-
|
|
67
|
+
i("loaded");
|
|
67
68
|
},
|
|
68
69
|
onError: () => {
|
|
69
|
-
|
|
70
|
+
i("error");
|
|
70
71
|
}
|
|
71
72
|
}
|
|
72
73
|
)
|
|
@@ -75,7 +76,7 @@ const P = h(
|
|
|
75
76
|
);
|
|
76
77
|
}
|
|
77
78
|
);
|
|
78
|
-
|
|
79
|
+
L.displayName = "SeldonImage";
|
|
79
80
|
export {
|
|
80
|
-
|
|
81
|
+
L as default
|
|
81
82
|
};
|
package/dist/index.d.ts
CHANGED
|
@@ -3,6 +3,7 @@ export * from './assets/icons';
|
|
|
3
3
|
export { default as Page } from './pages/Page';
|
|
4
4
|
export * from './utils/hooks';
|
|
5
5
|
export * from './providers/SeldonProvider/utils';
|
|
6
|
+
export * from './types/commonTypes';
|
|
6
7
|
export { default as Button, type ButtonProps } from './components/Button/Button';
|
|
7
8
|
export { ButtonVariants } from './components/Button/types';
|
|
8
9
|
export { default as IconButton } from './components/IconButton/IconButton';
|
|
@@ -58,3 +59,5 @@ export * from './components/SeldonImage';
|
|
|
58
59
|
export * from './patterns/SaleHeaderBanner';
|
|
59
60
|
export * from './components/Countdown';
|
|
60
61
|
export * from './components/Countdown/types';
|
|
62
|
+
export * from './patterns/ObjectTile';
|
|
63
|
+
export * from './patterns/BidSnapshot';
|