ecomlab-components-next 0.1.190 → 0.1.192

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.
Files changed (8) hide show
  1. package/dist/components/Article/ListOfContentSidebar/ListOfContentSidebar.js +118 -0
  2. package/dist/components/Article/ListOfContentSidebar/ListOfContentSidebar.scss +117 -0
  3. package/dist/components/Article/ListOfContentSidebar/ListOfContentSidebar.stories.js +45 -0
  4. package/dist/components/Article/ListOfContentSidebar/img/drop.svg +5 -0
  5. package/dist/components/Article/ListOfContentSidebar/img/time_icon.svg +3 -0
  6. package/dist/components/Article/ListOfContentSidebar/img/view_icon.svg +3 -0
  7. package/dist/index.js +20 -0
  8. package/package.json +1 -1
package/dist/components/Article/ListOfContentSidebar/ListOfContentSidebar.js ADDED
@@ -0,0 +1,118 @@
1
+ "use strict";
2
+ 'use client';
3
+
4
+ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports["default"] = void 0;
9
+ var _react = _interopRequireWildcard(require("react"));
10
+ var _link = _interopRequireDefault(require("next/link"));
11
+ var _image = _interopRequireDefault(require("next/image"));
12
+ var _htmlReactParser = _interopRequireDefault(require("html-react-parser"));
13
+ require("./ListOfContentSidebar.scss");
14
+ var _drop = _interopRequireDefault(require("./img/drop.svg"));
15
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
16
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
17
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
18
+ function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
19
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
20
+ function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
21
+ function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
22
+ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
23
+ function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
24
+ var ListOfContentSidebar = function ListOfContentSidebar(_ref) {
25
+ var links = _ref.links;
26
+ var _useState = (0, _react.useState)(''),
27
+ _useState2 = _slicedToArray(_useState, 2),
28
+ activeSubTitle = _useState2[0],
29
+ setActiveSubTitle = _useState2[1];
30
+ var _useState3 = (0, _react.useState)(true),
31
+ _useState4 = _slicedToArray(_useState3, 2),
32
+ init = _useState4[0],
33
+ setInit = _useState4[1];
34
+ var handleScroll = function handleScroll() {
35
+ var sections = document.querySelectorAll('.subtitle-link');
36
+ sections.forEach(function (section) {
37
+ var rect = section.getBoundingClientRect();
38
+ if (rect.top < 150) {
39
+ setActiveSubTitle(section.id);
40
+ }
41
+ });
42
+ };
43
+ var handleHashChange = function handleHashChange() {
44
+ var hash = window.location.hash.replace('#', ''); // Получаем часть хеша после '#'
45
+ setActiveSubTitle(hash);
46
+
47
+ // Прокручиваем страницу к нужному элементу
48
+ var targetElement = document.getElementById(hash);
49
+ if (targetElement) {
50
+ targetElement.scrollIntoView({
51
+ behavior: 'smooth'
52
+ });
53
+ }
54
+ };
55
+ (0, _react.useEffect)(function () {
56
+ window.addEventListener('hashchange', handleHashChange);
57
+ handleHashChange();
58
+ setInit(false);
59
+ return function () {
60
+ window.removeEventListener('hashchange', handleHashChange);
61
+ };
62
+ }, []);
63
+ (0, _react.useEffect)(function () {
64
+ if (activeSubTitle && !init) {
65
+ var _window;
66
+ (_window = window) === null || _window === void 0 || _window.history.pushState(null, '', "#".concat(activeSubTitle));
67
+ }
68
+ }, [activeSubTitle]);
69
+ (0, _react.useEffect)(function () {
70
+ if (!init) {
71
+ window.addEventListener('scroll', handleScroll);
72
+ return function () {
73
+ window.removeEventListener('scroll', handleScroll);
74
+ };
75
+ }
76
+ }, [init]);
77
+ var linksList = links === null || links === void 0 ? void 0 : links.map(function (_ref2, index) {
78
+ var _inside$;
79
+ var linkText = _ref2.linkText,
80
+ path = _ref2.path,
81
+ inside = _ref2.inside;
82
+ var isOpen = inside.some(function (_ref3) {
83
+ var path = _ref3.path;
84
+ return path == activeSubTitle;
85
+ });
86
+ var first_link = inside.length > 0 ? (_inside$ = inside[0]) === null || _inside$ === void 0 ? void 0 : _inside$.path : '#';
87
+ return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_link["default"], {
88
+ key: index,
89
+ href: "#".concat(first_link),
90
+ className: "list-of-content-sidebar__link"
91
+ }, (0, _htmlReactParser["default"])(linkText), /*#__PURE__*/_react["default"].createElement(_image["default"], {
92
+ alt: "icon",
93
+ className: isOpen ? 'list-of-content-sidebar__drop-icon-active' : 'list-of-content-sidebar__drop-icon',
94
+ src: _drop["default"]
95
+ })), /*#__PURE__*/_react["default"].createElement("div", {
96
+ className: isOpen ? 'list-of-content-sidebar__drop-box_active' : 'list-of-content-sidebar__drop-box'
97
+ }, inside === null || inside === void 0 ? void 0 : inside.map(function (_ref4) {
98
+ var linkText = _ref4.linkText,
99
+ path = _ref4.path;
100
+ return /*#__PURE__*/_react["default"].createElement("a", {
101
+ key: index,
102
+ href: "#".concat(path),
103
+ className: "list-of-content-sidebar__link",
104
+ style: {
105
+ color: activeSubTitle == path ? '#00B45E' : ''
106
+ }
107
+ }, (0, _htmlReactParser["default"])(linkText));
108
+ })));
109
+ });
110
+ return /*#__PURE__*/_react["default"].createElement("section", {
111
+ className: "list-of-content-sidebar"
112
+ }, /*#__PURE__*/_react["default"].createElement("div", {
113
+ className: "list-of-content-sidebar__content"
114
+ }, /*#__PURE__*/_react["default"].createElement("div", {
115
+ className: "list-of-content-sidebar__links"
116
+ }, linksList)));
117
+ };
118
+ var _default = exports["default"] = ListOfContentSidebar;
package/dist/components/Article/ListOfContentSidebar/ListOfContentSidebar.scss ADDED
@@ -0,0 +1,117 @@
1
+ // @import url('../../../font.scss');
2
+
3
+ .list-of-content-sidebar {
4
+ top: 20px;
5
+ height: 100%;
6
+ display: flex;
7
+ flex-direction: column;
8
+ gap: 12px;
9
+ max-height: 80vh;
10
+ position: sticky;
11
+ top: 140px;
12
+
13
+ &__title {
14
+ color: #9F9F9F;
15
+ // font-family: "Golos Text";
16
+ font-size: 12px;
17
+ font-style: normal;
18
+ font-weight: 500;
19
+ line-height: 20px;
20
+ text-transform: uppercase;
21
+
22
+ a {
23
+ color: #00B45E;
24
+ text-decoration: underline;
25
+ }
26
+ }
27
+
28
+ &__seo-box {
29
+ display: flex;
30
+ flex-direction: column;
31
+ gap: .5em;
32
+ margin-bottom: 1em;
33
+ }
34
+
35
+ &__drop-box,
36
+ &__drop-box_active {
37
+ display: flex;
38
+ flex-direction: column;
39
+ border-radius: 8px;
40
+ max-height: 0px;
41
+ overflow: hidden;
42
+
43
+ &_active {
44
+ transition: max-height 1s;
45
+ max-height: 1000px;
46
+ }
47
+ }
48
+
49
+ &__drop-icon,
50
+ &__drop-icon_active {
51
+ transform: rotate(180deg);
52
+
53
+ &_active {
54
+ transform: none;
55
+ }
56
+ }
57
+
58
+ &__links {
59
+ display: flex;
60
+ flex-direction: column;
61
+ width: 100%;
62
+ }
63
+
64
+ &__content {
65
+ display: flex;
66
+ flex-direction: column;
67
+ width: 230px;
68
+ min-width: 230px;
69
+ background-color: inherit;
70
+ border-radius: 16px;
71
+ height: auto;
72
+ border-radius: 10px;
73
+ background: #FFF;
74
+ border: 1px solid #EDEFFB;
75
+ overflow: overlay;
76
+ }
77
+
78
+ &__link {
79
+ display: flex;
80
+ justify-content: space-between;
81
+ gap: 8px;
82
+ color: #5C5C5C;
83
+ // font-family: "Golos Text";
84
+ font-size: 12px;
85
+ font-style: normal;
86
+ font-weight: 400;
87
+ line-height: 18px;
88
+ padding: 10px 14px 10px 24px;
89
+ border-bottom: 1px solid #EDEFFB;
90
+
91
+ span {
92
+ color: inherit !important;
93
+ // font-family: "Golos Text" !important;
94
+ font-size: 12px !important;
95
+ font-style: normal !important;
96
+ font-weight: 400 !important;
97
+ line-height: 18px !important;
98
+ word-wrap: break-word !important;
99
+ }
100
+ }
101
+
102
+ .share-btn {
103
+ width: 100%;
104
+ max-width: 100%;
105
+ }
106
+
107
+ .share__drop-container {
108
+ width: 100%;
109
+ max-width: 100%;
110
+ }
111
+ }
112
+
113
+ @media (max-width: 1240px) {
114
+ .list-of-content {
115
+ display: none;
116
+ }
117
+ }
package/dist/components/Article/ListOfContentSidebar/ListOfContentSidebar.stories.js ADDED
@@ -0,0 +1,45 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports["default"] = exports.Default = void 0;
7
+ var _ListOfContentSidebar = _interopRequireDefault(require("./ListOfContentSidebar"));
8
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
9
+ var list_links = [{
10
+ linkText: 'Зачем использовать Dotask, когда всё есть в личном кабинете маркетплейса?',
11
+ inside: [{
12
+ linkText: 'Заголовок 1',
13
+ path: 'h1'
14
+ }, {
15
+ linkText: 'Заголовок 2',
16
+ path: 'h2'
17
+ }, {
18
+ linkText: 'Заголовок 3',
19
+ path: 'h3'
20
+ }]
21
+ }, {
22
+ linkText: 'Можно ли пользоваться сервисами по отдельности?',
23
+ inside: [{
24
+ linkText: 'Заголовок 4',
25
+ path: 'h4'
26
+ }, {
27
+ linkText: 'Заголовок 5',
28
+ path: 'h5'
29
+ }, {
30
+ linkText: 'Заголовок 6',
31
+ path: 'h6'
32
+ }]
33
+ }];
34
+ var _default = exports["default"] = {
35
+ title: 'ListOfContentSidebar',
36
+ component: _ListOfContentSidebar["default"],
37
+ parameters: {
38
+ layout: 'centered'
39
+ },
40
+ args: {
41
+ links: list_links,
42
+ lang: 'ru'
43
+ }
44
+ };
45
+ var Default = exports.Default = {};
package/dist/components/Article/ListOfContentSidebar/img/drop.svg ADDED
@@ -0,0 +1,5 @@
1
+ <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <g id="bx-chevron-down.svg">
3
+ <path id="Vector" d="M5.13802 9.80469L8.00002 6.94269L10.862 9.80469L11.8047 8.86202L8.00002 5.05735L4.19535 8.86202L5.13802 9.80469Z" fill="#333333"/>
4
+ </g>
5
+ </svg>
package/dist/components/Article/ListOfContentSidebar/img/time_icon.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M7 1.75C7 1.33579 7.33579 1 7.75 1H12.25C12.6642 1 13 1.33579 13 1.75C13 2.16421 12.6642 2.5 12.25 2.5H10.75V3.03469C14.8166 3.41279 18 6.83463 18 11C18 15.4183 14.4183 19 10 19C5.58172 19 2 15.4183 2 11C2 6.83463 5.1834 3.41279 9.25 3.03469V2.5H7.75C7.33579 2.5 7 2.16421 7 1.75ZM4.78033 2.21967C5.07322 2.51256 5.07322 2.98744 4.78033 3.28033L2.28033 5.78033C1.98744 6.07323 1.51256 6.07323 1.21967 5.78033C0.926777 5.48744 0.926777 5.01257 1.21967 4.71967L3.71967 2.21967C4.01256 1.92678 4.48744 1.92678 4.78033 2.21967ZM15.2197 2.21967C15.5126 1.92678 15.9874 1.92678 16.2803 2.21967L18.7803 4.71967C19.0732 5.01257 19.0732 5.48744 18.7803 5.78033C18.4874 6.07323 18.0126 6.07323 17.7197 5.78033L15.2197 3.28033C14.9268 2.98744 14.9268 2.51256 15.2197 2.21967ZM10 4.5C6.41015 4.5 3.5 7.41015 3.5 11C3.5 14.5899 6.41015 17.5 10 17.5C13.5899 17.5 16.5 14.5899 16.5 11C16.5 7.41015 13.5899 4.5 10 4.5ZM9.75 6C10.1642 6 10.5 6.33579 10.5 6.75V10.5H12.25C12.6642 10.5 13 10.8358 13 11.25C13 11.6642 12.6642 12 12.25 12H9.75C9.33578 12 9 11.6642 9 11.25V6.75C9 6.33579 9.33578 6 9.75 6Z" fill="black"/>
3
+ </svg>
package/dist/components/Article/ListOfContentSidebar/img/view_icon.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M5.61359 6.42412C4.30606 7.52165 3.27624 8.83007 2.69645 9.64489C2.60201 9.77761 2.55769 9.84094 2.528 9.89127C2.50946 9.92271 2.50594 9.93377 2.50399 9.94131C2.50399 9.94131 2.50305 9.94681 2.50227 9.954C2.50094 9.96632 2.5 9.98222 2.5 10C2.5 10.0178 2.50094 10.0337 2.50227 10.046C2.50305 10.0532 2.50399 10.0587 2.50399 10.0587C2.50594 10.0662 2.50946 10.0773 2.528 10.1087C2.55769 10.1591 2.60201 10.2224 2.69645 10.3551C3.27624 11.1699 4.30606 12.4784 5.61359 13.5759C6.93271 14.6831 8.44391 15.5 10 15.5C11.5561 15.5 13.0673 14.6831 14.3864 13.5759C15.6939 12.4784 16.7238 11.1699 17.3036 10.3551C17.398 10.2224 17.4423 10.1591 17.472 10.1087C17.4905 10.0773 17.4941 10.0662 17.496 10.0587C17.496 10.0587 17.497 10.0532 17.4977 10.046C17.4991 10.0337 17.5 10.0178 17.5 10C17.5 9.98222 17.4991 9.96632 17.4977 9.954C17.497 9.94682 17.496 9.94131 17.496 9.94131C17.4941 9.93377 17.4905 9.92272 17.472 9.89127C17.4423 9.84094 17.398 9.77761 17.3036 9.64489C16.7238 8.83007 15.6939 7.52165 14.3864 6.42412C13.0673 5.31686 11.5561 4.5 10 4.5C8.44391 4.5 6.93271 5.31686 5.61359 6.42412ZM4.64921 5.27522C6.08184 4.07268 7.92989 3 10 3C12.0701 3 13.9182 4.07268 15.3508 5.27522C16.795 6.48747 17.9094 7.90908 18.5257 8.77524C18.5358 8.78946 18.5461 8.80377 18.5564 8.8182C18.7045 9.02535 18.8698 9.25645 18.9506 9.57492C19.0165 9.83465 19.0165 10.1653 18.9506 10.4251C18.8698 10.7436 18.7045 10.9747 18.5564 11.1818C18.5461 11.1962 18.5358 11.2105 18.5257 11.2248C17.9094 12.0909 16.795 13.5125 15.3508 14.7248C13.9182 15.9273 12.0701 17 10 17C7.92989 17 6.08184 15.9273 4.64921 14.7248C3.20501 13.5125 2.0906 12.0909 1.47428 11.2248C1.46416 11.2105 1.45393 11.1962 1.44361 11.1818C1.29548 10.9747 1.13023 10.7436 1.04943 10.4251C0.983524 10.1653 0.983524 9.83465 1.04943 9.57492C1.13023 9.25644 1.29548 9.02535 1.44361 8.81819C1.45393 8.80377 1.46416 8.78945 1.47428 8.77524C2.0906 7.90908 3.20501 6.48747 4.64921 5.27522ZM10 8.5C9.17157 8.5 8.5 9.17157 8.5 10C8.5 10.8284 9.17157 11.5 10 11.5C10.8284 11.5 11.5 10.8284 11.5 10C11.5 9.17157 10.8284 8.5 10 8.5ZM7 10C7 8.34315 8.34315 7 10 7C11.6569 7 13 8.34315 13 10C13 11.6569 11.6569 13 10 13C8.34315 13 7 11.6569 7 10Z" fill="black"/>
3
+ </svg>
package/dist/index.js CHANGED
@@ -123,6 +123,12 @@ Object.defineProperty(exports, "ListOfContent", {
123
123
  return _ListOfContent["default"];
124
124
  }
125
125
  });
126
+ Object.defineProperty(exports, "ListOfContentSidebar", {
127
+ enumerable: true,
128
+ get: function get() {
129
+ return _ListOfContentSidebar["default"];
130
+ }
131
+ });
126
132
  Object.defineProperty(exports, "LongTileArticleBox", {
127
133
  enumerable: true,
128
134
  get: function get() {
@@ -159,6 +165,12 @@ Object.defineProperty(exports, "NoArticles", {
159
165
  return _NoArticles["default"];
160
166
  }
161
167
  });
168
+ Object.defineProperty(exports, "PAGE_SIZES", {
169
+ enumerable: true,
170
+ get: function get() {
171
+ return _Paginator.PAGE_SIZES;
172
+ }
173
+ });
162
174
  Object.defineProperty(exports, "PagePreviews", {
163
175
  enumerable: true,
164
176
  get: function get() {
@@ -243,6 +255,12 @@ Object.defineProperty(exports, "ViewSwitch", {
243
255
  return _ViewSwitch["default"];
244
256
  }
245
257
  });
258
+ Object.defineProperty(exports, "usePagination", {
259
+ enumerable: true,
260
+ get: function get() {
261
+ return _Paginator.usePagination;
262
+ }
263
+ });
246
264
  var _Button = _interopRequireDefault(require("./components/Button"));
247
265
  var _ClientsAboutUs = _interopRequireDefault(require("./components/ConstructorComponents/ClientsAboutUs/ClientsAboutUs"));
248
266
  var _AdvantagesBlock = _interopRequireDefault(require("./components/ConstructorComponents/AdvantagesBlock/AdvantagesBlock"));
@@ -283,4 +301,6 @@ var _SliderRange = _interopRequireDefault(require("./components/SliderRange/Slid
283
301
  var _Checkbox = _interopRequireDefault(require("./components/Checkbox/Checkbox"));
284
302
  var _Breadcrumb = _interopRequireDefault(require("./components/Article/Breadcrumb/Breadcrumb"));
285
303
  var _Cookie = _interopRequireDefault(require("./components/Cookie/Cookie"));
304
+ var _Paginator = require("./components/Table/Paginator/Paginator");
305
+ var _ListOfContentSidebar = _interopRequireDefault(require("./components/Article/ListOfContentSidebar/ListOfContentSidebar"));
286
306
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ecomlab-components-next",
3
- "version": "0.1.190",
3
+ "version": "0.1.192",
4
4
  "description": "A set of common and reusable React components",
5
5
  "main": "dist/index.js",
6
6
  "files": [