@purpurds/promotion-card 8.5.2 → 8.6.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/LICENSE.txt +4 -4
- package/dist/metadata.js +2 -0
- package/dist/promotion-card.cjs.js +7 -7
- package/dist/promotion-card.cjs.js.map +1 -1
- package/dist/promotion-card.d.ts +9 -11
- package/dist/promotion-card.d.ts.map +1 -1
- package/dist/promotion-card.es.js +39 -39
- package/dist/promotion-card.es.js.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +13 -13
- package/src/promotion-card.module.scss +6 -0
- package/src/promotion-card.tsx +4 -1
package/dist/styles.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
._purpur-promotion-
|
|
1
|
+
._purpur-promotion-card_1kw9a_1{container:promotion-card/inline-size;position:relative;width:100%;height:100%;color:var(--promotion-card-color);box-sizing:border-box}._purpur-promotion-card__inner_1kw9a_9{height:100%}._purpur-promotion-card__inner--without-image_1kw9a_12 ._purpur-promotion-card__content_1kw9a_12{position:relative;z-index:1}._purpur-promotion-card__inner--without-image_1kw9a_12:before{content:"";position:absolute;width:100%;height:100%;background-color:var(--promotion-card-background);background-image:var(--promotion-card-background-image);background-position:right 50% center;background-size:cover;transform:rotateY(180deg)}@container promotion-card (min-width: 600px){._purpur-promotion-card__inner--without-image_1kw9a_12:before{background-position:center center}}@container promotion-card (min-width: 1024px){._purpur-promotion-card__inner--without-image_1kw9a_12:before{transform:rotateY(0)}}._purpur-promotion-card__inner--with-image_1kw9a_37{display:grid;grid-template-areas:"image" "body";grid-template-rows:auto 1fr;background:var(--promotion-card-background)}@container promotion-card (min-width: 600px){._purpur-promotion-card__inner--with-image_1kw9a_37{grid-template-areas:"body image";grid-template-columns:repeat(2,1fr)}}._purpur-promotion-card__actions_1kw9a_49{display:flex;flex-direction:column;flex-wrap:wrap;gap:var(--purpur-spacing-200);padding-top:var(--purpur-spacing-400)}@container promotion-card (min-width: 600px){._purpur-promotion-card__actions_1kw9a_49{flex-direction:row}}._purpur-promotion-card__content_1kw9a_12{grid-area:body;display:flex;flex-direction:column;justify-content:flex-end;height:100%;padding:var(--purpur-spacing-400);box-sizing:border-box}@container promotion-card (min-width: 1024px){._purpur-promotion-card__content--without-image_1kw9a_71{padding:var(--purpur-spacing-600)}._purpur-promotion-card__content--without-image_1kw9a_71 ._purpur-promotion-card__main-content_1kw9a_74{display:flex;flex-direction:row;gap:var(--purpur-spacing-300)}._purpur-promotion-card__content--without-image_1kw9a_71 ._purpur-promotion-card__heading_1kw9a_79{width:100%}}@container promotion-card (min-width: 600px){._purpur-promotion-card__content--with-image_1kw9a_84{flex-direction:column;justify-content:center;padding:var(--purpur-spacing-600) var(--purpur-spacing-400)}}@container promotion-card (min-width: 1024px){._purpur-promotion-card__content--with-image_1kw9a_84{padding:var(--purpur-spacing-1200) var(--purpur-spacing-600)}}._purpur-promotion-card__badge-wrapper_1kw9a_95{width:100%;padding-bottom:var(--purpur-spacing-200)}._purpur-promotion-card__heading_1kw9a_79,._purpur-promotion-card__body_1kw9a_99{width:100%}._purpur-promotion-card_1kw9a_1 ._purpur-promotion-card__heading_1kw9a_79{margin-bottom:var(--purpur-spacing-150);color:var(--promotion-card-color)}._purpur-promotion-card__main-content_1kw9a_74{display:flex;flex-direction:column}._purpur-promotion-card__main-content--space-between_1kw9a_110{flex-grow:1}._purpur-promotion-card__main-content--flex-end_1kw9a_113{flex-grow:0}._purpur-promotion-card_1kw9a_1 ._purpur-promotion-card__body_1kw9a_99{display:flex;flex-direction:column;flex-grow:1}._purpur-promotion-card_1kw9a_1 ._purpur-promotion-card__body_1kw9a_99,._purpur-promotion-card_1kw9a_1 ._purpur-promotion-card__body_1kw9a_99 p,._purpur-promotion-card_1kw9a_1 ._purpur-promotion-card__body_1kw9a_99 h1,._purpur-promotion-card_1kw9a_1 ._purpur-promotion-card__body_1kw9a_99 h2,._purpur-promotion-card_1kw9a_1 ._purpur-promotion-card__body_1kw9a_99 h3,._purpur-promotion-card_1kw9a_1 ._purpur-promotion-card__body_1kw9a_99 h4,._purpur-promotion-card_1kw9a_1 ._purpur-promotion-card__body_1kw9a_99 h5,._purpur-promotion-card_1kw9a_1 ._purpur-promotion-card__body_1kw9a_99 h6,._purpur-promotion-card_1kw9a_1 ._purpur-promotion-card__body_1kw9a_99 ul,._purpur-promotion-card_1kw9a_1 ._purpur-promotion-card__body_1kw9a_99 ol{color:var(--promotion-card-color)}._purpur-promotion-card__child-content_1kw9a_133{flex-grow:1}._purpur-promotion-card__additional-text_1kw9a_136{margin-top:var(--purpur-spacing-400)}._purpur-promotion-card__image-wrapper_1kw9a_139{grid-area:image}._purpur-promotion-card__image-wrapper--decorative_1kw9a_142 picture,._purpur-promotion-card__image-wrapper--decorative_1kw9a_142 img,._purpur-promotion-card__image-wrapper--product_1kw9a_143 picture,._purpur-promotion-card__image-wrapper--product_1kw9a_143 img{display:block;width:100%;height:auto}._purpur-promotion-card__image-wrapper--decorative_1kw9a_142 img,._purpur-promotion-card__image-wrapper--product_1kw9a_143 img{object-fit:cover}._purpur-promotion-card__image-wrapper--decorative_1kw9a_142{position:relative;width:100%;aspect-ratio:3/2}@container promotion-card (min-width: 600px){._purpur-promotion-card__image-wrapper--decorative_1kw9a_142{aspect-ratio:unset}._purpur-promotion-card__image-wrapper--decorative_1kw9a_142 img{height:100%}}._purpur-promotion-card__image-wrapper--product_1kw9a_143{display:flex;justify-content:center;align-items:center;padding:var(--purpur-spacing-400)}._purpur-promotion-card_1kw9a_1 [class*=_purpur-cta-link_]:not([class*=_purpur-cta-link__icon]),._purpur-promotion-card_1kw9a_1 [class*=_purpur-button_]:not([class*=_purpur-button__spinner]){box-sizing:border-box;width:100%}@container promotion-card (min-width: 600px){._purpur-promotion-card_1kw9a_1 [class*=_purpur-cta-link_]:not([class*=_purpur-cta-link__icon]),._purpur-promotion-card_1kw9a_1 [class*=_purpur-button_]:not([class*=_purpur-button__spinner]){width:auto}}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@purpurds/promotion-card",
|
|
3
|
-
"version": "8.
|
|
3
|
+
"version": "8.6.0",
|
|
4
4
|
"license": "AGPL-3.0-only",
|
|
5
5
|
"main": "./dist/promotion-card.cjs.js",
|
|
6
6
|
"types": "./dist/promotion-card.d.ts",
|
|
@@ -17,15 +17,15 @@
|
|
|
17
17
|
"source": "src/promotion-card.tsx",
|
|
18
18
|
"dependencies": {
|
|
19
19
|
"classnames": "~2.5.0",
|
|
20
|
-
"@purpurds/
|
|
21
|
-
"@purpurds/
|
|
22
|
-
"@purpurds/
|
|
23
|
-
"@purpurds/common-types": "8.
|
|
24
|
-
"@purpurds/cta-link": "8.
|
|
25
|
-
"@purpurds/
|
|
26
|
-
"@purpurds/
|
|
27
|
-
"@purpurds/paragraph": "8.
|
|
28
|
-
"@purpurds/tokens": "8.
|
|
20
|
+
"@purpurds/button": "8.6.0",
|
|
21
|
+
"@purpurds/badge": "8.6.0",
|
|
22
|
+
"@purpurds/card": "8.6.0",
|
|
23
|
+
"@purpurds/common-types": "8.6.0",
|
|
24
|
+
"@purpurds/cta-link": "8.6.0",
|
|
25
|
+
"@purpurds/icon": "8.6.0",
|
|
26
|
+
"@purpurds/heading": "8.6.0",
|
|
27
|
+
"@purpurds/paragraph": "8.6.0",
|
|
28
|
+
"@purpurds/tokens": "8.6.0"
|
|
29
29
|
},
|
|
30
30
|
"devDependencies": {
|
|
31
31
|
"@storybook/react-vite": "^9.0.18",
|
|
@@ -46,9 +46,9 @@
|
|
|
46
46
|
"vite": "^6.2.1",
|
|
47
47
|
"vitest": "^3.1.2",
|
|
48
48
|
"@purpurds/component-rig": "1.0.0",
|
|
49
|
-
"@purpurds/
|
|
50
|
-
"@purpurds/
|
|
51
|
-
"@purpurds/theme": "8.
|
|
49
|
+
"@purpurds/text-spacing": "8.6.0",
|
|
50
|
+
"@purpurds/grid": "8.6.0",
|
|
51
|
+
"@purpurds/theme": "8.6.0"
|
|
52
52
|
},
|
|
53
53
|
"peerDependencies": {
|
|
54
54
|
"@types/react": "^18 || ^19",
|
|
@@ -54,9 +54,14 @@
|
|
|
54
54
|
|
|
55
55
|
&__actions {
|
|
56
56
|
display: flex;
|
|
57
|
+
flex-direction: column;
|
|
57
58
|
flex-wrap: wrap;
|
|
58
59
|
gap: var(--purpur-spacing-200);
|
|
59
60
|
padding-top: var(--purpur-spacing-400);
|
|
61
|
+
|
|
62
|
+
@container promotion-card (min-width: #{$purpur-breakpoint-md}) {
|
|
63
|
+
flex-direction: row;
|
|
64
|
+
}
|
|
60
65
|
}
|
|
61
66
|
|
|
62
67
|
&__content {
|
|
@@ -192,6 +197,7 @@
|
|
|
192
197
|
|
|
193
198
|
[class*="_purpur-cta-link_"]:not([class*="_purpur-cta-link__icon"]),
|
|
194
199
|
[class*="_purpur-button_"]:not([class*="_purpur-button__spinner"]) {
|
|
200
|
+
box-sizing: border-box;
|
|
195
201
|
width: 100%;
|
|
196
202
|
|
|
197
203
|
@container promotion-card (min-width: #{$purpur-breakpoint-md}) {
|
package/src/promotion-card.tsx
CHANGED
|
@@ -39,6 +39,9 @@ const colors: StyleRecord = {
|
|
|
39
39
|
quaternary: "var(--purpur-color-text-tone-on-tone-tertiary)",
|
|
40
40
|
} as const;
|
|
41
41
|
|
|
42
|
+
export type PromotionCardDecorativeImage = { decorativeImage?: ReactNode };
|
|
43
|
+
export type PromotionCardProductImage = { productImage?: ReactNode };
|
|
44
|
+
|
|
42
45
|
export type PromotionCardProps = Omit<BaseProps, "children"> & {
|
|
43
46
|
variant?: PromotionCardVariant;
|
|
44
47
|
title: string;
|
|
@@ -56,7 +59,7 @@ export type PromotionCardProps = Omit<BaseProps, "children"> & {
|
|
|
56
59
|
* @deprecated Gradient has been removed from both design and implementation. This prop will be removed in the next major release.
|
|
57
60
|
*/
|
|
58
61
|
hasGradient?: boolean;
|
|
59
|
-
} & (
|
|
62
|
+
} & (PromotionCardDecorativeImage | PromotionCardProductImage);
|
|
60
63
|
|
|
61
64
|
const cx = c.bind(styles);
|
|
62
65
|
const rootClassName = "purpur-promotion-card";
|