@pedidopago/ui 1.7.23 → 1.7.25
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/dist/components/NewSelect/single/index.d.ts.map +1 -1
- package/dist/components/NewSelect/single/index.js +4 -4
- package/dist/components/Skeleton/styles.d.ts.map +1 -1
- package/dist/components/Skeleton/styles.js +3 -2
- package/dist/components/Table/components/MenuItem.d.ts.map +1 -1
- package/dist/components/Table/components/MenuItem.js +33 -16
- package/dist/components/Table/components/animations.d.ts +3 -0
- package/dist/components/Table/components/animations.d.ts.map +1 -0
- package/dist/components/Table/components/animations.js +24 -0
- package/dist/components/Table/index.d.ts +1 -1
- package/dist/components/Table/index.d.ts.map +1 -1
- package/dist/components/Table/index.js +13 -14
- package/dist/components/Table/styles.d.ts +0 -1
- package/dist/components/Table/styles.d.ts.map +1 -1
- package/dist/components/Table/styles.js +6 -11
- package/dist/components/Table/types.d.ts +2 -0
- package/dist/components/Table/types.d.ts.map +1 -1
- package/dist/utils/formatters/phone.d.ts +5 -5
- package/dist/utils/formatters/phone.d.ts.map +1 -1
- package/dist/utils/formatters/phone.js +20 -10
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/NewSelect/single/index.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/NewSelect/single/index.tsx"],"names":[],"mappings":";AAsBA,OAAO,EAAgB,uBAAuB,EAAE,MAAM,UAAU,CAAC;AAEjE,wBAAgB,eAAe,CAAC,CAAC,EAAE,EACjC,KAAU,EACV,WAAgB,EAChB,KAAK,EACL,UAAU,EACV,OAAO,EACP,QAAQ,EACR,KAAK,EACL,OAAO,EACP,MAAM,EACN,QAAQ,EACR,aAAa,EACb,GAAG,IAAI,EACR,EAAE,uBAAuB,CAAC,CAAC,CAAC,eAqI5B"}
|
|
@@ -8,12 +8,14 @@ var _react = require("react");
|
|
|
8
8
|
var _Flex = _interopRequireDefault(require("../../Flex"));
|
|
9
9
|
var _Icon = _interopRequireDefault(require("../../Icon"));
|
|
10
10
|
var _ReactPortal = require("../../ReactPortal");
|
|
11
|
+
var _SelectItem = require("../components/SelectItem");
|
|
11
12
|
var _useReposition = require("../../../shared/hooks/useReposition");
|
|
12
13
|
var _useOnClickOutside = require("../../../shared/hooks/useOnClickOutside");
|
|
13
14
|
var _styles = require("../components/OptionsSelect/styles");
|
|
14
15
|
var _styles2 = require("../styles");
|
|
15
16
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
16
17
|
var _excluded = ["label", "placeholder", "alert", "helperText", "variant", "children", "value", "onClose", "onOpen", "onChange", "renderOptions"];
|
|
18
|
+
/* eslint-disable no-console */
|
|
17
19
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
18
20
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
19
21
|
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."); }
|
|
@@ -156,10 +158,8 @@ function NewSingleSelect(_ref) {
|
|
|
156
158
|
top: positionsSelect.top
|
|
157
159
|
},
|
|
158
160
|
children: _react.Children.map(children, function (child) {
|
|
159
|
-
var
|
|
160
|
-
|
|
161
|
-
var isSelectItemElement = childTypeName === 'SelectItem';
|
|
162
|
-
if (! /*#__PURE__*/(0, _react.isValidElement)(child) || !isSelectItemElement) return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
161
|
+
var isSelectItemElement = child.type === _SelectItem.SelectItem;
|
|
162
|
+
if (! /*#__PURE__*/(0, _react.isValidElement)(child) || !isSelectItemElement) return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
|
|
163
163
|
children: child
|
|
164
164
|
});
|
|
165
165
|
var childElement = child;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Skeleton/styles.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AACzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Skeleton/styles.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AACzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAGlD,eAAO,MAAM,eAAe;;;+IA8F1B,CAAC"}
|
|
@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.SkeletonElement = void 0;
|
|
7
7
|
var _styled = _interopRequireDefault(require("@emotion/styled"));
|
|
8
8
|
var _react = require("@emotion/react");
|
|
9
|
+
var _customColorMode = require("../../utils/customColorMode");
|
|
9
10
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
|
|
10
11
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
12
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
@@ -16,10 +17,10 @@ var SkeletonElement = _styled.default.div(function (props) {
|
|
|
16
17
|
rectangle: '0'
|
|
17
18
|
};
|
|
18
19
|
var animationsCss = {
|
|
19
|
-
wave: (0, _react.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n overflow: hidden;\n transform-origin: 0px 55%;\n\n &::after {\n content: '';\n inset: 0px;\n position: absolute;\n animation: 1.6s linear 0.5s infinite normal none running move;\n transform: translateX(-100%);\n background: linear-gradient(\n 90deg,\n transparent,\n ", ",\n transparent\n );\n }\n\n @keyframes move {\n 0% {\n transform: translateX(-100%);\n }\n 40% {\n transform: translateX(100%);\n }\n 100% {\n transform: translateX(100%);\n }\n }\n "])), props.theme.colors.neutral.neutral1),
|
|
20
|
+
wave: (0, _react.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n overflow: hidden;\n transform-origin: 0px 55%;\n\n &::after {\n content: '';\n inset: 0px;\n position: absolute;\n animation: 1.6s linear 0.5s infinite normal none running move;\n transform: translateX(-100%);\n background: linear-gradient(\n 90deg,\n transparent,\n ", ",\n transparent\n );\n }\n\n @keyframes move {\n 0% {\n transform: translateX(-100%);\n }\n 40% {\n transform: translateX(100%);\n }\n 100% {\n transform: translateX(100%);\n }\n }\n "])), (0, _customColorMode.customColorMode)(props.theme.colors.neutral.neutral1, props.theme.colors.neutral.neutral2)),
|
|
20
21
|
pulse: (0, _react.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n animation: 1.6s linear 0.5s infinite normal none running pulse;\n\n @keyframes pulse {\n 0% {\n opacity: 1;\n }\n 50% {\n opacity: 0.4;\n }\n 100% {\n opacity: 1;\n }\n }\n "])))
|
|
21
22
|
};
|
|
22
|
-
var unloadedCss = (0, _react.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n display: block;\n position: relative;\n user-select: none;\n pointer-events: none;\n cursor: default;\n background: padding-box
|
|
23
|
+
var unloadedCss = (0, _react.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n display: block;\n position: relative;\n user-select: none;\n pointer-events: none;\n cursor: default;\n background: padding-box\n ", "70;\n border-radius: ", ";\n height: ", ";\n color: transparent;\n\n ", ";\n\n * {\n visibility: hidden;\n color: transparent;\n }\n "])), (0, _customColorMode.customColorMode)(props.theme.colors.neutral.neutral1, props.theme.colors.neutral.neutral2), borderRadiusByVariant[props.variant || 'text'], typeof props.height === 'number' ? props.height + 'px' : props.height || '', props.animation !== 'static' ? animationsCss[props.animation || 'wave'] : '');
|
|
23
24
|
var loadedCss = (0, _react.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n display: block;\n background: transparent;\n\n transition: all 300ms ease;\n "])));
|
|
24
25
|
return (0, _react.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n width: ", ";\n\n ", "\n "])), props.fullWidth ? '100%' : typeof props.width === 'number' ? props.width + 'px' : props.width || '', props.isLoaded ? loadedCss : unloadedCss);
|
|
25
26
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuItem.d.ts","sourceRoot":"","sources":["../../../../src/components/Table/components/MenuItem.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"MenuItem.d.ts","sourceRoot":"","sources":["../../../../src/components/Table/components/MenuItem.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAIrC,wBAAgB,QAAQ,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,cAAc,EAAE,GAAG,EAAE,KAAK,EAAE,EAAE,SAAS,eA+BhF"}
|
|
@@ -5,10 +5,18 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.MenuItem = MenuItem;
|
|
7
7
|
var _react = require("react");
|
|
8
|
+
var _framerMotion = require("framer-motion");
|
|
8
9
|
var _useKeyPress = require("../../../shared/hooks/useKeyPress");
|
|
9
10
|
var _useOnClickOutside = require("../../../shared/hooks/useOnClickOutside");
|
|
10
11
|
var _styles = require("../styles");
|
|
12
|
+
var _animations = require("./animations");
|
|
11
13
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
14
|
+
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
15
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
16
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
17
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
18
|
+
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
19
|
+
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
12
20
|
function MenuItem(_ref) {
|
|
13
21
|
var items = _ref.items,
|
|
14
22
|
isOpen = _ref.isOpen,
|
|
@@ -22,21 +30,30 @@ function MenuItem(_ref) {
|
|
|
22
30
|
(0, _useKeyPress.useKeyPress)('Escape', function () {
|
|
23
31
|
return onClickOutside && onClickOutside();
|
|
24
32
|
});
|
|
25
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
33
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_framerMotion.AnimatePresence, {
|
|
34
|
+
mode: "wait",
|
|
35
|
+
children: isOpen && /*#__PURE__*/(0, _react.createElement)(_framerMotion.motion.div, _objectSpread(_objectSpread({
|
|
36
|
+
style: {
|
|
37
|
+
position: 'absolute',
|
|
38
|
+
right: '0'
|
|
39
|
+
}
|
|
40
|
+
}, _animations.tableActionsAnimation), {}, {
|
|
41
|
+
key: "actions_table_row_motion"
|
|
42
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.MenuItemContainer, {
|
|
43
|
+
ref: menuRef,
|
|
44
|
+
posTop: top,
|
|
45
|
+
posRight: right,
|
|
46
|
+
children: items.map(function (_ref2, index) {
|
|
47
|
+
var label = _ref2.label,
|
|
48
|
+
handler = _ref2.handler;
|
|
49
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.MenuItemContent, {
|
|
50
|
+
tabIndex: 0,
|
|
51
|
+
onClick: function onClick() {
|
|
52
|
+
handler && handler();
|
|
53
|
+
},
|
|
54
|
+
children: label
|
|
55
|
+
}, index);
|
|
56
|
+
})
|
|
57
|
+
}))
|
|
41
58
|
});
|
|
42
59
|
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"animations.d.ts","sourceRoot":"","sources":["../../../../src/components/Table/components/animations.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,eAAO,MAAM,qBAAqB,EAAE,WAKnC,CAAC"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.tableActionsAnimation = void 0;
|
|
7
|
+
var tableActionsAnimation = {
|
|
8
|
+
initial: {
|
|
9
|
+
opacity: 0,
|
|
10
|
+
bottom: -15
|
|
11
|
+
},
|
|
12
|
+
exit: {
|
|
13
|
+
opacity: 0,
|
|
14
|
+
bottom: -15
|
|
15
|
+
},
|
|
16
|
+
animate: {
|
|
17
|
+
opacity: 1,
|
|
18
|
+
bottom: -5
|
|
19
|
+
},
|
|
20
|
+
transition: {
|
|
21
|
+
duration: 0.1
|
|
22
|
+
}
|
|
23
|
+
};
|
|
24
|
+
exports.tableActionsAnimation = tableActionsAnimation;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import { ComponentPropsWithoutRef } from 'react';
|
|
2
2
|
import { ITableProps } from './types';
|
|
3
|
-
export declare function Table({ selectable, primaryActions, secondaryActions, header, rows, isLoading, skeletonRows, skeletonHeight, ...rest }: ITableProps & ComponentPropsWithoutRef<'table'>): JSX.Element;
|
|
3
|
+
export declare function Table({ selectable, primaryActions, secondaryActions, header, rows, isLoading, skeletonRows, skeletonHeight, actionLabel, ...rest }: ITableProps & ComponentPropsWithoutRef<'table'>): JSX.Element;
|
|
4
4
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Table/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,EAAkD,MAAM,OAAO,CAAC;AAoBjG,OAAO,EAAE,WAAW,EAAkB,MAAM,SAAS,CAAC;AAMtD,wBAAgB,KAAK,CAAC,EACpB,UAAU,EACV,cAAc,EACd,gBAAgB,EAChB,MAAM,EACN,IAAI,EACJ,SAAiB,EACjB,YAAgB,EAChB,cAAuB,EACvB,GAAG,IAAI,EACR,EAAE,WAAW,GAAG,wBAAwB,CAAC,OAAO,CAAC,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Table/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,EAAkD,MAAM,OAAO,CAAC;AAoBjG,OAAO,EAAE,WAAW,EAAkB,MAAM,SAAS,CAAC;AAMtD,wBAAgB,KAAK,CAAC,EACpB,UAAU,EACV,cAAc,EACd,gBAAgB,EAChB,MAAM,EACN,IAAI,EACJ,SAAiB,EACjB,YAAgB,EAChB,cAAuB,EACvB,WAAW,EACX,GAAG,IAAI,EACR,EAAE,WAAW,GAAG,wBAAwB,CAAC,OAAO,CAAC,eAkMjD"}
|
|
@@ -15,7 +15,7 @@ var _TableSkeleton = require("./components/TableSkeleton");
|
|
|
15
15
|
var _styles = require("./styles");
|
|
16
16
|
var _GenerateKey = require("../../utils/GenerateKey");
|
|
17
17
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
18
|
-
var _excluded = ["selectable", "primaryActions", "secondaryActions", "header", "rows", "isLoading", "skeletonRows", "skeletonHeight"]; // Components
|
|
18
|
+
var _excluded = ["selectable", "primaryActions", "secondaryActions", "header", "rows", "isLoading", "skeletonRows", "skeletonHeight", "actionLabel"]; // Components
|
|
19
19
|
// Styles
|
|
20
20
|
// Types
|
|
21
21
|
// Utils
|
|
@@ -49,6 +49,7 @@ function Table(_ref) {
|
|
|
49
49
|
skeletonRows = _ref$skeletonRows === void 0 ? 5 : _ref$skeletonRows,
|
|
50
50
|
_ref$skeletonHeight = _ref.skeletonHeight,
|
|
51
51
|
skeletonHeight = _ref$skeletonHeight === void 0 ? '16px' : _ref$skeletonHeight,
|
|
52
|
+
actionLabel = _ref.actionLabel,
|
|
52
53
|
rest = _objectWithoutProperties(_ref, _excluded);
|
|
53
54
|
var _useState = (0, _react.useState)([]),
|
|
54
55
|
_useState2 = _slicedToArray(_useState, 2),
|
|
@@ -177,21 +178,19 @@ function Table(_ref) {
|
|
|
177
178
|
}), header.map(function (label) {
|
|
178
179
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)("th", {
|
|
179
180
|
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
|
|
180
|
-
color: "neutral.
|
|
181
|
-
fontSize: "
|
|
181
|
+
color: "neutral.black",
|
|
182
|
+
fontSize: "xxs",
|
|
182
183
|
fontWeight: "600",
|
|
183
184
|
children: label
|
|
184
185
|
})
|
|
185
186
|
}, (0, _GenerateKey.generateKey)());
|
|
186
187
|
})]
|
|
187
|
-
}), haveActions && /*#__PURE__*/(0, _jsxRuntime.jsx)(
|
|
188
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
children: "A\xE7\xF5es"
|
|
194
|
-
})
|
|
188
|
+
}), haveActions && /*#__PURE__*/(0, _jsxRuntime.jsx)("th", {
|
|
189
|
+
children: !selectedRows.length && !!actionLabel && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
|
|
190
|
+
color: "neutral.black",
|
|
191
|
+
fontSize: "xxs",
|
|
192
|
+
fontWeight: "600",
|
|
193
|
+
children: actionLabel
|
|
195
194
|
})
|
|
196
195
|
})]
|
|
197
196
|
})
|
|
@@ -214,8 +213,8 @@ function Table(_ref) {
|
|
|
214
213
|
}), row.items.map(function (cell) {
|
|
215
214
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)("td", {
|
|
216
215
|
children: typeof cell === 'string' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
|
|
217
|
-
|
|
218
|
-
|
|
216
|
+
color: "neutral.black",
|
|
217
|
+
fontSize: "xxs",
|
|
219
218
|
children: cell
|
|
220
219
|
}) : cell
|
|
221
220
|
}, (0, _GenerateKey.generateKey)());
|
|
@@ -232,7 +231,7 @@ function Table(_ref) {
|
|
|
232
231
|
},
|
|
233
232
|
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
|
|
234
233
|
name: "more-vertical",
|
|
235
|
-
color:
|
|
234
|
+
color: "neutral.black"
|
|
236
235
|
})
|
|
237
236
|
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_MenuItem.MenuItem, {
|
|
238
237
|
onClickOutside: function onClickOutside() {
|
|
@@ -24,7 +24,6 @@ export declare const MenuItemContainer: import("@emotion/styled").StyledComponen
|
|
|
24
24
|
theme?: import("@emotion/react").Theme | undefined;
|
|
25
25
|
as?: import("react").ElementType<any> | undefined;
|
|
26
26
|
} & GenericStyledProps & {
|
|
27
|
-
isOpen?: boolean | undefined;
|
|
28
27
|
posTop?: number | undefined;
|
|
29
28
|
posRight?: number | undefined;
|
|
30
29
|
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Table/styles.ts"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Table/styles.ts"],"names":[],"mappings":";AAKA,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAElD,eAAO,MAAM,WAAW;;;uIA2EtB,CAAC;AAEH,eAAO,MAAM,cAAc;;;yGAG1B,CAAC;AAEF,eAAO,MAAM,aAAa;;;0IAmDxB,CAAC;AAEH,eAAO,MAAM,eAAe;;;yGAE3B,CAAC;AAEF,eAAO,MAAM,oBAAoB;;;0IAgBhC,CAAC;AAEF,eAAO,MAAM,iBAAiB;;;;;;yGAgB7B,CAAC;AAEF,eAAO,MAAM,eAAe;;;8HAoB3B,CAAC"}
|
|
@@ -6,12 +6,13 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.VerticalPointsButton = exports.StyledTable = exports.SelectedHeader = exports.MenuItemWrapper = exports.MenuItemContent = exports.MenuItemContainer = exports.ActionsButton = void 0;
|
|
7
7
|
var _styled = _interopRequireDefault(require("@emotion/styled"));
|
|
8
8
|
var _react = require("@emotion/react");
|
|
9
|
+
var _customColorMode = require("../../utils/customColorMode");
|
|
9
10
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
|
|
10
11
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
12
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
12
13
|
var StyledTable = _styled.default.table(function (props) {
|
|
13
14
|
var theme = props.theme;
|
|
14
|
-
return (0, _react.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n width: 100%;\n border-spacing: 0px;\n\n & > thead {\n & > tr {\n height: 64px;\n\n & > th {\n background: ", "
|
|
15
|
+
return (0, _react.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n width: 100%;\n border-spacing: 0px;\n\n & > thead {\n & > tr {\n height: 64px;\n\n & > th {\n background: ", ";\n border: none;\n padding-inline: 16px;\n text-align: left;\n\n &:first-of-type {\n border-top-left-radius: 6px;\n border-bottom-left-radius: 6px;\n }\n\n &:last-child {\n border-top-right-radius: 6px;\n border-bottom-right-radius: 6px;\n }\n }\n }\n }\n\n & > tbody {\n tr {\n height: 64px;\n\n &:nth-of-type(even) {\n background: ", "4f;\n }\n\n &:hover {\n & > td {\n background: ", "50;\n }\n }\n\n &:focus {\n outline: 2px solid ", ";\n border-radius: 8px;\n }\n\n &[data-selected='true'] {\n & > td {\n background: ", "bb;\n }\n }\n\n & > td {\n padding-inline: 16px;\n transition: all ease 0.1s;\n text-align: left;\n\n color: ", ";\n\n &:first-of-type {\n border-top-left-radius: 8px;\n border-bottom-left-radius: 8px;\n }\n\n &:last-child {\n border-top-right-radius: 8px;\n border-bottom-right-radius: 8px;\n }\n }\n }\n }\n "])), theme.colors.neutral.neutral1, theme.colors.neutral.neutral1, theme.colors.neutral.neutral2, theme.colors.primary.focus, theme.colors.neutral.neutral1, theme.colors.neutral.neutral5);
|
|
15
16
|
});
|
|
16
17
|
exports.StyledTable = StyledTable;
|
|
17
18
|
var SelectedHeader = _styled.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n"])));
|
|
@@ -23,21 +24,15 @@ var ActionsButton = _styled.default.button(function (props) {
|
|
|
23
24
|
exports.ActionsButton = ActionsButton;
|
|
24
25
|
var MenuItemWrapper = _styled.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n position: relative;\n"])));
|
|
25
26
|
exports.MenuItemWrapper = MenuItemWrapper;
|
|
26
|
-
var VerticalPointsButton = _styled.default.button(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n border: 0;\n background-color: transparent;\n font-family: inherit;\n position: relative;\n cursor: pointer;\n\n border-radius: 50%;\n
|
|
27
|
-
return props.theme.zIndex.level1;
|
|
28
|
-
}, function (props) {
|
|
27
|
+
var VerticalPointsButton = _styled.default.button(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n border: 0;\n background-color: transparent;\n font-family: inherit;\n position: relative;\n cursor: pointer;\n\n border-radius: 50%;\n\n padding: 0.5rem;\n\n transition: background-color linear ", ";\n\n &:hover {\n background: rgba(0, 0, 0, 0.08);\n }\n"])), function (props) {
|
|
29
28
|
return props.theme.transition.speed;
|
|
30
29
|
});
|
|
31
30
|
exports.VerticalPointsButton = VerticalPointsButton;
|
|
32
|
-
var MenuItemContainer = _styled.default.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n display:
|
|
33
|
-
return props.isOpen ? 'block' : 'none';
|
|
34
|
-
}, function (_ref) {
|
|
31
|
+
var MenuItemContainer = _styled.default.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n display: block;\n position: absolute;\n border-radius: 8px;\n background-color: ", ";\n box-shadow: 0px 8px 24px rgba(0, 0, 0, 0.1);\n right: ", "px;\n padding: 10px;\n\n z-index: ", ";\n"])), function (_ref) {
|
|
35
32
|
var theme = _ref.theme;
|
|
36
|
-
return theme.colors.neutral.white;
|
|
33
|
+
return (0, _customColorMode.customColorMode)(theme.colors.neutral.white, theme.colors.neutral.neutral1);
|
|
37
34
|
}, function (props) {
|
|
38
35
|
return props.posRight ? props.posRight : 0;
|
|
39
|
-
}, function (props) {
|
|
40
|
-
return props.posTop ? props.posTop : 0;
|
|
41
36
|
}, function (props) {
|
|
42
37
|
return props.theme.zIndex.level2;
|
|
43
38
|
});
|
|
@@ -49,6 +44,6 @@ var MenuItemContent = _styled.default.div(_templateObject7 || (_templateObject7
|
|
|
49
44
|
return props.theme.transition.speed;
|
|
50
45
|
}, function (_ref3) {
|
|
51
46
|
var theme = _ref3.theme;
|
|
52
|
-
return theme.colors.neutral.neutral1;
|
|
47
|
+
return (0, _customColorMode.customColorMode)(theme.colors.neutral.neutral1, theme.colors.neutral.white);
|
|
53
48
|
});
|
|
54
49
|
exports.MenuItemContent = MenuItemContent;
|
|
@@ -30,6 +30,8 @@ export interface ITableProps {
|
|
|
30
30
|
skeletonRows?: number;
|
|
31
31
|
/** Used to determine how many columns to display when the table is loading. */
|
|
32
32
|
skeletonHeight?: string | number;
|
|
33
|
+
/** Used to display a custom text on header action column */
|
|
34
|
+
actionLabel?: string;
|
|
33
35
|
}
|
|
34
36
|
export interface IMenuItem {
|
|
35
37
|
/** Table row dropdown menu items. */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Table/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,SAAS,CAAC;IACjB,OAAO,EAAE,CAAC,YAAY,CAAC,EAAE,MAAM,EAAE,EAAE,WAAW,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;CACnE;AAED,MAAM,MAAM,QAAQ,GAAG;IACrB,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB,OAAO,CAAC,EAAE,WAAW,EAAE,CAAC;CACzB,CAAC;AAEF,gEAAgE;AAChE,MAAM,MAAM,SAAS,GAAG,SAAS,CAAC;AAElC,MAAM,MAAM,cAAc,GAAG;IAC3B,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,WAAW,WAAW;IAC1B,kFAAkF;IAClF,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,mEAAmE;IACnE,cAAc,CAAC,EAAE,WAAW,EAAE,CAAC;IAC/B,mFAAmF;IACnF,gBAAgB,CAAC,EAAE,WAAW,EAAE,CAAC;IACjC,mFAAmF;IACnF,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,gJAAgJ;IAChJ,IAAI,EAAE,QAAQ,EAAE,CAAC;IACjB,mEAAmE;IACnE,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,4EAA4E;IAC5E,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,+EAA+E;IAC/E,cAAc,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Table/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,SAAS,CAAC;IACjB,OAAO,EAAE,CAAC,YAAY,CAAC,EAAE,MAAM,EAAE,EAAE,WAAW,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;CACnE;AAED,MAAM,MAAM,QAAQ,GAAG;IACrB,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB,OAAO,CAAC,EAAE,WAAW,EAAE,CAAC;CACzB,CAAC;AAEF,gEAAgE;AAChE,MAAM,MAAM,SAAS,GAAG,SAAS,CAAC;AAElC,MAAM,MAAM,cAAc,GAAG;IAC3B,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,WAAW,WAAW;IAC1B,kFAAkF;IAClF,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,mEAAmE;IACnE,cAAc,CAAC,EAAE,WAAW,EAAE,CAAC;IAC/B,mFAAmF;IACnF,gBAAgB,CAAC,EAAE,WAAW,EAAE,CAAC;IACjC,mFAAmF;IACnF,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,gJAAgJ;IAChJ,IAAI,EAAE,QAAQ,EAAE,CAAC;IACjB,mEAAmE;IACnE,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,4EAA4E;IAC5E,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,+EAA+E;IAC/E,cAAc,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACjC,4DAA4D;IAC5D,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,MAAM,WAAW,SAAS;IACxB,qCAAqC;IACrC,KAAK,EAAE,WAAW,EAAE,CAAC;IACrB,qCAAqC;IACrC,MAAM,EAAE,OAAO,CAAC;IAChB,kDAAkD;IAClD,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,4CAA4C;IAC5C,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,6CAA6C;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,qBAAqB;IACpC,+EAA+E;IAC/E,eAAe,EAAE,MAAM,CAAC;IACxB,4EAA4E;IAC5E,YAAY,EAAE,MAAM,CAAC;IACrB,+EAA+E;IAC/E,cAAc,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAClC"}
|
|
@@ -53,16 +53,16 @@ export declare function formatedPhone(phone: string, options?: {
|
|
|
53
53
|
}): string;
|
|
54
54
|
/**
|
|
55
55
|
* Returns an object containing various formatted representations of a phone number.
|
|
56
|
-
* @param {string}
|
|
57
|
-
* @returns {FormatPhoneProps
|
|
56
|
+
* @param {string} phoneNumberWithDDI - The phone number to be formatted with +DDI.
|
|
57
|
+
* @returns {FormatPhoneProps} - An object containing different formats of the phone number or null if the number cannot be parsed.
|
|
58
58
|
*/
|
|
59
|
-
export declare function formatPhone(
|
|
59
|
+
export declare function formatPhone(phoneNumberWithDDI: string): FormatPhoneProps;
|
|
60
60
|
/**
|
|
61
61
|
* Formats a guest phone number by masking digits except the last four digits for each format.
|
|
62
|
-
* @param
|
|
62
|
+
* @param phoneNumberWithDDI - The phone number to be formatted with +DDI.
|
|
63
63
|
* @returns The formatted phone number object, or null if the formatting is not possible.
|
|
64
64
|
*/
|
|
65
|
-
export declare function formatGuestPhone(
|
|
65
|
+
export declare function formatGuestPhone(phoneNumberWithDDI: string): FormatPhoneProps;
|
|
66
66
|
/**
|
|
67
67
|
* Validates if a phone number is valid.
|
|
68
68
|
* @param {string | undefined} phoneNumber - The phone number to be validated.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"phone.d.ts","sourceRoot":"","sources":["../../../src/utils/formatters/phone.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAE5D;;;;;GAKG;AACH,wBAAgB,qBAAqB,CAAC,KAAK,CAAC,EAAE,MAAM,EAAE,GAAG,GAAE,MAAc,GAAG,MAAM,CAkCjF;AAED;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAEnD;AAED;;;;GAIG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAerD;AAED;;;;;GAKG;AACH,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,UAAQ,GAAG,MAAM,CAmB1E;AAED;;;;;GAKG;AACH,wBAAgB,eAAe,CAC7B,KAAK,EAAE,MAAM,EACb,EACE,YAA4E,GAC7E,EAAE;IAAE,YAAY,CAAC,EAAE,MAAM,CAAA;CAAE,GAC3B,OAAO,GAAG,MAAM,CAQlB;AAED;;;;GAIG;AACH,wBAAgB,MAAM,CAAC,MAAM,CAAC,EAAE,MAAM,sBAWrC;AAED;;;;;GAKG;AACH,wBAAgB,aAAa,CAC3B,KAAK,EAAE,MAAM,EACb,OAAO,GAAE;IACP,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;CACd,UA2BP;AAED;;;;GAIG;AACH,wBAAgB,WAAW,CAAC,
|
|
1
|
+
{"version":3,"file":"phone.d.ts","sourceRoot":"","sources":["../../../src/utils/formatters/phone.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAE5D;;;;;GAKG;AACH,wBAAgB,qBAAqB,CAAC,KAAK,CAAC,EAAE,MAAM,EAAE,GAAG,GAAE,MAAc,GAAG,MAAM,CAkCjF;AAED;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAEnD;AAED;;;;GAIG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAerD;AAED;;;;;GAKG;AACH,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,UAAQ,GAAG,MAAM,CAmB1E;AAED;;;;;GAKG;AACH,wBAAgB,eAAe,CAC7B,KAAK,EAAE,MAAM,EACb,EACE,YAA4E,GAC7E,EAAE;IAAE,YAAY,CAAC,EAAE,MAAM,CAAA;CAAE,GAC3B,OAAO,GAAG,MAAM,CAQlB;AAED;;;;GAIG;AACH,wBAAgB,MAAM,CAAC,MAAM,CAAC,EAAE,MAAM,sBAWrC;AAED;;;;;GAKG;AACH,wBAAgB,aAAa,CAC3B,KAAK,EAAE,MAAM,EACb,OAAO,GAAE;IACP,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;CACd,UA2BP;AAED;;;;GAIG;AACH,wBAAgB,WAAW,CAAC,kBAAkB,EAAE,MAAM,GAAG,gBAAgB,CAkCxE;AAED;;;;GAIG;AACH,wBAAgB,gBAAgB,CAAC,kBAAkB,EAAE,MAAM,GAAG,gBAAgB,CAwC7E;AAED;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,WAAW,CAAC,EAAE,MAAM,GAAG,OAAO,CAU3D"}
|
|
@@ -172,16 +172,21 @@ function formatedPhone(phone) {
|
|
|
172
172
|
|
|
173
173
|
/**
|
|
174
174
|
* Returns an object containing various formatted representations of a phone number.
|
|
175
|
-
* @param {string}
|
|
176
|
-
* @returns {FormatPhoneProps
|
|
175
|
+
* @param {string} phoneNumberWithDDI - The phone number to be formatted with +DDI.
|
|
176
|
+
* @returns {FormatPhoneProps} - An object containing different formats of the phone number or null if the number cannot be parsed.
|
|
177
177
|
*/
|
|
178
|
-
function formatPhone(
|
|
179
|
-
if (
|
|
178
|
+
function formatPhone(phoneNumberWithDDI) {
|
|
179
|
+
if (phoneNumberWithDDI !== null && phoneNumberWithDDI !== void 0 && phoneNumberWithDDI.includes('*')) return formatGuestPhone(phoneNumberWithDDI);
|
|
180
180
|
|
|
181
181
|
// Parses the phone number
|
|
182
|
-
var parsedNumber = (0, _max.parsePhoneNumberFromString)(
|
|
182
|
+
var parsedNumber = (0, _max.parsePhoneNumberFromString)(phoneNumberWithDDI || '');
|
|
183
183
|
if (!parsedNumber) {
|
|
184
|
-
return
|
|
184
|
+
return {
|
|
185
|
+
formattedNumber: phoneNumberWithDDI,
|
|
186
|
+
formattedNumberWithDDI: phoneNumberWithDDI,
|
|
187
|
+
unformattedNumber: phoneNumberWithDDI,
|
|
188
|
+
unformattedNumberWithDDI: phoneNumberWithDDI
|
|
189
|
+
};
|
|
185
190
|
}
|
|
186
191
|
var hasDDI = parsedNumber.countryCallingCode !== undefined;
|
|
187
192
|
var isInternational = hasDDI && parsedNumber.countryCallingCode !== '55';
|
|
@@ -197,14 +202,19 @@ function formatPhone(phoneNumber) {
|
|
|
197
202
|
|
|
198
203
|
/**
|
|
199
204
|
* Formats a guest phone number by masking digits except the last four digits for each format.
|
|
200
|
-
* @param
|
|
205
|
+
* @param phoneNumberWithDDI - The phone number to be formatted with +DDI.
|
|
201
206
|
* @returns The formatted phone number object, or null if the formatting is not possible.
|
|
202
207
|
*/
|
|
203
|
-
function formatGuestPhone(
|
|
204
|
-
var phone =
|
|
208
|
+
function formatGuestPhone(phoneNumberWithDDI) {
|
|
209
|
+
var phone = phoneNumberWithDDI === null || phoneNumberWithDDI === void 0 ? void 0 : phoneNumberWithDDI.replace(/\*/g, '9');
|
|
205
210
|
var phoneFormatter = formatPhone(phone);
|
|
206
211
|
if (!phoneFormatter) {
|
|
207
|
-
return
|
|
212
|
+
return {
|
|
213
|
+
formattedNumber: phone,
|
|
214
|
+
formattedNumberWithDDI: phone,
|
|
215
|
+
unformattedNumber: phone,
|
|
216
|
+
unformattedNumberWithDDI: phone
|
|
217
|
+
};
|
|
208
218
|
}
|
|
209
219
|
return Object.keys(phoneFormatter).reduce(function (acc, key) {
|
|
210
220
|
var currentKey = key;
|