@pedidopago/ui 1.3.3 → 1.3.6
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/Alert/index.d.ts.map +1 -1
- package/dist/components/Alert/index.js +2 -3
- package/dist/components/Alert/styles.d.ts +1 -1
- package/dist/components/Alert/styles.d.ts.map +1 -1
- package/dist/components/Alert/styles.js +1 -3
- package/dist/components/Alert/types.d.ts +1 -1
- package/dist/components/Alert/types.d.ts.map +1 -1
- package/dist/components/Button/Button.test.js +1 -1
- package/dist/components/Button/index.d.ts +3 -4
- package/dist/components/Button/index.d.ts.map +1 -1
- package/dist/components/Button/index.js +14 -18
- package/dist/components/Button/styles.d.ts +3 -3
- package/dist/components/Button/styles.d.ts.map +1 -1
- package/dist/components/Button/styles.js +42 -43
- package/dist/components/Button/types.d.ts +10 -13
- package/dist/components/Button/types.d.ts.map +1 -1
- package/dist/components/DateInput/components/ModalWrapper/index.d.ts +4 -0
- package/dist/components/DateInput/components/ModalWrapper/index.d.ts.map +1 -0
- package/dist/components/DateInput/components/ModalWrapper/index.js +43 -0
- package/dist/components/DateInput/components/ModalWrapper/styles.d.ts +265 -0
- package/dist/components/DateInput/components/ModalWrapper/styles.d.ts.map +1 -0
- package/dist/components/DateInput/components/ModalWrapper/styles.js +32 -0
- package/dist/components/DateInput/components/ModalWrapper/types.d.ts +16 -0
- package/dist/components/DateInput/components/ModalWrapper/types.d.ts.map +1 -0
- package/dist/components/DateInput/components/ModalWrapper/types.js +1 -0
- package/dist/components/DateInput/index.d.ts +1 -1
- package/dist/components/DateInput/index.d.ts.map +1 -1
- package/dist/components/DateInput/index.js +63 -34
- package/dist/components/DateInput/styles.d.ts +7 -2
- package/dist/components/DateInput/styles.d.ts.map +1 -1
- package/dist/components/DateInput/styles.js +10 -3
- package/dist/components/DateInput/types.d.ts +1 -0
- package/dist/components/DateInput/types.d.ts.map +1 -1
- package/dist/components/DatePicker/components/DatePickerContent.d.ts.map +1 -1
- package/dist/components/DatePicker/components/DatePickerContent.js +2 -0
- package/dist/components/DatePicker/components/DateYearPicker.d.ts.map +1 -1
- package/dist/components/DatePicker/components/DateYearPicker.js +2 -0
- package/dist/components/Input/styles.d.ts.map +1 -1
- package/dist/components/Input/styles.js +2 -2
- package/dist/components/Modal/ModalExample.d.ts +4 -0
- package/dist/components/Modal/ModalExample.d.ts.map +1 -0
- package/dist/components/Modal/ModalExample.js +66 -0
- package/dist/components/Modal/index.d.ts +1 -1
- package/dist/components/Modal/index.d.ts.map +1 -1
- package/dist/components/Modal/index.js +11 -13
- package/dist/components/Modal/modal.test.js +11 -9
- package/dist/components/MultipleSelect/MultipleSelect.test.js +9 -9
- package/dist/components/MultipleSelect/components/OptionsArea/index.js +4 -4
- package/dist/components/MultipleSelect/components/SelectArea/index.js +4 -4
- package/dist/components/MultipleSelect/index.d.ts.map +1 -1
- package/dist/components/MultipleSelect/index.js +1 -1
- package/dist/components/MultipleSelect/types.d.ts +1 -1
- package/dist/components/MultipleSelect/types.d.ts.map +1 -1
- package/dist/components/Pagination/index.d.ts.map +1 -1
- package/dist/components/Pagination/index.js +23 -10
- package/dist/components/Pagination/styles.js +3 -2
- package/dist/components/ReactPortal/index.d.ts +8 -0
- package/dist/components/ReactPortal/index.d.ts.map +1 -0
- package/dist/components/ReactPortal/index.js +58 -0
- package/dist/components/ReactPortal/reactPortal.test.d.ts +2 -0
- package/dist/components/ReactPortal/reactPortal.test.d.ts.map +1 -0
- package/dist/components/ReactPortal/reactPortal.test.js +26 -0
- package/dist/components/ReactPortal/utils/createWrapperAndApprendToBody.d.ts +2 -0
- package/dist/components/ReactPortal/utils/createWrapperAndApprendToBody.d.ts.map +1 -0
- package/dist/components/ReactPortal/utils/createWrapperAndApprendToBody.js +13 -0
- package/dist/components/Select/components/OptionsSelect/index.d.ts +4 -0
- package/dist/components/Select/components/OptionsSelect/index.d.ts.map +1 -0
- package/dist/components/Select/components/OptionsSelect/index.js +91 -0
- package/dist/components/Select/components/OptionsSelect/styles.d.ts +265 -0
- package/dist/components/Select/components/OptionsSelect/styles.d.ts.map +1 -0
- package/dist/components/Select/components/OptionsSelect/styles.js +32 -0
- package/dist/components/Select/components/OptionsSelect/types.d.ts +16 -0
- package/dist/components/Select/components/OptionsSelect/types.d.ts.map +1 -0
- package/dist/components/Select/components/OptionsSelect/types.js +1 -0
- package/dist/components/Select/index.d.ts.map +1 -1
- package/dist/components/Select/index.js +61 -27
- package/dist/components/Select/select.test.js +14 -0
- package/dist/components/Select/styles.d.ts +5 -7
- package/dist/components/Select/styles.d.ts.map +1 -1
- package/dist/components/Select/styles.js +26 -16
- package/dist/components/Select/types.d.ts +7 -2
- package/dist/components/Select/types.d.ts.map +1 -1
- package/dist/components/Table/styles.d.ts.map +1 -1
- package/dist/components/Table/styles.js +8 -2
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +9 -0
- package/package.json +2 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAa3B,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAErC,QAAA,MAAM,KAAK,EAAE,EAAE,CAAC,UAAU,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAa3B,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAErC,QAAA,MAAM,KAAK,EAAE,EAAE,CAAC,UAAU,CAoCzB,CAAC;AAEF,eAAe,KAAK,CAAC"}
|
|
@@ -28,7 +28,7 @@ var Alert = function Alert(_ref) {
|
|
|
28
28
|
variant = _ref$variant === void 0 ? 'filled' : _ref$variant;
|
|
29
29
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.StyledAlertContainer, {
|
|
30
30
|
children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.StyledAlertWrapper, {
|
|
31
|
-
haveContent: !!content,
|
|
31
|
+
haveContent: !!content && !!title,
|
|
32
32
|
variant: variant,
|
|
33
33
|
type: type,
|
|
34
34
|
maxWidth: maxWidth,
|
|
@@ -41,8 +41,7 @@ var Alert = function Alert(_ref) {
|
|
|
41
41
|
size: variant === 'outlined' ? '1.375rem' : '2rem'
|
|
42
42
|
})
|
|
43
43
|
}), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.StyledColumn, {
|
|
44
|
-
|
|
45
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
|
|
44
|
+
children: [title && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
|
|
46
45
|
fontSize: "xs",
|
|
47
46
|
fontWeight: "bold",
|
|
48
47
|
children: title
|
|
@@ -17,7 +17,7 @@ export declare const StyledIconBox: import("@emotion/styled").StyledComponent<{
|
|
|
17
17
|
export declare const StyledColumn: import("@emotion/styled").StyledComponent<{
|
|
18
18
|
theme?: import("@emotion/react").Theme | undefined;
|
|
19
19
|
as?: import("react").ElementType<any> | undefined;
|
|
20
|
-
}
|
|
20
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
21
21
|
export declare const StyledCloseIcon: import("@emotion/styled").StyledComponent<{
|
|
22
22
|
theme?: import("@emotion/react").Theme | undefined;
|
|
23
23
|
as?: import("react").ElementType<any> | undefined;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/styles.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAEvC,eAAO,MAAM,oBAAoB;;;yGAEhC,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/styles.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAEvC,eAAO,MAAM,oBAAoB;;;yGAEhC,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;wHAsB7B,CAAC;AAEH,eAAO,MAAM,aAAa;;;;iBAA4C,OAAO;yGA0B3E,CAAC;AAEH,eAAO,MAAM,YAAY;;;yGASxB,CAAC;AAEF,eAAO,MAAM,eAAe;;;yGAS3B,CAAC"}
|
|
@@ -22,10 +22,8 @@ var StyledAlertContainer = _styled.default.div(_templateObject || (_templateObje
|
|
|
22
22
|
exports.StyledAlertContainer = StyledAlertContainer;
|
|
23
23
|
|
|
24
24
|
var StyledAlertWrapper = _styled.default.div(function (props) {
|
|
25
|
-
var buttonPrimaryColor = props.type !== 'default' && props.type ? props.theme.colors[props.type].default : props.theme.colors.neutral.neutral3;
|
|
26
|
-
var buttonSecondaryColor = props.type !== 'default' && props.type ? props.theme.colorMode === 'dark' ? props.theme.colors[props.type].dark : props.theme.colors[props.type].blurred : props.theme.colors.neutral.neutral1;
|
|
27
25
|
var secondaryColor = props.type !== 'default' && props.type ? props.theme.colorMode === 'dark' ? props.theme.colors[props.type].dark : props.theme.colors[props.type].blurred : props.theme.colorMode === 'dark' ? props.theme.colors.neutral.neutral6 : props.theme.colors.neutral.neutral1;
|
|
28
|
-
return (0, _react.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n display: flex;\n align-items: ", ";\n padding: 1rem;\n gap: 1rem;\n border-radius: 8px;\n width: 100%;\n background-color: ", ";\n border: ", ";\n color: ", ";\n max-width: ", ";\n
|
|
26
|
+
return (0, _react.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n display: flex;\n align-items: ", ";\n padding: 1rem;\n gap: 1rem;\n border-radius: 8px;\n width: 100%;\n background-color: ", ";\n border: ", ";\n color: ", ";\n max-width: ", ";\n "])), props.haveContent ? 'flex-start' : 'center', props.variant === 'outlined' ? 'transparent' : secondaryColor, props.variant === 'outlined' ? "2px solid ".concat(secondaryColor, ";") : '', props.variant === 'outlined' ? props.theme.colors.neutral.neutral4 : '', props.maxWidth ? "".concat(props.maxWidth, "px") : '');
|
|
29
27
|
});
|
|
30
28
|
|
|
31
29
|
exports.StyledAlertWrapper = StyledAlertWrapper;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,gBAAgB,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEzC,oBAAY,UAAU,GAAG;IACvB;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;;OAGG;IACH,OAAO,CAAC,EAAE,UAAU,GAAG,QAAQ,GAAG,UAAU,CAAC;IAC7C;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,UAAU,GAAG,aAAa,CAAC;IAChF;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Alert/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,gBAAgB,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEzC,oBAAY,UAAU,GAAG;IACvB;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;;OAGG;IACH,OAAO,CAAC,EAAE,UAAU,GAAG,QAAQ,GAAG,UAAU,CAAC;IAC7C;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,UAAU,GAAG,aAAa,CAAC;IAChF;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAEF,oBAAY,YAAY,GAAG;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,UAAU,GAAG,QAAQ,GAAG,UAAU,CAAC;IAC7C,IAAI,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,UAAU,GAAG,aAAa,CAAC;IAChF,KAAK,CAAC,EAAE,gBAAgB,CAAC;IACzB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC"}
|
|
@@ -102,7 +102,7 @@ describe('Button', function () {
|
|
|
102
102
|
children: "Click Me"
|
|
103
103
|
}));
|
|
104
104
|
expect(_react.screen.getByRole('button')).toBeDisabled();
|
|
105
|
-
expect(_react.screen.getByRole('button')).toHaveStyle('cursor:
|
|
105
|
+
expect(_react.screen.getByRole('button')).not.toHaveStyle('cursor: pointer');
|
|
106
106
|
});
|
|
107
107
|
it('should render a ghost variant button', function () {
|
|
108
108
|
(0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
export default Button;
|
|
1
|
+
import { ButtonHTMLAttributes } from 'react';
|
|
2
|
+
import { ButtonProps } from './types';
|
|
3
|
+
export default function Button({ children, leftIcon, rightIcon, isLoading, variant, bgColor, size, fullWidth, textColor, type, iconColor, ...props }: ButtonProps & ButtonHTMLAttributes<HTMLButtonElement>): JSX.Element;
|
|
5
4
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAM7C,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAEtC,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,EAC7B,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,SAAS,EACT,OAAiB,EACjB,OAAY,EACZ,IAAW,EACX,SAAS,EACT,SAAc,EACd,IAAe,EACf,SAAc,EACd,GAAG,KAAK,EACT,EAAE,WAAW,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,eAoEvD"}
|
|
@@ -3,18 +3,18 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.default =
|
|
7
|
-
|
|
8
|
-
var _Icon = _interopRequireDefault(require("../Icon"));
|
|
6
|
+
exports.default = Button;
|
|
9
7
|
|
|
10
8
|
var _index = require("../../shared/theme/index");
|
|
11
9
|
|
|
12
10
|
var _getColorValue = require("../../utils/getColorValue");
|
|
13
11
|
|
|
14
|
-
var
|
|
12
|
+
var _Icon = _interopRequireDefault(require("../Icon"));
|
|
15
13
|
|
|
16
14
|
var _Skeleton = _interopRequireDefault(require("../Skeleton"));
|
|
17
15
|
|
|
16
|
+
var _styles = require("./styles");
|
|
17
|
+
|
|
18
18
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
19
19
|
|
|
20
20
|
var _excluded = ["children", "leftIcon", "rightIcon", "isLoading", "variant", "bgColor", "size", "fullWidth", "textColor", "type", "iconColor"];
|
|
@@ -31,7 +31,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
|
|
|
31
31
|
|
|
32
32
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
33
33
|
|
|
34
|
-
|
|
34
|
+
function Button(_ref) {
|
|
35
35
|
var children = _ref.children,
|
|
36
36
|
leftIcon = _ref.leftIcon,
|
|
37
37
|
rightIcon = _ref.rightIcon,
|
|
@@ -94,15 +94,14 @@ var Button = function Button(_ref) {
|
|
|
94
94
|
});
|
|
95
95
|
}
|
|
96
96
|
|
|
97
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
}
|
|
97
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.ButtonContainer, _objectSpread(_objectSpread({
|
|
98
|
+
bgColor: parsedBgColor,
|
|
99
|
+
textColor: parsedTextColor,
|
|
100
|
+
fullWidth: fullWidth,
|
|
101
|
+
isLoading: isLoading,
|
|
102
|
+
variant: variant,
|
|
103
|
+
size: size,
|
|
104
|
+
type: type
|
|
106
105
|
}, props), {}, {
|
|
107
106
|
children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.IconContainer, {
|
|
108
107
|
children: [leftIcon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.IconWrapper, {
|
|
@@ -122,7 +121,4 @@ var Button = function Button(_ref) {
|
|
|
122
121
|
})]
|
|
123
122
|
})
|
|
124
123
|
}));
|
|
125
|
-
}
|
|
126
|
-
|
|
127
|
-
var _default = Button;
|
|
128
|
-
exports.default = _default;
|
|
124
|
+
}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import {
|
|
3
|
-
export declare const
|
|
2
|
+
import { ButtonProps } from './types';
|
|
3
|
+
export declare const ButtonContainer: import("@emotion/styled").StyledComponent<{
|
|
4
4
|
theme?: import("@emotion/react").Theme | undefined;
|
|
5
5
|
as?: import("react").ElementType<any> | undefined;
|
|
6
|
-
} &
|
|
6
|
+
} & ButtonProps, import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;
|
|
7
7
|
export declare const IconContainer: import("@emotion/styled").StyledComponent<{
|
|
8
8
|
theme?: import("@emotion/react").Theme | undefined;
|
|
9
9
|
as?: import("react").ElementType<any> | undefined;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Button/styles.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Button/styles.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAGtC,eAAO,MAAM,eAAe;;;mIAmI3B,CAAC;AAEF,eAAO,MAAM,aAAa;;;yGAKzB,CAAC;AAEF,eAAO,MAAM,WAAW;;;yGAIvB,CAAC"}
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.IconWrapper = exports.IconContainer = exports.
|
|
6
|
+
exports.IconWrapper = exports.IconContainer = exports.ButtonContainer = void 0;
|
|
7
7
|
|
|
8
8
|
var _styled = _interopRequireDefault(require("@emotion/styled"));
|
|
9
9
|
|
|
@@ -19,104 +19,103 @@ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" =
|
|
|
19
19
|
|
|
20
20
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
21
21
|
|
|
22
|
-
var
|
|
22
|
+
var ButtonContainer = _styled.default.button(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n font-family: inherit;\n font-weight: ", ";\n font-size: ", ";\n border-radius: 8px;\n border: 0px;\n cursor: pointer;\n padding-inline: 24px;\n --button-brightness: brightness(0.85);\n\n transition: all 0.15s ease-in-out;\n\n color: ", ";\n\n background-color: ", ";\n\n height: ", ";\n\n width: ", ";\n\n &:disabled {\n filter: opacity(0.5);\n cursor: default;\n }\n\n ", "\n\n @media screen and (min-width: ", ") {\n width: ", ";\n }\n\n @media screen and (min-width: ", ") {\n width: ", ";\n }\n\n @media screen and (min-width: ", ") {\n width: ", ";\n }\n\n @media screen and (min-width: ", ") {\n width: ", ";\n }\n"])), function (_ref) {
|
|
23
23
|
var theme = _ref.theme;
|
|
24
24
|
return theme.fontWeight[600];
|
|
25
25
|
}, function (_ref2) {
|
|
26
26
|
var theme = _ref2.theme;
|
|
27
27
|
return theme.fontSizes.xs;
|
|
28
28
|
}, function (_ref3) {
|
|
29
|
-
var
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
return (_button$textColor = button.textColor) !== null && _button$textColor !== void 0 ? _button$textColor : baseColor;
|
|
29
|
+
var theme = _ref3.theme,
|
|
30
|
+
textColor = _ref3.textColor,
|
|
31
|
+
bgColor = _ref3.bgColor;
|
|
32
|
+
var baseColor = (0, _invertColor.invertColor)(textColor || bgColor || theme.colors.primary.default, true);
|
|
33
|
+
return textColor !== null && textColor !== void 0 ? textColor : baseColor;
|
|
35
34
|
}, function (_ref4) {
|
|
36
|
-
var
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
theme = _ref4.theme;
|
|
40
|
-
return (_button$bgColor = button.bgColor) !== null && _button$bgColor !== void 0 ? _button$bgColor : theme.colors.primary.default;
|
|
35
|
+
var theme = _ref4.theme,
|
|
36
|
+
bgColor = _ref4.bgColor;
|
|
37
|
+
return bgColor !== null && bgColor !== void 0 ? bgColor : theme.colors.primary.default;
|
|
41
38
|
}, function (_ref5) {
|
|
42
|
-
var
|
|
43
|
-
|
|
44
|
-
if (
|
|
39
|
+
var theme = _ref5.theme,
|
|
40
|
+
size = _ref5.size;
|
|
41
|
+
if (size) return theme.buttonSize[size];
|
|
45
42
|
return theme.buttonSize.md;
|
|
46
43
|
}, function (_ref6) {
|
|
47
|
-
var
|
|
44
|
+
var fullWidth = _ref6.fullWidth;
|
|
48
45
|
|
|
49
|
-
if (
|
|
50
|
-
if (_typeof(
|
|
51
|
-
return
|
|
46
|
+
if (fullWidth) {
|
|
47
|
+
if (_typeof(fullWidth) === 'object' && fullWidth !== undefined) {
|
|
48
|
+
return fullWidth.base && '100%';
|
|
52
49
|
}
|
|
53
50
|
|
|
54
51
|
return '100%';
|
|
55
52
|
}
|
|
56
53
|
}, function (_ref7) {
|
|
57
|
-
var
|
|
58
|
-
|
|
54
|
+
var theme = _ref7.theme,
|
|
55
|
+
variant = _ref7.variant,
|
|
56
|
+
textColor = _ref7.textColor,
|
|
57
|
+
bgColor = _ref7.bgColor;
|
|
59
58
|
|
|
60
|
-
switch (
|
|
59
|
+
switch (variant) {
|
|
61
60
|
case 'solid':
|
|
62
61
|
return (0, _react.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n &:is(&:hover, &:focus):not(:disabled) {\n box-shadow: inset 0 0 40px 40px rgba(0, 0, 0, 0.2);\n }\n "])));
|
|
63
62
|
|
|
64
63
|
case 'outline':
|
|
65
|
-
return (0, _react.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n background-color: transparent;\n color: ", ";\n border: 3px ", " solid;\n box-shadow: none;\n &:is(&:hover, &:focus):not(:disabled) {\n filter: var(--button-brightness);\n }\n "])),
|
|
64
|
+
return (0, _react.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n background-color: transparent;\n color: ", ";\n border: 3px ", " solid;\n box-shadow: none;\n &:is(&:hover, &:focus):not(:disabled) {\n filter: var(--button-brightness);\n }\n "])), textColor || bgColor || theme.colors.primary.default, bgColor || textColor || theme.colors.primary.default);
|
|
66
65
|
|
|
67
66
|
case 'ghost':
|
|
68
|
-
return (0, _react.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n padding-inline: 0;\n background-color: transparent;\n color: ", ";\n &:is(&:hover, &:focus):not(:disabled) {\n filter: var(--button-brightness);\n }\n "])),
|
|
67
|
+
return (0, _react.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n padding-inline: 0;\n background-color: transparent;\n color: ", ";\n &:is(&:hover, &:focus):not(:disabled) {\n filter: var(--button-brightness);\n }\n "])), bgColor || textColor || theme.colors.primary.default);
|
|
69
68
|
|
|
70
69
|
case 'link':
|
|
71
|
-
return (0, _react.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n padding-inline: 0;\n text-decoration: underline;\n background-color: transparent;\n color: ", ";\n &:is(&:hover, &:focus):not(:disabled) {\n filter: var(--button-brightness);\n }\n "])),
|
|
70
|
+
return (0, _react.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n padding-inline: 0;\n text-decoration: underline;\n background-color: transparent;\n color: ", ";\n &:is(&:hover, &:focus):not(:disabled) {\n filter: var(--button-brightness);\n }\n "])), bgColor || textColor || theme.colors.primary.default);
|
|
72
71
|
}
|
|
73
72
|
}, function (_ref8) {
|
|
74
73
|
var theme = _ref8.theme;
|
|
75
74
|
return theme.breakpoints.sm;
|
|
76
75
|
}, function (_ref9) {
|
|
77
|
-
var
|
|
76
|
+
var fullWidth = _ref9.fullWidth;
|
|
78
77
|
|
|
79
|
-
if (_typeof(
|
|
80
|
-
var widthWasNotSet =
|
|
78
|
+
if (_typeof(fullWidth) === 'object') {
|
|
79
|
+
var widthWasNotSet = fullWidth.sm === undefined;
|
|
81
80
|
if (widthWasNotSet) return;
|
|
82
|
-
return
|
|
81
|
+
return fullWidth.sm ? '100%' : 'fit-content';
|
|
83
82
|
}
|
|
84
83
|
}, function (_ref10) {
|
|
85
84
|
var theme = _ref10.theme;
|
|
86
85
|
return theme.breakpoints.md;
|
|
87
86
|
}, function (_ref11) {
|
|
88
|
-
var
|
|
87
|
+
var fullWidth = _ref11.fullWidth;
|
|
89
88
|
|
|
90
|
-
if (_typeof(
|
|
91
|
-
var widthWasNotSet =
|
|
89
|
+
if (_typeof(fullWidth) === 'object') {
|
|
90
|
+
var widthWasNotSet = fullWidth.md === undefined;
|
|
92
91
|
if (widthWasNotSet) return;
|
|
93
|
-
return
|
|
92
|
+
return fullWidth.md ? '100%' : 'fit-content';
|
|
94
93
|
}
|
|
95
94
|
}, function (_ref12) {
|
|
96
95
|
var theme = _ref12.theme;
|
|
97
96
|
return theme.breakpoints.lg;
|
|
98
97
|
}, function (_ref13) {
|
|
99
|
-
var
|
|
98
|
+
var fullWidth = _ref13.fullWidth;
|
|
100
99
|
|
|
101
|
-
if (_typeof(
|
|
102
|
-
var widthWasNotSet =
|
|
100
|
+
if (_typeof(fullWidth) === 'object') {
|
|
101
|
+
var widthWasNotSet = fullWidth.lg === undefined;
|
|
103
102
|
if (widthWasNotSet) return;
|
|
104
|
-
return
|
|
103
|
+
return fullWidth.lg ? '100%' : 'fit-content';
|
|
105
104
|
}
|
|
106
105
|
}, function (_ref14) {
|
|
107
106
|
var theme = _ref14.theme;
|
|
108
107
|
return theme.breakpoints.xl;
|
|
109
108
|
}, function (_ref15) {
|
|
110
|
-
var
|
|
109
|
+
var fullWidth = _ref15.fullWidth;
|
|
111
110
|
|
|
112
|
-
if (_typeof(
|
|
113
|
-
var widthWasNotSet =
|
|
111
|
+
if (_typeof(fullWidth) === 'object') {
|
|
112
|
+
var widthWasNotSet = fullWidth.xl === undefined;
|
|
114
113
|
if (widthWasNotSet) return;
|
|
115
|
-
return
|
|
114
|
+
return fullWidth.xl ? '100%' : 'fit-content';
|
|
116
115
|
}
|
|
117
116
|
});
|
|
118
117
|
|
|
119
|
-
exports.
|
|
118
|
+
exports.ButtonContainer = ButtonContainer;
|
|
120
119
|
|
|
121
120
|
var IconContainer = _styled.default.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 0.45em;\n"])));
|
|
122
121
|
|
|
@@ -11,14 +11,14 @@ declare type responsivePattern<T = any> = {
|
|
|
11
11
|
xxl?: T;
|
|
12
12
|
};
|
|
13
13
|
declare type sizeOptions = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
14
|
-
export interface
|
|
14
|
+
export interface ButtonProps {
|
|
15
15
|
/**
|
|
16
16
|
* The button's properties change making it not clickable and changing it's color.
|
|
17
17
|
*
|
|
18
18
|
* @default 'solid'
|
|
19
19
|
* @example 'solid' | 'outline' | 'ghost' | 'link'
|
|
20
20
|
* @type buttonVariant
|
|
21
|
-
* @memberof
|
|
21
|
+
* @memberof ButtonProps
|
|
22
22
|
*/
|
|
23
23
|
disabled?: boolean;
|
|
24
24
|
/**
|
|
@@ -27,7 +27,7 @@ export interface IButtonProps {
|
|
|
27
27
|
*
|
|
28
28
|
* @default ''
|
|
29
29
|
* @type IconName
|
|
30
|
-
* @memberof
|
|
30
|
+
* @memberof ButtonProps
|
|
31
31
|
*/
|
|
32
32
|
leftIcon?: IconName;
|
|
33
33
|
/**
|
|
@@ -37,7 +37,7 @@ export interface IButtonProps {
|
|
|
37
37
|
*
|
|
38
38
|
* @default ''
|
|
39
39
|
* @type IconName
|
|
40
|
-
* @memberof
|
|
40
|
+
* @memberof ButtonProps
|
|
41
41
|
*/
|
|
42
42
|
rightIcon?: IconName;
|
|
43
43
|
/**
|
|
@@ -45,7 +45,7 @@ export interface IButtonProps {
|
|
|
45
45
|
*
|
|
46
46
|
* @default false
|
|
47
47
|
* @type boolean
|
|
48
|
-
* @memberof
|
|
48
|
+
* @memberof ButtonProps
|
|
49
49
|
* @example true
|
|
50
50
|
*/
|
|
51
51
|
isLoading?: boolean;
|
|
@@ -54,7 +54,7 @@ export interface IButtonProps {
|
|
|
54
54
|
*
|
|
55
55
|
* @default 'md'
|
|
56
56
|
* @type sizeOptions
|
|
57
|
-
* @memberof
|
|
57
|
+
* @memberof ButtonProps
|
|
58
58
|
* @example 'xs' | 'sm' | 'md' | 'lg' | 'xl'
|
|
59
59
|
*/
|
|
60
60
|
size?: sizeOptions;
|
|
@@ -64,7 +64,7 @@ export interface IButtonProps {
|
|
|
64
64
|
* @default 'solid'
|
|
65
65
|
* @example 'solid' | 'outline' | 'ghost' | 'link'
|
|
66
66
|
* @type buttonVariant
|
|
67
|
-
* @memberof
|
|
67
|
+
* @memberof ButtonProps
|
|
68
68
|
*/
|
|
69
69
|
variant?: buttonVariant;
|
|
70
70
|
/**
|
|
@@ -73,7 +73,7 @@ export interface IButtonProps {
|
|
|
73
73
|
* @default 'primary'
|
|
74
74
|
* @example 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | 'light' | 'dark'
|
|
75
75
|
* @type buttonColor
|
|
76
|
-
* @memberof
|
|
76
|
+
* @memberof ButtonProps
|
|
77
77
|
*/
|
|
78
78
|
bgColor?: buttonColor;
|
|
79
79
|
iconColor?: GlobalColorsProps | string;
|
|
@@ -85,7 +85,7 @@ export interface IButtonProps {
|
|
|
85
85
|
* @example { base: true, sm: false', md: false }
|
|
86
86
|
* @example { base: 'md', md: 'xl' }
|
|
87
87
|
* @type boolean | responsivePattern<boolean>
|
|
88
|
-
* @memberof
|
|
88
|
+
* @memberof ButtonProps
|
|
89
89
|
*/
|
|
90
90
|
fullWidth?: boolean | responsivePattern<boolean>;
|
|
91
91
|
/**
|
|
@@ -94,12 +94,9 @@ export interface IButtonProps {
|
|
|
94
94
|
* @default 'white'
|
|
95
95
|
* @example 'white' | 'black'
|
|
96
96
|
* @type string
|
|
97
|
-
* @memberof
|
|
97
|
+
* @memberof ButtonProps
|
|
98
98
|
*/
|
|
99
99
|
textColor?: buttonColor;
|
|
100
100
|
}
|
|
101
|
-
export declare type StyledMapping = {
|
|
102
|
-
button: IButtonProps;
|
|
103
|
-
};
|
|
104
101
|
export {};
|
|
105
102
|
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Button/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAEvD,aAAK,aAAa,GAAG,SAAS,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,CAAC;AAC5D,aAAK,WAAW,GAAG,iBAAiB,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;AACrD,aAAK,iBAAiB,CAAC,CAAC,GAAG,GAAG,IAAI;IAChC,IAAI,CAAC,EAAE,CAAC,CAAC;IACT,EAAE,CAAC,EAAE,CAAC,CAAC;IACP,EAAE,CAAC,EAAE,CAAC,CAAC;IACP,EAAE,CAAC,EAAE,CAAC,CAAC;IACP,EAAE,CAAC,EAAE,CAAC,CAAC;IACP,GAAG,CAAC,EAAE,CAAC,CAAC;CACT,CAAC;AACF,aAAK,WAAW,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEpD,MAAM,WAAW,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Button/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAEvD,aAAK,aAAa,GAAG,SAAS,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,CAAC;AAC5D,aAAK,WAAW,GAAG,iBAAiB,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;AACrD,aAAK,iBAAiB,CAAC,CAAC,GAAG,GAAG,IAAI;IAChC,IAAI,CAAC,EAAE,CAAC,CAAC;IACT,EAAE,CAAC,EAAE,CAAC,CAAC;IACP,EAAE,CAAC,EAAE,CAAC,CAAC;IACP,EAAE,CAAC,EAAE,CAAC,CAAC;IACP,EAAE,CAAC,EAAE,CAAC,CAAC;IACP,GAAG,CAAC,EAAE,CAAC,CAAC;CACT,CAAC;AACF,aAAK,WAAW,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEpD,MAAM,WAAW,WAAW;IAC1B;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC;IAEpB;;;;;;;;OAQG;IACH,SAAS,CAAC,EAAE,QAAQ,CAAC;IAErB;;;;;;;OAOG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IAEnB;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IAExB;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,SAAS,CAAC,EAAE,iBAAiB,GAAG,MAAM,CAAC;IAEvC;;;;;;;;;OASG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,iBAAiB,CAAC,OAAO,CAAC,CAAC;IAEjD;;;;;;;OAOG;IACH,SAAS,CAAC,EAAE,WAAW,CAAC;CACzB"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/DateInput/components/ModalWrapper/index.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAE5C,eAAO,MAAM,YAAY,8GA+BxB,CAAC"}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.ModalWrapper = void 0;
|
|
7
|
+
|
|
8
|
+
var _react = require("react");
|
|
9
|
+
|
|
10
|
+
var _useDisableBodyScroll = require("src/shared/hooks/useDisableBodyScroll");
|
|
11
|
+
|
|
12
|
+
var _styles = require("./styles");
|
|
13
|
+
|
|
14
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
15
|
+
|
|
16
|
+
var ModalWrapper = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
17
|
+
var open = _ref.open,
|
|
18
|
+
_ref$left = _ref.left,
|
|
19
|
+
left = _ref$left === void 0 ? '50vw' : _ref$left,
|
|
20
|
+
_ref$top = _ref.top,
|
|
21
|
+
top = _ref$top === void 0 ? '' : _ref$top,
|
|
22
|
+
_ref$offsetX = _ref.offsetX,
|
|
23
|
+
offsetX = _ref$offsetX === void 0 ? '0px' : _ref$offsetX,
|
|
24
|
+
_ref$disableScrollOnO = _ref.disableScrollOnOpen,
|
|
25
|
+
disableScrollOnOpen = _ref$disableScrollOnO === void 0 ? true : _ref$disableScrollOnO,
|
|
26
|
+
maxWidth = _ref.maxWidth,
|
|
27
|
+
children = _ref.children;
|
|
28
|
+
var optionsContainerRef = (0, _react.useRef)(null);
|
|
29
|
+
(0, _react.useImperativeHandle)(ref, function () {
|
|
30
|
+
return optionsContainerRef.current;
|
|
31
|
+
});
|
|
32
|
+
(0, _useDisableBodyScroll.useDisableBodyScroll)(open && disableScrollOnOpen);
|
|
33
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.ModalWrapperContainer, {
|
|
34
|
+
ref: optionsContainerRef,
|
|
35
|
+
open: open,
|
|
36
|
+
maxWidth: typeof maxWidth === 'number' ? "".concat(maxWidth, "px") : maxWidth,
|
|
37
|
+
left: "calc(".concat(left, " + ").concat(offsetX, ")"),
|
|
38
|
+
top: top,
|
|
39
|
+
children: children
|
|
40
|
+
});
|
|
41
|
+
});
|
|
42
|
+
exports.ModalWrapper = ModalWrapper;
|
|
43
|
+
ModalWrapper.displayName = 'ModalWrapper';
|