@gravity-ui/blog-constructor 8.0.0-alpha.1 → 8.0.0-alpha.3
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/build/cjs/components/PostCard/PostCard.css +6 -5
- package/build/cjs/components/PostCard/PostCard.js +5 -2
- package/build/cjs/components/PostCard/PostCard.js.map +1 -1
- package/build/cjs/containers/BlogPostPage/BlogPostPage.css +4 -0
- package/build/esm/components/PostCard/PostCard.css +6 -5
- package/build/esm/components/PostCard/PostCard.js +6 -3
- package/build/esm/components/PostCard/PostCard.js.map +1 -1
- package/build/esm/containers/BlogPostPage/BlogPostPage.css +4 -0
- package/package.json +3 -3
- package/styles/styles.css +4 -0
- package/styles/yfm.css +4 -0
- package/styles/yfm.scss +6 -0
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
.bc-post-card__title_size_m, .bc-post-card__title_size_s {
|
|
1
|
+
.bc-post-card__title.bc-post-card__title_size_m, .bc-post-card__title.bc-post-card__title_size_s {
|
|
2
2
|
margin: 0;
|
|
3
3
|
}
|
|
4
4
|
|
|
@@ -27,27 +27,28 @@ unpredictable css rules order in build */
|
|
|
27
27
|
min-height: 480px;
|
|
28
28
|
}
|
|
29
29
|
}
|
|
30
|
-
.bc-post-card__title {
|
|
30
|
+
.bc-post-card__title.bc-post-card__title {
|
|
31
31
|
margin-bottom: 8px;
|
|
32
32
|
}
|
|
33
|
-
.bc-post-card__title_size_s {
|
|
33
|
+
.bc-post-card__title.bc-post-card__title_size_s {
|
|
34
34
|
font-size: var(--g-text-header-1-font-size);
|
|
35
35
|
line-height: var(--g-text-header-1-line-height);
|
|
36
36
|
color: var(--pc-text-header-color);
|
|
37
37
|
font-weight: var(--g-text-accent-font-weight);
|
|
38
38
|
}
|
|
39
|
-
.bc-post-card__title_size_m {
|
|
39
|
+
.bc-post-card__title.bc-post-card__title_size_m {
|
|
40
40
|
font-size: var(--g-text-display-2-font-size);
|
|
41
41
|
line-height: var(--g-text-display-2-line-height);
|
|
42
42
|
color: var(--pc-text-header-color);
|
|
43
43
|
font-weight: var(--g-text-accent-font-weight);
|
|
44
44
|
}
|
|
45
45
|
@media (max-width: 576px) {
|
|
46
|
-
.bc-post-card__title_size_m {
|
|
46
|
+
.bc-post-card__title.bc-post-card__title_size_m {
|
|
47
47
|
font-size: var(--g-text-display-1-font-size);
|
|
48
48
|
line-height: var(--g-text-display-1-line-height);
|
|
49
49
|
}
|
|
50
50
|
}
|
|
51
|
+
|
|
51
52
|
.bc-post-card__image-container {
|
|
52
53
|
height: 156px;
|
|
53
54
|
}
|
|
@@ -38,8 +38,11 @@ const PostCard = ({ post, fullWidth = false, size = common_1.PostCardSize.SMALL,
|
|
|
38
38
|
readingTime && readingTimeId,
|
|
39
39
|
],
|
|
40
40
|
});
|
|
41
|
-
return ((0, jsx_runtime_1.jsxs)(page_constructor_1.CardBase, { url: url, analyticsEvents: analyticsEvents, className: b('card', { fullWidth }), extraProps: ariaAttributes, children: [(0, jsx_runtime_1.jsx)(page_constructor_1.CardBase.Header, { image: image, className: b('header', { fullWidth }), children: (0, jsx_runtime_1.jsx)("div", { className: b('image-container'), "data-qa": "blog-suggest-header" }) }), (0, jsx_runtime_1.jsxs)(page_constructor_1.CardBase.Content, { children: [isTagVisible && ((0, jsx_runtime_1.jsx)("div", { id: tagId, className: b('tag', { size }), children: tags[0].name })), title &&
|
|
42
|
-
|
|
41
|
+
return ((0, jsx_runtime_1.jsxs)(page_constructor_1.CardBase, { url: url, analyticsEvents: analyticsEvents, className: b('card', { fullWidth }), extraProps: ariaAttributes, children: [(0, jsx_runtime_1.jsx)(page_constructor_1.CardBase.Header, { image: image, className: b('header', { fullWidth }), children: (0, jsx_runtime_1.jsx)("div", { className: b('image-container'), "data-qa": "blog-suggest-header" }) }), (0, jsx_runtime_1.jsxs)(page_constructor_1.CardBase.Content, { children: [isTagVisible && ((0, jsx_runtime_1.jsx)("div", { id: tagId, className: b('tag', { size }), children: tags[0].name })), title && ((0, jsx_runtime_1.jsx)(page_constructor_1.YFMWrapper, { className: b('title', { size }), tagName: titleHeadingLevel, content: title, contentClassName: b('title', { size }), modifiers: {
|
|
42
|
+
blog: true,
|
|
43
|
+
blogCard: true,
|
|
44
|
+
heading: true,
|
|
45
|
+
}, id: titleId })), description && ((0, jsx_runtime_1.jsx)(page_constructor_1.YFMWrapper, { className: b('description'), content: description, modifiers: {
|
|
43
46
|
blog: size === 'm',
|
|
44
47
|
blogCard: true,
|
|
45
48
|
}, id: descriptionId }))] }), (0, jsx_runtime_1.jsx)(page_constructor_1.CardBase.Footer, { children: (0, jsx_runtime_1.jsx)(SuggestPostInfo_1.SuggestPostInfo, { postId: blogPostId || id, date: date, readingTime: readingTime, hasUserLike: hasUserLike, likes: likesProps, size: size, qa: "blog-suggest-block", dateId: dateId, readingTimeId: readingTimeId }) })] }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PostCard.js","sourceRoot":"../../../../src","sources":["components/PostCard/PostCard.tsx"],"names":[],"mappings":";;;;;AAAA,qDAA+B;AAC/B,
|
|
1
|
+
{"version":3,"file":"PostCard.js","sourceRoot":"../../../../src","sources":["components/PostCard/PostCard.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport {AnalyticsEventsProp, CardBase, YFMWrapper} from '@gravity-ui/page-constructor';\nimport {useUniqId} from '@gravity-ui/uikit';\n\nimport {LikesContext} from '../../contexts/LikesContext';\nimport {PostCardSize, PostCardTitleHeadingLevel, PostData} from '../../models/common';\nimport {block} from '../../utils/cn';\nimport {SuggestPostInfo} from '../PostInfo/SuggestPostInfo';\nimport {useAriaAttributes} from '../../hooks/useAriaAttributes';\n\nimport './PostCard.scss';\n\ntype PostCardProps = {\n post: PostData;\n fullWidth?: boolean;\n showTag?: boolean;\n size?: PostCardSize;\n titleHeadingLevel?: PostCardTitleHeadingLevel;\n analyticsEvents?: AnalyticsEventsProp;\n};\n\nconst b = block('post-card');\n\nexport const PostCard = ({\n post,\n fullWidth = false,\n size = PostCardSize.SMALL,\n showTag = false,\n titleHeadingLevel = PostCardTitleHeadingLevel.H3,\n analyticsEvents,\n}: PostCardProps) => {\n const {\n title: postTitle,\n htmlTitle,\n textTitle,\n blogPostId,\n id,\n date,\n readingTime,\n hasUserLike,\n likes,\n image,\n description,\n tags,\n url,\n } = post;\n\n const title = postTitle || textTitle || htmlTitle;\n\n const {toggleLike, hasLikes} = React.useContext(LikesContext);\n\n const likesProps = React.useMemo(\n () =>\n hasLikes\n ? {\n hasUserLike,\n likesCount: likes,\n toggleLike,\n }\n : undefined,\n [hasUserLike, likes, toggleLike, hasLikes],\n );\n const titleId = useUniqId();\n const descriptionId = useUniqId();\n const dateId = useUniqId();\n const tagId = useUniqId();\n const readingTimeId = useUniqId();\n const isTagVisible = showTag && tags?.[0]?.name;\n const ariaAttributes = useAriaAttributes({\n labelIds: [isTagVisible && tagId, title && titleId],\n descriptionIds: [\n description && descriptionId,\n date && dateId,\n readingTime && readingTimeId,\n ],\n });\n\n return (\n <CardBase\n url={url}\n analyticsEvents={analyticsEvents}\n className={b('card', {fullWidth})}\n extraProps={ariaAttributes}\n >\n <CardBase.Header image={image} className={b('header', {fullWidth})}>\n <div className={b('image-container')} data-qa=\"blog-suggest-header\" />\n </CardBase.Header>\n <CardBase.Content>\n {isTagVisible && (\n <div id={tagId} className={b('tag', {size})}>\n {tags[0].name}\n </div>\n )}\n {title && (\n <YFMWrapper\n className={b('title', {size})}\n tagName={titleHeadingLevel}\n content={title}\n contentClassName={b('title', {size})}\n modifiers={{\n blog: true,\n blogCard: true,\n heading: true,\n }}\n id={titleId}\n />\n )}\n {description && (\n <YFMWrapper\n className={b('description')}\n content={description}\n modifiers={{\n blog: size === 'm',\n blogCard: true,\n }}\n id={descriptionId}\n />\n )}\n </CardBase.Content>\n <CardBase.Footer>\n <SuggestPostInfo\n postId={blogPostId || id}\n date={date}\n readingTime={readingTime}\n hasUserLike={hasUserLike}\n likes={likesProps}\n size={size}\n qa=\"blog-suggest-block\"\n dateId={dateId}\n readingTimeId={readingTimeId}\n />\n </CardBase.Footer>\n </CardBase>\n );\n};\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
.bc-post-card__title_size_m, .bc-post-card__title_size_s {
|
|
1
|
+
.bc-post-card__title.bc-post-card__title_size_m, .bc-post-card__title.bc-post-card__title_size_s {
|
|
2
2
|
margin: 0;
|
|
3
3
|
}
|
|
4
4
|
|
|
@@ -27,27 +27,28 @@ unpredictable css rules order in build */
|
|
|
27
27
|
min-height: 480px;
|
|
28
28
|
}
|
|
29
29
|
}
|
|
30
|
-
.bc-post-card__title {
|
|
30
|
+
.bc-post-card__title.bc-post-card__title {
|
|
31
31
|
margin-bottom: 8px;
|
|
32
32
|
}
|
|
33
|
-
.bc-post-card__title_size_s {
|
|
33
|
+
.bc-post-card__title.bc-post-card__title_size_s {
|
|
34
34
|
font-size: var(--g-text-header-1-font-size);
|
|
35
35
|
line-height: var(--g-text-header-1-line-height);
|
|
36
36
|
color: var(--pc-text-header-color);
|
|
37
37
|
font-weight: var(--g-text-accent-font-weight);
|
|
38
38
|
}
|
|
39
|
-
.bc-post-card__title_size_m {
|
|
39
|
+
.bc-post-card__title.bc-post-card__title_size_m {
|
|
40
40
|
font-size: var(--g-text-display-2-font-size);
|
|
41
41
|
line-height: var(--g-text-display-2-line-height);
|
|
42
42
|
color: var(--pc-text-header-color);
|
|
43
43
|
font-weight: var(--g-text-accent-font-weight);
|
|
44
44
|
}
|
|
45
45
|
@media (max-width: 576px) {
|
|
46
|
-
.bc-post-card__title_size_m {
|
|
46
|
+
.bc-post-card__title.bc-post-card__title_size_m {
|
|
47
47
|
font-size: var(--g-text-display-1-font-size);
|
|
48
48
|
line-height: var(--g-text-display-1-line-height);
|
|
49
49
|
}
|
|
50
50
|
}
|
|
51
|
+
|
|
51
52
|
.bc-post-card__image-container {
|
|
52
53
|
height: 156px;
|
|
53
54
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import * as React from 'react';
|
|
3
|
-
import { CardBase,
|
|
3
|
+
import { CardBase, YFMWrapper } from '@gravity-ui/page-constructor';
|
|
4
4
|
import { useUniqId } from '@gravity-ui/uikit';
|
|
5
5
|
import { LikesContext } from "../../contexts/LikesContext.js";
|
|
6
6
|
import { PostCardSize, PostCardTitleHeadingLevel } from "../../models/common.js";
|
|
@@ -35,8 +35,11 @@ export const PostCard = ({ post, fullWidth = false, size = PostCardSize.SMALL, s
|
|
|
35
35
|
readingTime && readingTimeId,
|
|
36
36
|
],
|
|
37
37
|
});
|
|
38
|
-
return (_jsxs(CardBase, { url: url, analyticsEvents: analyticsEvents, className: b('card', { fullWidth }), extraProps: ariaAttributes, children: [_jsx(CardBase.Header, { image: image, className: b('header', { fullWidth }), children: _jsx("div", { className: b('image-container'), "data-qa": "blog-suggest-header" }) }), _jsxs(CardBase.Content, { children: [isTagVisible && (_jsx("div", { id: tagId, className: b('tag', { size }), children: tags[0].name })), title &&
|
|
39
|
-
|
|
38
|
+
return (_jsxs(CardBase, { url: url, analyticsEvents: analyticsEvents, className: b('card', { fullWidth }), extraProps: ariaAttributes, children: [_jsx(CardBase.Header, { image: image, className: b('header', { fullWidth }), children: _jsx("div", { className: b('image-container'), "data-qa": "blog-suggest-header" }) }), _jsxs(CardBase.Content, { children: [isTagVisible && (_jsx("div", { id: tagId, className: b('tag', { size }), children: tags[0].name })), title && (_jsx(YFMWrapper, { className: b('title', { size }), tagName: titleHeadingLevel, content: title, contentClassName: b('title', { size }), modifiers: {
|
|
39
|
+
blog: true,
|
|
40
|
+
blogCard: true,
|
|
41
|
+
heading: true,
|
|
42
|
+
}, id: titleId })), description && (_jsx(YFMWrapper, { className: b('description'), content: description, modifiers: {
|
|
40
43
|
blog: size === 'm',
|
|
41
44
|
blogCard: true,
|
|
42
45
|
}, id: descriptionId }))] }), _jsx(CardBase.Footer, { children: _jsx(SuggestPostInfo, { postId: blogPostId || id, date: date, readingTime: readingTime, hasUserLike: hasUserLike, likes: likesProps, size: size, qa: "blog-suggest-block", dateId: dateId, readingTimeId: readingTimeId }) })] }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PostCard.js","sourceRoot":"../../../../src","sources":["components/PostCard/PostCard.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAsB,QAAQ,EAAE,
|
|
1
|
+
{"version":3,"file":"PostCard.js","sourceRoot":"../../../../src","sources":["components/PostCard/PostCard.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport {AnalyticsEventsProp, CardBase, YFMWrapper} from '@gravity-ui/page-constructor';\nimport {useUniqId} from '@gravity-ui/uikit';\n\nimport {LikesContext} from '../../contexts/LikesContext';\nimport {PostCardSize, PostCardTitleHeadingLevel, PostData} from '../../models/common';\nimport {block} from '../../utils/cn';\nimport {SuggestPostInfo} from '../PostInfo/SuggestPostInfo';\nimport {useAriaAttributes} from '../../hooks/useAriaAttributes';\n\nimport './PostCard.scss';\n\ntype PostCardProps = {\n post: PostData;\n fullWidth?: boolean;\n showTag?: boolean;\n size?: PostCardSize;\n titleHeadingLevel?: PostCardTitleHeadingLevel;\n analyticsEvents?: AnalyticsEventsProp;\n};\n\nconst b = block('post-card');\n\nexport const PostCard = ({\n post,\n fullWidth = false,\n size = PostCardSize.SMALL,\n showTag = false,\n titleHeadingLevel = PostCardTitleHeadingLevel.H3,\n analyticsEvents,\n}: PostCardProps) => {\n const {\n title: postTitle,\n htmlTitle,\n textTitle,\n blogPostId,\n id,\n date,\n readingTime,\n hasUserLike,\n likes,\n image,\n description,\n tags,\n url,\n } = post;\n\n const title = postTitle || textTitle || htmlTitle;\n\n const {toggleLike, hasLikes} = React.useContext(LikesContext);\n\n const likesProps = React.useMemo(\n () =>\n hasLikes\n ? {\n hasUserLike,\n likesCount: likes,\n toggleLike,\n }\n : undefined,\n [hasUserLike, likes, toggleLike, hasLikes],\n );\n const titleId = useUniqId();\n const descriptionId = useUniqId();\n const dateId = useUniqId();\n const tagId = useUniqId();\n const readingTimeId = useUniqId();\n const isTagVisible = showTag && tags?.[0]?.name;\n const ariaAttributes = useAriaAttributes({\n labelIds: [isTagVisible && tagId, title && titleId],\n descriptionIds: [\n description && descriptionId,\n date && dateId,\n readingTime && readingTimeId,\n ],\n });\n\n return (\n <CardBase\n url={url}\n analyticsEvents={analyticsEvents}\n className={b('card', {fullWidth})}\n extraProps={ariaAttributes}\n >\n <CardBase.Header image={image} className={b('header', {fullWidth})}>\n <div className={b('image-container')} data-qa=\"blog-suggest-header\" />\n </CardBase.Header>\n <CardBase.Content>\n {isTagVisible && (\n <div id={tagId} className={b('tag', {size})}>\n {tags[0].name}\n </div>\n )}\n {title && (\n <YFMWrapper\n className={b('title', {size})}\n tagName={titleHeadingLevel}\n content={title}\n contentClassName={b('title', {size})}\n modifiers={{\n blog: true,\n blogCard: true,\n heading: true,\n }}\n id={titleId}\n />\n )}\n {description && (\n <YFMWrapper\n className={b('description')}\n content={description}\n modifiers={{\n blog: size === 'm',\n blogCard: true,\n }}\n id={descriptionId}\n />\n )}\n </CardBase.Content>\n <CardBase.Footer>\n <SuggestPostInfo\n postId={blogPostId || id}\n date={date}\n readingTime={readingTime}\n hasUserLike={hasUserLike}\n likes={likesProps}\n size={size}\n qa=\"blog-suggest-block\"\n dateId={dateId}\n readingTimeId={readingTimeId}\n />\n </CardBase.Footer>\n </CardBase>\n );\n};\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@gravity-ui/blog-constructor",
|
|
3
|
-
"version": "8.0.0-alpha.
|
|
3
|
+
"version": "8.0.0-alpha.3",
|
|
4
4
|
"description": "Gravity UI Blog Constructor",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"type": "commonjs",
|
|
@@ -91,7 +91,7 @@
|
|
|
91
91
|
},
|
|
92
92
|
"peerDependencies": {
|
|
93
93
|
"@diplodoc/transform": "^4.10.7",
|
|
94
|
-
"@gravity-ui/page-constructor": "^7.0.0-alpha.
|
|
94
|
+
"@gravity-ui/page-constructor": "^7.0.0-alpha.4",
|
|
95
95
|
"@gravity-ui/uikit": "^7.1.1",
|
|
96
96
|
"react": "^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
|
|
97
97
|
},
|
|
@@ -102,7 +102,7 @@
|
|
|
102
102
|
"@commitlint/config-conventional": "^17.4.3",
|
|
103
103
|
"@diplodoc/transform": "^4.10.8",
|
|
104
104
|
"@gravity-ui/eslint-config": "^3.2.0",
|
|
105
|
-
"@gravity-ui/page-constructor": "^7.0.0-alpha.
|
|
105
|
+
"@gravity-ui/page-constructor": "^7.0.0-alpha.4",
|
|
106
106
|
"@gravity-ui/prettier-config": "^1.1.0",
|
|
107
107
|
"@gravity-ui/stylelint-config": "^4.0.1",
|
|
108
108
|
"@gravity-ui/tsconfig": "^1.0.0",
|
package/styles/styles.css
CHANGED
|
@@ -243,6 +243,10 @@ unpredictable css rules order in build */
|
|
|
243
243
|
color: var(--pc-text-header-color);
|
|
244
244
|
}
|
|
245
245
|
|
|
246
|
+
.yfm_heading.yfm_heading {
|
|
247
|
+
font-family: var(--g-text-body-font-family);
|
|
248
|
+
}
|
|
249
|
+
|
|
246
250
|
@font-face {
|
|
247
251
|
font-family: "YS Display";
|
|
248
252
|
src: url("https://yastatic.net/s3/home/fonts/ys/1/display-thin.woff2") format("woff2"), url("https://yastatic.net/s3/home/fonts/ys/1/display-thin.woff") format("woff");
|
package/styles/yfm.css
CHANGED