linear-react-components-ui 0.4.76-beta.28 → 0.4.76-beta.29
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/README.md +5 -7
- package/lib/assets/styles/effects.scss +0 -20
- package/lib/assets/styles/panel.scss +1 -4
- package/lib/assets/styles/select.scss +3 -3
- package/lib/assets/styles/table.scss +0 -13
- package/lib/assets/styles/tabs.scss +44 -49
- package/lib/assets/styles/treeview.scss +5 -0
- package/lib/dropdown/Popup.js +2 -3
- package/lib/form/form.spec.js +0 -8
- package/lib/form/index.js +21 -40
- package/lib/icons/helper.js +0 -4
- package/lib/inputs/base/InputTextBase.js +3 -23
- package/lib/inputs/mask/Phone.js +1 -10
- package/lib/inputs/mask/input_mask.spec.js +4 -21
- package/lib/inputs/select/Dropdown.js +59 -48
- package/lib/inputs/select/helper.js +2 -65
- package/lib/inputs/select/multiple/index.js +3 -6
- package/lib/inputs/select/simple/index.js +2 -5
- package/lib/internals/withTooltip.js +2 -2
- package/lib/skeleton/SkeletonContainer.js +1 -1
- package/lib/table/Body.js +7 -41
- package/lib/table/Header.js +1 -12
- package/lib/table/HeaderColumn.js +2 -4
- package/lib/table/Row.js +7 -14
- package/lib/table/RowColumn.js +3 -4
- package/lib/table/helpers.js +1 -11
- package/lib/table/index.js +8 -32
- package/lib/tabs/Menu.js +11 -1
- package/lib/tabs/index.js +1 -1
- package/lib/treeview/Node.js +7 -15
- package/lib/treeview/index.js +19 -33
- package/lib/treeview/treeview.spec.js +0 -9
- package/package.json +1 -1
- package/lib/assets/styles/uitour.scss +0 -112
- package/lib/inputs/date/helper.js +0 -16
- package/lib/uitour/helpers.js +0 -15
- package/lib/uitour/index.js +0 -271
- package/lib/uitour/uitour.spec.js +0 -176
package/lib/table/index.js
CHANGED
|
@@ -63,8 +63,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
63
63
|
|
|
64
64
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
65
65
|
|
|
66
|
-
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
67
|
-
|
|
68
66
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
69
67
|
|
|
70
68
|
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."); }
|
|
@@ -87,9 +85,8 @@ var getClass = function getClass(_ref) {
|
|
|
87
85
|
headerColored = _ref.headerColored,
|
|
88
86
|
condensed = _ref.condensed,
|
|
89
87
|
vertical = _ref.vertical,
|
|
90
|
-
bodyScrollable = _ref.bodyScrollable
|
|
91
|
-
|
|
92
|
-
return "table-component ".concat(customClass, " ").concat(striped && '-striped', " \n ").concat(bordered && '-bordered', " ").concat(hovered && '-hovered', " ").concat(headerColored && '-headercolor', "\n ").concat(condensed && '-condensed', "\n ").concat(vertical && '-vertical', "\n ").concat(skeletonize && !skeletonInRows ? '-skeletonized' : '', "\n ").concat(bodyScrollable ? '-scrollable' : '');
|
|
88
|
+
bodyScrollable = _ref.bodyScrollable;
|
|
89
|
+
return "table-component ".concat(customClass, " ").concat(striped && '-striped', " \n ").concat(bordered && '-bordered', " ").concat(hovered && '-hovered', " ").concat(headerColored && '-headercolor', "\n ").concat(condensed && '-condensed', "\n ").concat(vertical && '-vertical', "\n ").concat(skeletonize ? '-skeletonized' : '', "\n ").concat(bodyScrollable ? '-scrollable' : '');
|
|
93
90
|
};
|
|
94
91
|
|
|
95
92
|
var Table = function Table(props) {
|
|
@@ -98,8 +95,7 @@ var Table = function Table(props) {
|
|
|
98
95
|
bodyScrollable = props.bodyScrollable,
|
|
99
96
|
children = props.children,
|
|
100
97
|
vertical = props.vertical,
|
|
101
|
-
skeletonize = props.skeletonize
|
|
102
|
-
strict = props.strict;
|
|
98
|
+
skeletonize = props.skeletonize;
|
|
103
99
|
|
|
104
100
|
var _useState = (0, _react.useState)(props.selectedRowId),
|
|
105
101
|
_useState2 = _slicedToArray(_useState, 2),
|
|
@@ -116,11 +112,6 @@ var Table = function Table(props) {
|
|
|
116
112
|
columnsWidth = _useState6[0],
|
|
117
113
|
setColumnsWidth = _useState6[1];
|
|
118
114
|
|
|
119
|
-
var _useState7 = (0, _react.useState)(undefined),
|
|
120
|
-
_useState8 = _slicedToArray(_useState7, 2),
|
|
121
|
-
columnsCount = _useState8[0],
|
|
122
|
-
setColumnsCount = _useState8[1];
|
|
123
|
-
|
|
124
115
|
var bodyContainerRef = (0, _react.useRef)(undefined);
|
|
125
116
|
(0, _react.useEffect)(function () {
|
|
126
117
|
if (bodyScrollable && bodyContainerRef && bodyContainerRef.current) {
|
|
@@ -134,15 +125,13 @@ var Table = function Table(props) {
|
|
|
134
125
|
(0, _react.useEffect)(function () {
|
|
135
126
|
setSelectedRowId(props.selectedRowId);
|
|
136
127
|
}, [props.selectedRowId]);
|
|
137
|
-
|
|
138
|
-
var contextValues = _extends({}, props, {
|
|
128
|
+
var contextValues = {
|
|
139
129
|
bodyContainerRef: bodyContainerRef,
|
|
130
|
+
bodyScrollable: bodyScrollable,
|
|
140
131
|
bodyScrollWidth: bodyScrollWidth,
|
|
141
132
|
selectedRowId: selectedRowId,
|
|
142
133
|
vertical: vertical,
|
|
143
134
|
skeletonize: skeletonize,
|
|
144
|
-
strict: strict,
|
|
145
|
-
columnsCount: columnsCount,
|
|
146
135
|
handleSelectRow: function handleSelectRow(selectedId) {
|
|
147
136
|
setSelectedRowId(selectedId);
|
|
148
137
|
},
|
|
@@ -150,20 +139,13 @@ var Table = function Table(props) {
|
|
|
150
139
|
handleTableRowClick: onRowClick,
|
|
151
140
|
handlerSetColumnsWidth: function handlerSetColumnsWidth(widths) {
|
|
152
141
|
if (!_lodash["default"].isEmpty(widths) && _lodash["default"].isEmpty(columnsWidth)) setColumnsWidth(widths);
|
|
153
|
-
},
|
|
154
|
-
handlerSetColumnsCount: function handlerSetColumnsCount(count) {
|
|
155
|
-
return setColumnsCount(count);
|
|
156
142
|
}
|
|
157
|
-
}
|
|
158
|
-
|
|
143
|
+
};
|
|
159
144
|
return /*#__PURE__*/_react["default"].createElement(_helpers["default"].Provider, {
|
|
160
145
|
value: contextValues
|
|
161
146
|
}, bodyScrollable ? /*#__PURE__*/_react["default"].createElement("div", {
|
|
162
147
|
className: getClass(props)
|
|
163
148
|
}, children) : /*#__PURE__*/_react["default"].createElement("table", {
|
|
164
|
-
style: {
|
|
165
|
-
contain: strict ? 'strict' : 'size layout style'
|
|
166
|
-
},
|
|
167
149
|
className: getClass(props)
|
|
168
150
|
}, children));
|
|
169
151
|
};
|
|
@@ -181,10 +163,7 @@ Table.propTypes = {
|
|
|
181
163
|
vertical: _propTypes["default"].bool,
|
|
182
164
|
selectedRowId: _propTypes["default"].string,
|
|
183
165
|
bodyScrollable: _propTypes["default"].bool,
|
|
184
|
-
skeletonize: _propTypes["default"].bool
|
|
185
|
-
strict: _propTypes["default"].bool,
|
|
186
|
-
skeletonInRows: _propTypes["default"].number,
|
|
187
|
-
skeletonInHeader: _propTypes["default"].bool
|
|
166
|
+
skeletonize: _propTypes["default"].bool
|
|
188
167
|
};
|
|
189
168
|
Table.defaultProps = {
|
|
190
169
|
striped: false,
|
|
@@ -198,10 +177,7 @@ Table.defaultProps = {
|
|
|
198
177
|
vertical: false,
|
|
199
178
|
selectedRowId: null,
|
|
200
179
|
bodyScrollable: false,
|
|
201
|
-
skeletonize: false
|
|
202
|
-
strict: false,
|
|
203
|
-
skeletonInRows: undefined,
|
|
204
|
-
skeletonInHeader: true
|
|
180
|
+
skeletonize: false
|
|
205
181
|
};
|
|
206
182
|
var _default = Table;
|
|
207
183
|
exports["default"] = _default;
|
package/lib/tabs/Menu.js
CHANGED
|
@@ -20,12 +20,22 @@ var Menu = function Menu(props) {
|
|
|
20
20
|
customClassForToolBar = props.customClassForToolBar,
|
|
21
21
|
menuRef = props.menuRef,
|
|
22
22
|
toolBarRef = props.toolBarRef;
|
|
23
|
+
|
|
24
|
+
if (!toolbar) {
|
|
25
|
+
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
26
|
+
className: "menucontainer",
|
|
27
|
+
ref: function ref(r) {
|
|
28
|
+
menuRef(r);
|
|
29
|
+
}
|
|
30
|
+
}, /*#__PURE__*/_react["default"].createElement(_MenuItems["default"], props), /*#__PURE__*/_react["default"].createElement(_DropdownItems["default"], props));
|
|
31
|
+
}
|
|
32
|
+
|
|
23
33
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
24
34
|
className: "menucontainer",
|
|
25
35
|
ref: function ref(r) {
|
|
26
36
|
menuRef(r);
|
|
27
37
|
}
|
|
28
|
-
}, /*#__PURE__*/_react["default"].createElement(_MenuItems["default"], props), /*#__PURE__*/_react["default"].createElement(_DropdownItems["default"], props),
|
|
38
|
+
}, /*#__PURE__*/_react["default"].createElement(_MenuItems["default"], props), /*#__PURE__*/_react["default"].createElement(_DropdownItems["default"], props), /*#__PURE__*/_react["default"].cloneElement(toolbar, {
|
|
29
39
|
customClass: "menubar ".concat(customClassForToolBar),
|
|
30
40
|
innerRef: toolBarRef ? function (r) {
|
|
31
41
|
toolBarRef(r);
|
package/lib/tabs/index.js
CHANGED
|
@@ -254,7 +254,7 @@ var Tabs = function Tabs(props) {
|
|
|
254
254
|
return function () {
|
|
255
255
|
return window.removeEventListener('resize', onResize);
|
|
256
256
|
};
|
|
257
|
-
}, [_menuRef.current
|
|
257
|
+
}, [_menuRef.current]);
|
|
258
258
|
(0, _react.useEffect)(function () {
|
|
259
259
|
if (selectedTab) setSelectedTabId(selectedTab);
|
|
260
260
|
if (children) setPanels((0, _tabHelpers.buildPanels)(children));
|
package/lib/treeview/Node.js
CHANGED
|
@@ -135,8 +135,7 @@ var TreeNode = /*#__PURE__*/function (_Component) {
|
|
|
135
135
|
children = _this$props3.children,
|
|
136
136
|
isParent = _this$props3.isParent,
|
|
137
137
|
onNodeClick = _this$props3.onNodeClick,
|
|
138
|
-
nodeMenuButtonSize = _this$props3.nodeMenuButtonSize
|
|
139
|
-
selectedNodeId = _this$props3.selectedNodeId;
|
|
138
|
+
nodeMenuButtonSize = _this$props3.nodeMenuButtonSize;
|
|
140
139
|
var node = this.state.node;
|
|
141
140
|
var showNodeElements = this.state.showNodeElements;
|
|
142
141
|
return /*#__PURE__*/_react["default"].createElement(_constants.TreeviewContext.Consumer, null, function (_ref) {
|
|
@@ -158,10 +157,9 @@ var TreeNode = /*#__PURE__*/function (_Component) {
|
|
|
158
157
|
className: "treeviewitem"
|
|
159
158
|
}, _this2.getSpan(), /*#__PURE__*/_react["default"].createElement("div", {
|
|
160
159
|
className: "label",
|
|
161
|
-
style: {
|
|
162
|
-
textDecoration:
|
|
163
|
-
|
|
164
|
-
},
|
|
160
|
+
style: !onNodeClick ? {
|
|
161
|
+
textDecoration: 'none'
|
|
162
|
+
} : null,
|
|
165
163
|
ref: _this2.labelRef,
|
|
166
164
|
role: "button",
|
|
167
165
|
onKeyPress: null,
|
|
@@ -260,11 +258,7 @@ var _initialiseProps = function _initialiseProps() {
|
|
|
260
258
|
onKeyPress: null,
|
|
261
259
|
tabIndex: 0,
|
|
262
260
|
role: "button",
|
|
263
|
-
|
|
264
|
-
marginLeft: '-30px',
|
|
265
|
-
marginTop: '-5px'
|
|
266
|
-
} : null,
|
|
267
|
-
className: "opencloseicon",
|
|
261
|
+
className: isLoading ? 'isloading' : 'opencloseicon',
|
|
268
262
|
onClick: function onClick() {
|
|
269
263
|
return _this3.openCloseTree(node);
|
|
270
264
|
}
|
|
@@ -448,8 +442,7 @@ TreeNode.propTypes = {
|
|
|
448
442
|
handlerOnNodeOpen: _propTypes["default"].func,
|
|
449
443
|
nodeElementsValidations: _propTypes["default"].object,
|
|
450
444
|
startNodesOpened: _propTypes["default"].bool.isRequired,
|
|
451
|
-
idsInLoading: _propTypes["default"].arrayOf(_propTypes["default"].number)
|
|
452
|
-
selectedNodeId: _propTypes["default"].number
|
|
445
|
+
idsInLoading: _propTypes["default"].arrayOf(_propTypes["default"].number)
|
|
453
446
|
};
|
|
454
447
|
TreeNode.defaultProps = {
|
|
455
448
|
childrenIds: [],
|
|
@@ -463,8 +456,7 @@ TreeNode.defaultProps = {
|
|
|
463
456
|
onNodeClick: undefined,
|
|
464
457
|
handlerOnNodeOpen: undefined,
|
|
465
458
|
nodeElementsValidations: undefined,
|
|
466
|
-
idsInLoading: []
|
|
467
|
-
selectedNodeId: undefined
|
|
459
|
+
idsInLoading: []
|
|
468
460
|
};
|
|
469
461
|
TreeNode.contextType = _constants.TreeviewContext;
|
|
470
462
|
var _default = TreeNode;
|
package/lib/treeview/index.js
CHANGED
|
@@ -100,26 +100,20 @@ var TreeView = /*#__PURE__*/function (_Component) {
|
|
|
100
100
|
enumerable: true,
|
|
101
101
|
writable: true,
|
|
102
102
|
value: function value(selectedIds) {
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
var
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
newSelectedIds = [].concat(_toConsumableArray(newSelectedIds), _toConsumableArray(updatedIdsWithAncestryIds));
|
|
115
|
-
requiredIds = [].concat(_toConsumableArray(requiredIds), _toConsumableArray(requiredParentsIds));
|
|
116
|
-
});
|
|
103
|
+
var requiredIds = [];
|
|
104
|
+
var newSelectedIds = [];
|
|
105
|
+
selectedIds.forEach(function (id) {
|
|
106
|
+
var _this$checkAllAncestr = _this.checkAllAncestry(id, [], true, false),
|
|
107
|
+
requiredParentsIds = _this$checkAllAncestr.requiredParentsIds,
|
|
108
|
+
updatedIdsWithAncestryIds = _this$checkAllAncestr.updatedIdsWithAncestryIds;
|
|
109
|
+
|
|
110
|
+
newSelectedIds = [].concat(_toConsumableArray(newSelectedIds), _toConsumableArray(updatedIdsWithAncestryIds));
|
|
111
|
+
requiredIds = [].concat(_toConsumableArray(requiredIds), _toConsumableArray(requiredParentsIds));
|
|
112
|
+
});
|
|
117
113
|
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
selectedIdsUpdatedOnMount: selectedIdsUpdatedOnMount || true
|
|
122
|
-
});
|
|
114
|
+
_this.setState({
|
|
115
|
+
requiredParentsIds: _lodash["default"].uniq(requiredIds),
|
|
116
|
+
selectedIds: _lodash["default"].uniq(newSelectedIds)
|
|
123
117
|
});
|
|
124
118
|
}
|
|
125
119
|
});
|
|
@@ -470,8 +464,7 @@ var TreeView = /*#__PURE__*/function (_Component) {
|
|
|
470
464
|
nodeMenuButtonSize = _this$props3.nodeMenuButtonSize,
|
|
471
465
|
alwaysShowArrow = _this$props3.alwaysShowArrow,
|
|
472
466
|
startNodesOpened = _this$props3.startNodesOpened,
|
|
473
|
-
idsInLoading = _this$props3.idsInLoading
|
|
474
|
-
selectedNodeId = _this$props3.selectedNodeId;
|
|
467
|
+
idsInLoading = _this$props3.idsInLoading;
|
|
475
468
|
var childrenIds = [];
|
|
476
469
|
|
|
477
470
|
if (node.itens && node.itens.length > 0) {
|
|
@@ -500,7 +493,6 @@ var TreeView = /*#__PURE__*/function (_Component) {
|
|
|
500
493
|
nodeElementsValidations: nodeElementsValidations,
|
|
501
494
|
nodeMenuButtonSize: nodeMenuButtonSize,
|
|
502
495
|
onNodeClick: onNodeClick,
|
|
503
|
-
selectedNodeId: selectedNodeId,
|
|
504
496
|
handlerOnNodeOpen: _this.handleOnNodeOpen
|
|
505
497
|
}, childrenIds.length > 0 && node.itens.map(function (nodeitem) {
|
|
506
498
|
return _this.buildTree(nodeitem, node.id, ids);
|
|
@@ -514,8 +506,7 @@ var TreeView = /*#__PURE__*/function (_Component) {
|
|
|
514
506
|
selectedIds: _this.props.selectedIds,
|
|
515
507
|
isHandlingSelectedIds: false,
|
|
516
508
|
requiredParentsIds: [],
|
|
517
|
-
alreadyOpenedIds: []
|
|
518
|
-
selectedIdsUpdatedOnMount: false
|
|
509
|
+
alreadyOpenedIds: []
|
|
519
510
|
};
|
|
520
511
|
return _this;
|
|
521
512
|
}
|
|
@@ -530,15 +521,12 @@ var TreeView = /*#__PURE__*/function (_Component) {
|
|
|
530
521
|
value: function componentDidUpdate(prevProps, prevState) {
|
|
531
522
|
var _this$state3 = this.state,
|
|
532
523
|
selectedIds = _this$state3.selectedIds,
|
|
533
|
-
propSelectedIds = _this$state3.propSelectedIds
|
|
534
|
-
selectedIdsUpdatedOnMount = _this$state3.selectedIdsUpdatedOnMount;
|
|
524
|
+
propSelectedIds = _this$state3.propSelectedIds;
|
|
535
525
|
var allowCheckAllAncestry = this.props.allowCheckAllAncestry;
|
|
536
526
|
|
|
537
527
|
var isSameSelectedIds = _lodash["default"].isEqual(propSelectedIds.sort(), prevState.propSelectedIds.sort());
|
|
538
528
|
|
|
539
|
-
if (allowCheckAllAncestry &&
|
|
540
|
-
this.handleNewSelectedIds(selectedIds);
|
|
541
|
-
}
|
|
529
|
+
if (allowCheckAllAncestry && !isSameSelectedIds) this.handleNewSelectedIds(selectedIds);
|
|
542
530
|
}
|
|
543
531
|
}, {
|
|
544
532
|
key: "render",
|
|
@@ -611,8 +599,7 @@ TreeView.propTypes = {
|
|
|
611
599
|
onNodeOpen: _propTypes["default"].func,
|
|
612
600
|
nodeElementsValidations: _propTypes["default"].object,
|
|
613
601
|
enableDynamicData: _propTypes["default"].bool,
|
|
614
|
-
idsInLoading: _propTypes["default"].arrayOf(_propTypes["default"].number)
|
|
615
|
-
selectedNodeId: _propTypes["default"].number
|
|
602
|
+
idsInLoading: _propTypes["default"].arrayOf(_propTypes["default"].number)
|
|
616
603
|
};
|
|
617
604
|
TreeView.defaultProps = {
|
|
618
605
|
customClass: '',
|
|
@@ -635,8 +622,7 @@ TreeView.defaultProps = {
|
|
|
635
622
|
onNodeOpen: undefined,
|
|
636
623
|
nodeElementsValidations: undefined,
|
|
637
624
|
enableDynamicData: false,
|
|
638
|
-
idsInLoading: []
|
|
639
|
-
selectedNodeId: undefined
|
|
625
|
+
idsInLoading: []
|
|
640
626
|
};
|
|
641
627
|
var _default = TreeView;
|
|
642
628
|
exports["default"] = _default;
|
|
@@ -266,14 +266,5 @@ describe('Treeview', function () {
|
|
|
266
266
|
var li = container.querySelector('li').firstChild;
|
|
267
267
|
expect(li.firstChild).toHaveClass('spinnerloading');
|
|
268
268
|
});
|
|
269
|
-
it('should apply selectedNodeId', function () {
|
|
270
|
-
var _render14 = (0, _react.render)(treeviewRenderMock({
|
|
271
|
-
selectedNodeId: 1
|
|
272
|
-
})),
|
|
273
|
-
container = _render14.container;
|
|
274
|
-
|
|
275
|
-
var filhosLi = container.querySelector('li').children;
|
|
276
|
-
expect(filhosLi[1]).toHaveStyle('background-color: rgb(209, 209, 209)');
|
|
277
|
-
});
|
|
278
269
|
});
|
|
279
270
|
});
|
package/package.json
CHANGED
|
@@ -1,112 +0,0 @@
|
|
|
1
|
-
@import "commons.scss";
|
|
2
|
-
@import "colors.scss";
|
|
3
|
-
@import "effects.scss";
|
|
4
|
-
|
|
5
|
-
$step-arrow-size: 22px;
|
|
6
|
-
$step-arrow-shadow-size: 26px;
|
|
7
|
-
%step-arrow {
|
|
8
|
-
content: '';
|
|
9
|
-
position: absolute;
|
|
10
|
-
border-bottom: $step-arrow-size solid transparent;
|
|
11
|
-
border-right: $step-arrow-size solid #fff;
|
|
12
|
-
border-top: $step-arrow-size solid transparent;
|
|
13
|
-
}
|
|
14
|
-
%step-arrow-shadow {
|
|
15
|
-
content: '';
|
|
16
|
-
position: absolute;
|
|
17
|
-
border-bottom: $step-arrow-shadow-size solid transparent;
|
|
18
|
-
border-right: $step-arrow-shadow-size solid rgba(0, 0, 0, 0.6);
|
|
19
|
-
border-top: $step-arrow-shadow-size solid transparent;
|
|
20
|
-
}
|
|
21
|
-
.uitour-component {
|
|
22
|
-
position: absolute;
|
|
23
|
-
width: 100%;
|
|
24
|
-
height: 100vh;
|
|
25
|
-
left: 0;
|
|
26
|
-
top: 0;
|
|
27
|
-
z-index: 99999999999999999999;
|
|
28
|
-
> .step {
|
|
29
|
-
background-color: #fff;
|
|
30
|
-
position: relative;
|
|
31
|
-
max-width: 450px;
|
|
32
|
-
display: flex;
|
|
33
|
-
flex-direction: column;
|
|
34
|
-
border: 3px solid rgba(0, 0, 0, 0.6);
|
|
35
|
-
border-radius: 8px;
|
|
36
|
-
padding: 5px 0;
|
|
37
|
-
&.-left {
|
|
38
|
-
animation: slideRightToLeftWithFade 0.5s;
|
|
39
|
-
&:before {
|
|
40
|
-
@extend %step-arrow-shadow;
|
|
41
|
-
top: 6px;
|
|
42
|
-
left: -$step-arrow-shadow-size;
|
|
43
|
-
}
|
|
44
|
-
&:after {
|
|
45
|
-
@extend %step-arrow;
|
|
46
|
-
top: 10px;
|
|
47
|
-
left: -$step-arrow-size;
|
|
48
|
-
}
|
|
49
|
-
}
|
|
50
|
-
&.-right {
|
|
51
|
-
animation: slideLeftToRightWithFade 0.5s;
|
|
52
|
-
&:before {
|
|
53
|
-
@extend %step-arrow-shadow;
|
|
54
|
-
top: 6px;
|
|
55
|
-
right: -$step-arrow-shadow-size;
|
|
56
|
-
transform: rotate(180deg);
|
|
57
|
-
}
|
|
58
|
-
&:after {
|
|
59
|
-
@extend %step-arrow;
|
|
60
|
-
top: 10px;
|
|
61
|
-
right: -$step-arrow-size;
|
|
62
|
-
transform: rotate(180deg);
|
|
63
|
-
}
|
|
64
|
-
}
|
|
65
|
-
> .closebutton {
|
|
66
|
-
align-self: flex-end;
|
|
67
|
-
padding: 0 5px 5px;
|
|
68
|
-
line-height: 0;
|
|
69
|
-
}
|
|
70
|
-
> .content {
|
|
71
|
-
width: 100%;
|
|
72
|
-
padding: 0px 20px;
|
|
73
|
-
margin-bottom: 0;
|
|
74
|
-
display: flex;
|
|
75
|
-
> .number {
|
|
76
|
-
display: flex;
|
|
77
|
-
width: 40px;
|
|
78
|
-
height: 40px;
|
|
79
|
-
align-items: center;
|
|
80
|
-
justify-content: center;
|
|
81
|
-
border-radius: 50%;
|
|
82
|
-
background-color: $success-color;
|
|
83
|
-
color: #fff;
|
|
84
|
-
margin-right: 10px;
|
|
85
|
-
font-weight: bold;
|
|
86
|
-
font-size: 20px;
|
|
87
|
-
line-height: 0;
|
|
88
|
-
}
|
|
89
|
-
> .about {
|
|
90
|
-
flex: 1;
|
|
91
|
-
margin-bottom: 10px;
|
|
92
|
-
> h3 {
|
|
93
|
-
font-size: 16px;
|
|
94
|
-
font-weight: bold;
|
|
95
|
-
}
|
|
96
|
-
> .description {
|
|
97
|
-
font-size: 14px;
|
|
98
|
-
line-height: 18px;
|
|
99
|
-
strong {
|
|
100
|
-
font-weight: bold;
|
|
101
|
-
}
|
|
102
|
-
}
|
|
103
|
-
}
|
|
104
|
-
}
|
|
105
|
-
> .footer {
|
|
106
|
-
display: flex;
|
|
107
|
-
justify-content: flex-end;
|
|
108
|
-
gap: 10px;
|
|
109
|
-
padding: 5px 10px 10px;
|
|
110
|
-
}
|
|
111
|
-
}
|
|
112
|
-
}
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports["default"] = void 0;
|
|
7
|
-
|
|
8
|
-
var getCalendarDropdownStyle = function getCalendarDropdownStyle(_ref) {
|
|
9
|
-
var topPosition = _ref.topPosition,
|
|
10
|
-
leftPosition = _ref.leftPosition,
|
|
11
|
-
width = _ref.width;
|
|
12
|
-
return "top: ".concat(topPosition, "px;\n left: ").concat(leftPosition, "px;\n width:").concat(width, "px");
|
|
13
|
-
};
|
|
14
|
-
|
|
15
|
-
var _default = getCalendarDropdownStyle;
|
|
16
|
-
exports["default"] = _default;
|
package/lib/uitour/helpers.js
DELETED
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.STEP_POSITIONS = exports.ARROW_HEIGHT = exports.ARROW_WIDTH = void 0;
|
|
7
|
-
var ARROW_WIDTH = 26;
|
|
8
|
-
exports.ARROW_WIDTH = ARROW_WIDTH;
|
|
9
|
-
var ARROW_HEIGHT = 20;
|
|
10
|
-
exports.ARROW_HEIGHT = ARROW_HEIGHT;
|
|
11
|
-
var STEP_POSITIONS = {
|
|
12
|
-
right: 'right',
|
|
13
|
-
left: 'left'
|
|
14
|
-
};
|
|
15
|
-
exports.STEP_POSITIONS = STEP_POSITIONS;
|