Skip to content

Commit

Permalink
Merge pull request #61 from gravity-ui/yuberdysheva/extendend-feature…
Browse files Browse the repository at this point in the history
…s-fix

fix(ExtendedFeatures): add props
  • Loading branch information
Juli Ovechkina authored Nov 29, 2022
2 parents b52d707 + b98eccc commit 2640b74
Show file tree
Hide file tree
Showing 4 changed files with 67 additions and 72 deletions.
71 changes: 42 additions & 29 deletions src/blocks/ExtendedFeatures/ExtendedFeatures.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -33,38 +33,51 @@ export const ExtendedFeaturesBlock = ({
<BlockHeader title={title} description={description} className={b('header')} />
<div className={b('items')}>
<Row>
{items.map(({title: itemTitle, text, link, links, label, icon}) => {
const itemLinks = links || [];
{items.map(
({
title: itemTitle,
text,
link,
links,
label,
icon,
buttons,
additionalInfo,
}) => {
const itemLinks = links || [];

const iconThemed = icon && getThemedValue(icon, theme);
const iconData = iconThemed && getMediaImage(iconThemed);
const iconThemed = icon && getThemedValue(icon, theme);
const iconData = iconThemed && getMediaImage(iconThemed);

if (link) {
itemLinks.push(link);
}
if (link) {
itemLinks.push(link);
}

return (
<Col className={b('item')} key={text || itemTitle} sizes={colSizes}>
{iconData && <Image {...iconData} className={b('icon')} />}
<div className={b('container')}>
{itemTitle && (
<h5 className={b('item-title')}>
<HTML>{itemTitle}</HTML>
{label && (
<div className={b('item-label')}>{label}</div>
)}
</h5>
)}
<Content
text={text}
links={itemLinks}
size="s"
colSizes={{all: 12, md: 12}}
/>
</div>
</Col>
);
})}
return (
<Col className={b('item')} key={text || itemTitle} sizes={colSizes}>
{iconData && <Image {...iconData} className={b('icon')} />}
<div className={b('container')}>
{itemTitle && (
<h5 className={b('item-title')}>
<HTML>{itemTitle}</HTML>
{label && (
<div className={b('item-label')}>{label}</div>
)}
</h5>
)}
<Content
text={text}
links={itemLinks}
size="s"
colSizes={{all: 12, md: 12}}
buttons={buttons}
additionalInfo={additionalInfo}
/>
</div>
</Col>
);
},
)}
</Row>
</div>
</AnimateBlock>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ const extendedFeaturesItems = (items: ExtendedFeaturesItem[]) => {
return items.map((item) => ({
...item,
text: item.text && yfmTransform(item.text),
additionalInfo: item.additionalInfo && yfmTransform(item.additionalInfo),
}));
};

Expand Down
60 changes: 21 additions & 39 deletions src/blocks/ExtendedFeatures/__stories__/data.json
Original file line number Diff line number Diff line change
Expand Up @@ -14,14 +14,7 @@
"light": "https://storage.yandexcloud.net/cloud-www-assets/constructor/storybook/images/icon_1_light.svg",
"dark": "https://storage.yandexcloud.net/cloud-www-assets/constructor/storybook/images/icon_1_dark.svg"
},
"links": [
{
"text": "Go",
"url": "#",
"arrow": true,
"theme": "normal"
}
]
"additionalInfo": "Duis aute irure dolor in [reprehenderit](https://example.com) n voluptate velit esse cillum dolore eu fugiat nulla pariatur."
},
{
"title": "Sed do eiusmod tempor",
Expand All @@ -30,12 +23,16 @@
"light": "https://storage.yandexcloud.net/cloud-www-assets/constructor/storybook/images/icon_2_light.svg",
"dark": "https://storage.yandexcloud.net/cloud-www-assets/constructor/storybook/images/icon_2_dark.svg"
},
"links": [
"buttons": [
{
"text": "Go",
"url": "#",
"arrow": true,
"theme": "normal"
"text": "Button",
"theme": "action",
"url": "https://example.com"
},
{
"text": "Button",
"theme": "outlined",
"url": "https://example.com"
}
]
},
Expand Down Expand Up @@ -67,26 +64,13 @@
},
"items": [
{
"title": "Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua",
"title": "Sed do eiusmod tempor",
"text": "Ut enim ad minim veniam [quis nostrud](https://example.com) ullamco laboris nisi ut aliquip ex ea commodo consequat.",
"icon": {
"light": "https://storage.yandexcloud.net/cloud-www-assets/constructor/storybook/images/icon_1_light.svg",
"dark": "https://storage.yandexcloud.net/cloud-www-assets/constructor/storybook/images/icon_1_dark.svg"
},
"link": {
"text": "Go",
"url": "#",
"arrow": true,
"theme": "normal"
},
"links": [
{
"text": "Go",
"url": "#",
"arrow": true,
"theme": "normal"
}
],
"additionalInfo": "Duis aute irure dolor in [reprehenderit](https://example.com) n voluptate velit esse cillum dolore eu fugiat nulla pariatur.",
"label": "New"
},
{
Expand All @@ -96,18 +80,16 @@
"light": "https://storage.yandexcloud.net/cloud-www-assets/constructor/storybook/images/icon_2_light.svg",
"dark": "https://storage.yandexcloud.net/cloud-www-assets/constructor/storybook/images/icon_2_dark.svg"
},
"link": {
"text": "Go",
"url": "#",
"arrow": true,
"theme": "normal"
},
"links": [
"buttons": [
{
"text": "Go",
"url": "#",
"arrow": true,
"theme": "normal"
"text": "Button",
"theme": "action",
"url": "https://example.com"
},
{
"text": "Button",
"theme": "outlined",
"url": "https://example.com"
}
],
"label": "Preview"
Expand Down
7 changes: 3 additions & 4 deletions src/models/constructor-items/blocks.ts
Original file line number Diff line number Diff line change
Expand Up @@ -164,14 +164,13 @@ export interface SimpleBlockProps extends Animatable, Childable {
description: string;
}

export interface ExtendedFeaturesItem {
title?: string;
text?: string;
export interface ExtendedFeaturesItem
extends Omit<ContentBlockProps, 'theme' | 'centered' | 'colSizes' | 'size' | 'title'> {
title: string;
label?: string;
icon?: ThemedImage;
/** @deprecated **/
link?: LinkProps;
links?: LinkProps[];
}

export interface ExtendedFeaturesProps extends Animatable {
Expand Down

0 comments on commit 2640b74

Please sign in to comment.