@doyourjob/gravity-ui-page-constructor 5.31.86 → 5.31.88
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/blocks/Header/Header.css +1 -0
- package/build/cjs/blocks/HighlightTable/HighlightTable.css +1 -0
- package/build/cjs/blocks/HighlightTable/HighlightTable.js +9 -1
- package/build/cjs/blocks/ReportsCards/ReportsCards.css +3 -0
- package/build/cjs/blocks/ReportsCards/ReportsCards.js +1 -1
- package/build/cjs/blocks/ReportsSections/ReportsSections.css +10 -0
- package/build/cjs/blocks/ReportsSections/ReportsSections.js +2 -1
- package/build/cjs/components/Filters/FilterSelect/FilterSelect.css +3 -0
- package/build/esm/blocks/Header/Header.css +1 -0
- package/build/esm/blocks/HighlightTable/HighlightTable.css +1 -0
- package/build/esm/blocks/HighlightTable/HighlightTable.js +9 -1
- package/build/esm/blocks/ReportsCards/ReportsCards.css +3 -0
- package/build/esm/blocks/ReportsCards/ReportsCards.js +1 -1
- package/build/esm/blocks/ReportsSections/ReportsSections.css +10 -0
- package/build/esm/blocks/ReportsSections/ReportsSections.js +3 -2
- package/build/esm/components/Filters/FilterSelect/FilterSelect.css +3 -0
- package/package.json +1 -1
- package/widget/index.js +1 -1
|
@@ -37,7 +37,7 @@ const HighlightTableBlock = ({ title, description, table, legend = [], contentSi
|
|
|
37
37
|
if (!tableContentElem || !blockElem)
|
|
38
38
|
return () => { };
|
|
39
39
|
const updateSizes = (0, debounce_1.default)(() => {
|
|
40
|
-
const width = Math.max(
|
|
40
|
+
const width = Math.max(648, blockElem.clientWidth - 24 - 2); // 24 - padding, 2 - border
|
|
41
41
|
tableContentElem.style.setProperty('--block-width', `${width}px`);
|
|
42
42
|
});
|
|
43
43
|
updateSizes();
|
|
@@ -53,6 +53,14 @@ const HighlightTableBlock = ({ title, description, table, legend = [], contentSi
|
|
|
53
53
|
if (!tableElem || !scrollBar || !scrollThumb)
|
|
54
54
|
return () => { };
|
|
55
55
|
const updateProgress = (0, debounce_1.default)(() => {
|
|
56
|
+
if (tableElem.clientWidth === tableElem.scrollWidth) {
|
|
57
|
+
if (scrollBar.style.getPropertyValue('display') !== 'none') {
|
|
58
|
+
scrollBar.style.setProperty('display', `none`);
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
else if (scrollBar.style.getPropertyValue('display') !== 'block') {
|
|
62
|
+
scrollBar.style.setProperty('display', `block`);
|
|
63
|
+
}
|
|
56
64
|
const scrollWidth = Math.round(scrollBar.clientWidth * (tableElem.clientWidth / tableElem.scrollWidth));
|
|
57
65
|
const scrollLeft = Math.round(scrollBar.clientWidth * (tableElem.scrollLeft / tableElem.scrollWidth));
|
|
58
66
|
scrollThumb.style.setProperty('transform', `translateX(${scrollLeft}px)`);
|
|
@@ -3,6 +3,9 @@ unpredictable css rules order in build */
|
|
|
3
3
|
.pc-reports-cards-block__title {
|
|
4
4
|
margin-bottom: 24px;
|
|
5
5
|
}
|
|
6
|
+
.pc-reports-cards-block__items {
|
|
7
|
+
row-gap: 16px;
|
|
8
|
+
}
|
|
6
9
|
.pc-reports-cards-block__postscript {
|
|
7
10
|
font-size: var(--g-text-body-1-font-size, var(--pc-text-body-1-font-size));
|
|
8
11
|
line-height: var(--g-text-body-1-line-height, var(--pc-text-body-1-line-height));
|
|
@@ -36,7 +36,7 @@ const ReportsCardsBlock = ({ title, typeKey, postscript, empty }) => {
|
|
|
36
36
|
return (react_1.default.createElement("div", { className: b() },
|
|
37
37
|
title && react_1.default.createElement(components_1.Title, { className: b('title'), title: titleProps, colSizes: titleColSizes }),
|
|
38
38
|
react_1.default.createElement(FilterSelects_1.default, { selects: selects, filters: localFilters, handleChange: handleChange }),
|
|
39
|
-
filteredItems.length ? (react_1.default.createElement(grid_1.Row,
|
|
39
|
+
filteredItems.length ? (react_1.default.createElement(grid_1.Row, { className: b('items') }, filteredItems.map((item, index) => (react_1.default.createElement(grid_1.Col, { key: index, sizes: cardsColSizes },
|
|
40
40
|
react_1.default.createElement(sub_blocks_1.AttachmentCard, Object.assign({}, item))))))) : (react_1.default.createElement(components_1.EmptyPlug, { empty: empty })),
|
|
41
41
|
postscript && (react_1.default.createElement(components_1.YFMWrapper, { className: b('postscript'), content: postscript, modifiers: { constructor: true, [`constructor-size-s`]: true } }))));
|
|
42
42
|
};
|
|
@@ -3,6 +3,16 @@ unpredictable css rules order in build */
|
|
|
3
3
|
.pc-reports-sections-block__title {
|
|
4
4
|
margin-bottom: 24px;
|
|
5
5
|
}
|
|
6
|
+
@media (min-width: 769px) {
|
|
7
|
+
.pc-reports-sections-block__wrap-sections.pc-AnimateBlock .pc-reports-sections-block__sections, .pc-AnimateBlock .pc-reports-sections-block__wrap-sections .pc-reports-sections-block__sections {
|
|
8
|
+
opacity: 0;
|
|
9
|
+
}
|
|
10
|
+
.pc-reports-sections-block__wrap-sections.pc-AnimateBlock.animate .pc-reports-sections-block__sections, .pc-AnimateBlock .pc-reports-sections-block__wrap-sections.animate .pc-reports-sections-block__sections {
|
|
11
|
+
opacity: 1;
|
|
12
|
+
transition: opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
|
13
|
+
transition-delay: 0s;
|
|
14
|
+
}
|
|
15
|
+
}
|
|
6
16
|
.pc-reports-sections-block__sections {
|
|
7
17
|
display: flex;
|
|
8
18
|
flex-direction: column;
|
|
@@ -30,7 +30,8 @@ const ReportsSectionsBlock = ({ title, typeKey, empty }) => {
|
|
|
30
30
|
return (react_1.default.createElement("div", { className: b() },
|
|
31
31
|
title && react_1.default.createElement(components_1.Title, { className: b('title'), title: titleProps, colSizes: titleColSizes }),
|
|
32
32
|
react_1.default.createElement(FilterSelects_1.default, { selects: selects, filters: localFilters, handleChange: handleChange }),
|
|
33
|
-
filteredItems.length ? (react_1.default.createElement(
|
|
33
|
+
filteredItems.length ? (react_1.default.createElement(components_1.AnimateBlock, { key: JSON.stringify(localFilters), className: b('wrap-sections'), animate: true },
|
|
34
|
+
react_1.default.createElement("div", { className: b('sections') }, filteredItems.map((item, index) => (react_1.default.createElement(Section_1.default, Object.assign({ key: index }, item))))))) : (react_1.default.createElement(components_1.EmptyPlug, { empty: empty, className: b('empty') }))));
|
|
34
35
|
};
|
|
35
36
|
exports.ReportsSectionsBlock = ReportsSectionsBlock;
|
|
36
37
|
exports.default = exports.ReportsSectionsBlock;
|
|
@@ -34,7 +34,7 @@ export const HighlightTableBlock = ({ title, description, table, legend = [], co
|
|
|
34
34
|
if (!tableContentElem || !blockElem)
|
|
35
35
|
return () => { };
|
|
36
36
|
const updateSizes = debounce(() => {
|
|
37
|
-
const width = Math.max(
|
|
37
|
+
const width = Math.max(648, blockElem.clientWidth - 24 - 2); // 24 - padding, 2 - border
|
|
38
38
|
tableContentElem.style.setProperty('--block-width', `${width}px`);
|
|
39
39
|
});
|
|
40
40
|
updateSizes();
|
|
@@ -50,6 +50,14 @@ export const HighlightTableBlock = ({ title, description, table, legend = [], co
|
|
|
50
50
|
if (!tableElem || !scrollBar || !scrollThumb)
|
|
51
51
|
return () => { };
|
|
52
52
|
const updateProgress = debounce(() => {
|
|
53
|
+
if (tableElem.clientWidth === tableElem.scrollWidth) {
|
|
54
|
+
if (scrollBar.style.getPropertyValue('display') !== 'none') {
|
|
55
|
+
scrollBar.style.setProperty('display', `none`);
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
else if (scrollBar.style.getPropertyValue('display') !== 'block') {
|
|
59
|
+
scrollBar.style.setProperty('display', `block`);
|
|
60
|
+
}
|
|
53
61
|
const scrollWidth = Math.round(scrollBar.clientWidth * (tableElem.clientWidth / tableElem.scrollWidth));
|
|
54
62
|
const scrollLeft = Math.round(scrollBar.clientWidth * (tableElem.scrollLeft / tableElem.scrollWidth));
|
|
55
63
|
scrollThumb.style.setProperty('transform', `translateX(${scrollLeft}px)`);
|
|
@@ -3,6 +3,9 @@ unpredictable css rules order in build */
|
|
|
3
3
|
.pc-reports-cards-block__title {
|
|
4
4
|
margin-bottom: 24px;
|
|
5
5
|
}
|
|
6
|
+
.pc-reports-cards-block__items {
|
|
7
|
+
row-gap: 16px;
|
|
8
|
+
}
|
|
6
9
|
.pc-reports-cards-block__postscript {
|
|
7
10
|
font-size: var(--g-text-body-1-font-size, var(--pc-text-body-1-font-size));
|
|
8
11
|
line-height: var(--g-text-body-1-line-height, var(--pc-text-body-1-line-height));
|
|
@@ -33,7 +33,7 @@ export const ReportsCardsBlock = ({ title, typeKey, postscript, empty }) => {
|
|
|
33
33
|
return (React.createElement("div", { className: b() },
|
|
34
34
|
title && React.createElement(Title, { className: b('title'), title: titleProps, colSizes: titleColSizes }),
|
|
35
35
|
React.createElement(FilterSelects, { selects: selects, filters: localFilters, handleChange: handleChange }),
|
|
36
|
-
filteredItems.length ? (React.createElement(Row,
|
|
36
|
+
filteredItems.length ? (React.createElement(Row, { className: b('items') }, filteredItems.map((item, index) => (React.createElement(Col, { key: index, sizes: cardsColSizes },
|
|
37
37
|
React.createElement(AttachmentCard, Object.assign({}, item))))))) : (React.createElement(EmptyPlug, { empty: empty })),
|
|
38
38
|
postscript && (React.createElement(YFMWrapper, { className: b('postscript'), content: postscript, modifiers: { constructor: true, [`constructor-size-s`]: true } }))));
|
|
39
39
|
};
|
|
@@ -3,6 +3,16 @@ unpredictable css rules order in build */
|
|
|
3
3
|
.pc-reports-sections-block__title {
|
|
4
4
|
margin-bottom: 24px;
|
|
5
5
|
}
|
|
6
|
+
@media (min-width: 769px) {
|
|
7
|
+
.pc-reports-sections-block__wrap-sections.pc-AnimateBlock .pc-reports-sections-block__sections, .pc-AnimateBlock .pc-reports-sections-block__wrap-sections .pc-reports-sections-block__sections {
|
|
8
|
+
opacity: 0;
|
|
9
|
+
}
|
|
10
|
+
.pc-reports-sections-block__wrap-sections.pc-AnimateBlock.animate .pc-reports-sections-block__sections, .pc-AnimateBlock .pc-reports-sections-block__wrap-sections.animate .pc-reports-sections-block__sections {
|
|
11
|
+
opacity: 1;
|
|
12
|
+
transition: opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
|
13
|
+
transition-delay: 0s;
|
|
14
|
+
}
|
|
15
|
+
}
|
|
6
16
|
.pc-reports-sections-block__sections {
|
|
7
17
|
display: flex;
|
|
8
18
|
flex-direction: column;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React, { useCallback, useContext, useMemo, useState } from 'react';
|
|
2
|
-
import { EmptyPlug, Title } from '../../components';
|
|
2
|
+
import { AnimateBlock, EmptyPlug, Title } from '../../components';
|
|
3
3
|
import FilterSelects from '../../components/Filters/FilterSelects/FilterSelects';
|
|
4
4
|
import { ReportsSectionsContext } from '../../context/reportsSectionsContext';
|
|
5
5
|
import { block } from '../../utils';
|
|
@@ -27,6 +27,7 @@ export const ReportsSectionsBlock = ({ title, typeKey, empty }) => {
|
|
|
27
27
|
return (React.createElement("div", { className: b() },
|
|
28
28
|
title && React.createElement(Title, { className: b('title'), title: titleProps, colSizes: titleColSizes }),
|
|
29
29
|
React.createElement(FilterSelects, { selects: selects, filters: localFilters, handleChange: handleChange }),
|
|
30
|
-
filteredItems.length ? (React.createElement(
|
|
30
|
+
filteredItems.length ? (React.createElement(AnimateBlock, { key: JSON.stringify(localFilters), className: b('wrap-sections'), animate: true },
|
|
31
|
+
React.createElement("div", { className: b('sections') }, filteredItems.map((item, index) => (React.createElement(Section, Object.assign({ key: index }, item))))))) : (React.createElement(EmptyPlug, { empty: empty, className: b('empty') }))));
|
|
31
32
|
};
|
|
32
33
|
export default ReportsSectionsBlock;
|