ecomlab-components-next 0.1.163 → 0.1.165

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.
@@ -0,0 +1,114 @@
1
+ "use strict";
2
+ 'use client';
3
+
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.OptionsExecutor = exports.ExecutorPlaceholder = void 0;
8
+ var _react = _interopRequireDefault(require("react"));
9
+ var _TooltipBlack = require("../TooltipBlack/TooltipBlack");
10
+ require("./OptionsExecutor.scss");
11
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
12
+ 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); }
13
+ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
14
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
15
+ function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
16
+ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
17
+ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
18
+ var ExecutorPlaceholder = exports.ExecutorPlaceholder = function ExecutorPlaceholder(_ref) {
19
+ var _name$split$map$reduc, _name$split$map$reduc2;
20
+ var _ref$name = _ref.name,
21
+ name = _ref$name === void 0 ? '' : _ref$name,
22
+ color = _ref.color,
23
+ email = _ref.email,
24
+ _ref$iconStyle = _ref.iconStyle,
25
+ iconStyle = _ref$iconStyle === void 0 ? {} : _ref$iconStyle,
26
+ _ref$hideTooltip = _ref.hideTooltip,
27
+ hideTooltip = _ref$hideTooltip === void 0 ? false : _ref$hideTooltip,
28
+ _ref$author = _ref.author,
29
+ author = _ref$author === void 0 ? false : _ref$author,
30
+ ind = _ref.ind,
31
+ _ref$bkg = _ref.bkg,
32
+ bkg = _ref$bkg === void 0 ? false : _ref$bkg,
33
+ isShowInfo = _ref.isShowInfo;
34
+ if (typeof name !== 'string') {
35
+ console.error("\u041D\u0435\u0432\u0435\u0440\u043D\u044B\u0439 \u0442\u0438\u043F \u043F\u0430\u0440\u0430\u043C\u0435\u0442\u0440\u0430 {name} \u0434\u043B\u044F \u043A\u043E\u043C\u043F\u043E\u043D\u0435\u043D\u0442\u0430 ExecutorPlaceholder\n Wrong type of {name} param in ExecutorPlaceholder component");
36
+ return /*#__PURE__*/_react["default"].createElement(_TooltipBlack.TooltipBlack, {
37
+ child: /*#__PURE__*/_react["default"].createElement("div", {
38
+ className: "executor-placeholder"
39
+ }, /*#__PURE__*/_react["default"].createElement("p", null, '-')),
40
+ text: 'Ошибка данных'
41
+ });
42
+ }
43
+ return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, isShowInfo ? /*#__PURE__*/_react["default"].createElement("div", {
44
+ className: "executor-placeholder__item"
45
+ }, /*#__PURE__*/_react["default"].createElement("div", {
46
+ style: _objectSpread({
47
+ backgroundColor: bkg ? bkg : color
48
+ }, iconStyle),
49
+ className: "executor-placeholder"
50
+ }, /*#__PURE__*/_react["default"].createElement("p", {
51
+ className: "executor-placeholder__text"
52
+ }, (name === null || name === void 0 ? void 0 : name.length) > 0 ? name === null || name === void 0 || (_name$split$map$reduc = name.split(' ').map(function (str) {
53
+ return str[0];
54
+ }).reduce(function (acc, current) {
55
+ return acc += current;
56
+ }, '')) === null || _name$split$map$reduc === void 0 ? void 0 : _name$split$map$reduc.toUpperCase() : '-')), /*#__PURE__*/_react["default"].createElement("div", {
57
+ className: "executor-placeholder__info"
58
+ }, /*#__PURE__*/_react["default"].createElement("p", {
59
+ className: "executor-placeholder__name"
60
+ }, name || '-'), email ? /*#__PURE__*/_react["default"].createElement("p", {
61
+ className: "executor-placeholder__email"
62
+ }, email || '-') : null)) : /*#__PURE__*/_react["default"].createElement(_TooltipBlack.TooltipBlack, {
63
+ hideTooltip: hideTooltip,
64
+ child: /*#__PURE__*/_react["default"].createElement("div", {
65
+ style: _objectSpread({
66
+ backgroundColor: bkg ? bkg : color
67
+ }, iconStyle),
68
+ className: "executor-placeholder"
69
+ }, /*#__PURE__*/_react["default"].createElement("p", {
70
+ className: "executor-placeholder__text"
71
+ }, (name === null || name === void 0 ? void 0 : name.length) > 0 ? name === null || name === void 0 || (_name$split$map$reduc2 = name.split(' ').map(function (str) {
72
+ return str[0];
73
+ }).reduce(function (acc, current) {
74
+ return acc += current;
75
+ }, '')) === null || _name$split$map$reduc2 === void 0 ? void 0 : _name$split$map$reduc2.toUpperCase() : '-')),
76
+ text: /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("p", null, name || '-'), email ? /*#__PURE__*/_react["default"].createElement("p", null, email || '-') : null)
77
+ }));
78
+ };
79
+ var OptionsExecutor = exports.OptionsExecutor = function OptionsExecutor(_ref2) {
80
+ var id = _ref2.id,
81
+ name = _ref2.name,
82
+ email = _ref2.email,
83
+ color = _ref2.color,
84
+ img = _ref2.img,
85
+ _onClick = _ref2.onClick;
86
+ return /*#__PURE__*/_react["default"].createElement("div", {
87
+ className: "options-executor",
88
+ onClick: function onClick() {
89
+ _onClick({
90
+ id: id,
91
+ name: name,
92
+ email: email,
93
+ img: img,
94
+ color: color
95
+ });
96
+ }
97
+ }, img ? /*#__PURE__*/_react["default"].createElement("img", {
98
+ src: img
99
+ }) : /*#__PURE__*/_react["default"].createElement(ExecutorPlaceholder, {
100
+ name: name,
101
+ email: email,
102
+ hideTooltip: true,
103
+ color: color
104
+ }), /*#__PURE__*/_react["default"].createElement("div", {
105
+ className: "text-box"
106
+ }, /*#__PURE__*/_react["default"].createElement("p", {
107
+ className: "text",
108
+ style: {
109
+ textAlign: 'left'
110
+ }
111
+ }, name), /*#__PURE__*/_react["default"].createElement("p", {
112
+ className: "text_grey"
113
+ }, email)));
114
+ };
@@ -0,0 +1,114 @@
1
+ .options-executor {
2
+ display: flex;
3
+ align-items: center;
4
+ width: auto;
5
+ gap: 16px;
6
+ padding: 4px 16px;
7
+
8
+
9
+ img {
10
+ width: 20px;
11
+ height: 20px;
12
+ }
13
+
14
+ .text-box {
15
+ display: flex;
16
+ flex-direction: column;
17
+
18
+ .text {
19
+ font-size: 11px;
20
+ overflow: hidden;
21
+ text-overflow: ellipsis;
22
+ white-space: nowrap;
23
+ max-width: 180px;
24
+ color: #636D65;
25
+ font-family: NunitoSans;
26
+ font-size: 13px;
27
+ font-style: normal;
28
+ font-weight: 400;
29
+ line-height: 16px;
30
+ }
31
+
32
+ .text_grey {
33
+ font-size: 10px;
34
+ color: grey;
35
+ overflow: hidden;
36
+ text-overflow: ellipsis;
37
+ white-space: nowrap;
38
+ max-width: 180px;
39
+ }
40
+ }
41
+
42
+ &:hover {
43
+ background-color: #E6F7FF;
44
+ transition: background-color 0.5s;
45
+ }
46
+ }
47
+
48
+ .executor-placeholder {
49
+ border-radius: 50%;
50
+ background-color: white;
51
+ color: #fff;
52
+ border: 1px solid #fff;
53
+ text-align: center;
54
+ font-family: NunitoSans;
55
+ font-size: 11px;
56
+ font-style: normal;
57
+ font-weight: 400;
58
+ line-height: 12px;
59
+ min-height: 32px;
60
+ width: 32px;
61
+ height: 32px;
62
+ min-width: 32px;
63
+ height: 100%;
64
+ display: flex;
65
+ align-items: center;
66
+ justify-content: center;
67
+ font-size: 13px;
68
+ userSelect: none;
69
+ cursor: pointer;
70
+
71
+ &__item {
72
+ display: flex;
73
+ align-items: center;
74
+ gap: 8px;
75
+ min-width: 220px;
76
+ max-width: 220px;
77
+ overflow: hidden;
78
+ }
79
+
80
+ &__name {
81
+ display: -webkit-box;
82
+ -webkit-line-clamp: 1; // количество строк
83
+ -webkit-box-orient: vertical;
84
+ word-break: break-word;
85
+ overflow: hidden;
86
+ hyphens: auto;
87
+ font-size: 13px;
88
+ font-style: normal;
89
+ font-weight: 600;
90
+ line-height: 18px
91
+ }
92
+
93
+ &__email {
94
+ display: -webkit-box;
95
+ -webkit-line-clamp: 1; // количество строк
96
+ -webkit-box-orient: vertical;
97
+ word-break: break-word;
98
+ overflow: hidden;
99
+ hyphens: auto;
100
+ color: #636D65;
101
+ font-size: 11px;
102
+ font-style: normal;
103
+ font-weight: 300;
104
+ line-height: 14px;
105
+ }
106
+
107
+ &__info {
108
+ display: flex;
109
+ flex-direction: column;
110
+ gap: 6px;
111
+ max-width: calc(220px - 48px - 8px);
112
+ overflow: hidden;
113
+ }
114
+ }
@@ -0,0 +1,154 @@
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 _OptionsExecutor = require("../OptionsExecutor/OptionsExecutor");
11
+ require("./SelectExecutor.scss");
12
+ 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); }
13
+ 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; }
14
+ function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
15
+ function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
16
+ function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
17
+ function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
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 SelectExecutor = function SelectExecutor(_ref) {
25
+ var _ref$hideTooltip = _ref.hideTooltip,
26
+ hideTooltip = _ref$hideTooltip === void 0 ? true : _ref$hideTooltip,
27
+ _ref$executors = _ref.executors,
28
+ executors = _ref$executors === void 0 ? [] : _ref$executors,
29
+ _ref$setExecutors = _ref.setExecutors,
30
+ setExecutors = _ref$setExecutors === void 0 ? false : _ref$setExecutors,
31
+ _ref$executorOptions = _ref.executorOptions,
32
+ executorOptions = _ref$executorOptions === void 0 ? [] : _ref$executorOptions,
33
+ _ref$multi = _ref.multi,
34
+ multi = _ref$multi === void 0 ? false : _ref$multi,
35
+ placeholder = _ref.placeholder,
36
+ title = _ref.title,
37
+ _ref$isShowInfo = _ref.isShowInfo,
38
+ isShowInfo = _ref$isShowInfo === void 0 ? false : _ref$isShowInfo,
39
+ _ref$hideExecutor = _ref.hideExecutor,
40
+ hideExecutor = _ref$hideExecutor === void 0 ? false : _ref$hideExecutor,
41
+ _ref$onDeleteExecutor = _ref.onDeleteExecutor,
42
+ onDeleteExecutor = _ref$onDeleteExecutor === void 0 ? function () {} : _ref$onDeleteExecutor,
43
+ _ref$onAddExecutor = _ref.onAddExecutor,
44
+ onAddExecutor = _ref$onAddExecutor === void 0 ? function () {} : _ref$onAddExecutor;
45
+ var _useState = (0, _react.useState)(false),
46
+ _useState2 = _slicedToArray(_useState, 2),
47
+ isDrop = _useState2[0],
48
+ setIsDrop = _useState2[1];
49
+ var _useState3 = (0, _react.useState)(''),
50
+ _useState4 = _slicedToArray(_useState3, 2),
51
+ executorSearchValue = _useState4[0],
52
+ setExecutorSearchValue = _useState4[1];
53
+
54
+ // Обработчик на клик вне элемента
55
+ (0, _react.useEffect)(function () {
56
+ var isDrop = function isDrop(e) {
57
+ var el = e.target;
58
+ if (!el.closest('.select_executor')) {
59
+ setIsDrop(false);
60
+ }
61
+ };
62
+ document.addEventListener('click', isDrop);
63
+ return function () {
64
+ document.addEventListener('click', isDrop);
65
+ };
66
+ }, []);
67
+ var executorList = function executorList() {
68
+ var _executorOptions$filt;
69
+ var executor_list = (_executorOptions$filt = executorOptions.filter(function (e) {
70
+ var nameLowerCased = e.name.toLowerCase();
71
+ return !(executors !== null && executors !== void 0 && executors.map(function (e) {
72
+ var _e$name;
73
+ return (_e$name = e.name) === null || _e$name === void 0 ? void 0 : _e$name.toLowerCase();
74
+ }).includes(nameLowerCased)) && (executorSearchValue ? nameLowerCased === null || nameLowerCased === void 0 ? void 0 : nameLowerCased.includes(executorSearchValue === null || executorSearchValue === void 0 ? void 0 : executorSearchValue.toLowerCase()) : true);
75
+ })) === null || _executorOptions$filt === void 0 ? void 0 : _executorOptions$filt.map(function (_ref2) {
76
+ var id = _ref2.id,
77
+ name = _ref2.name,
78
+ login = _ref2.login,
79
+ img = _ref2.img,
80
+ color = _ref2.color;
81
+ return /*#__PURE__*/_react["default"].createElement(_OptionsExecutor.OptionsExecutor, {
82
+ onClick: function onClick(e) {
83
+ setExecutors(function (prev) {
84
+ return [].concat(_toConsumableArray(prev), [e]);
85
+ });
86
+ onAddExecutor(id);
87
+ },
88
+ key: id,
89
+ id: id,
90
+ name: name,
91
+ email: login,
92
+ img: img,
93
+ color: color
94
+ });
95
+ });
96
+ return executor_list;
97
+ };
98
+ return /*#__PURE__*/_react["default"].createElement("div", {
99
+ className: "select_executor"
100
+ }, /*#__PURE__*/_react["default"].createElement("p", {
101
+ className: "select_executor__placeholder"
102
+ }, title ? title : 'Исполнитель', ":"), /*#__PURE__*/_react["default"].createElement("div", {
103
+ className: "select_executor__content"
104
+ }, (executors === null || executors === void 0 ? void 0 : executors.length) != 0 && !multi ? null : /*#__PURE__*/_react["default"].createElement("div", {
105
+ className: "select_executor__select_content"
106
+ }, /*#__PURE__*/_react["default"].createElement("input", {
107
+ className: "select_executor__input",
108
+ placeholder: placeholder ? placeholder : 'Назначить',
109
+ value: executorSearchValue,
110
+ onClick: function onClick(e) {
111
+ return setIsDrop(!isDrop);
112
+ },
113
+ onChange: function onChange(e) {
114
+ return setExecutorSearchValue(e.target.value);
115
+ }
116
+ }), isDrop ? /*#__PURE__*/_react["default"].createElement("div", {
117
+ className: "select_executor__drop_content"
118
+ }, executorList().length > 0 ? executorList() : /*#__PURE__*/_react["default"].createElement("p", {
119
+ className: "select_executor__no-data"
120
+ }, " \u041F\u043E \u0432\u0430\u0448\u0435\u043C\u0443 \u0437\u0430\u043F\u0440\u043E\u0441\u0443 \u043D\u0438\u0447\u0435\u0433\u043E \u043D\u0435 \u043D\u0430\u0439\u0434\u0435\u043D\u043E")) : null), !hideExecutor && /*#__PURE__*/_react["default"].createElement("div", {
121
+ className: "select_executor__group_executor",
122
+ style: {
123
+ gap: isShowInfo ? '20px' : ''
124
+ }
125
+ }, (executors === null || executors === void 0 ? void 0 : executors.length) < 0 && !multi ? null : executors === null || executors === void 0 ? void 0 : executors.map(function (_ref3) {
126
+ var name = _ref3.name,
127
+ login = _ref3.login,
128
+ color = _ref3.color,
129
+ email = _ref3.email,
130
+ id = _ref3.id;
131
+ return /*#__PURE__*/_react["default"].createElement("div", {
132
+ className: "select_executor__content_executor",
133
+ key: name + login
134
+ }, /*#__PURE__*/_react["default"].createElement(_OptionsExecutor.ExecutorPlaceholder, {
135
+ isShowInfo: isShowInfo,
136
+ hideTooltip: hideTooltip,
137
+ name: name,
138
+ email: email,
139
+ color: color
140
+ }), !multi && /*#__PURE__*/_react["default"].createElement("p", {
141
+ className: "select_executor__name"
142
+ }, name), /*#__PURE__*/_react["default"].createElement("button", {
143
+ className: "select_executor__btn_close",
144
+ onClick: function onClick() {
145
+ var executorFilter = executors === null || executors === void 0 ? void 0 : executors.filter(function (item) {
146
+ return !item.name.toLowerCase().includes(name.toLowerCase());
147
+ });
148
+ setExecutors(executorFilter);
149
+ onDeleteExecutor(id);
150
+ }
151
+ }));
152
+ }))));
153
+ };
154
+ var _default = exports["default"] = SelectExecutor;
@@ -0,0 +1,163 @@
1
+ .select_executor {
2
+ display: flex;
3
+ flex-direction: column;
4
+ align-items: flex-start;
5
+ gap: 4px;
6
+ justify-content: space-between;
7
+
8
+ .executor-placeholder {
9
+ width: 48px;
10
+ height: 48px;
11
+ min-width: 48px;
12
+ min-height: 48px;
13
+ }
14
+
15
+ &__group_executor {
16
+ display: flex;
17
+ flex-wrap: wrap;
18
+ }
19
+
20
+ &__placeholder {
21
+ color: #636D65;
22
+ text-align: right;
23
+ font-family: NunitoSans;
24
+ font-size: 13px;
25
+ font-style: normal;
26
+ font-weight: 400;
27
+ line-height: 16px;
28
+ }
29
+
30
+ &__btn_close {
31
+ width: 24px;
32
+ height: 24px;
33
+ position: absolute;
34
+ right: -10px;
35
+ top: calc(10% - 12px);
36
+ border-radius: 24px;
37
+ border: none;
38
+ cursor: pointer;
39
+ background-image: url('https://dl.ecomru.ru/svg-storage/close.svg');
40
+ background-color: #F5F5F5;
41
+ background-repeat: no-repeat;
42
+ background-size: 8px;
43
+ background-position: center;
44
+ opacity: 0;
45
+ visibility: hidden;
46
+ }
47
+
48
+ &__select_content {
49
+ display: flex;
50
+ position: relative;
51
+ width: 100%;
52
+ height: 48px;
53
+ }
54
+
55
+ &__input {
56
+ position: relative;
57
+ width: 100%;
58
+ height: 48px;
59
+ border-radius: 22px;
60
+ padding: 10px;
61
+ transition-duration: 1000ms;
62
+ cursor: pointer;
63
+ background-repeat: no-repeat;
64
+ font-size: 11px;
65
+ color: black;
66
+ //border: 1px solid #F0F0F0;
67
+ border: none;
68
+ overflow: hidden;
69
+ background-image: url('./img/executor_icon.svg');
70
+ background-color: white;
71
+ background-size: 48px;
72
+ background-position: 0% 50%;
73
+ padding-left: 56px;
74
+
75
+ &::placeholder {
76
+ color: #0009E8;
77
+ font-family: NunitoSans;
78
+ font-size: 13px;
79
+ font-style: normal;
80
+ font-weight: 400;
81
+ line-height: 16px;
82
+ }
83
+
84
+ &:focus {
85
+ outline: none;
86
+ }
87
+ }
88
+
89
+ &__drop_content {
90
+ position: absolute;
91
+ left: 0;
92
+ top: calc(100% + 4px);
93
+ display: flex;
94
+ width: 100%;
95
+ max-width: 300px;
96
+ flex-direction: column;
97
+ border-radius: 16px;
98
+ background-color: white;
99
+ position: absolute;
100
+ -webkit-box-shadow: 4px 4px 8px 0px rgba(0, 0, 0, 0.2);
101
+ -moz-box-shadow: 4px 4px 8px 0px rgba(0, 0, 0, 0.2);
102
+ box-shadow: 4px 4px 8px 0px rgba(0, 0, 0, 0.2);
103
+ right: -24px;
104
+ cursor: pointer;
105
+ transition: 1s;
106
+ visibility: hidden;
107
+ opacity: 0;
108
+ transition: all 1s;
109
+ overflow: hidden;
110
+ max-height: 350px;
111
+ overflow-y: auto;
112
+ overflow-x: hidden;
113
+ z-index: 1;
114
+ visibility: visible;
115
+ opacity: 1;
116
+ transition: all 1s;
117
+ }
118
+
119
+ &__no-data {
120
+ display: flex;
121
+ justify-content: center;
122
+ align-items: center;
123
+ padding: 8px 16px;
124
+ font-size: 11px;
125
+ }
126
+
127
+ &__name {
128
+ color: #0B110B;
129
+ font-family: NunitoSans;
130
+ font-size: 13px;
131
+ font-style: normal;
132
+ font-weight: 400;
133
+ line-height: 16px;
134
+ white-space: nowrap;
135
+ text-overflow: ellipsis;
136
+ overflow: hidden;
137
+ padding-right: 16px;
138
+ cursor: default
139
+ }
140
+
141
+ &__content {
142
+ display: flex;
143
+ flex-direction: column;
144
+ gap: 8px;
145
+ width: 100%;
146
+ }
147
+
148
+ &__content_executor {
149
+ position: relative;
150
+ display: flex;
151
+ align-items: center;
152
+ gap: 8px;
153
+
154
+ &:hover {
155
+ .select_executor__btn_close {
156
+ opacity: 1;
157
+ visibility: visible;
158
+ transition: 0.3s;
159
+ }
160
+ }
161
+ }
162
+
163
+ }
@@ -0,0 +1,115 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports["default"] = exports.SelectExecutorSingle = exports.SelectExecutorMultiShowInfo = exports.SelectExecutorMulti = void 0;
7
+ var _react = require("react");
8
+ var _SelectExecutor = _interopRequireDefault(require("./SelectExecutor"));
9
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
10
+ function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
11
+ 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."); }
12
+ 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; } }
13
+ 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; }
14
+ 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; } }
15
+ function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
16
+ var executors_list = [{
17
+ "id": 197,
18
+ "name": "Konstantin Nosov",
19
+ "color": "rgb(97, 72, 209)",
20
+ "login": "info@gtcom.io"
21
+ }, {
22
+ "id": 258,
23
+ "name": "Evgenii Shirokov",
24
+ "color": "rgb(122, 49, 98)",
25
+ "login": "e.shirokov@gtcom.io"
26
+ }, {
27
+ "id": 419,
28
+ "name": "e.anurova@gtcom.io",
29
+ "color": "rgb(239, 131, 229)",
30
+ "login": "e.anurova@gtcom.io"
31
+ }, {
32
+ "id": 438,
33
+ "name": "Елена",
34
+ "color": "rgb(224, 173, 46)",
35
+ "login": "e.naloeva@gtcom.io"
36
+ }, {
37
+ "id": 517,
38
+ "name": "Ravshan Sherzanov",
39
+ "color": "rgb(121, 243, 110)",
40
+ "login": "r.sherzanov@gtcom.io"
41
+ }, {
42
+ "id": 530,
43
+ "name": "i.matov@gtcom.io",
44
+ "color": "rgb(214, 90, 90)",
45
+ "login": "i.matov@gtcom.io"
46
+ }, {
47
+ "id": 540,
48
+ "name": "Александр",
49
+ "color": "rgb(97, 72, 209)",
50
+ "login": "a.morozov@gtcom.io"
51
+ }, {
52
+ "id": 546,
53
+ "name": "a.kuzmin@gtcom.io",
54
+ "color": "rgb(83, 86, 83)",
55
+ "login": "a.kuzmin@gtcom.io"
56
+ }, {
57
+ "id": 559,
58
+ "name": "Evgenii Ryabinin",
59
+ "color": "rgb(43, 105, 121)",
60
+ "login": "e.ryabinin@gtcom.io"
61
+ }, {
62
+ "id": 564,
63
+ "name": "Roman Safin",
64
+ "color": "rgb(48, 50, 177)",
65
+ "login": "r.safin@gtcom.io"
66
+ }];
67
+ var _default = exports["default"] = {
68
+ title: 'SelectExecutor',
69
+ component: _SelectExecutor["default"]
70
+ };
71
+ var SelectExecutorSingle = exports.SelectExecutorSingle = function SelectExecutorSingle() {
72
+ var _useState = (0, _react.useState)([]),
73
+ _useState2 = _slicedToArray(_useState, 2),
74
+ executors = _useState2[0],
75
+ _setExecutors = _useState2[1];
76
+ return /*#__PURE__*/React.createElement(_SelectExecutor["default"], {
77
+ hideTooltip: false,
78
+ executors: executors,
79
+ setExecutors: function setExecutors(e) {
80
+ return _setExecutors(e);
81
+ },
82
+ executorOptions: executors_list
83
+ });
84
+ };
85
+ var SelectExecutorMulti = exports.SelectExecutorMulti = function SelectExecutorMulti() {
86
+ var _useState3 = (0, _react.useState)([]),
87
+ _useState4 = _slicedToArray(_useState3, 2),
88
+ executors = _useState4[0],
89
+ _setExecutors2 = _useState4[1];
90
+ return /*#__PURE__*/React.createElement(_SelectExecutor["default"], {
91
+ hideTooltip: false,
92
+ executors: executors,
93
+ setExecutors: function setExecutors(e) {
94
+ return _setExecutors2(e);
95
+ },
96
+ executorOptions: executors_list,
97
+ multi: true
98
+ });
99
+ };
100
+ var SelectExecutorMultiShowInfo = exports.SelectExecutorMultiShowInfo = function SelectExecutorMultiShowInfo() {
101
+ var _useState5 = (0, _react.useState)([]),
102
+ _useState6 = _slicedToArray(_useState5, 2),
103
+ executors = _useState6[0],
104
+ _setExecutors3 = _useState6[1];
105
+ return /*#__PURE__*/React.createElement(_SelectExecutor["default"], {
106
+ isShowInfo: true,
107
+ hideTooltip: false,
108
+ executors: executors,
109
+ setExecutors: function setExecutors(e) {
110
+ return _setExecutors3(e);
111
+ },
112
+ executorOptions: executors_list,
113
+ multi: true
114
+ });
115
+ };
@@ -0,0 +1,12 @@
1
+ <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <g clip-path="url(#clip0_16493_42174)">
3
+ <circle cx="24" cy="24" r="23.5" fill="#EDEFED" stroke="white"/>
4
+ <path d="M28 18C28 20.2091 26.2091 22 24 22C21.7909 22 20 20.2091 20 18C20 15.7909 21.7909 14 24 14C26.2091 14 28 15.7909 28 18Z" fill="#94A3B8"/>
5
+ <path d="M16 23.5556C16 23.126 16.3482 22.7778 16.7778 22.7778H31.2222C31.6518 22.7778 32 23.126 32 23.5556V30.1111C32 32.6884 29.9107 34.7778 27.3333 34.7778H20.6667C18.0893 34.7778 16 32.6884 16 30.1111V23.5556Z" fill="#94A3B8"/>
6
+ </g>
7
+ <defs>
8
+ <clipPath id="clip0_16493_42174">
9
+ <rect width="48" height="48" fill="white"/>
10
+ </clipPath>
11
+ </defs>
12
+ </svg>
@@ -0,0 +1,36 @@
1
+ "use strict";
2
+ 'use client';
3
+
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.TooltipBlack = void 0;
8
+ var _react = _interopRequireDefault(require("react"));
9
+ require("./TooltipBlack.scss");
10
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
11
+ var TooltipBlack = exports.TooltipBlack = function TooltipBlack(_ref) {
12
+ var child = _ref.child,
13
+ text = _ref.text,
14
+ top = _ref.top,
15
+ left = _ref.left,
16
+ right = _ref.right,
17
+ position = _ref.position,
18
+ maxWidth = _ref.maxWidth,
19
+ _ref$hideTooltip = _ref.hideTooltip,
20
+ hideTooltip = _ref$hideTooltip === void 0 ? false : _ref$hideTooltip;
21
+ return /*#__PURE__*/_react["default"].createElement("div", {
22
+ className: "tooltip-container",
23
+ style: {
24
+ position: position === 'absolute' ? 'static' : 'relative'
25
+ }
26
+ }, child, !hideTooltip && /*#__PURE__*/_react["default"].createElement("div", {
27
+ className: "tooltip-black",
28
+ style: {
29
+ top: top ? top : '',
30
+ left: left ? left : '15px',
31
+ right: right ? right : '',
32
+ maxWidth: maxWidth ? maxWidth : '',
33
+ position: position ? position : ''
34
+ }
35
+ }, text));
36
+ };
@@ -0,0 +1,30 @@
1
+ .tooltip-container {
2
+ position: relative;
3
+
4
+ .tooltip-black {
5
+ opacity: 0;
6
+ visibility: hidden;
7
+ position: absolute;
8
+ width: max-content;
9
+ z-index: 11;
10
+ top: 36px;
11
+ padding: 6px;
12
+ border-radius: 2px;
13
+ background: #4A4A4A;
14
+ color: #fff;
15
+ font-family: Inter;
16
+ font-size: 11px;
17
+ font-style: normal;
18
+ font-weight: 500;
19
+ line-height: 16px;
20
+ max-width: 200px;
21
+ }
22
+
23
+ &:hover {
24
+ .tooltip-black {
25
+ opacity: 1;
26
+ visibility: visible;
27
+ transition: 0.5s;
28
+ }
29
+ }
30
+ }
package/dist/index.js CHANGED
@@ -147,6 +147,12 @@ Object.defineProperty(exports, "Questions", {
147
147
  return _Questions["default"];
148
148
  }
149
149
  });
150
+ Object.defineProperty(exports, "SelectExecutor", {
151
+ enumerable: true,
152
+ get: function get() {
153
+ return _SelectExecutor["default"];
154
+ }
155
+ });
150
156
  Object.defineProperty(exports, "ShortTileArticleBox", {
151
157
  enumerable: true,
152
158
  get: function get() {
@@ -177,6 +183,12 @@ Object.defineProperty(exports, "TariffPlan", {
177
183
  return _TariffPlan["default"];
178
184
  }
179
185
  });
186
+ Object.defineProperty(exports, "TextareaDynamicPlaceholder", {
187
+ enumerable: true,
188
+ get: function get() {
189
+ return _TextareaDynamicPlaceholder["default"];
190
+ }
191
+ });
180
192
  Object.defineProperty(exports, "VideoBlock", {
181
193
  enumerable: true,
182
194
  get: function get() {
@@ -212,5 +224,7 @@ var _ArticleViewV = _interopRequireDefault(require("./components/Article/Article
212
224
  var _ListOfContent = _interopRequireDefault(require("./components/Article/ListOfContent/ListOfContent"));
213
225
  var _ShortTileArticleBox = _interopRequireDefault(require("./components/ArticleElements/ShortTileArticleBox/ShortTileArticleBox"));
214
226
  var _LongTileArticleBox = _interopRequireDefault(require("./components/ArticleElements/LongTileArticleBox/LongTileArticleBox"));
227
+ var _SelectExecutor = _interopRequireDefault(require("./components/SelectExecutor/SelectExecutor"));
215
228
  var _DownSelector = _interopRequireDefault(require("./components/Inputs/DropDownSelector/DownSelector"));
229
+ var _TextareaDynamicPlaceholder = _interopRequireDefault(require("./components/Inputs/TextareaDynamicPlaceholder/TextareaDynamicPlaceholder"));
216
230
  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.163",
3
+ "version": "0.1.165",
4
4
  "description": "A set of common and reusable React components",
5
5
  "main": "dist/index.js",
6
6
  "files": [