@pedidopago/ui 1.3.25 → 1.3.28
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 +93 -93
- package/dist/components/Button/Button.test.js +4 -31
- package/dist/components/Button/index.d.ts +1 -1
- package/dist/components/Button/index.d.ts.map +1 -1
- package/dist/components/Button/index.js +25 -39
- package/dist/components/Button/types.d.ts +0 -9
- package/dist/components/Button/types.d.ts.map +1 -1
- package/dist/components/Card/card.test.d.ts +2 -0
- package/dist/components/Card/card.test.d.ts.map +1 -0
- package/dist/components/Card/card.test.js +37 -0
- package/dist/components/Card/index.d.ts +2 -2
- package/dist/components/Card/index.d.ts.map +1 -1
- package/dist/components/Card/index.js +18 -4
- package/dist/components/Card/styles.d.ts +2 -2
- package/dist/components/Card/styles.d.ts.map +1 -1
- package/dist/components/Card/types.d.ts +5 -5
- package/dist/components/Card/types.d.ts.map +1 -1
- package/dist/components/Icon/data/dash.d.ts.map +1 -1
- package/dist/components/Icon/data/dash.js +1 -1
- package/dist/components/Icon/types.d.ts +1 -1
- package/dist/components/Icon/types.d.ts.map +1 -1
- package/dist/components/RadioInput/components/ChoiceList/index.js +1 -1
- package/dist/components/Select/components/OptionsSelect/index.d.ts.map +1 -1
- package/dist/components/Select/components/OptionsSelect/index.js +2 -0
- package/dist/components/Select/components/OptionsSelect/styles.d.ts +1 -0
- package/dist/components/Select/components/OptionsSelect/styles.d.ts.map +1 -1
- package/dist/components/Select/components/OptionsSelect/styles.js +1 -1
- package/dist/components/Select/components/OptionsSelect/types.d.ts +3 -1
- package/dist/components/Select/components/OptionsSelect/types.d.ts.map +1 -1
- package/dist/components/Select/index.d.ts.map +1 -1
- package/dist/components/Select/index.js +3 -1
- package/dist/components/Select/types.d.ts +1 -0
- package/dist/components/Select/types.d.ts.map +1 -1
- package/dist/components/Slider/SliderExample.d.ts.map +1 -1
- package/dist/components/Slider/SliderExample.js +21 -9
- package/dist/components/Slider/components/SliderRail.d.ts +1 -1
- package/dist/components/Slider/components/SliderRail.d.ts.map +1 -1
- package/dist/components/Slider/components/SliderRail.js +3 -3
- package/dist/components/Slider/components/SliderSelector.d.ts +17 -3
- package/dist/components/Slider/components/SliderSelector.d.ts.map +1 -1
- package/dist/components/Slider/components/SliderSelector.js +48 -28
- package/dist/components/Slider/index.d.ts +17 -3
- package/dist/components/Slider/index.d.ts.map +1 -1
- package/dist/components/Slider/index.js +34 -14
- package/dist/components/Slider/slider.test.js +23 -23
- package/dist/components/Slider/styles.d.ts.map +1 -1
- package/dist/components/Slider/styles.js +3 -3
- package/dist/components/Slider/types.d.ts +6 -5
- package/dist/components/Slider/types.d.ts.map +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,93 +1,93 @@
|
|
|
1
|
-
<h1 align="center">
|
|
2
|
-
<img src="https://user-images.githubusercontent.com/75874462/145101826-9244932f-7072-4727-9124-8c26620ad786.png" alt="Logo"/>
|
|
3
|
-
<br/>
|
|
4
|
-
</h1>
|
|
5
|
-
|
|
6
|
-
<div align="center">
|
|
7
|
-
<img src="https://img.shields.io/badge/React-v17.0.2-1DD195?style=for-the-badge&logo=react&link=http://google.com" />
|
|
8
|
-
<img src="https://img.shields.io/badge/Emotion-v11.3.0-1DD195?style=for-the-badge&logo=styled-components" />
|
|
9
|
-
<img src="https://img.shields.io/badge/Storybook-v6.3.7-1DD195?style=for-the-badge&logo=storybook" />
|
|
10
|
-
<img src="https://img.shields.io/badge/React Testing Library-v11.1.0-1DD195?style=for-the-badge&logo=testinglibrary" />
|
|
11
|
-
<img src="https://img.shields.io/badge/FrameMotion-v4.1.17-1DD195?style=for-the-badge&logo=framer" />
|
|
12
|
-
<img src="https://img.shields.io/badge/Typescript-v4.3.5-1DD195?style=for-the-badge&logo=typescript" />
|
|
13
|
-
</div>
|
|
14
|
-
|
|
15
|
-
<p align="center">
|
|
16
|
-
<a href="#iniciar-">Iniciar </a> |
|
|
17
|
-
<a href="#estrutura-de-codigo-">Estrutura de codigo </a> |
|
|
18
|
-
<a href="#roadmap-">Roadmap </a> |
|
|
19
|
-
<a href="#contribuir-">Contribuir </a>
|
|
20
|
-
</p>
|
|
21
|
-
|
|
22
|
-
## Iniciar 🚀
|
|
23
|
-
|
|
24
|
-
### Requisitos:
|
|
25
|
-
- [Nodejs](https://github.com/nodejs/node)
|
|
26
|
-
- [Yarn](https://github.com/yarnpkg/yarn)
|
|
27
|
-
|
|
28
|
-
### Instalação:
|
|
29
|
-
|
|
30
|
-
1. Clone o Repositorio
|
|
31
|
-
|
|
32
|
-
``` bash
|
|
33
|
-
git clone git@github.com:pedidopago/pedidopago-ui.git
|
|
34
|
-
```
|
|
35
|
-
|
|
36
|
-
2. Instalar as dependencias:
|
|
37
|
-
|
|
38
|
-
```bash
|
|
39
|
-
yarn
|
|
40
|
-
```
|
|
41
|
-
|
|
42
|
-
### Executar o projeto localmente:
|
|
43
|
-
|
|
44
|
-
Iniciar o projeto com o storybook:
|
|
45
|
-
|
|
46
|
-
```bash
|
|
47
|
-
yarn storybook
|
|
48
|
-
```
|
|
49
|
-
|
|
50
|
-
Para executar os testes use o script:
|
|
51
|
-
|
|
52
|
-
```bash
|
|
53
|
-
yarn test
|
|
54
|
-
```
|
|
55
|
-
|
|
56
|
-
> Para mais detalhes dos scripts considere consultar o package.json na raiz do projeto.
|
|
57
|
-
|
|
58
|
-
#### 📌 Ira precisar tambem das variaveis de ambiente `CHROMATIC_PROJECT_TOKEN` e `SKIP_PREFLIGHT_CHECK`.
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
## Estrutura de codigo
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
> Ao entrar no projeto sempre entre em `packages/pedidopago-ui` para trabalhar/executar os scripts
|
|
66
|
-
|
|
67
|
-
## Roadmap 🌐
|
|
68
|
-
|
|
69
|
-
- [ ] Mudar a estrutura de pastas
|
|
70
|
-
|
|
71
|
-
- [ ] Sessão de novos componentes
|
|
72
|
-
|
|
73
|
-
- [ ] Atualização de pacotes
|
|
74
|
-
|
|
75
|
-
- [ ] Incrementação dos testes
|
|
76
|
-
|
|
77
|
-
- [ ] Melhorias na documentação
|
|
78
|
-
|
|
79
|
-
- [ ] Adicionar license
|
|
80
|
-
|
|
81
|
-
## Contribuir 💡
|
|
82
|
-
|
|
83
|
-
1. Crie uma branch apartir da **`dev`** com o prefixo **`lib`-[número da issue]-[nome da issue]**.
|
|
84
|
-
exemplo:
|
|
85
|
-
```bash
|
|
86
|
-
git checkout -b lib-99-buttom
|
|
87
|
-
```
|
|
88
|
-
2. Desenvolver
|
|
89
|
-
|
|
90
|
-
3. Criar a pull request
|
|
91
|
-
- Número da issue no inicio da pr.
|
|
92
|
-
- Descritivo com pontos importantes do que foi feito.
|
|
93
|
-
- Print dos tests no terminal e video de apresentação que pode ser feito via [loom](https://www.loom.com/).
|
|
1
|
+
<h1 align="center">
|
|
2
|
+
<img src="https://user-images.githubusercontent.com/75874462/145101826-9244932f-7072-4727-9124-8c26620ad786.png" alt="Logo"/>
|
|
3
|
+
<br/>
|
|
4
|
+
</h1>
|
|
5
|
+
|
|
6
|
+
<div align="center">
|
|
7
|
+
<img src="https://img.shields.io/badge/React-v17.0.2-1DD195?style=for-the-badge&logo=react&link=http://google.com" />
|
|
8
|
+
<img src="https://img.shields.io/badge/Emotion-v11.3.0-1DD195?style=for-the-badge&logo=styled-components" />
|
|
9
|
+
<img src="https://img.shields.io/badge/Storybook-v6.3.7-1DD195?style=for-the-badge&logo=storybook" />
|
|
10
|
+
<img src="https://img.shields.io/badge/React Testing Library-v11.1.0-1DD195?style=for-the-badge&logo=testinglibrary" />
|
|
11
|
+
<img src="https://img.shields.io/badge/FrameMotion-v4.1.17-1DD195?style=for-the-badge&logo=framer" />
|
|
12
|
+
<img src="https://img.shields.io/badge/Typescript-v4.3.5-1DD195?style=for-the-badge&logo=typescript" />
|
|
13
|
+
</div>
|
|
14
|
+
|
|
15
|
+
<p align="center">
|
|
16
|
+
<a href="#iniciar-">Iniciar </a> |
|
|
17
|
+
<a href="#estrutura-de-codigo-">Estrutura de codigo </a> |
|
|
18
|
+
<a href="#roadmap-">Roadmap </a> |
|
|
19
|
+
<a href="#contribuir-">Contribuir </a>
|
|
20
|
+
</p>
|
|
21
|
+
|
|
22
|
+
## Iniciar 🚀
|
|
23
|
+
|
|
24
|
+
### Requisitos:
|
|
25
|
+
- [Nodejs](https://github.com/nodejs/node)
|
|
26
|
+
- [Yarn](https://github.com/yarnpkg/yarn)
|
|
27
|
+
|
|
28
|
+
### Instalação:
|
|
29
|
+
|
|
30
|
+
1. Clone o Repositorio
|
|
31
|
+
|
|
32
|
+
``` bash
|
|
33
|
+
git clone git@github.com:pedidopago/pedidopago-ui.git
|
|
34
|
+
```
|
|
35
|
+
|
|
36
|
+
2. Instalar as dependencias:
|
|
37
|
+
|
|
38
|
+
```bash
|
|
39
|
+
yarn
|
|
40
|
+
```
|
|
41
|
+
|
|
42
|
+
### Executar o projeto localmente:
|
|
43
|
+
|
|
44
|
+
Iniciar o projeto com o storybook:
|
|
45
|
+
|
|
46
|
+
```bash
|
|
47
|
+
yarn storybook
|
|
48
|
+
```
|
|
49
|
+
|
|
50
|
+
Para executar os testes use o script:
|
|
51
|
+
|
|
52
|
+
```bash
|
|
53
|
+
yarn test
|
|
54
|
+
```
|
|
55
|
+
|
|
56
|
+
> Para mais detalhes dos scripts considere consultar o package.json na raiz do projeto.
|
|
57
|
+
|
|
58
|
+
#### 📌 Ira precisar tambem das variaveis de ambiente `CHROMATIC_PROJECT_TOKEN` e `SKIP_PREFLIGHT_CHECK`.
|
|
59
|
+
|
|
60
|
+
|
|
61
|
+
## Estrutura de codigo
|
|
62
|
+
|
|
63
|
+
|
|
64
|
+
|
|
65
|
+
> Ao entrar no projeto sempre entre em `packages/pedidopago-ui` para trabalhar/executar os scripts
|
|
66
|
+
|
|
67
|
+
## Roadmap 🌐
|
|
68
|
+
|
|
69
|
+
- [ ] Mudar a estrutura de pastas
|
|
70
|
+
|
|
71
|
+
- [ ] Sessão de novos componentes
|
|
72
|
+
|
|
73
|
+
- [ ] Atualização de pacotes
|
|
74
|
+
|
|
75
|
+
- [ ] Incrementação dos testes
|
|
76
|
+
|
|
77
|
+
- [ ] Melhorias na documentação
|
|
78
|
+
|
|
79
|
+
- [ ] Adicionar license
|
|
80
|
+
|
|
81
|
+
## Contribuir 💡
|
|
82
|
+
|
|
83
|
+
1. Crie uma branch apartir da **`dev`** com o prefixo **`lib`-[número da issue]-[nome da issue]**.
|
|
84
|
+
exemplo:
|
|
85
|
+
```bash
|
|
86
|
+
git checkout -b lib-99-buttom
|
|
87
|
+
```
|
|
88
|
+
2. Desenvolver
|
|
89
|
+
|
|
90
|
+
3. Criar a pull request
|
|
91
|
+
- Número da issue no inicio da pr.
|
|
92
|
+
- Descritivo com pontos importantes do que foi feito.
|
|
93
|
+
- Print dos tests no terminal e video de apresentação que pode ser feito via [loom](https://www.loom.com/).
|
|
@@ -12,10 +12,6 @@ var _jsxRuntime = require("react/jsx-runtime");
|
|
|
12
12
|
|
|
13
13
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
14
14
|
|
|
15
|
-
function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
|
|
16
|
-
|
|
17
|
-
function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
|
|
18
|
-
|
|
19
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; }
|
|
20
16
|
|
|
21
17
|
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; }
|
|
@@ -69,29 +65,6 @@ describe('Button', function () {
|
|
|
69
65
|
|
|
70
66
|
expect(handleClick).toHaveBeenCalledTimes(1);
|
|
71
67
|
});
|
|
72
|
-
it('should render a loading button', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
|
|
73
|
-
var _setup2, getSkeleton;
|
|
74
|
-
|
|
75
|
-
return regeneratorRuntime.wrap(function _callee$(_context) {
|
|
76
|
-
while (1) {
|
|
77
|
-
switch (_context.prev = _context.next) {
|
|
78
|
-
case 0:
|
|
79
|
-
(0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
|
|
80
|
-
variant: "solid",
|
|
81
|
-
children: "Click Me"
|
|
82
|
-
}));
|
|
83
|
-
_setup2 = setup({
|
|
84
|
-
isLoading: true
|
|
85
|
-
}), getSkeleton = _setup2.getSkeleton;
|
|
86
|
-
expect(getSkeleton()).toBeInTheDocument();
|
|
87
|
-
|
|
88
|
-
case 3:
|
|
89
|
-
case "end":
|
|
90
|
-
return _context.stop();
|
|
91
|
-
}
|
|
92
|
-
}
|
|
93
|
-
}, _callee);
|
|
94
|
-
})));
|
|
95
68
|
it('should render a disabled button', function () {
|
|
96
69
|
var handleClick = jest.fn();
|
|
97
70
|
(0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
|
|
@@ -168,10 +141,10 @@ describe('Button', function () {
|
|
|
168
141
|
children: "Click Me"
|
|
169
142
|
}));
|
|
170
143
|
|
|
171
|
-
var
|
|
144
|
+
var _setup2 = setup({
|
|
172
145
|
leftIcon: 'airplay'
|
|
173
146
|
}),
|
|
174
|
-
getLeftIcon =
|
|
147
|
+
getLeftIcon = _setup2.getLeftIcon;
|
|
175
148
|
|
|
176
149
|
expect(getLeftIcon()).toBeInTheDocument();
|
|
177
150
|
});
|
|
@@ -182,10 +155,10 @@ describe('Button', function () {
|
|
|
182
155
|
children: "Click Me"
|
|
183
156
|
}));
|
|
184
157
|
|
|
185
|
-
var
|
|
158
|
+
var _setup3 = setup({
|
|
186
159
|
rightIcon: 'airplay'
|
|
187
160
|
}),
|
|
188
|
-
getRightIcon =
|
|
161
|
+
getRightIcon = _setup3.getRightIcon;
|
|
189
162
|
|
|
190
163
|
expect(getRightIcon()).toBeInTheDocument();
|
|
191
164
|
});
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import { ButtonHTMLAttributes } from 'react';
|
|
2
2
|
import { ButtonProps } from './types';
|
|
3
|
-
export default function Button({ children, leftIcon, rightIcon,
|
|
3
|
+
export default function Button({ children, leftIcon, rightIcon, variant, bgColor, size, fullWidth, textColor, type, iconColor, ...props }: ButtonProps & ButtonHTMLAttributes<HTMLButtonElement>): JSX.Element;
|
|
4
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,oBAAoB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAK7C,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAEtC,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,EAC7B,QAAQ,EACR,QAAQ,EACR,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,eA0DvD"}
|
|
@@ -5,21 +5,17 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.default = Button;
|
|
7
7
|
|
|
8
|
-
var _react = require("react");
|
|
9
|
-
|
|
10
8
|
var _index = require("../../shared/theme/index");
|
|
11
9
|
|
|
12
10
|
var _getColorValue = require("../../utils/getColorValue");
|
|
13
11
|
|
|
14
12
|
var _Icon = _interopRequireDefault(require("../Icon"));
|
|
15
13
|
|
|
16
|
-
var _Skeleton = _interopRequireDefault(require("../Skeleton"));
|
|
17
|
-
|
|
18
14
|
var _styles = require("./styles");
|
|
19
15
|
|
|
20
16
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
21
17
|
|
|
22
|
-
var _excluded = ["children", "leftIcon", "rightIcon", "
|
|
18
|
+
var _excluded = ["children", "leftIcon", "rightIcon", "variant", "bgColor", "size", "fullWidth", "textColor", "type", "iconColor"];
|
|
23
19
|
|
|
24
20
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
25
21
|
|
|
@@ -37,7 +33,6 @@ function Button(_ref) {
|
|
|
37
33
|
var children = _ref.children,
|
|
38
34
|
leftIcon = _ref.leftIcon,
|
|
39
35
|
rightIcon = _ref.rightIcon,
|
|
40
|
-
isLoading = _ref.isLoading,
|
|
41
36
|
_ref$variant = _ref.variant,
|
|
42
37
|
variant = _ref$variant === void 0 ? 'solid' : _ref$variant,
|
|
43
38
|
_ref$bgColor = _ref.bgColor,
|
|
@@ -79,39 +74,30 @@ function Button(_ref) {
|
|
|
79
74
|
parsedIconColor = (0, _getColorValue.getThemeHex)(parsedIconColor, theme);
|
|
80
75
|
}
|
|
81
76
|
|
|
82
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
})
|
|
105
|
-
}), children, !leftIcon && rightIcon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.IconWrapper, {
|
|
106
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
|
|
107
|
-
name: rightIcon,
|
|
108
|
-
color: parsedIconColor,
|
|
109
|
-
size: iconSize,
|
|
110
|
-
"data-testid": "rightIconId"
|
|
111
|
-
})
|
|
112
|
-
})]
|
|
77
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.ButtonContainer, _objectSpread(_objectSpread({
|
|
78
|
+
bgColor: parsedBgColor,
|
|
79
|
+
textColor: parsedTextColor,
|
|
80
|
+
fullWidth: fullWidth,
|
|
81
|
+
variant: variant,
|
|
82
|
+
size: size,
|
|
83
|
+
type: type
|
|
84
|
+
}, props), {}, {
|
|
85
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.IconContainer, {
|
|
86
|
+
children: [leftIcon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.IconWrapper, {
|
|
87
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
|
|
88
|
+
color: parsedIconColor,
|
|
89
|
+
name: leftIcon,
|
|
90
|
+
size: iconSize,
|
|
91
|
+
"data-testid": "leftIconId"
|
|
92
|
+
})
|
|
93
|
+
}), children, !leftIcon && rightIcon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.IconWrapper, {
|
|
94
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
|
|
95
|
+
name: rightIcon,
|
|
96
|
+
color: parsedIconColor,
|
|
97
|
+
size: iconSize,
|
|
98
|
+
"data-testid": "rightIconId"
|
|
113
99
|
})
|
|
114
|
-
})
|
|
100
|
+
})]
|
|
115
101
|
})
|
|
116
|
-
});
|
|
102
|
+
}));
|
|
117
103
|
}
|
|
@@ -40,15 +40,6 @@ export interface ButtonProps {
|
|
|
40
40
|
* @memberof ButtonProps
|
|
41
41
|
*/
|
|
42
42
|
rightIcon?: IconName;
|
|
43
|
-
/**
|
|
44
|
-
* The button rendered changes to a LoadingButton component
|
|
45
|
-
*
|
|
46
|
-
* @default false
|
|
47
|
-
* @type boolean
|
|
48
|
-
* @memberof ButtonProps
|
|
49
|
-
* @example true
|
|
50
|
-
*/
|
|
51
|
-
isLoading?: boolean;
|
|
52
43
|
/**
|
|
53
44
|
* The button height changes based on the string passed to this prop
|
|
54
45
|
*
|
|
@@ -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,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,
|
|
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,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":"card.test.d.ts","sourceRoot":"","sources":["../../../src/components/Card/card.test.tsx"],"names":[],"mappings":"AAEA,OAAO,2BAA2B,CAAC"}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _testUtils = require("../../shared/tests/test-utils");
|
|
4
|
+
|
|
5
|
+
require("@testing-library/jest-dom");
|
|
6
|
+
|
|
7
|
+
var _ = require(".");
|
|
8
|
+
|
|
9
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
10
|
+
|
|
11
|
+
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; }
|
|
12
|
+
|
|
13
|
+
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; }
|
|
14
|
+
|
|
15
|
+
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
16
|
+
|
|
17
|
+
var setup = function setup(props) {
|
|
18
|
+
var utils = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Card, _objectSpread({}, props)));
|
|
19
|
+
return utils;
|
|
20
|
+
};
|
|
21
|
+
|
|
22
|
+
describe('Card', function () {
|
|
23
|
+
it('Should render a empty card', function () {
|
|
24
|
+
var _setup = setup({}),
|
|
25
|
+
container = _setup.container;
|
|
26
|
+
|
|
27
|
+
expect(container).toBeInTheDocument();
|
|
28
|
+
});
|
|
29
|
+
it('Should render a card with padding', function () {
|
|
30
|
+
var _setup2 = setup({
|
|
31
|
+
cardPadding: '32px'
|
|
32
|
+
}),
|
|
33
|
+
container = _setup2.container;
|
|
34
|
+
|
|
35
|
+
expect(container).toBeInTheDocument();
|
|
36
|
+
});
|
|
37
|
+
});
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import {
|
|
3
|
-
export declare function Card({ cardPadding, borderRadius, variant, boxShadow, bgColor, children, }:
|
|
2
|
+
import { CardProps } from './types';
|
|
3
|
+
export declare function Card({ cardPadding, borderRadius, variant, boxShadow, bgColor, children, ...rest }: CardProps): JSX.Element;
|
|
4
4
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Card/index.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Card/index.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEpC,wBAAgB,IAAI,CAAC,EACnB,WAAoB,EACpB,YAAuB,EACvB,OAAiB,EACjB,SAA2B,EAC3B,OAAO,EACP,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,SAAS,eAoBX"}
|
|
@@ -11,6 +11,18 @@ var _styles = require("./styles");
|
|
|
11
11
|
|
|
12
12
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
13
13
|
|
|
14
|
+
var _excluded = ["cardPadding", "borderRadius", "variant", "boxShadow", "bgColor", "children"];
|
|
15
|
+
|
|
16
|
+
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; }
|
|
17
|
+
|
|
18
|
+
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; }
|
|
19
|
+
|
|
20
|
+
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
21
|
+
|
|
22
|
+
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
23
|
+
|
|
24
|
+
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; }
|
|
25
|
+
|
|
14
26
|
function Card(_ref) {
|
|
15
27
|
var _ref$cardPadding = _ref.cardPadding,
|
|
16
28
|
cardPadding = _ref$cardPadding === void 0 ? '10px' : _ref$cardPadding,
|
|
@@ -21,19 +33,21 @@ function Card(_ref) {
|
|
|
21
33
|
_ref$boxShadow = _ref.boxShadow,
|
|
22
34
|
boxShadow = _ref$boxShadow === void 0 ? 'shadow.level1' : _ref$boxShadow,
|
|
23
35
|
bgColor = _ref.bgColor,
|
|
24
|
-
children = _ref.children
|
|
36
|
+
children = _ref.children,
|
|
37
|
+
rest = _objectWithoutProperties(_ref, _excluded);
|
|
25
38
|
|
|
26
39
|
var _useTheme = (0, _theme.useTheme)(),
|
|
27
40
|
theme = _useTheme.theme;
|
|
28
41
|
|
|
29
42
|
var splitBoxShadow = boxShadow && boxShadow.indexOf('shadow') > -1 ? boxShadow.split('.') : null;
|
|
30
43
|
var boxShadowValue = splitBoxShadow ? theme.shadow[splitBoxShadow[1]] : boxShadow;
|
|
31
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.CardBody, {
|
|
44
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.CardBody, _objectSpread(_objectSpread({
|
|
32
45
|
cardPadding: cardPadding,
|
|
33
46
|
borderRadius: borderRadius,
|
|
34
47
|
variant: variant,
|
|
35
48
|
boxShadow: boxShadowValue,
|
|
36
|
-
bgColor: bgColor
|
|
49
|
+
bgColor: bgColor
|
|
50
|
+
}, rest), {}, {
|
|
37
51
|
children: children
|
|
38
|
-
});
|
|
52
|
+
}));
|
|
39
53
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import {
|
|
2
|
+
import { BodyCardProps } from './types';
|
|
3
3
|
export declare const CardBody: import("@emotion/styled").StyledComponent<{
|
|
4
4
|
theme?: import("@emotion/react").Theme | undefined;
|
|
5
5
|
as?: import("react").ElementType<any> | undefined;
|
|
6
|
-
} &
|
|
6
|
+
} & BodyCardProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
7
7
|
//# sourceMappingURL=styles.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Card/styles.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Card/styles.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAExC,eAAO,MAAM,QAAQ;;;yHAYnB,CAAC"}
|
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
export
|
|
1
|
+
import React, { HTMLAttributes } from 'react';
|
|
2
|
+
export declare type BodyCardProps = {
|
|
3
3
|
cardPadding?: string;
|
|
4
4
|
borderRadius?: string;
|
|
5
5
|
variant?: string;
|
|
6
6
|
boxShadow?: string;
|
|
7
7
|
bgColor?: string;
|
|
8
|
-
}
|
|
9
|
-
export
|
|
8
|
+
};
|
|
9
|
+
export declare type CardProps = HTMLAttributes<HTMLDivElement> & {
|
|
10
10
|
cardPadding?: string;
|
|
11
11
|
children?: React.ReactChild;
|
|
12
12
|
borderRadius?: string;
|
|
13
13
|
variant?: string;
|
|
14
14
|
boxShadow?: 'shadow.level1' | 'shadow.level2' | 'shadow.level3' | (string & {});
|
|
15
15
|
bgColor?: string;
|
|
16
|
-
}
|
|
16
|
+
};
|
|
17
17
|
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Card/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Card/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAE9C,oBAAY,aAAa,GAAG;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,oBAAY,SAAS,GAAG,cAAc,CAAC,cAAc,CAAC,GAAG;IACvD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,eAAe,GAAG,eAAe,GAAG,eAAe,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAChF,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dash.d.ts","sourceRoot":"","sources":["../../../../src/components/Icon/data/dash.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,SAAS;;;;;;;
|
|
1
|
+
{"version":3,"file":"dash.d.ts","sourceRoot":"","sources":["../../../../src/components/Icon/data/dash.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,SAAS;;;;;;;GAimFrB,CAAC"}
|